/* ============================================================
   CONCEPT TIRAMISU — V3 LAYER  "THE CONTINUOUS SYSTEM"
   Loaded after styles.css. Adds the editorial/system layer and
   overrides the card-heavy v2 patterns on redesigned pages.
   Motion verbs: DRAW · PULSE · CONNECT · SETTLE · RELEASE
   ============================================================ */

/* --- reveal only when JS is present (no-JS keeps content visible) --- */
html:not(.js) .reveal { opacity: 1 !important; transform: none !important; }
.reveal.is-instant{ transition:none !important; }

/* ── STAGE: full-viewport hero on espresso ───────────────── */
.stage{
  position:relative; min-height:calc(100svh - 78px); display:flex; align-items:center;
  background:var(--parchment); color:var(--espresso); overflow:hidden;
  padding:var(--sp-7) var(--sp-4) var(--sp-8);
  isolation:isolate;
}
/* scrim: the system field stays behind the type, never competes with it */
.stage::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(112% 74% at 4% 38%, var(--parchment) 0%, rgba(250,245,235,.9) 40%, rgba(250,245,235,0) 76%);
}
/* the local network sits low-left and is allowed to stay readable */
.sys-local .sys-edge{ opacity:.5; }
.sys-local .sys-edge--soft{ opacity:.34; }
@media (max-width:900px){
  .stage::before{ background:linear-gradient(180deg, var(--parchment) 0%, rgba(250,245,235,.94) 44%, rgba(250,245,235,.35) 66%, rgba(250,245,235,0) 100%); }
  .stage .stage__field{ top:auto; bottom:0; height:56%; }
  /* the field is scaled way down on phones — keep strokes and nodes legible */
  .stage__field .sys-edge, .stage__field .sys-pulse{ vector-effect:non-scaling-stroke; }
  .stage__field .sys-edge{ opacity:.45; }
  .stage__field .sys-node{ r:6; }
  .stage__field .sys-node--lg{ r:9; }
  .stage__field .sys-label{ font-size:15px; letter-spacing:3px; }
  .stage__field .sys-coord{ font-size:13px; letter-spacing:2px; }
}
.stage__field{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.stage__field svg{ width:100%; height:100%; display:block; }
.stage__inner{ position:relative; z-index:2; max-width:1280px; margin:0 auto; width:100%; }

.stage__eyebrow{
  display:flex; align-items:center; gap:var(--sp-3);
  font-size:11px; letter-spacing:.34em; text-transform:uppercase;
  color:var(--amber-text); margin-bottom:var(--sp-5);
}
.stage__eyebrow::before{ content:""; width:44px; height:1px; background:var(--amber); }

.stage h1{
  color:var(--espresso); font-weight:300;
  font-size:clamp(2.7rem, 7.6vw, 6.8rem);
  line-height:.95; letter-spacing:-.015em; margin-bottom:var(--sp-5);
  max-width:17ch;
}
.stage h1 em{ font-style:italic; color:var(--amber-text); }
.stage__lead{
  font-size:clamp(1rem,1.5vw,1.18rem); line-height:1.65;
  color:var(--ink-soft); max-width:48ch; margin-bottom:var(--sp-6);
}
.stage__ctas{ display:flex; flex-wrap:wrap; gap:var(--sp-3); }

.stage__hint{
  position:absolute; left:50%; bottom:var(--sp-4); transform:translateX(-50%);
  z-index:2; display:flex; flex-direction:column; align-items:center; gap:8px;
  font-size:9px; letter-spacing:.3em; text-transform:uppercase; color:rgba(59,27,12,.62);
}
.stage__hint i{ display:block; width:1px; height:34px;
  background:linear-gradient(to bottom,transparent,var(--amber-text)); }
@media (prefers-reduced-motion: no-preference){
  .stage__hint i{ animation:hintPulse 2.8s var(--ease) infinite; transform-origin:top; }
}
@keyframes hintPulse{ 0%{transform:scaleY(0);opacity:0} 45%{transform:scaleY(1);opacity:1} 100%{transform:scaleY(1);opacity:0} }

/* ── SYSTEM FIELD primitives (SVG) ───────────────────────── */
.sys-edge{ stroke:var(--amber); stroke-width:1; fill:none; opacity:.4; }
.sys-edge--soft{ stroke:var(--dust); opacity:.34; }
.sys-node{ fill:var(--amber); opacity:.62; }
.sys-node--lg{ fill:var(--amber); opacity:.9; }
.sys-label{ font-family:var(--font-body); font-size:9px; letter-spacing:.22em;
  text-transform:uppercase; fill:rgba(59,27,12,.5); }
.sys-coord{ font-family:var(--font-body); font-size:8px; letter-spacing:.16em;
  fill:rgba(143,90,14,.65); }

/* DRAW */
.js .sys-draw{ stroke-dasharray:var(--len,400); stroke-dashoffset:var(--len,400); }
.js .in-view .sys-draw{ animation:sysDraw 1.6s var(--ease) forwards; animation-delay:var(--d,0s); }
@keyframes sysDraw{ to{ stroke-dashoffset:0; } }

/* CONNECT */
.js .sys-pop{ opacity:0; }
.js .in-view .sys-pop{ animation:sysPop .8s var(--ease) forwards; animation-delay:var(--d,0s); }
@keyframes sysPop{ to{ opacity:var(--o,.5); } }

/* PULSE */
.sys-pulse{ stroke:var(--amber); stroke-width:2; fill:none;
  stroke-linecap:round; stroke-dasharray:4 460; opacity:0; }
@media (prefers-reduced-motion: no-preference){
  .js .sys-pulse{ animation:sysPulse 6s linear infinite; animation-delay:var(--d,0s); }
}
@keyframes sysPulse{
  0%{ stroke-dashoffset:460; opacity:0 }
  10%{ opacity:.9 }
  60%{ opacity:.9 }
  75%{ stroke-dashoffset:0; opacity:0 }
  100%{ stroke-dashoffset:0; opacity:0 }
}
.sys-node, .sys-edge{ transition:opacity .45s var(--ease); }

/* ── TICKER ──────────────────────────────────────────────── */
.ticker{ background:var(--espresso-deep); border-top:1px solid rgba(196,129,26,.18);
  border-bottom:1px solid rgba(196,129,26,.18); overflow:hidden; padding:var(--sp-3) 0; }
.ticker__row{ display:flex; width:max-content; }
@media (prefers-reduced-motion: no-preference){
  .ticker__row{ animation:tickerRun 52s linear infinite; }
  .ticker:hover .ticker__row{ animation-play-state:paused; }
}
@keyframes tickerRun{ to{ transform:translateX(-50%); } }
.ticker__row span{
  font-size:11px; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(243,232,208,.4); white-space:nowrap; padding-right:var(--sp-5);
}
.ticker__row span::after{ content:"·"; color:var(--amber); opacity:.7; padding-left:var(--sp-5); }

/* ── STATEMENT ───────────────────────────────────────────── */
.statement{ padding:var(--sp-9) var(--sp-4); }
.statement__inner{ max-width:1120px; margin:0 auto; }
.statement p.big{
  font-family:var(--font-head); font-weight:300;
  font-size:clamp(1.9rem,5vw,4.2rem); line-height:1.08; color:var(--cacao);
  letter-spacing:-.01em; margin:0;
}
.statement em{ font-style:italic; color:var(--amber-text); }
.statement__foot{ margin-top:var(--sp-5); font-size:1rem; color:var(--ink-soft); max-width:54ch; }
.statement--dark{ background:var(--cacao); }
.statement--dark p.big{ color:var(--cream); }
.statement--dark em{ color:var(--amber-light); }
.statement--dark .statement__foot{ color:rgba(243,232,208,.68); }

/* ── SPLIT ───────────────────────────────────────────────── */
.split{ padding:var(--sp-9) var(--sp-4); }
.split__inner{ max-width:1280px; margin:0 auto; display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
  gap:clamp(var(--sp-5),5vw,var(--sp-8)); align-items:start; }
.split--flip .split__vis{ order:-1; }
@media (max-width:900px){
  .split__inner{ grid-template-columns:1fr; }
  .split--flip .split__vis{ order:0; }
}
.split__vis{ position:sticky; top:96px; }
@media (max-width:900px){ .split__vis{ position:static; margin-top:var(--sp-5); } }
.split__vis svg{ width:100%; height:auto; display:block; overflow:visible; }
.split__num{ font-family:var(--font-head); font-style:italic;
  font-size:clamp(2.6rem,6vw,4.6rem); line-height:1; color:var(--amber-text);
  opacity:.82; display:block; margin-bottom:var(--sp-1); }
.split h2{ font-size:clamp(1.8rem,3.6vw,3rem); line-height:1.08; margin-bottom:var(--sp-4); }
.split__kicker{ font-size:11px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--amber-text); margin-bottom:var(--sp-3); }
.split__body{ font-size:1.02rem; line-height:1.7; color:var(--ink-soft); max-width:52ch; }
.split__body + .split__body{ margin-top:var(--sp-3); }
.split--tint{ background:var(--cream); }

