@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Fraunces_6NUs8FyLNQOQZAnv9ZwNjucMHVn85Ni7emAe9lKqZTnbB-gzTK0K1ChJdt9hFwpX9W37ll9_mvMiQvTm.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Fraunces_6NUs8FyLNQOQZAnv9ZwNjucMHVn85Ni7emAe9lKqZTnbB-gzTK0K1ChJdt9hFwpX9W37ll9_mv0iQg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Fraunces_6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxCFTeO-U.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Fraunces_6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxC9TeA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Fraunces_6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxCFTeO-U.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Fraunces_6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxC9TeA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Fraunces_6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxCFTeO-U.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Fraunces_6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxC9TeA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Hanken_ieVn2YZDLWuGJpnzaiwFXS9tYtpT59CjCQ.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Hanken_ieVn2YZDLWuGJpnzaiwFXS9tYtpd59A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Hanken_ieVn2YZDLWuGJpnzaiwFXS9tYtpT59CjCQ.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Hanken_ieVn2YZDLWuGJpnzaiwFXS9tYtpd59A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Hanken_ieVn2YZDLWuGJpnzaiwFXS9tYtpT59CjCQ.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Hanken_ieVn2YZDLWuGJpnzaiwFXS9tYtpd59A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/SpaceMono_i7dPIFZifjKcF5UAWdDRYE98RWq7.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/SpaceMono_i7dPIFZifjKcF5UAWdDRYEF8RQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  --ink:#FAF7F1;--raised:#FFFFFF;--line:#E4DCC8;
  --gold:#7C5E22;--gold-hi:#C8A96E;--gold-lo:#6B5222;
  --paper:#1B1E25;--muted:#4A4F5A;--maxw:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--paper);font-family:"Hanken Grotesk",system-ui,sans-serif;
  line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--gold-hi);color:#1A1400;padding:10px 18px;font-family:"Space Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.skip:focus{left:0}
.eyebrow{font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:12px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);opacity:1}
h2.eyebrow{font-weight:400}
.display{font-family:"Fraunces",serif;font-weight:500;line-height:1.04;letter-spacing:-.01em;color:var(--paper)}
.gold-text{background:linear-gradient(100deg,var(--gold-lo),var(--gold) 35%,var(--gold-hi) 50%,var(--gold) 65%,var(--gold-lo));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* Nav */
nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:20px 28px;max-width:var(--maxw);margin:0 auto;transition:background .4s}
nav.scrolled{background:rgba(250,247,241,.92);backdrop-filter:blur(12px)}
.brandmark{font-family:"Fraunces",serif;font-weight:600;font-size:20px;letter-spacing:.14em}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links a{font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);transition:color .3s}
.nav-links a:hover{color:var(--gold)}
.nav-links a.active{color:var(--gold)}
.nav-cta{border:1px solid var(--line);padding:9px 16px;border-radius:2px;color:var(--paper)!important}
.nav-cta:hover{border-color:var(--gold)}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;width:44px;height:44px;position:relative;padding:0;z-index:60}
.nav-toggle span{display:block;position:absolute;left:7px;width:30px;height:2px;background:var(--gold);border-radius:2px;transition:transform .3s,opacity .3s,top .3s}
.nav-toggle span:nth-child(1){top:12px}
.nav-toggle span:nth-child(2){top:21px}
.nav-toggle span:nth-child(3){top:30px}
.nav-toggle.open span:nth-child(1){top:21px;transform:rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){top:21px;transform:rotate(-45deg)}

/* Hero (Start) */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;position:relative;padding:120px 0 80px}
.hero::before{content:"";position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);
  width:760px;height:760px;max-width:100%;background:radial-gradient(circle,rgba(200,169,110,.16),transparent 62%);pointer-events:none;z-index:0}
