:root{
  /* ---- Corporate Colours (Logo-Redesign V3 — FINALE Hex-Werte, 2026-07-09) ---- */
  --jet:#0e0c12;
  --arctic:#ffffff;
  --cosmos:#2b1275;      /* DEEP COSMOS */
  --orchid:#8229ff;      /* ELECTRIC ORCHID */
  --tangerine:#ff914c;   /* VIBRANT TANGERINE */
  --haze:#d1b3ff;        /* LAVENDER HAZE */

  --canvas:#eae6f2;
  --paper:#fffefc;
  --ink:#141119;
  --ink-soft:#5d5669;
  --ink-faint:#9c95a9;
  /* CTA-Variante (Partner-Test): Default Orchid, umschaltbar auf Lavender */
  --cta-bg:var(--orchid);--cta-fg:var(--arctic);--cta-shadow:rgba(130,41,255,.55);--cta-panel-bg:var(--arctic);

  --line:rgba(20,17,25,.13);
  --line-soft:rgba(20,17,25,.07);
  --shadow:0 40px 80px -32px rgba(43,18,117,.26), 0 8px 24px -12px rgba(43,18,117,.14);
  --maxw:1440px;            /* Papierbreite — ENTSCHIEDEN 2026-08-16: 1440 Desktop, fix */
  --wrappad:clamp(14px,3vw,40px);
  --pad:clamp(22px,5vw,84px);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html.lenis{scroll-behavior:auto}
body{
  font-family:"Hanken Grotesk",sans-serif;
  background:var(--canvas);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{background:var(--orchid);color:var(--arctic)}

/* ---- Wordmark „kootsch." — finales Designer-SVG (Logo-Redesign V3) ---- */
.wordmark{display:inline-flex;align-items:center;line-height:0}
.wordmark svg{display:block;width:auto;overflow:visible}
.wordmark svg path{fill:currentColor}
.wordmark.grad svg path{fill:url(#ktlg)} /* Orchid→Tangerine über die volle Wortbreite */
.wordmark svg .lg-dot{transform-box:fill-box;transform-origin:center;transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.wordmark:hover svg .lg-dot{transform:translateY(-22px)} /* px = viewBox-Einheiten (167 hoch) ≈ 3px im Nav-Maßstab */

/* Nav-Gimmick: Doppel-o als „Switch" — das volle o springt (leicht verzögert) auf die Ring-Position
   und umgekehrt. Ruhezustand = Original-Glyph; die Kreise sind unsichtbar geparkt. Die komplette
   Choreografie (Glyph-Tausch, Sprung, Rücklauf) läuft in JS/GSAP, denn: Die Kreise nutzen eigene
   Verlaufs-Klone (#ktlgF/#ktlgR), deren gradientTransform gegenläufig zur Kreisbewegung animiert
   wird — so bleibt der Verlauf ortsfest und das Wordmark läuft während des Switch durchgängig
   Orchid→Tangerine (die o's nehmen unterwegs kontinuierlich die Farbe ihres Zielorts an). */
.wordmark svg .o-fill{fill:currentColor;opacity:0}
.wordmark svg .o-ring{fill:none;stroke:currentColor;opacity:0}
.wordmark.grad svg .o-fill{fill:url(#ktlgF)}
.wordmark.grad svg .o-ring{stroke:url(#ktlgR)}
.wordmark svg .lg-bang{fill:currentColor;opacity:0;transform:scaleY(0);transform-box:fill-box;transform-origin:center bottom;
  transition:transform .45s cubic-bezier(.34,1.56,.64,1) .22s,opacity .2s .22s}
.wordmark.grad svg .lg-bang{fill:url(#ktlg)}
.wordmark:hover svg .lg-bang{opacity:1;transform:scaleY(1)}
nav .wordmark:hover svg .lg-dot{transform:none} /* Punkt hüpft in der Nav nicht mehr — er ist der Punkt des „!" */

/* ---- Atmosphärischer three.js-Hintergrund ---- */
#bg{position:fixed;inset:0;z-index:0;pointer-events:none}

/* ---- Scroll-Progress ---- */
#progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:90;background:linear-gradient(90deg,var(--orchid),var(--tangerine));transform:scaleX(0);transform-origin:left;pointer-events:none}

/* ---- Custom Cursor: Punkt + Ring = das Doppel-o (nur pointer:fine) ---- */
#cur,#curring{position:fixed;top:0;left:0;z-index:120;pointer-events:none;border-radius:50%;display:none}
#cur{width:8px;height:8px;background:var(--orchid);transform:translate(-50%,-50%)}
#curring{width:34px;height:34px;border:1.5px solid rgba(130,41,255,.5);transform:translate(-50%,-50%);transition:width .3s,height .3s,border-color .3s,background .3s}
body.cur-hover #curring{width:52px;height:52px;border-color:rgba(130,41,255,.9);background:rgba(130,41,255,.08)}
body.cur-dark #cur{background:var(--tangerine)}
body.cur-dark #curring{border-color:rgba(255,145,76,.65)}
@media(pointer:fine){body.has-cursor{cursor:none} body.has-cursor a,body.has-cursor button{cursor:none} #cur,#curring{display:block}}

/* ---- Loader — Brand-Gradient-Mesh statt Flächenfarbe (wie Logo-PDF S.4/7) ---- */
#loader{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:26px;
  background:
    radial-gradient(95% 115% at 86% 6%, rgba(130,41,255,.92), transparent 62%),
    radial-gradient(115% 95% at 8% 94%, rgba(255,145,76,.88), transparent 58%),
    radial-gradient(75% 75% at 48% 46%, rgba(209,179,255,.32), transparent 72%),
    var(--cosmos)}
#loader::after{content:"";position:absolute;inset:0;opacity:.5;mix-blend-mode:overlay;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='gl'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23gl)' opacity='.5'/%3E%3C/svg%3E")}
#loader>*{position:relative;z-index:2}
/* Logo + Balken laufen per CSS ab First Paint (kein Warten auf JS/window.load);
   GSAP friert die Animationen bei window.load ein und übernimmt das Finale */
#loader .wordmark{color:var(--arctic);opacity:0;animation:ldWm .6s ease .2s forwards}
#loader .wordmark svg{height:36px}
#loader .bar{width:min(220px,42vw);height:1px;background:rgba(255,255,255,.35)}
#loader .bar i{display:block;height:100%;width:0;background:var(--arctic);animation:ldBar 2.4s cubic-bezier(.25,.6,.3,1) .35s forwards}
@keyframes ldWm{to{opacity:1}}
@keyframes ldBar{to{width:82%}}

/* ---- Papier ---- */
.wrap{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 var(--wrappad);transition:max-width .45s cubic-bezier(.6,.1,.2,1)}
.paper{position:relative;background:var(--paper);border-radius:22px;box-shadow:var(--shadow);overflow:hidden;margin:18px auto 28px}
#paper{margin-top:clamp(88px,11vh,118px)} /* Abstand zur gepinnten Nav */
.paper::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}
.guides{position:absolute;inset:0;pointer-events:none;z-index:1}
.guides .v{position:absolute;top:0;bottom:0;width:1px;background:var(--line-soft);transform:scaleY(0);transform-origin:top;
  display:none} /* versuchsweise entfernt (Partner-Feedback „too much") — Zeile löschen, um sie zurückzuholen */
.guides .v.l{left:var(--pad)} .guides .v.r{right:var(--pad)}

/* ---- Nav — vollbreit an den oberen Rand gepinnt (Attio-Stil) ---- */
nav{position:fixed;top:0;left:0;right:0;z-index:50;
  background:rgba(255,254,252,.68);backdrop-filter:blur(14px) saturate(1.3);
  border-bottom:1px solid var(--line-soft);
  transition:background .4s,box-shadow .4s}
nav.scrolled{background:rgba(255,254,252,.88);box-shadow:0 12px 32px -24px rgba(43,18,117,.3)}
.navin{max-width:var(--maxw);margin:0 auto;padding:0 var(--wrappad);transition:max-width .45s cubic-bezier(.6,.1,.2,1)}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:15px 0;transition:padding .4s}
nav.scrolled .navbar{padding-top:11px;padding-bottom:11px}
nav .wordmark{color:var(--ink);text-decoration:none}
nav .wordmark svg{height:25px}
.navlinks{display:flex;align-items:center;gap:30px}
.navlinks a{font-size:14px;font-weight:500;color:var(--ink-soft);text-decoration:none;position:relative;transition:color .25s}
.navlinks a::after{content:"";position:absolute;left:0;bottom:-5px;height:1px;width:0;background:var(--orchid);transition:width .3s}
.navlinks a:hover,.navlinks a.active{color:var(--ink)}
.navlinks a:hover::after,.navlinks a.active::after{width:100%}
.navcta{font-size:13.5px;font-weight:600;color:var(--cta-fg);background:var(--cta-bg);padding:10px 18px;border-radius:100px;text-decoration:none;transition:transform .25s,background .25s,color .25s;white-space:nowrap}
.navcta:hover{color:var(--arctic)}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.burger span{width:24px;height:2px;background:var(--ink);border-radius:2px;transition:.3s}

/* ---- Mobile-Menü ---- */
#mmenu{position:fixed;inset:0;z-index:48;background:rgba(255,254,252,.96);backdrop-filter:blur(20px) saturate(1.3);
  display:flex;flex-direction:column;justify-content:center;padding:100px clamp(24px,8vw,48px) 48px;
  opacity:0;pointer-events:none;transition:opacity .35s}
body.menu-open{overflow:hidden}
body.menu-open #mmenu{opacity:1;pointer-events:auto}
#mmenu a{font-family:"Schibsted Grotesk",sans-serif;font-size:clamp(26px,6.5vw,38px);font-weight:600;letter-spacing:-.01em;
  color:var(--ink);text-decoration:none;padding:14px 0;border-bottom:1px solid var(--line-soft);
  opacity:0;transform:translateY(16px);transition:opacity .4s,transform .4s}
body.menu-open #mmenu a{opacity:1;transform:none}
#mmenu a:nth-child(2){transition-delay:.05s}#mmenu a:nth-child(3){transition-delay:.1s}
#mmenu a:nth-child(4){transition-delay:.15s}#mmenu a:nth-child(5){transition-delay:.2s}
#mmenu .mcta{margin-top:30px;border-bottom:0;background:var(--cta-bg);color:var(--cta-fg);text-align:center;
  border-radius:100px;padding:16px 24px;font-family:"Hanken Grotesk",sans-serif;font-size:16px;transition-delay:.25s}
body.menu-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(min-width:861px){#mmenu{display:none}}

/* ---- Sektions-Primitives ---- */
section{padding:clamp(70px,11vh,140px) var(--pad);position:relative}
/* Eyebrows im Brand-Verlauf (Versuch) */
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;
  background:linear-gradient(90deg,var(--orchid),var(--tangerine) 125%);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--orchid);display:inline-block}
.statement .eyebrow{background:none;-webkit-background-clip:initial;background-clip:initial}
.display{font-family:"Schibsted Grotesk",sans-serif;font-weight:500;line-height:1.05;letter-spacing:-.018em;color:var(--ink)}
.reveal{opacity:0;transform:translateY(22px)}
.hr{height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;margin:0 var(--pad)}
/* Wort-Masken für Headline-Reveals.
   .words startet per CSS unsichtbar: der Browser malt die Seite VOR den
   deferred Scripts — ohne diese Regel blitzt die rohe Headline auf, bevor
   das JS sie für das Intro zerlegt (User-Bug 2026-08-16). JS setzt beim
   Intro-Start opacity:1 zurück; .anim-off (Failsafe) und Reduced-Motion
   heben es ebenfalls auf. */
.words{opacity:0}
.words .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.words .w>i{display:inline-block;font-style:normal;transform:translateY(115%)}
/* Failsafe: falls JS/CDN nicht lädt, zeigt ein Inline-Timeout im <head> die
   Inhalte nach 3 s ohne Animation */
.anim-off .words,.anim-off .reveal{opacity:1!important;transform:none!important}
.anim-off .words .w>i{transform:none!important}
.anim-off .hero h1 em .ch{opacity:1!important;transform:none!important}
.anim-off #loader{display:none!important}

/* ---- Hero ---- */
.hero{min-height:82vh;display:flex;flex-direction:column;justify-content:center;padding-top:clamp(70px,9vh,110px)}
.hero .eyebrow{margin-bottom:30px}
.hero h1{font-size:clamp(40px,7.6vw,124px);max-width:14ch}
.hero h1 em{font-style:normal;color:var(--orchid);white-space:nowrap} /* .ch-Spans (inline-block) dürfen nie mitten im Wort umbrechen */
/* „wirksam." — Verlauf über das Wort, Buchstabe für Buchstabe (Slices via JS) */
.hero h1 em .ch{display:inline-block;-webkit-background-clip:text;background-clip:text;color:transparent;
  opacity:0;transform:translateY(96px) rotate(10deg) scale(1.3);will-change:transform,opacity,filter}
.hero .sub{margin-top:34px;max-width:54ch;font-size:clamp(17px,1.5vw,20px);line-height:1.65;color:var(--ink-soft)}
.hero .cta-row{margin-top:46px;display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.btn{font-size:15px;font-weight:600;text-decoration:none;border-radius:100px;padding:15px 28px;transition:background .25s,color .25s,box-shadow .25s;display:inline-flex;align-items:center;gap:10px;will-change:transform}
/* CTA-Farbvarianten (Partner-Test, Umschalter unten rechts): Orchid vs. Lavender Haze */
.btn-primary{background:var(--cta-bg);color:var(--cta-fg);box-shadow:0 14px 32px -12px var(--cta-shadow)}
.btn-primary:hover{color:var(--arctic);box-shadow:0 16px 36px -12px rgba(255,145,76,.5)}
/* Hover: fließender Orchid→Tangerine-Verlauf (nahtlose Schleife via repeat + symmetrischem Gradient) */
.btn-primary,.navcta,.tisc-panel .btn{position:relative;overflow:hidden;z-index:0}
.btn-primary::before,.navcta::before,.tisc-panel .btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;
  background:linear-gradient(110deg,var(--orchid),var(--tangerine),var(--orchid));
  background-size:200% 100%;background-repeat:repeat;
  opacity:0;transition:opacity .35s;animation:ctaflow 2.2s linear infinite paused}
.btn-primary:hover::before,.navcta:hover::before,.tisc-panel .btn:hover::before{opacity:1;animation-play-state:running}
@keyframes ctaflow{to{background-position:200% 0}}
.btn-ghost{color:var(--ink);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--ink)}
.btn .arr{transition:transform .3s} .btn:hover .arr{transform:translateX(4px)}
.hero .meta{margin-top:60px;display:flex;gap:40px;flex-wrap:wrap;border-top:1px solid var(--line-soft);padding-top:26px}
.hero .meta div{font-size:13.5px;color:var(--ink-soft)} .hero .meta b{display:block;font-family:"Schibsted Grotesk";font-size:26px;font-weight:600;color:var(--ink);letter-spacing:-.01em;margin-bottom:3px}

/* ---- Hero-Visual — Higgsfield-Bild mit sanfter Maus-Parallax (später interaktiv) ---- */
.media-ph{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 24px 60px -28px rgba(43,18,117,.4);background:var(--cosmos)}
.media-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);will-change:transform}
.media-ph .blob{position:absolute;border-radius:50%;filter:blur(60px);will-change:transform}
.media-ph .b1{width:55%;aspect-ratio:1;background:rgba(130,41,255,.95);right:-8%;top:-42%;animation:float1 11s ease-in-out infinite alternate}
.media-ph .b2{width:52%;aspect-ratio:1;background:rgba(255,145,76,.9);left:-10%;bottom:-52%;animation:float2 13s ease-in-out infinite alternate}
.media-ph .b3{width:34%;aspect-ratio:1;background:rgba(209,179,255,.55);left:38%;top:-8%;animation:float1 16s ease-in-out infinite alternate-reverse}
@keyframes float1{from{transform:translate(0,0) scale(1)}to{transform:translate(-5%,7%) scale(1.08)}}
@keyframes float2{from{transform:translate(0,0) scale(1)}to{transform:translate(6%,-6%) scale(1.05)}}
.media-ph .grain{position:absolute;inset:0;opacity:.55;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='.5'/%3E%3C/svg%3E")}
.media-ph .tag{position:absolute;left:18px;bottom:16px;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.28);border-radius:100px;padding:7px 14px;backdrop-filter:blur(6px)}
.hero .media-ph{margin-top:58px;aspect-ratio:2/1}

/* ---- Marquee ---- */
.marquee{overflow:hidden;padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 var(--pad)}
.mtrack{display:flex;width:max-content;will-change:transform;animation:mq 30s linear infinite}
.marquee:hover .mtrack{animation-play-state:paused}
.mtrack span{font-family:"Schibsted Grotesk";font-weight:500;font-size:clamp(17px,1.8vw,24px);letter-spacing:-.01em;color:var(--ink);white-space:nowrap;padding-right:.6em}
.mtrack span b{font-weight:500;color:var(--orchid);padding-right:.6em}
@keyframes mq{to{transform:translateX(-25%)}}

/* ---- Problem — die Kästchen ---- */
.problem h2{font-size:clamp(30px,4.4vw,58px);max-width:18ch;margin-bottom:14px}
.problem .lead{color:var(--ink-soft);max-width:50ch;font-size:18px;line-height:1.6;margin-bottom:54px}
.prob-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.prob-grid .cell{background:var(--paper);padding:32px 28px;transition:background .4s;position:relative;overflow:hidden}
.prob-grid .cell::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:linear-gradient(90deg,var(--orchid),var(--tangerine));transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.6,.1,.2,1)}
.prob-grid .cell:hover{background:#fff}
.prob-grid .cell:hover::after{transform:scaleX(1)}
.prob-grid .n{font-family:"Schibsted Grotesk";font-size:15px;color:var(--orchid);margin-bottom:14px;transition:transform .4s;display:inline-block}
.prob-grid .cell:hover .n{transform:translateX(6px)}
.prob-grid h3{font-size:20px;font-weight:600;margin-bottom:9px;letter-spacing:-.01em}
.prob-grid p{color:var(--ink-soft);font-size:15px;line-height:1.6}
.problem .turn{margin-top:46px;font-family:"Schibsted Grotesk";font-size:clamp(20px,2.4vw,30px);line-height:1.4;max-width:32ch;color:var(--ink)}

/* ---- Säulen ---- */
.pillars{background:linear-gradient(180deg,transparent,rgba(234,230,242,.55))}
.pillars .head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:18px}
.pillars h2{font-size:clamp(30px,4.4vw,58px);max-width:16ch}
.pillars .head p{color:var(--ink-soft);max-width:34ch;font-size:16px;line-height:1.6}
.pillar{display:grid;grid-template-columns:110px 1fr 1.1fr;gap:34px;padding:48px 0;border-top:1px solid var(--line);align-items:start}
.pillar .idx{font-family:"Schibsted Grotesk";font-size:72px;font-weight:500;line-height:1;color:transparent;-webkit-text-stroke:1.2px rgba(20,17,25,.32);transition:color .5s,-webkit-text-stroke-color .5s;will-change:transform}
.pillar:hover .idx{color:var(--orchid);-webkit-text-stroke-color:transparent}
.pillar .ttl h3{font-size:clamp(24px,3vw,34px);font-family:"Schibsted Grotesk";font-weight:600;letter-spacing:-.015em;margin-bottom:8px}
.pillar .ttl .tag{font-size:13.5px;color:var(--orchid);font-family:"Schibsted Grotesk"}
.pillar .body>p{color:var(--ink-soft);font-size:16px;line-height:1.65;margin-bottom:18px}
.pillar ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.pillar li{font-size:15px;color:var(--ink);display:flex;gap:12px;align-items:flex-start}
.pillar li::before{content:"";flex-shrink:0;width:7px;height:7px;border-radius:50%;border:1.5px solid var(--orchid);margin-top:6px;transition:background .3s}
.pillar li:hover::before{background:var(--orchid)}