/* inline note list — replaces service cards */
.notes{ margin-top:var(--sp-5); border-top:1px solid rgba(59,27,12,.14); padding:0; }
.notes li{ list-style:none; padding:var(--sp-3) 0; border-bottom:1px solid rgba(59,27,12,.14); }
.notes b{ display:block; font-family:var(--font-head); font-weight:400;
  font-size:1.08rem; color:var(--cacao); margin-bottom:2px; }
.notes span{ font-size:.92rem; color:var(--ink-soft); }


/* ── RAIL ────────────────────────────────────────────────── */
.rail{ position:relative; margin-top:var(--sp-6); padding-left:var(--sp-5); }
.rail::before{ content:""; position:absolute; left:6px; top:10px; bottom:10px; width:1px;
  background:linear-gradient(to bottom,var(--amber),rgba(196,129,26,.18)); }
.rail__stop{ position:relative; padding:var(--sp-3) 0 var(--sp-4); }
.rail__stop::before{ content:""; position:absolute; left:calc(-1 * var(--sp-5) + 2px);
  top:calc(var(--sp-3) + 9px); width:9px; height:9px; border-radius:50%;
  background:var(--parchment); border:1px solid var(--amber);
  transition:background .4s var(--ease), box-shadow .4s var(--ease); }
.rail__stop.is-on::before{ background:var(--amber); box-shadow:0 0 0 4px rgba(196,129,26,.16); }
.rail__stop h3{ font-size:1.15rem; margin-bottom:2px; }
.rail__stop p{ font-size:.9rem; color:var(--ink-soft); margin:0; }
.rail__stop small{ display:block; font-size:10px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--amber-text); margin-bottom:4px; }
.rail--dark::before{ background:linear-gradient(to bottom,var(--amber-light),rgba(196,129,26,.18)); }
.rail--dark .rail__stop::before{ background:var(--espresso); }
.rail--dark .rail__stop h3{ color:var(--cream); }
.rail--dark .rail__stop p{ color:rgba(243,232,208,.6); }
.rail--dark .rail__stop small{ color:var(--amber-light); }