.hero .wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center}
.seal{width:76px;height:76px;margin-bottom:22px;color:var(--gold);opacity:0;animation:sealIn 1.1s .15s cubic-bezier(.2,.7,.2,1) forwards}
.hero .eyebrow{opacity:0;animation:rise .8s .5s ease forwards}
.hero h1{font-size:clamp(2.5rem,7.2vw,5.4rem);margin:18px 0 0;max-width:14ch;opacity:0;animation:rise .9s .65s ease forwards}
.hero .lede{margin:26px auto 0;max-width:52ch;color:var(--muted);font-size:clamp(1rem,1.6vw,1.18rem);opacity:0;animation:rise .9s .85s ease forwards}
.scrollhint{margin-top:54px;font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);opacity:0;animation:rise 1s 1.1s ease forwards}
.scrollhint span{display:block;width:1px;height:34px;margin:14px auto 0;background:linear-gradient(var(--gold),transparent)}
.hero .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:38px;opacity:0;animation:rise 1s 1.05s ease forwards}

/* Sub-Hero (Unterseiten) */
.subhero{padding:160px 0 70px;position:relative}
.subhero::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:680px;height:520px;max-width:100%;background:radial-gradient(circle at 50% 0,rgba(200,169,110,.14),transparent 60%);pointer-events:none}
.subhero .wrap{position:relative}
.subhero .kicker{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.subhero .kicker .num{font-family:"Fraunces",serif;font-size:18px;color:var(--gold)}
.subhero h1{font-size:clamp(2.2rem,5.5vw,3.8rem);max-width:18ch}
.subhero .lede{margin-top:22px;max-width:54ch;color:var(--muted);font-size:clamp(1.05rem,1.7vw,1.25rem)}

/* Geviertetes Wappen (Start) */
.fields{padding:clamp(80px,12vh,140px) 0}
.section-head{display:flex;flex-direction:column;gap:14px;margin-bottom:54px;max-width:30ch}
.section-head h2{font-size:clamp(1.9rem,4vw,3rem)}
.quarters{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:3px;overflow:hidden;position:relative;background:var(--raised)}
.quarters::before,.quarters::after{content:"";position:absolute;z-index:2;pointer-events:none}
.quarters::before{left:0;right:0;top:50%;height:1px;background:linear-gradient(90deg,transparent,var(--gold-lo),transparent)}
.quarters::after{top:0;bottom:0;left:50%;width:1px;background:linear-gradient(180deg,transparent,var(--gold-lo),transparent)}
.field{position:relative;padding:clamp(28px,4vw,48px);min-height:240px;display:flex;flex-direction:column;justify-content:space-between;transition:background .5s;z-index:1}
.field:hover{background:#EFE8D6}
.field .idx{font-family:"Space Mono",monospace;font-size:12px;color:var(--gold);letter-spacing:.2em;opacity:1}
.field h3{font-family:"Fraunces",serif;font-weight:500;font-size:clamp(1.4rem,2.6vw,2rem);margin:auto 0 10px;line-height:1.1}
.field p{color:var(--muted);font-size:.97rem;max-width:34ch}
.field .tag{margin-top:16px;font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-lo)}
.field:hover .tag{color:var(--gold)}
.field-link{position:absolute;inset:0;z-index:3}

/* Leistungs-Liste (Unterseiten) */
.lvl{padding:clamp(60px,9vh,110px) 0;border-top:1px solid var(--line)}
.lvl .wrap{display:grid;grid-template-columns:.7fr 1.3fr;gap:48px}
.lvl h2{font-family:"Fraunces",serif;font-weight:500;font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.1}
.lvl .body p{color:var(--muted);font-size:1.05rem;margin-bottom:18px;max-width:60ch}
.svc{list-style:none;display:grid;gap:0;margin-top:8px}
.svc li{display:grid;grid-template-columns:auto 1fr;gap:18px;padding:20px 0;border-top:1px solid var(--line)}
.svc li:last-child{border-bottom:1px solid var(--line)}
.svc .n{font-family:"Space Mono",monospace;font-size:12px;color:var(--gold);font-weight:700;padding-top:4px}
.svc h4{font-family:"Fraunces",serif;font-weight:500;font-size:1.2rem;margin-bottom:5px}
.svc p{color:var(--muted);font-size:.96rem;max-width:50ch}

/* Hinweis-Box */
.note{margin-top:30px;padding:18px 22px;border:1px solid var(--line);border-left:2px solid var(--gold);border-radius:2px;background:var(--raised)}
.note b{color:var(--gold);font-weight:600}
.note span{color:var(--muted);font-size:.95rem}

/* Haltung */
.creed{padding:clamp(70px,10vh,120px) 0;border-top:1px solid var(--line)}
.creed .wrap{display:grid;grid-template-columns:1fr 1.4fr;gap:48px;align-items:start}
.creed .eyebrow{padding-top:8px}
.creed p{font-family:"Fraunces",serif;font-weight:400;font-size:clamp(1.3rem,2.8vw,2.1rem);line-height:1.35;color:var(--paper)}
.creed p em{font-style:italic;color:var(--gold)}

/* weitere Felder (Unterseiten-Footer-Nav) */
.more{padding:clamp(60px,8vh,100px) 0;border-top:1px solid var(--line)}
.more .eyebrow{margin-bottom:26px}
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.more-card{border:1px solid var(--line);border-radius:3px;padding:24px;transition:border-color .3s,background .3s}
.more-card:hover{border-color:var(--gold-lo);background:var(--raised)}
.more-card .idx{font-family:"Space Mono",monospace;font-size:11px;color:var(--gold);letter-spacing:.2em}
.more-card h4{font-family:"Fraunces",serif;font-weight:500;font-size:1.3rem;margin-top:12px}

/* Kontakt */
.contact{padding:clamp(80px,12vh,150px) 0;text-align:center;position:relative}
.contact h1,.contact h2{font-size:clamp(2.2rem,6vw,4.2rem);margin-bottom:22px}
.contact .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.cdetails{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden;margin-top:48px;text-align:left}
.cdetails div{background:var(--ink);padding:26px}
.cdetails .lbl{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.cdetails .val{color:var(--paper);font-size:1.02rem}
.cdetails .val a:hover{color:var(--gold)}
.btn{font-family:"Space Mono",monospace;font-size:13px;letter-spacing:.14em;text-transform:uppercase;padding:15px 30px;border-radius:2px;transition:.3s}
.btn-gold{background:var(--gold-hi);color:#1A1400;font-weight:600}
.btn-gold:hover{filter:brightness(1.08)}
.btn-ghost{border:1px solid var(--line);color:var(--paper)}
.btn-ghost:hover{border-color:var(--gold)}

/* Footer */
footer{border-top:1px solid var(--line);padding:40px 0;color:var(--muted);font-size:.85rem}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;align-items:center}
footer a:hover{color:var(--gold)}
.foot-links{display:flex;gap:22px;flex-wrap:wrap}

/* Reveal */
.reveal{transition:opacity .9s ease,transform .9s ease}
html.js .reveal{opacity:0;transform:translateY(26px)}
html.js .reveal.in{opacity:1;transform:none}

@keyframes sealIn{from{opacity:0;transform:translateY(18px) scale(.9)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

/* Legal-Seiten */
.legal{padding:150px 0 100px}
.legal .wrap{max-width:780px}
.legal h1{font-size:clamp(2rem,4.5vw,3rem)}
.legal .updated{font-family:"Space Mono",monospace;font-size:12px;color:var(--muted);letter-spacing:.1em;margin:10px 0 44px}
.legal h2{font-family:"Fraunces",serif;font-weight:500;font-size:1.5rem;margin:42px 0 14px;color:var(--gold)}
.legal h3{font-weight:600;font-size:1.05rem;margin:24px 0 6px;color:var(--paper)}
.legal p,.legal li{color:var(--paper);font-size:1rem;line-height:1.7;margin-bottom:14px}
.legal ul{padding-left:22px;margin-bottom:14px}
.legal a{color:var(--gold);text-decoration:underline}
.legal .ph{color:#241c05;background:var(--gold-hi);padding:1px 7px;border-radius:3px;font-family:"Space Mono",monospace;font-size:.88em}
.legal .disc{margin-top:46px;padding:18px 22px;border:1px solid var(--line);border-left:2px solid var(--gold);border-radius:2px;background:var(--raised);font-size:.92rem;color:var(--muted)}

/* Produktseite */
.prodhero{padding:150px 0 56px;text-align:center;position:relative}
.prodhero::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:700px;height:480px;max-width:100%;background:radial-gradient(circle at 50% 0,rgba(200,169,110,.16),transparent 60%);pointer-events:none}
.prodhero .wrap{position:relative}
.prodhero .badge{font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);border:1px solid var(--line);padding:7px 16px;border-radius:999px;display:inline-block;margin-bottom:24px}
.prodhero h1{font-size:clamp(2.2rem,5.5vw,3.8rem);max-width:18ch;margin:0 auto}
.prodhero .lede{max-width:58ch;margin:22px auto 0;color:var(--muted);font-size:clamp(1.05rem,1.7vw,1.2rem)}
.prodhero .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.videosec{padding:0 0 clamp(40px,7vh,80px)}
.videowrap{max-width:940px;margin:0 auto;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 30px 70px rgba(42,38,32,.16);background:var(--raised)}
.videowrap video{display:block;width:100%;height:auto;aspect-ratio:16/9}
.featsec{padding:clamp(60px,9vh,100px) 0;border-top:1px solid var(--line)}
.featsec .eyebrow{margin-bottom:34px}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden}
.feat{background:var(--ink);padding:28px}
.feat .ic{font-family:"Hanken Grotesk",sans-serif;font-weight:700;color:var(--gold);font-size:12px;letter-spacing:.08em}
.feat h4{font-family:"Fraunces",serif;font-weight:500;font-size:1.2rem;margin:12px 0 8px}
.feat p{color:var(--muted);font-size:.94rem}
.shots{padding:clamp(60px,9vh,100px) 0;border-top:1px solid var(--line)}
.shots .eyebrow{margin-bottom:40px}
.shot{margin-bottom:56px}
.shot:last-child{margin-bottom:0}
.shot .cap{display:flex;align-items:baseline;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.shot .cap .n{font-family:"Space Mono",monospace;color:var(--gold);font-size:13px;font-weight:700}
.shot .cap h3{font-family:"Fraunces",serif;font-weight:500;font-size:clamp(1.3rem,2.4vw,1.7rem)}
.shot .cap p{color:var(--muted);font-size:.94rem;margin-left:auto;max-width:42ch}
.frame{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--raised);box-shadow:0 24px 60px rgba(42,38,32,.14)}
.frame img{display:block;width:100%;height:auto}
.frame video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:var(--raised)}
.modtags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:50px}
.modtags span{font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:12px;letter-spacing:.02em;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:6px 13px}