/* ---- Warum / USP ---- */
.why h2{font-size:clamp(30px,4.4vw,58px);max-width:16ch;margin-bottom:48px}
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.why-grid .c{background:var(--paper);padding:38px 34px;transition:background .4s;position:relative;overflow:hidden}
.why-grid .c:hover{background:#fff}
.why-grid .ic{width:42px;height:42px;border-radius:11px;background:rgba(130,41,255,.09);display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:var(--orchid);transition:background .35s,color .35s,transform .35s}
.why-grid .c:hover .ic{background:var(--orchid);color:var(--arctic);transform:translateY(-3px) rotate(-3deg)}
.why-grid h3{font-size:20px;font-weight:600;margin-bottom:9px;letter-spacing:-.01em}
.why-grid p{color:var(--ink-soft);font-size:15.5px;line-height:1.62}

/* ---- TISC ---- */
.tisc{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(40px,5vw,72px);align-items:center}
.tisc h2{font-size:clamp(28px,3.8vw,50px);max-width:15ch;margin:20px 0 18px}
.tisc .copy p{color:var(--ink-soft);font-size:17px;line-height:1.65;max-width:46ch;margin-bottom:16px}
.tisc .facts{display:flex;gap:26px;flex-wrap:wrap;margin:26px 0 10px;border-top:1px solid var(--line-soft);padding-top:22px}
.tisc .facts div{font-size:13px;color:var(--ink-soft)}
.tisc .facts b{display:block;font-family:"Schibsted Grotesk";font-size:20px;font-weight:600;color:var(--ink);margin-bottom:2px}
.tisc-wrap{perspective:1100px}
.tisc-panel{position:relative;border-radius:20px;overflow:hidden;background:var(--cosmos);box-shadow:0 30px 70px -30px rgba(43,18,117,.55);padding:clamp(30px,3.4vw,46px);will-change:transform;transform-style:preserve-3d}
.tisc-panel::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(90% 90% at 88% 0%, rgba(130,41,255,.75), transparent 60%),
  radial-gradient(80% 80% at 0% 100%, rgba(255,145,76,.5), transparent 55%)}