/* ── APPLIST ─────────────────────────────────────────────── */
.applist{ border-top:1px solid rgba(243,232,208,.16); margin-top:var(--sp-6); }
.applist a{ display:grid; grid-template-columns:auto 1fr auto; gap:var(--sp-4);
  align-items:baseline; padding:var(--sp-5) 0;
  border-bottom:1px solid rgba(243,232,208,.16);
  transition:padding-left .4s var(--ease), background .4s var(--ease); }
.applist a:hover, .applist a:focus-visible{ padding-left:var(--sp-4); background:rgba(196,129,26,.07); }
.applist .n{ font-family:var(--font-head); font-style:italic; color:var(--amber); font-size:1rem; }
.applist .t{ font-family:var(--font-head); font-size:clamp(1.5rem,3vw,2.2rem);
  color:var(--cream); line-height:1.1; }
.applist .d{ display:block; font-family:var(--font-body); font-size:.88rem;
  color:rgba(243,232,208,.55); margin-top:6px; max-width:58ch; }
.applist .go{ color:var(--amber-light); font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; white-space:nowrap; }
@media (max-width:700px){
  .applist a{ grid-template-columns:auto 1fr; }
  .applist .go{ grid-column:2; margin-top:var(--sp-2); }
}

/* ── BUTTON / NAV microinteractions ──────────────────────── */
.btn--arrow::after{ content:""; display:inline-block; width:0; height:1px;
  background:currentColor; margin-left:8px; vertical-align:middle;
  transition:width .35s var(--ease); }
