/* Projektkarte LOGisch – im Design der LOGisch-Seite (logisch/assets/style.css):
   seeblauer Aufmacher mit Kartenraster, Archivo schmal und fett, IBM Plex Mono,
   eine echte Logbuchseite als Bild. Bleibt in beiden Farbschemata seeblau. */

@font-face { font-family: "Archivo"; src: url(../fonts/archivo.woff2) format("woff2"); font-weight: 400 900; font-stretch: 62% 125%; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url(../fonts/plexmono-500.woff2) format("woff2"); font-weight: 500; font-display: swap; }

.projekt--logisch {
  --lg-display: "Archivo", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --lg-mono: "IBM Plex Mono", "Cascadia Mono", Consolas, monospace;
  color: #fff; border: 0; border-radius: 6px;
  background:
    linear-gradient(rgba(159, 220, 240, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(159, 220, 240, .07) 1px, transparent 1px),
    linear-gradient(180deg, #177A9A -40%, #0B4A5F 70%);
  background-size: 96px 96px, 96px 96px, auto;
  padding-bottom: 0; align-items: end;
}
.projekt--logisch .projekt-text { padding-bottom: clamp(1.5rem, 4vw, 3rem); }
.projekt--logisch .projekt-marke img { border-radius: 8px; width: 36px; height: 36px; }
.projekt--logisch .projekt-name { font: 800 1.45rem/1 var(--lg-display); letter-spacing: -.01em; }
.projekt--logisch .projekt-name b { color: #9FDCF0; font-weight: 900; }
.projekt--logisch .projekt-motto { font: 500 .92rem/1.2 var(--lg-mono); color: #9FDCF0; letter-spacing: .02em; }
.projekt--logisch .projekt-motto::before { content: "⚓ "; }
.projekt--logisch h2 { font-family: var(--lg-display); font-size: clamp(2.1rem, 4.6vw, 3.3rem); font-weight: 900; font-stretch: 78%; letter-spacing: -.015em; line-height: .98; }
.projekt--logisch h2 em { font-style: normal; color: #9FDCF0; }
.projekt--logisch .projekt-lede { color: #CFE6EE; font-size: 1.08rem; }
.projekt--logisch .projekt-fakten { font: 500 .8rem/1.3 var(--lg-mono); color: #A9CCD8; }
.projekt--logisch .projekt-fakten li::before { content: "— "; color: #5FA9C2; }
.projekt--logisch .projekt-link { background: #fff; color: #0B4A5F; font-family: "Source Sans 3", "Segoe UI", system-ui, sans-serif; font-size: 1rem; }
.projekt--logisch:hover .projekt-link { background: #E6F4F8; }
.projekt--logisch:hover { box-shadow: 0 22px 50px rgba(8, 58, 76, .35); }
.projekt--logisch:focus-within { outline-color: #F0A14B; }

/* Logbuchseite: Papier, unten angeschnitten wie auf der LOGisch-Startseite */
.lg-blatt { background: #FBFCFA; color: #1B2F36; border-radius: 10px 10px 0 0; box-shadow: 0 30px 80px rgba(0, 0, 0, .35); padding: 1rem 1rem 0; }
.lg-blatt-kopf { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem 1rem; padding: 0 .2rem .7rem; border-bottom: 2px solid #1B2F36; }
.lg-blatt-kopf strong { font: 800 1rem/1.2 var(--lg-display); font-stretch: 90%; }
.lg-blatt-kopf span { font: 500 .72rem/1.4 var(--lg-mono); color: #5A6F76; }
.lg-log { width: 100%; border-collapse: collapse; font: 500 .74rem/1.35 var(--lg-mono); font-variant-numeric: tabular-nums; }
.lg-log th { font: 700 .62rem/1.2 var(--lg-display); font-stretch: 105%; text-transform: uppercase; letter-spacing: .08em; text-align: left; color: #5A6F76; padding: .55rem .35rem .35rem; border-bottom: 1px solid #C9D6DA; }
.lg-log td { padding: .45rem .35rem; border-bottom: 1px solid #E3EAEC; white-space: nowrap; }
.lg-log td:last-child { white-space: normal; font-family: "Source Sans 3", "Segoe UI", system-ui, sans-serif; font-size: .8rem; }
.lg-log .auto td:first-child::after { content: " (A)"; color: #B0600F; }
.lg-log .event td { background: #EEF5F7; }
@media (max-width: 520px) { .lg-log .schmal { display: none; } }