@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url("../fonts/archivo-variable.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/inter-variable.woff2") format("woff2")}
@font-face{font-family:"Marcellus";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/marcellus.woff2") format("woff2")}
@font-face{font-family:"Big Shoulders Display";font-weight:600 900;font-display:swap;src:url("../fonts/BigShouldersDisplay.woff2") format("woff2")}
@font-face{font-family:"Fraunces";font-style:italic;font-weight:500 700;font-display:swap;src:url("../fonts/Fraunces-Italic.woff2") format("woff2")}

:root{
  --bg:#0C0C0B; --bg-2:#151513; --line:#2A2926;
  --fg:#EEEAE2; --muted:#9C978D; --accent:#C2A878;
  --head:"Archivo","Helvetica Neue",Arial,sans-serif;
  --body:"Inter","Helvetica Neue",Arial,sans-serif;
  --wrap:1280px; --gut:clamp(16px,4vw,48px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--body);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.eyebrow{font-family:var(--head);font-weight:600;font-stretch:115%;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}

/* Header */
.top{position:fixed;inset:0 0 auto;z-index:20;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.top.scrolled{background:rgba(12,12,11,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{white-space:nowrap;font-family:var(--head);font-weight:800;font-stretch:125%;font-size:1.05rem;letter-spacing:.16em}
.logo span{font-weight:300}
.nav{display:flex;gap:32px;list-style:none}
.nav a{font-family:var(--head);font-weight:600;font-stretch:110%;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.nav a:hover{color:var(--fg)}

.top .nav{margin-left:auto;margin-right:24px}
.lang{display:flex;gap:2px;align-items:center}
.lang a{display:flex;align-items:center;gap:4px;padding:3px 4px;font-family:var(--head);font-weight:600;font-stretch:110%;font-size:.6rem;letter-spacing:.14em;color:var(--muted);opacity:.55;transition:opacity .2s,color .2s}
.lang a svg{width:14px;height:9px;display:block;box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.lang a[aria-current="true"]{color:var(--fg);opacity:1}
.lang a:hover{opacity:1;color:var(--accent)}
@media (max-width:760px){.lang a span{display:none}}

/* Hero */
.hero{padding:132px 0 48px;position:relative}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 75% 20%,rgba(194,168,120,.10),transparent 70%);pointer-events:none}
.mark{font-family:var(--head);font-weight:800;font-stretch:125%;font-size:clamp(2.6rem,9vw,8.5rem);line-height:.86;letter-spacing:-.01em}
.mark .thin{display:block;font-weight:200;color:var(--accent)}
.lead{font-family:var(--head);font-weight:700;font-stretch:115%;font-size:clamp(1.6rem,3.4vw,2.8rem);line-height:1.08;letter-spacing:-.01em}
.lead span{display:block;font-weight:300;color:var(--accent)}

/* Brand grid */
.brands{padding:0 0 96px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{position:relative;overflow:hidden;min-height:400px;display:flex;flex-direction:column;justify-content:flex-end;padding:32px;isolation:isolate;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.card:hover{transform:translateY(-4px)}
.card .bg{position:absolute;inset:0;z-index:-2}
.card .bg img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.card:hover .bg img{transform:scale(1.04)}
.card .bg::after{content:"";position:absolute;inset:0}
.card .tag{text-shadow:0 1px 8px rgba(0,0,0,.35);position:absolute;top:28px;left:32px;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase}
.card .num{position:absolute;top:26px;right:32px;font-family:var(--head);font-stretch:110%;font-size:.75rem;letter-spacing:.14em;opacity:.7}
.card h3{line-height:.95;margin-bottom:14px}
.card p{max-width:32em;font-size:.97rem}
.card .go{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.card .go i{font-style:normal;transition:transform .25s}
.card:hover .go i{transform:translate(3px,-3px)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chips span{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;border:1px solid currentColor;opacity:.85}

/* Reihenfolge = Priorität: Karte 1 groß, Karte 2 mittel, Karten 3 bis 5 klein */
.grid>.card:nth-child(1){grid-column:span 7;min-height:480px}
.grid>.card:nth-child(2){grid-column:span 5;min-height:480px}
.grid>.card:nth-child(n+3){grid-column:span 4}
.c-halla{color:#fff}
.c-halla{background:#000}
.c-halla .bg img{object-position:60% 40%}
.c-halla .bg::after{background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.35) 45%,rgba(0,0,0,.92) 100%)}
.c-halla h3{font-family:"Archivo",sans-serif;font-weight:800;font-stretch:112%;font-size:clamp(2.4rem,4.6vw,4rem);letter-spacing:.08em}
.c-halla h3 small{display:block;font-size:.26em;letter-spacing:.42em;font-weight:700;margin-top:10px}
.c-halla .tag{color:rgba(255,255,255,.7)}

.c-sas{color:#ECE9DF;background:#0E1E18}
.c-sas .bg::after{background:linear-gradient(180deg,rgba(14,30,24,.75),rgba(14,30,24,.35) 20%,rgba(14,30,24,.6) 40%,#0E1E18 88%)}
.c-sas h3{font-family:"Big Shoulders Display",sans-serif;font-weight:900;font-size:clamp(2.4rem,3.8vw,3.4rem);text-transform:uppercase;letter-spacing:.01em}
.c-sas h3 em{font-family:"Fraunces",serif;font-style:italic;font-weight:600;color:#CDA54C;text-transform:none;font-size:.8em}
.c-sas .tag,.c-sas .go{color:#CDA54C}

.c-seb{color:#E8ECF2;background:#13233F}
.c-seb .bg img{object-position:50% 30%}
.c-seb .bg::after{background:linear-gradient(180deg,rgba(19,35,63,.85),rgba(19,35,63,.1) 26%,rgba(19,35,63,.55) 45%,#13233F 90%)}
.c-seb h3{font-family:"Marcellus",serif;font-weight:400;font-size:clamp(2.6rem,5.4vw,4.6rem)}
.c-seb .tag,.c-seb .go{color:#A3BAD6}

.c-cr{color:#111;background:#F3F0EA;padding-top:180px}
.c-cr h3{font-family:"Archivo",sans-serif;font-weight:900;font-stretch:72%;text-transform:uppercase;font-size:clamp(2.8rem,4.8vw,4rem);line-height:.86}
.c-cr .claim{font-family:"Archivo",sans-serif;font-weight:800;font-stretch:80%;text-transform:uppercase;color:#D6241B;letter-spacing:.04em;margin-bottom:10px;font-size:1rem}
.c-cr .tag{color:#5E5A54;text-shadow:none}
.c-cr .go{color:#D6241B}
.poles{position:absolute;top:72px;left:32px;right:32px;height:84px;z-index:-1}
.poles .s{position:absolute;top:0;bottom:0;width:6px;background:#111}
.poles .s.l{left:0}.poles .s.r{right:0}
.poles .bar{position:absolute;left:-6px;right:-6px;top:20px;height:16px;background:repeating-linear-gradient(90deg,#D6241B 0 12.5%,#fff 12.5% 25%);box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.poles .bar.b2{top:50px}
.card.c-cr:hover .poles .bar.b2{animation:knock .6s ease}
@keyframes knock{40%{transform:translateY(-6px) rotate(-1deg)}100%{transform:none}}

.c-src{color:#F1EFE8;background:#163A2F}
.c-src .bg img{filter:grayscale(.35) contrast(1.05)}
.c-src .bg::after{background:linear-gradient(180deg,rgba(22,58,47,.45),rgba(22,58,47,.75) 45%,#163A2F 88%)}
.c-src h3{font-family:"Inter",sans-serif;font-weight:700;letter-spacing:-.03em;font-size:clamp(2.1rem,3.4vw,2.8rem)}
.c-src h3 span{font-weight:400;opacity:.8}
.c-src .tag{color:#E2DED3}
.c-src .go{color:#E9B38A}

/* Book */
.book{border-top:1px solid var(--line);padding:80px 0}
.book .wrap{display:grid;grid-template-columns:minmax(180px,300px) 1fr;gap:64px;align-items:center}
.book-cover{margin:0}
.book-cover img{width:100%;aspect-ratio:13/20;object-fit:cover;box-shadow:0 30px 60px -20px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.06);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.book-cover img:hover{transform:translateY(-4px) rotate(-.6deg)}
.book-text h2{font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.05;margin:0 0 10px}
.book-sub{font-family:Georgia,"Times New Roman",serif;font-style:italic;color:var(--accent);font-size:clamp(1rem,1.5vw,1.2rem);margin-bottom:20px}
.book-text p:not(.eyebrow):not(.book-sub){color:#CFCAC0;max-width:34em}
.book-btn{display:inline-flex;align-items:center;gap:10px;margin-top:28px;padding:13px 22px;border:1px solid var(--accent);font-family:var(--head);font-weight:600;font-stretch:110%;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg);transition:background .2s,color .2s}
.book-btn i{font-style:normal;color:var(--accent)}
a.book-btn:hover{background:var(--accent);color:var(--bg)}
a.book-btn:hover i{color:var(--bg)}
.book-btn.is-soon{border-color:var(--line);color:var(--muted);cursor:default}
@media (max-width:760px){.book{padding:56px 0}.book .wrap{grid-template-columns:1fr;gap:32px}.book-cover{max-width:220px}}

/* Contact */
.contact{border-top:1px solid var(--line);padding:56px 0}
.contact .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.contact p{color:var(--muted)}
.contact a{font-family:var(--head);font-weight:600;font-stretch:115%;font-size:clamp(1.1rem,2.2vw,1.6rem);border-bottom:1px solid var(--line);transition:border-color .2s}
.contact a i{font-style:normal;color:var(--accent)}
.contact a:hover{border-color:var(--accent)}

/* Footer */
footer{border-top:1px solid var(--line);padding:28px 0;font-size:.82rem;color:var(--muted)}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer nav{display:flex;gap:24px}
footer a:hover{color:var(--fg)}

/* Reveal */
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* Legal pages */
.legal{max-width:760px;margin:0 auto;padding:140px var(--gut) 96px}
.legal h1{font-family:var(--head);font-weight:800;font-stretch:120%;font-size:clamp(2rem,5vw,3rem);margin-bottom:32px}
.legal h2{font-family:var(--head);font-weight:700;font-stretch:110%;font-size:1.15rem;margin:32px 0 10px}
.legal p{color:#CFCAC0;margin-bottom:12px}
.legal mark{background:#5c4a1f;color:#fff;padding:0 4px}

/* Responsive */
@media (max-width:1024px){
  .grid>.card:nth-child(-n+2){grid-column:span 12}
  .grid>.card:nth-child(n+3){grid-column:span 6}
  .grid>.card:nth-child(5){grid-column:span 12}
}
@media (max-width:760px){
  .nav{display:none}
  .hero{padding:108px 0 32px}
  .grid{gap:12px}
  .grid>.card:nth-child(n+3){grid-column:span 12}
  .card{padding:24px;min-height:420px}
  .grid>.card:nth-child(-n+2){min-height:500px}
  .card .tag{left:24px;top:22px}.card .num{right:24px;top:20px}
  .poles{left:24px;right:24px}
}