.btn--arrow:hover::after, .btn--arrow:focus-visible::after{ width:22px; }
.main-nav a::after{ transform-origin:right; transition:transform .35s var(--ease), width 0s; width:100%; }
.main-nav a:hover::after{ transform:scaleX(1); transform-origin:left; }
.main-nav a:not([aria-current])::after{ transform:scaleX(0); }
.main-nav a[aria-current]::after{ transform:scaleX(1); }

/* ── PATHS (final CTA) ───────────────────────────────────── */
.paths{ display:grid; grid-template-columns:1fr 1fr; border-top:1px solid rgba(59,27,12,.16); }
@media (max-width:800px){ .paths{ grid-template-columns:1fr; } }
.paths a{ padding:clamp(var(--sp-6),5.5vw,var(--sp-8)) var(--sp-5);
  display:flex; flex-direction:column; gap:var(--sp-2);
  transition:background .4s var(--ease); }
.paths a + a{ border-left:1px solid rgba(59,27,12,.16); }
@media (max-width:800px){ .paths a + a{ border-left:0; border-top:1px solid rgba(59,27,12,.16); } }
.paths a:hover{ background:rgba(196,129,26,.09); }
.paths small{ font-size:10px; letter-spacing:.28em; text-transform:uppercase; color:var(--amber-text); }
.paths strong{ font-family:var(--font-head); font-weight:400;
  font-size:clamp(1.5rem,3vw,2.3rem); color:var(--cacao); line-height:1.1; }
.paths span{ font-size:.9rem; color:var(--ink-soft); max-width:40ch; }

/* ── STAGE variant for interior pages ────────────────────── */
/* a fixed-ish height keeps the page below from moving when the display font swaps in */
.stage--sub{ min-height:clamp(480px, 66svh, 640px); padding:var(--sp-8) var(--sp-4) var(--sp-7); align-items:flex-end; }
.stage--sub h1{ font-size:clamp(2.1rem,5vw,4.3rem); max-width:19ch; margin-bottom:var(--sp-4); }
.stage--sub .stage__lead{ margin-bottom:var(--sp-5); }
.stage--sub::before{
  background:radial-gradient(105% 88% at 2% 46%, var(--parchment) 0%, rgba(250,245,235,.88) 42%, rgba(250,245,235,0) 78%);
}
@media (max-width:900px){
  .stage--sub{ min-height:clamp(540px, 76svh, 680px); padding:var(--sp-7) var(--sp-4) var(--sp-6); }
  .stage--sub::before{ background:linear-gradient(180deg, var(--parchment) 0%, rgba(250,245,235,.92) 60%, rgba(250,245,235,.45) 100%); }
  .stage--sub .stage__field{ height:100%; opacity:.5; }
}
/* breadcrumb-ish trail above an interior H1 */
.stage__trail{ display:flex; gap:.6em; font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--dust); margin-bottom:var(--sp-4); }
.stage__trail a{ color:var(--amber-text); }