@media(max-width:860px){
  .feat-grid{grid-template-columns:1fr}
  .shot .cap p{margin-left:0;text-align:left}
}

@media(max-width:860px){
  .lvl .wrap,.creed .wrap{grid-template-columns:1fr;gap:22px}
  .more-grid,.cdetails{grid-template-columns:1fr}
  .nav-toggle{display:block}
  .nav-links{
    position:fixed;top:0;right:0;height:100vh;width:min(80vw,310px);
    flex-direction:column;align-items:flex-start;justify-content:flex-start;
    gap:6px;padding:96px 30px 30px;background:var(--raised);
    border-left:1px solid var(--line);box-shadow:-24px 0 60px rgba(42,38,32,.14);
    transform:translateX(100%);transition:transform .35s ease}
  .nav-links.open{transform:translateX(0)}
  .nav-links a{font-size:14px;letter-spacing:.12em;padding:12px 0;width:100%}
  .nav-cta{margin-top:14px;padding:11px 18px;text-align:center}
  /* Ohne JavaScript bleibt der Hamburger-Button funktionslos (er wird nur per
     Skript geschaltet) — darum ohne .js-Klasse das Menü statisch sichtbar
     unter der Kopfzeile umbrechen lassen statt es per transform zu verstecken. */
  html:not(.js) nav{position:static;flex-wrap:wrap;row-gap:10px}
  html:not(.js) .nav-toggle{display:none}
  html:not(.js) .nav-links{
    position:static;height:auto;width:100%;flex-direction:row;flex-wrap:wrap;
    justify-content:flex-start;gap:10px 20px;padding:10px 0 0;background:transparent;
    border-left:0;box-shadow:none;transform:none}
  html:not(.js) .nav-links a{width:auto;padding:6px 0}
}
@media(max-width:620px){
  .quarters{grid-template-columns:1fr}
  .quarters::before,.quarters::after{display:none}
  .field{min-height:auto;border-bottom:1px solid var(--line)}
  .field:last-child{border-bottom:none}
  .field h3{margin:18px 0 10px}
  nav{padding:16px 20px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .seal,.hero .eyebrow,.hero h1,.hero .lede,.hero .row,.scrollhint,.reveal{opacity:1!important;transform:none!important}
}