.tisc-panel::after{content:"";position:absolute;inset:0;opacity:.5;mix-blend-mode:overlay;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g2'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g2)' opacity='.5'/%3E%3C/svg%3E")}
.tisc-panel>*{position:relative;z-index:2}
.tisc-panel .plabel{font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:22px}
.tisc-panel .score-row{display:flex;align-items:baseline;gap:14px;margin-bottom:30px}
.tisc-panel .score{font-family:"Schibsted Grotesk";font-weight:600;font-size:clamp(54px,5vw,74px);color:var(--arctic);letter-spacing:-.02em}
.tisc-panel .of{color:rgba(255,255,255,.55);font-size:16px}
.tisc-panel .dims{display:flex;flex-direction:column;gap:16px;margin-bottom:34px}
.tisc-panel .dim{display:grid;grid-template-columns:1fr auto;gap:6px}
.tisc-panel .dim span{font-size:13px;color:rgba(255,255,255,.8)}
.tisc-panel .dim .track{grid-column:1/-1;height:4px;border-radius:4px;background:rgba(255,255,255,.16);overflow:hidden}
.tisc-panel .dim .track i{display:block;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,var(--tangerine),var(--haze))}
.tisc-panel .btn{background:var(--cta-panel-bg);color:var(--cosmos);box-shadow:none;z-index:2}
.tisc-panel .btn:hover{color:var(--arctic)}
.tisc-panel .note{margin-top:16px;font-size:12.5px;color:rgba(255,255,255,.55)}