/* ── brand moments ───────────────────────────────────────── */
/* the pairing line under the brand headline */
.stage__pair{
  display:flex; align-items:center; flex-wrap:wrap; gap:.7em;
  font-size:clamp(.78rem,1.2vw,.95rem); letter-spacing:.3em; text-transform:uppercase;
  color:var(--cacao); margin:0 0 var(--sp-4);
}
.stage__pair i{ font-style:normal; color:var(--amber-text); font-size:1.35em; line-height:1; }
.stage h1 em{ font-style:italic; color:var(--amber-text); }

/* "Zieh mich hoch." — a room of its own */
.pullup{
  min-height:64svh; display:grid; place-items:center; text-align:center;
  padding:var(--sp-8) var(--sp-4); background:var(--parchment);
}
.pullup p{
  font-family:var(--font-head); font-weight:300; font-style:italic;
  font-size:clamp(2.4rem,8vw,6rem); line-height:1; color:var(--cacao);
  margin:0; letter-spacing:-.015em;
  opacity:0; transform:translateY(46px);
  transition:opacity 1.1s var(--ease), transform 1.1s var(--ease);
}
.pullup.is-visible p{ opacity:1; transform:none; }
.pullup i{
  display:block; width:min(220px,42vw); height:1px; margin:var(--sp-5) auto var(--sp-3);
  background:var(--amber); transform:scaleX(0); transform-origin:left center;
  transition:transform 1.2s var(--ease) .25s;
}
.pullup.is-visible i{ transform:scaleX(1); }
.pullup small{
  display:block; font-size:10px; letter-spacing:.36em; text-transform:uppercase;
  color:var(--amber-text); opacity:0; transition:opacity .8s var(--ease) .6s;
}
.pullup.is-visible small{ opacity:1; }
@media (prefers-reduced-motion: reduce){
  .pullup p, .pullup small{ opacity:1 !important; transform:none !important; }
  .pullup i{ transform:scaleX(1) !important; }
}

/* "Quietly Essential." — dark, quiet, wide */
.quiet{
  background:var(--espresso-deep); padding:var(--sp-9) var(--sp-4);
  text-align:center;
}
.quiet p{
  font-family:var(--font-head); font-weight:300;
  font-size:clamp(2rem,6vw,4.6rem); line-height:1.05; color:var(--cream);
  margin:0; letter-spacing:-.01em;
}
.quiet em{ font-style:italic; color:var(--amber-light); }
.quiet small{
  display:block; margin-top:var(--sp-5); font-size:11px; letter-spacing:.3em;
  text-transform:uppercase; color:rgba(243,232,208,.62);
}

/* thinking + doing, without cards */
.duo{ padding:var(--sp-9) var(--sp-4); }
.duo__inner{
  max-width:1280px; margin:0 auto; display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:clamp(var(--sp-5),5vw,var(--sp-8));
}
.duo h3{
  font-family:var(--font-head); font-weight:400; font-size:clamp(1.5rem,3vw,2.3rem);
  color:var(--cacao); margin:0 0 var(--sp-3);
}
.duo h3 em{ font-style:italic; color:var(--amber-text); }
.duo p{ font-size:1rem; line-height:1.75; color:var(--ink-soft); max-width:44ch; margin:0; }
.duo__rule{ height:1px; background:rgba(59,27,12,.16); margin-bottom:var(--sp-4); }

/* ── rhythm corrections ──────────────────────────────────── */
/* a statement already carries its own air — don't stack two full gaps */
.statement + .split{ padding-top:var(--sp-6); }
.split + .split{ padding-top:var(--sp-8); }

@media (max-width:900px){
  .statement{ padding:var(--sp-7) var(--sp-4); }
  .split{ padding:var(--sp-7) var(--sp-4); }
  .statement + .split{ padding-top:var(--sp-5); }
  .split__vis svg text{ font-size:12px; letter-spacing:1.2px; }
  .split__vis{ margin-top:var(--sp-4); }
}

/* ── reduced motion ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  .js .sys-draw{ stroke-dashoffset:0 !important; animation:none !important; }
  .js .sys-pop{ opacity:.5 !important; animation:none !important; }
  .sys-pulse{ display:none !important; }
  .ticker__row{ animation:none !important; }
  .stage__hint i{ animation:none !important; }
  .rail__stop::before{ background:var(--amber) !important; }
}

/* ── TEAM (Über uns) ─────────────────────────────────────── */
.team-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(var(--sp-5),5vw,var(--sp-7)); margin-top:var(--sp-6); }
@media (max-width:760px){ .team-grid{ grid-template-columns:1fr; gap:var(--sp-6); } }
.team-card{ display:flex; flex-direction:column; }
.team-card__photo{ width:100%; height:auto; aspect-ratio:4 / 5; object-fit:cover; object-position:top center;
  border-radius:var(--radius); background:var(--parchment);
  border:1px solid rgba(59,27,12,.10); }
.team-card__body{ padding-top:var(--sp-4); }
.team-card__body h3{ font-family:var(--font-head); font-weight:400; color:var(--cacao);
  font-size:1.5rem; line-height:1.1; margin:0; }
.team-card__role{ font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--amber-text); margin:8px 0 var(--sp-3); }
.team-card__body p:last-child{ font-size:.92rem; color:var(--ink-soft);
  line-height:1.75; margin:0; max-width:52ch; }

/* ── FREE SCAN DIALOG (free-scan.js) ─────────────────────── */
.fs{ position:fixed; inset:0; z-index:1000; display:none; place-items:center; padding:var(--sp-4); }
.fs.is-open{ display:grid; }
.fs__backdrop{ position:absolute; inset:0; background:rgba(26,11,5,.46); opacity:0; transition:opacity .3s var(--ease); }
.fs__dialog{ position:relative; width:100%; max-width:780px;
  max-height:calc(100vh - 2 * var(--sp-4)); max-height:calc(100dvh - 2 * var(--sp-4));
  overflow:auto; overscroll-behavior:contain;
  background:var(--parchment); color:var(--ink);
  border:1px solid rgba(59,27,12,.12); border-radius:var(--radius);
  box-shadow:0 24px 60px rgba(26,11,5,.28);
  padding:clamp(var(--sp-5),4vw,var(--sp-7));
  opacity:0; transform:translateY(12px);
  transition:opacity .3s var(--ease), transform .3s var(--ease); }
.fs.is-visible .fs__backdrop{ opacity:1; }
.fs.is-visible .fs__dialog{ opacity:1; transform:none; }
.fs__dialog:focus{ outline:none; }
.fs__close{ position:absolute; top:8px; right:8px; width:44px; height:44px; display:grid; place-items:center;
  background:none; border:0; cursor:pointer; font-size:26px; line-height:1; color:var(--cacao); border-radius:var(--radius); }
.fs__close:hover{ color:var(--amber-text); }
.fs__close:focus-visible, .fs__later:focus-visible{ outline:2px solid var(--amber); outline-offset:2px; }
.fs__eyebrow{ font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--ink-soft);
  margin:0 var(--sp-6) var(--sp-3) 0; }
.fs__title{ font-family:var(--font-head); font-weight:400; color:var(--cacao);
  font-size:clamp(1.7rem,4vw,2.6rem); line-height:1.05; margin:0; }