/* ---- ICP ---- */
.icp{display:grid;grid-template-columns:1.15fr 1fr;gap:60px;align-items:center}
.icp h2{font-size:clamp(28px,3.8vw,50px);max-width:14ch;margin-bottom:18px}
.icp p{color:var(--ink-soft);font-size:17px;line-height:1.65;max-width:46ch}
.icp .trends{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.icp .trends span{font-size:13.5px;border:1px solid var(--line);border-radius:100px;padding:8px 16px;color:var(--ink);transition:background .3s,color .3s,border-color .3s}
.icp .trends span:hover{background:var(--orchid);border-color:var(--orchid);color:var(--arctic)}
.icp .stat{border-left:1px solid var(--line);padding-left:44px}
.icp .stat .big{font-family:"Schibsted Grotesk";font-size:clamp(60px,8.5vw,124px);font-weight:600;line-height:.92;letter-spacing:-.02em;
  background:linear-gradient(96deg,var(--orchid) 10%,var(--tangerine) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.icp .stat .lbl{color:var(--ink-soft);font-size:15px;margin-top:14px;max-width:24ch}

/* ---- Statement ---- */
.statement{background:var(--cosmos);color:var(--arctic);border-radius:22px;box-shadow:var(--shadow);padding:clamp(46px,6vw,90px) clamp(30px,4.5vw,72px);position:relative;overflow:hidden;margin:0 auto 28px}
.statement::before{content:"";position:absolute;inset:0;opacity:.45;mix-blend-mode:overlay;pointer-events:none;z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g3'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g3)' opacity='.5'/%3E%3C/svg%3E")}
.statement .glow{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;will-change:transform}
.statement .ga{width:46%;aspect-ratio:1;background:rgba(130,41,255,.5);right:-10%;top:-30%}
.statement .gb{width:40%;aspect-ratio:1;background:rgba(255,145,76,.32);left:-8%;bottom:-34%}
.statement .eyebrow{color:var(--tangerine)} .statement .eyebrow::before{background:var(--tangerine)}
.statement .grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(36px,5vw,80px);margin-top:32px;position:relative;z-index:2}
.statement .k{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:13px}
.statement .whyt .t{font-family:"Schibsted Grotesk";font-weight:500;font-size:clamp(25px,3.1vw,44px);line-height:1.12;letter-spacing:-.02em}
.statement .whyt .t em{font-style:normal;color:var(--tangerine)}
.statement .mv{display:flex;flex-direction:column;gap:32px}
.statement .mv .k{color:var(--tangerine)}
.statement .mv .t{font-size:clamp(15.5px,1.35vw,18px);line-height:1.6;color:rgba(255,255,255,.86);max-width:52ch;font-weight:400}

/* ---- Final CTA ---- */
.final{text-align:center;padding-top:clamp(80px,12vh,150px);padding-bottom:clamp(80px,12vh,150px)}
.final h2{font-size:clamp(36px,6vw,90px);max-width:16ch;margin:0 auto 22px}
.final p{color:var(--ink-soft);font-size:18px;line-height:1.6;max-width:42ch;margin:0 auto 40px}

/* ---- Footer ---- */
footer{padding:48px var(--pad) 40px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;border-top:1px solid var(--line)}
footer .wordmark{color:var(--ink)}
footer .wordmark svg{height:22px}
footer .slogan{font-family:"Schibsted Grotesk";color:var(--ink-soft);font-size:15px}
footer .fnav{display:flex;gap:22px;flex-wrap:wrap} footer .fnav a{font-size:13.5px;color:var(--ink-soft);text-decoration:none} footer .fnav a:hover{color:var(--ink)}
.subnote{max-width:var(--maxw);margin:0 auto;padding:16px var(--wrappad) 40px;color:var(--ink-faint);font-size:12.5px;letter-spacing:.02em}

/* ==== Ornament-Baukasten (Attio-inspiriert): feine Linien, Punkte, Bögen, Plus-Marken ====
   Wiederverwendbar für alle künftigen Seiten: .plus (Schnittpunkt-Kreuze),
   .da/.db/.dc/.dd (variierende Box-Hintergründe), .dotgrid (dunkle Flächen). */
.plus{position:absolute;width:11px;height:11px;color:rgba(20,17,25,.30);z-index:3;pointer-events:none}
.plus::before,.plus::after{content:"";position:absolute;background:currentColor}
.plus::before{left:50%;top:0;bottom:0;width:1px;margin-left:-.5px}
.plus::after{top:50%;left:0;right:0;height:1px;margin-top:-.5px}
.plus.tl{top:-6px;left:-6px}.plus.tr{top:-6px;right:-6px}
.plus.bl{bottom:-6px;left:-6px}.plus.br{bottom:-6px;right:-6px}
.guides .plus{top:24px}
.guides .plus.gl{left:calc(var(--pad) - 5.5px)} .guides .plus.gr{right:calc(var(--pad) - 5.5px)}

/* variierende Kachel-Hintergründe — immer hinter dem Inhalt, weich ausmaskiert */
.prob-grid .cell>*,.why-grid .c>*{position:relative;z-index:1}
.deco::before{content:"";position:absolute;inset:0;pointer-events:none}
.deco.da::before{ /* Punkt-Raster */
  background-image:radial-gradient(rgba(20,17,25,.15) 1px,transparent 1.5px);background-size:13px 13px;
  -webkit-mask-image:radial-gradient(140% 120% at 100% 0%,#000 18%,transparent 62%);mask-image:radial-gradient(140% 120% at 100% 0%,#000 18%,transparent 62%)}
.deco.db::before{ /* sanfte Diagonalstriche */
  background-image:repeating-linear-gradient(-45deg,rgba(20,17,25,.10) 0 1px,transparent 1px 10px);
  -webkit-mask-image:radial-gradient(150% 130% at 0% 100%,#000 16%,transparent 60%);mask-image:radial-gradient(150% 130% at 0% 100%,#000 16%,transparent 60%)}
.deco.dc::before{ /* konzentrische Bögen */
  background:repeating-radial-gradient(circle at 108% -12%,rgba(20,17,25,.11) 0 1px,transparent 1px 17px);
  -webkit-mask-image:radial-gradient(160% 140% at 100% 0%,#000 28%,transparent 72%);mask-image:radial-gradient(160% 140% at 100% 0%,#000 28%,transparent 72%)}
.deco.dd::before{ /* feines Karo */
  background-image:linear-gradient(rgba(20,17,25,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(20,17,25,.08) 1px,transparent 1px);background-size:20px 20px;
  -webkit-mask-image:radial-gradient(140% 120% at 0% 0%,#000 16%,transparent 58%);mask-image:radial-gradient(140% 120% at 0% 0%,#000 16%,transparent 58%)}
.prob-grid,.why-grid{position:relative}
/* Index-Notation [01] */
.prob-grid .n::before{content:"[ ";color:var(--ink-faint)}
.prob-grid .n::after{content:" ]";color:var(--ink-faint)}
/* Säulen: Knoten-Punkt auf der Trennlinie */
.pillar{position:relative}
.pillar::before{content:"";position:absolute;top:-4.5px;left:28px;width:8px;height:8px;border-radius:50%;
  background:var(--paper);border:1.5px solid rgba(20,17,25,.32);transition:border-color .4s,background .4s;z-index:2}
.pillar:hover::before{border-color:var(--orchid);background:var(--orchid)}
/* Stat: konzentrische Bögen hinter der Zahl */
.icp .stat{position:relative}
.icp .stat>*{position:relative;z-index:1}
.icp .stat::before{content:"";position:absolute;right:-36px;top:-52px;width:280px;height:280px;border-radius:50%;pointer-events:none;
  background:repeating-radial-gradient(circle,transparent 0 17px,rgba(20,17,25,.09) 17px 18px);
  -webkit-mask-image:radial-gradient(#000 28%,transparent 70%);mask-image:radial-gradient(#000 28%,transparent 70%)}
/* Ausbaukandidat 1: Säulen-Rail — gestrichelte Verbindungslinie durch die Knoten, mit Scroll-Puls */
.pillars .rail{position:absolute;left:calc(var(--pad) + 31.5px);width:1px;z-index:0;pointer-events:none;
  background:repeating-linear-gradient(180deg,rgba(20,17,25,.20) 0 4px,transparent 4px 10px)}
.pillars .rail i{position:absolute;left:50%;top:0;width:7px;height:7px;border-radius:50%;background:var(--orchid);
  transform:translate(-50%,-50%);box-shadow:0 0 0 4px rgba(130,41,255,.14),0 0 14px rgba(130,41,255,.55)}
/* dunkle Flächen: weißes Punkt-Raster */
.dotgrid{position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.22) 1px,transparent 1.5px);background-size:17px 17px;
  -webkit-mask-image:radial-gradient(95% 95% at 90% 4%,#000 8%,transparent 60%);mask-image:radial-gradient(95% 95% at 90% 4%,#000 8%,transparent 60%)}

/* Test-Umschalter (Papierbreite + CTA) entfernt — Entscheidung 2026-08-16 */

/* ---- Responsive ---- */
@media(max-width:1200px){.prob-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1000px){.tisc{grid-template-columns:1fr;gap:44px}}
@media(max-width:860px){
  .navlinks{display:none}
  .burger{display:flex}
  .navbar{padding:10px 18px}
  nav.scrolled .navbar{padding:8px 16px}
  .prob-grid{grid-template-columns:1fr}
  .pillar{grid-template-columns:1fr;gap:14px;padding:36px 0}
  .pillar .idx{font-size:44px}
  .why-grid{grid-template-columns:1fr}
  .icp{grid-template-columns:1fr;gap:40px}
  .icp .stat{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:30px}
  .statement .grid{grid-template-columns:1fr;gap:34px}
  .hero .media-ph{aspect-ratio:16/10}
  .guides .plus{display:none} /* Plus-Marken oben am Blatt mobil ausblenden */
  .hero{padding-top:42px}     /* Eyebrow rückt in den frei gewordenen Raum */
}
@media(max-width:640px){
  .navcta{display:none} /* CTA steckt im Mobile-Menü */
  .hero .cta-row .btn{width:100%;justify-content:center}
  .hero .meta{gap:22px}
  .tisc-panel .btn{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1!important;transform:none!important}
  .words{opacity:1!important}
  .words .w>i{transform:none!important}
  .hero h1 em .ch{opacity:1!important;transform:none!important}
  .mtrack,.media-ph .blob{animation:none!important}
  .btn-primary::before,.navcta::before{animation:none!important}
}

/* ==== Unterseiten-Ergänzungen (Mehrseiten-Ausbau 2026-08-13) ==== */
/* Kompakterer Hero für Unterseiten */
.hero.subhero{min-height:56vh;padding-top:clamp(60px,8vh,96px)}
.subhero h1{font-size:clamp(34px,5.8vw,92px);max-width:16ch}
.subhero .sub{margin-top:28px}
/* Chat-Mock im dunklen Panel (KI-Tools) — nutzt tisc-panel als Basis */
.chatmock{display:flex;flex-direction:column;gap:12px;margin-bottom:30px}
.chatmock .msg{max-width:88%;font-size:14px;line-height:1.55;padding:12px 16px;border-radius:14px}
.chatmock .q{align-self:flex-end;background:rgba(255,255,255,.12);color:rgba(255,255,255,.92);border-bottom-right-radius:4px}
.chatmock .a{align-self:flex-start;background:rgba(255,255,255,.92);color:var(--cosmos);border-bottom-left-radius:4px}
.chatmock .a .src{display:block;margin-top:8px;font-size:11.5px;color:var(--orchid);font-weight:600}
/* Kontakt-Karten */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.contact-grid .c{background:var(--paper);padding:42px 38px;position:relative;overflow:hidden}
.contact-grid .c>*{position:relative;z-index:1}
.contact-grid h3{font-family:"Schibsted Grotesk";font-size:24px;font-weight:600;letter-spacing:-.01em;margin-bottom:10px}
.contact-grid p{color:var(--ink-soft);font-size:15.5px;line-height:1.62;margin-bottom:24px;max-width:38ch}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}

/* ---- TISCovery-Anfrage-Formular (Kontakt-Seite + Overlays) ---- */
.tform{display:flex;flex-direction:column;gap:14px;max-width:520px}
.tf-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.tf-row{grid-template-columns:1fr}}
.tf-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.tf-field span{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.tf-field input,.tf-field select{font-family:inherit;font-size:15px;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);border-radius:12px;padding:11px 13px;outline:none;width:100%;
  transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.tf-field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%235d5669' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:32px}
.tf-field input::placeholder{color:var(--ink-faint)}
.tf-field input:focus,.tf-field select:focus{border-color:var(--orchid);box-shadow:0 0 0 4px rgba(130,41,255,.12)}
.tf-field input.err{border-color:#c8371e}
.tf-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.tf-submit{margin-top:4px;align-self:flex-start;border:0;cursor:pointer}
.tf-submit[disabled]{opacity:.55;cursor:wait}
.tf-note{font-size:12.5px;color:var(--ink-faint);margin:0}
.tf-msg{font-size:14px;font-weight:600;margin:0;display:none}
.tf-msg.ok{display:block;color:var(--orchid)}
.tf-msg.fail{display:block;color:#c8371e}
.tform.sent .tf-row,.tform.sent .tf-submit,.tform.sent .tf-note{display:none}
.tform.sent .tf-msg.ok{font-size:16px}

/* ---- Software-Screenshots (/plattform/) ---- */
.shots{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:42px}
.shot{margin:0;background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 24px 60px -28px rgba(43,18,117,.22)}
.shot.wide{grid-column:1/-1}
.shot-bar{display:flex;gap:6px;padding:12px 16px;border-bottom:1px solid var(--line-soft)}
.shot-bar i{width:9px;height:9px;border-radius:50%;background:var(--line)}
.shot img{display:block;width:100%;height:auto}
.shot figcaption{padding:14px 18px;font-size:13.5px;color:var(--ink-soft);line-height:1.55}
.shot figcaption b{color:var(--ink);font-weight:600}
@media(max-width:760px){.shots{grid-template-columns:1fr;gap:18px}}

/* ---- TISC-Overlay (iframe-Modal für tisc.kootsch.app) ---- */
#tiscmodal{position:fixed;inset:0;z-index:9000;background:rgba(20,17,25,.55);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;padding:clamp(8px,3vw,40px);
  opacity:0;pointer-events:none;transition:opacity .3s ease}
#tiscmodal.open{opacity:1;pointer-events:auto}
#tiscmodal .tm-box{position:relative;width:min(860px,100%);height:min(860px,92vh);background:var(--paper);
  border-radius:20px;overflow:hidden;box-shadow:0 40px 90px -20px rgba(20,17,25,.5);
  transform:translateY(18px) scale(.985);transition:transform .3s ease}
#tiscmodal.open .tm-box{transform:none}
#tiscmodal iframe{width:100%;height:100%;border:0;display:block}
#tiscmodal .tm-close{position:absolute;top:10px;right:10px;z-index:2;width:38px;height:38px;border-radius:50%;
  border:0;background:rgba(20,17,25,.08);color:var(--ink);font-size:22px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .2s}
#tiscmodal .tm-close:hover{background:rgba(20,17,25,.16)}
body.tm-open{overflow:hidden}
@media(prefers-reduced-motion:reduce){#tiscmodal,#tiscmodal .tm-box{transition:none}}


/* ── Rechtliches: Footer-Zeile, Consent-Leiste, Textseiten (2026-09-27) ── */
.flegal{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:22px;font-size:13px}
.flegal a{color:var(--ink-soft);text-decoration:none;border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.flegal a:hover{color:var(--ink);border-color:var(--ink)}
#ktconsent{position:fixed;left:18px;bottom:18px;z-index:9000;max-width:380px;padding:16px 18px;border-radius:18px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(43,18,117,.12);
  box-shadow:0 18px 50px -20px rgba(43,18,117,.35);font-family:"Hanken Grotesk",sans-serif;font-size:13.5px;line-height:1.5;color:var(--ink);
  opacity:0;transform:translateY(14px);transition:opacity .35s,transform .35s}
#ktconsent.on{opacity:1;transform:none}
#ktconsent p{margin:0 0 12px}
#ktconsent a{color:var(--orchid);text-decoration:underline;text-underline-offset:2px}
#ktconsent .kc-btns{display:flex;gap:8px;flex-wrap:wrap}
#ktconsent button{cursor:pointer;border-radius:100px;padding:9px 16px;font:inherit;font-weight:600;font-size:13px;border:1px solid rgba(43,18,117,.18);background:#fff;color:var(--ink)}
#ktconsent button.kc-all{background:var(--orchid);border-color:var(--orchid);color:#fff}
#ktconsent button:hover{filter:brightness(1.06)}
@media(max-width:640px){#ktconsent{left:12px;right:12px;bottom:12px;max-width:none}}
.legal{max-width:76ch;padding:8px 0 70px;font-size:16.5px;line-height:1.65;color:var(--ink)}
.legal h2{font-family:"Schibsted Grotesk",sans-serif;font-weight:600;font-size:clamp(21px,2.2vw,27px);letter-spacing:-.012em;margin:46px 0 12px}
.legal h3{font-family:"Schibsted Grotesk",sans-serif;font-weight:600;font-size:18px;margin:28px 0 8px}
.legal p,.legal li{color:var(--ink-soft)} .legal p b,.legal li b{color:var(--ink)}
.legal p{margin:0 0 12px} .legal ul,.legal ol{margin:0 0 14px 22px;padding:0} .legal li{margin:0 0 6px}
.legal a{color:var(--orchid);text-decoration:underline;text-underline-offset:2px}
.legal table{width:100%;border-collapse:collapse;margin:8px 0 18px;font-size:14.5px}
.legal th,.legal td{text-align:left;vertical-align:top;padding:8px 10px;border-bottom:1px solid rgba(43,18,117,.12)}
.legal th{font-weight:600;color:var(--ink);background:rgba(43,18,117,.04)}
.legal .ph{background:#fff2a8;color:#3a2f00;font-weight:600;padding:0 4px;border-radius:4px}
.legal .note{border:1px solid rgba(255,145,76,.5);background:rgba(255,145,76,.08);border-radius:14px;padding:14px 18px;margin:0 0 30px;font-size:14.5px}
.legal .meta{font-size:14px;color:var(--ink-soft);margin:-10px 0 34px}
.legal .small{font-size:13.5px;color:var(--ink-soft)}
.legal .toc{margin:0 0 34px;padding:16px 20px;border:1px solid rgba(43,18,117,.12);border-radius:14px;font-size:14.5px;columns:2;column-gap:28px}
.legal .toc a{display:block;color:var(--ink-soft);text-decoration:none;padding:3px 0;break-inside:avoid} .legal .toc a:hover{color:var(--orchid)}
@media(max-width:640px){.legal .toc{columns:1}}

/* ── Made in Austria (2026-09-27) ── */
.flag-at{display:inline-block;width:17px;height:11px;border-radius:2px;flex:none;
  background:linear-gradient(#c8102e 0 33.34%,#fff 33.34% 66.66%,#c8102e 66.66%);box-shadow:0 0 0 1px rgba(43,18,117,.14)}
.origin{display:flex;align-items:center;gap:9px;margin-top:14px;font-size:13.5px;color:var(--ink-soft);letter-spacing:.01em}
.austria .eyebrow .flag-at{margin-right:2px}
.austria .lead{color:var(--ink-soft);max-width:62ch;font-size:18px;line-height:1.6;margin:-26px 0 48px}
.why-grid.three{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.why-grid.three{grid-template-columns:1fr}}