.fs__title em{ font-style:normal; color:var(--amber-text); }
.fs__title::after{ content:""; display:block; width:48px; height:2px; background:var(--amber); margin-top:var(--sp-3); }
.fs__lead{ font-size:1rem; color:var(--ink); margin:var(--sp-3) 0 0; max-width:52ch; }
.fs__grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-5); margin-top:var(--sp-5); }
@media (min-width:700px){ .fs__grid{ grid-template-columns:1.05fr .95fr; gap:var(--sp-6); } }
.fs__label{ font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--amber-text); margin:0 0 var(--sp-3); }
.fs__list{ margin:0; }
.fs__list dt{ font-weight:500; color:var(--cacao); font-size:.95rem; margin-top:var(--sp-2); }
.fs__list dt:first-child{ margin-top:0; }
.fs__list dd{ margin:2px 0 0; font-size:.9rem; color:var(--ink-soft); line-height:1.55; }
.fs__need{ margin:0; font-size:.95rem; color:var(--ink); }
.fs__chart{ display:none; margin-top:var(--sp-5); background:rgba(243,232,208,.55); border-radius:var(--radius); padding:var(--sp-3) var(--sp-3) 0; }
@media (min-width:700px){ .fs__chart{ display:block; } }
.fs__legend{ display:flex; gap:var(--sp-4); justify-content:flex-end; margin:0 0 var(--sp-2); font-size:11px; color:var(--ink-soft); }
.fs__legend span::before{ content:""; display:inline-block; width:18px; height:3px; margin-right:6px; vertical-align:middle; background:#5A4A44; }
.fs__legend span + span::before{ background:var(--amber); }
.fs__chart svg{ width:100%; height:auto; display:block; }
.fs__note{ margin:var(--sp-5) 0 0; font-family:var(--font-head); font-size:clamp(1.1rem,2.2vw,1.35rem); color:var(--cacao); }
.fs__note span{ color:var(--amber-text); }
.fs__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-3) var(--sp-5); margin-top:var(--sp-5); }
.fs__later{ min-height:44px; padding:0 var(--sp-2); background:none; border:0; cursor:pointer; font:inherit; font-size:13px;
  letter-spacing:.06em; color:var(--ink-soft); text-decoration:underline; text-underline-offset:3px; }
.fs__later:hover{ color:var(--cacao); }
/* Mobil: Aktionsleiste am unteren Dialogrand halten, damit der CTA ohne Scrollen sichtbar ist.
   Negative Margins = Dialog-Padding (clamp liefert unter 800px Breite --sp-5). */
@media (max-width:699px){
  .fs__actions{ position:sticky; bottom:calc(-1 * var(--sp-5)); z-index:1;
    margin:var(--sp-5) calc(-1 * var(--sp-5)) calc(-1 * var(--sp-5));
    padding:var(--sp-3) var(--sp-5) var(--sp-5); background:var(--parchment);
    border-top:1px solid rgba(59,27,12,.10); }
}
@media (prefers-reduced-motion: reduce){ .fs__backdrop, .fs__dialog{ transition:none; } }

/* ── PROBLEM-GRID (Startseite, "Der Ausgangspunkt") ─────── */
.problem-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-6); margin-top:var(--sp-5); max-width:1040px; }
@media (min-width:800px){ .problem-grid{ grid-template-columns:1fr 1fr; gap:var(--sp-7); } }
.problem-grid__label{ font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--amber-text); margin:0 0 var(--sp-3); }
.problem-grid .notes{ margin-top:0; }

/* ── LEAD-KARTE (Hotels, Design im Vordergrund) ─────────── */
.svc-card--lead{ grid-column:1 / -1; border-left:3px solid var(--amber); }
.svc-card--lead h3{ font-size:clamp(1.35rem,2.2vw,1.6rem); }
.svc-card--lead p{ max-width:72ch; font-size:1rem; }

/* ── HOME-PAIR (Startseite: Anwendungen | Architekten) ───── */
.home-pair{ display:grid; grid-template-columns:1fr; gap:var(--sp-7); }
@media (min-width:960px){ .home-pair{ grid-template-columns:1.1fr .9fr; gap:clamp(var(--sp-6),5vw,var(--sp-8)); align-items:start; } }
.home-pair__col--arch{ padding-top:0; }  /* mobil trennt schon die letzte Listenlinie */
@media (min-width:960px){ .home-pair__col--arch{ padding-top:0; border-top:0; padding-left:clamp(var(--sp-5),4vw,var(--sp-7)); border-left:1px solid rgba(59,27,12,.14); } }