:root{
  --navy:#172741;--navy-d:#0D1828;--gold:#B58932;--gold-l:#D2AE62;--ivory:#F6F2EA;--ink:#1b2333;--muted:#5d6472;--line:#e3dccd;
  --serif:'Cormorant Garamond',Georgia,serif;--sans:'Montserrat',system-ui,sans-serif;
  --gut:clamp(20px,5vw,64px);--max:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);font-size:clamp(.95rem,.25vw + .9rem,1.05rem);line-height:1.7;color:var(--ink);background:var(--ivory)}
img{display:block;max-width:100%}
a{color:inherit}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--gold);color:var(--navy-d);padding:8px 12px}
:focus-visible{outline:2px solid var(--gold-l);outline-offset:3px}
.k{font-size:.7rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.05;letter-spacing:-.005em}
h2{font-size:clamp(2.1rem,4.4vw,3.6rem)}
h2 em,h1 em{font-style:italic;color:var(--gold-l)}
section{padding:clamp(72px,10vw,128px) 0}
.lead{font-size:clamp(1.02rem,.5vw + .95rem,1.2rem);color:var(--muted);max-width:60ch}
.btn{display:inline-flex;align-items:center;gap:10px;font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:15px 24px;border:1px solid transparent;transition:background .2s,color .2s,border-color .2s}
.btn-g{background:var(--gold);color:var(--navy-d)}.btn-g:hover{background:var(--gold-l)}
.btn-o{border-color:rgba(210,174,98,.6);color:var(--ivory)}.btn-o:hover{background:rgba(210,174,98,.12);border-color:var(--gold-l)}
.btn-n{border-color:var(--navy);color:var(--navy)}.btn-n:hover{background:var(--navy);color:var(--ivory)}

/* header */
.top{position:fixed;inset:0 0 auto;z-index:50;background:rgba(13,24,40,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(210,174,98,.18);color:var(--ivory)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:36px;height:36px}
.brand span{font-family:var(--serif);font-size:1.25rem;font-weight:600;letter-spacing:.08em;line-height:1}
.brand small{display:block;font-family:var(--sans);font-size:.56rem;letter-spacing:.26em;color:var(--gold-l);margin-top:5px}
.brand span{display:inline-block}
.brand small.bw{display:flex;justify-content:space-between;letter-spacing:0;font-size:.5rem;font-weight:500;text-transform:uppercase;margin-right:.1rem}
.brand small.bw i{font-style:normal}
.brand small.bw i:empty{width:.45em}
.nav{display:flex;gap:clamp(14px,2vw,30px);list-style:none}
.nav a{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:rgba(246,242,234,.82)}
.nav a:hover{color:var(--gold-l)}
.top .btn{padding:10px 16px;font-size:.66rem}
.menu-btn{display:none;background:none;border:1px solid rgba(210,174,98,.5);color:var(--ivory);font:600 .7rem var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:10px 14px;cursor:pointer}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:var(--ivory);background:var(--navy-d);padding:0;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,24,40,.94) 0%,rgba(13,24,40,.7) 42%,rgba(13,24,40,.1) 100%),linear-gradient(0deg,rgba(13,24,40,.9),transparent 45%)}
.hero .wrap{position:relative;z-index:1;padding-top:140px;padding-bottom:clamp(56px,9vw,110px)}
.hero h1{font-size:clamp(2.8rem,7vw,6.2rem);max-width:12ch;margin:18px 0 24px}
.hero p.lead{color:rgba(246,242,234,.86);max-width:52ch}
.hero .btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero-facts{display:flex;flex-wrap:wrap;gap:clamp(24px,5vw,64px);margin-top:clamp(48px,7vw,84px);padding-top:24px;border-top:1px solid rgba(210,174,98,.3)}
.hero-facts b{display:block;font-family:var(--serif);font-size:1.6rem;font-weight:600;color:var(--gold-l);line-height:1.1}
.hero-facts span{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(246,242,234,.7)}

/* about */
.about .grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(40px,7vw,110px);align-items:start}
.about h2{margin-top:14px}
.svc{list-style:none;counter-reset:s;border-top:1px solid var(--line)}
.svc li{counter-increment:s;display:grid;grid-template-columns:56px 1fr;gap:8px 18px;padding:24px 0;border-bottom:1px solid var(--line)}
.svc li::before{content:"0" counter(s);font-family:var(--serif);font-style:italic;font-size:1.7rem;color:var(--gold);line-height:1}
.svc h3{font-size:1.5rem}
.svc p{grid-column:2;color:var(--muted);font-size:.95rem}

/* focus */
.focus{background:var(--navy-d);color:var(--ivory)}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap;margin-bottom:clamp(36px,5vw,60px)}
.sec-head h2{margin-top:12px}
.focus .sec-head p{color:rgba(246,242,234,.78);max-width:46ch}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
.fcard{position:relative;aspect-ratio:3/4;overflow:hidden;display:flex;align-items:flex-end;text-decoration:none}
.fcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.fcard:hover img{transform:scale(1.04)}
.fcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(13,24,40,.95) 0%,rgba(13,24,40,.35) 55%,transparent)}
.fcard div{position:relative;z-index:1;padding:clamp(20px,2.4vw,32px)}
.fcard .no{font-family:var(--serif);font-style:italic;color:var(--gold-l);font-size:1.2rem}
.fcard h3{font-size:clamp(2rem,3vw,2.6rem);margin:4px 0 8px}
.fcard p{font-size:.9rem;color:rgba(246,242,234,.82)}

/* projects */
.plist{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2vw,28px)}
.proj{background:#fff;border:1px solid var(--line);display:grid;grid-template-rows:auto 1fr}
.proj figure{aspect-ratio:16/9;overflow:hidden;background:var(--navy-d)}
.proj figure img{width:100%;height:100%;object-fit:cover}
.proj figure.logo{display:flex;align-items:center;justify-content:center;background:#111}
.proj figure.logo img{width:auto;height:84%;object-fit:contain}
.proj .body{padding:clamp(22px,2.6vw,34px);display:flex;flex-direction:column;gap:10px}
.meta{display:flex;justify-content:space-between;gap:12px;font-size:.66rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.meta .s{color:var(--muted)}
.meta .r{color:var(--gold)}
.proj h3{font-size:clamp(1.7rem,2.4vw,2.2rem)}
.proj p{color:var(--muted);font-size:.95rem}
.proj .more{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--navy);display:flex;justify-content:space-between}
.proj a.more:hover{color:var(--gold)}
.proj span.more{color:var(--muted)}

/* lab */
.lab{position:relative;background:var(--navy);color:var(--ivory);overflow:hidden}
.lab .grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(36px,6vw,90px);align-items:center}
.lab figure{aspect-ratio:4/3;overflow:hidden;border:1px solid rgba(210,174,98,.3)}
.lab figure img{width:100%;height:100%;object-fit:cover}
.lab p{color:rgba(246,242,234,.82);margin-top:18px;max-width:52ch}
.lab ul{list-style:none;margin-top:26px;border-top:1px solid rgba(210,174,98,.25)}
.lab li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(210,174,98,.25);font-size:.92rem}
.lab li b{font-family:var(--serif);font-size:1.3rem;font-weight:600}
.lab li span{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-l);align-self:center;text-align:right}

/* magazine */
.mag .grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,90px);align-items:center}
.mag figure{aspect-ratio:4/5;overflow:hidden;max-height:620px}
.mag figure img{width:100%;height:100%;object-fit:cover}
.mag .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.mag p{margin-top:18px}

/* contact */
.contact{background:var(--navy-d);color:var(--ivory)}
.contact .grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(36px,6vw,90px)}
.contact p.lead{color:rgba(246,242,234,.82);margin-top:18px}
.contact .mail{display:inline-block;margin-top:28px;font-family:var(--serif);font-size:clamp(1.5rem,3vw,2.3rem);color:var(--gold-l);text-decoration:none;border-bottom:1px solid rgba(210,174,98,.5);white-space:nowrap}
.contact .mail:hover{color:var(--ivory)}
.facts{border-top:1px solid rgba(210,174,98,.3)}
.facts div{padding:16px 0;border-bottom:1px solid rgba(210,174,98,.2)}
.facts dt{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-l)}
.facts dd{font-size:.95rem;color:rgba(246,242,234,.88);margin-top:4px}

/* footer */
footer{background:#08101c;color:rgba(246,242,234,.7);padding:44px 0;font-size:.8rem}
footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
footer ul{list-style:none;display:flex;gap:22px;flex-wrap:wrap}
footer a{text-decoration:none}footer a:hover{color:var(--gold-l)}

/* legal pages */
.page-head{background:var(--navy-d);color:var(--ivory);padding:150px 0 64px}
.page-head h1{font-size:clamp(2.6rem,6vw,4.6rem);margin-top:14px}
.legal{max-width:760px;padding:clamp(48px,7vw,88px) var(--gut)}
.legal h2{font-size:1.7rem;margin:38px 0 10px}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{color:#333b49;margin-bottom:12px}
.legal ul{padding-left:20px}

/* reveal */
.rv{opacity:1;transform:none}
@media (prefers-reduced-motion:no-preference){.js .rv{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.js .rv.in{opacity:1;transform:none}}

@media (max-width:1020px){
  .nav,.top .btn{display:none}
  .menu-btn{display:block}
  .top.open .nav{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;gap:0;background:var(--navy-d);padding:8px var(--gut) 20px;border-bottom:1px solid rgba(210,174,98,.25)}
  .top.open .nav a{display:block;padding:14px 0;border-bottom:1px solid rgba(210,174,98,.15)}
  .about .grid,.lab .grid,.mag .grid,.contact .grid{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
  .fcard{aspect-ratio:4/3}
  .mag figure{aspect-ratio:16/10}
}
@media (max-width:720px){
  .plist{grid-template-columns:1fr}
  .hero::after{background:linear-gradient(0deg,rgba(13,24,40,.96) 0%,rgba(13,24,40,.75) 55%,rgba(13,24,40,.35) 100%)}
  .hero>img{object-position:70% 50%}
  .brand small,.brand small.bw{display:none}
}

/* project cards */
.proj.wide{grid-column:1/-1;grid-template-columns:1.3fr 1fr;grid-template-rows:none}
.proj.wide figure{aspect-ratio:auto;min-height:100%}
@media (max-width:720px){.proj.wide{grid-template-columns:1fr}.proj.wide figure{aspect-ratio:16/9}}

/* grand terrain – magazine feature */
.mg-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;background:var(--navy-d);color:var(--ivory);padding:0;overflow:hidden}
.mg-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.mg-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,24,40,.9) 0%,rgba(13,24,40,.55) 40%,rgba(13,24,40,0) 75%),linear-gradient(0deg,rgba(13,24,40,.92) 0%,transparent 50%)}
.mg-hero .wrap{position:relative;z-index:1;padding-top:150px;padding-bottom:clamp(60px,9vw,120px)}
.mg-hero h1{font-size:clamp(3.4rem,9vw,8.4rem);font-weight:500;line-height:.95;margin:22px 0 18px}
.mg-hero h1 em{font-weight:400}
.mg-hero .claim{font-family:var(--serif);font-style:italic;font-size:clamp(1.35rem,2.4vw,2.1rem);color:var(--gold-l);max-width:30ch;line-height:1.25}
.mg-byline{display:flex;flex-wrap:wrap;gap:10px 34px;margin-top:clamp(36px,5vw,60px);padding-top:22px;border-top:1px solid rgba(210,174,98,.35);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(246,242,234,.72)}
.mg-byline b{color:var(--gold-l);font-weight:600}
.mg-scroll{position:absolute;right:var(--gut);bottom:clamp(60px,9vw,120px);z-index:1;writing-mode:vertical-rl;font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(246,242,234,.6)}

.mg-col{max-width:720px;margin:0 auto;padding:0 var(--gut)}
.mg-intro{padding:clamp(90px,12vw,160px) 0 clamp(40px,6vw,70px)}
.mg-stand{font-family:var(--serif);font-size:clamp(1.6rem,2.8vw,2.35rem);line-height:1.32;color:var(--navy);font-weight:500}
.mg-stand em{color:var(--gold)}
.mg-text p{font-size:clamp(1.05rem,.35vw + 1rem,1.2rem);line-height:1.85;color:#2c3444;margin-top:1.4em}
.mg-text.drop>p:first-of-type::first-letter{float:left;font-family:var(--serif);font-size:5.6em;line-height:.8;padding:.06em .1em 0 0;color:var(--gold);font-weight:600}
.mg-chapter{padding:clamp(70px,10vw,140px) 0}
.mg-chapter .no{display:block;font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--gold);margin-bottom:14px}
.mg-chapter h2{font-size:clamp(2.4rem,5vw,4.2rem);font-weight:500;max-width:16ch;line-height:1.02}
.mg-chapter h2+.mg-text p:first-child{margin-top:1.8em}
.mg-quote{padding:clamp(70px,10vw,140px) var(--gut);text-align:center;background:var(--navy-d);color:var(--ivory)}
.mg-quote blockquote{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(2rem,4.6vw,4rem);line-height:1.12;max-width:20ch;margin:0 auto;color:var(--ivory)}
.mg-quote blockquote em{color:var(--gold-l)}
.mg-quote cite{display:block;margin-top:28px;font-style:normal;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-l)}
.mg-bleed{margin:0;padding:0}
.mg-bleed img{width:100%;max-height:88vh;object-fit:cover}
.mg-cap{max-width:var(--max);margin:14px auto 0;padding:0 var(--gut);font-size:.78rem;letter-spacing:.04em;color:var(--muted)}
.mg-cap b{font-family:var(--serif);font-size:1.05rem;color:var(--navy);font-weight:600;letter-spacing:0;margin-right:6px}
.mg-pair{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(20px,3vw,44px);align-items:end;max-width:1400px;margin:0 auto;padding:0 var(--gut)}
.mg-pair figure img{width:100%;height:auto;background:#fff}
.mg-pair figcaption{font-size:.8rem;color:var(--muted);margin-top:12px;line-height:1.6}
.mg-blocks{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,72px) clamp(40px,6vw,96px);max-width:1080px;margin:clamp(60px,8vw,110px) auto 0;padding:0 var(--gut)}
.mg-blocks li{border-top:1px solid var(--gold);padding-top:24px}
.mg-blocks span{font-family:var(--serif);font-style:italic;font-size:1.1rem;color:var(--gold)}
.mg-blocks h3{font-size:clamp(1.8rem,2.6vw,2.3rem);font-weight:500;margin:6px 0 14px}
.mg-blocks p{font-size:1.04rem;line-height:1.8;color:#3a4252}

.mg-dark{background:var(--navy-d);color:var(--ivory)}
.mg-dark .mg-stand,.mg-dark h2{color:var(--ivory)}
.mg-dark .mg-text p{color:rgba(246,242,234,.84)}
.mg-dark .mg-cap{color:rgba(246,242,234,.6)}.mg-dark .mg-cap b{color:var(--gold-l)}
.mg-ed{display:grid;grid-template-columns:1.45fr 1fr;gap:clamp(32px,5vw,88px);align-items:center;max-width:1400px;margin:0 auto;padding:clamp(56px,7vw,100px) var(--gut);border-top:1px solid rgba(210,174,98,.18)}
.mg-ed:nth-of-type(even){grid-template-columns:1fr 1.45fr}
.mg-ed:nth-of-type(even) figure{order:2}
.mg-ed figure{overflow:hidden}
.mg-ed img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.mg-ed:hover img{transform:scale(1.03)}
.mg-ed .k{color:var(--gold-l)}
.mg-ed h3{font-size:clamp(2.2rem,4vw,3.6rem);font-weight:500;margin:12px 0 20px;line-height:1}
.mg-ed p:not(.k){font-size:1.08rem;line-height:1.85;color:rgba(246,242,234,.82);max-width:42ch}
.mg-series{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px);max-width:1400px;margin:0 auto;padding:0 var(--gut)}
.mg-series img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.mg-series figcaption{margin-top:14px;font-size:.88rem;line-height:1.6;color:rgba(246,242,234,.7)}
.mg-series figcaption b{display:block;font-family:var(--serif);font-size:1.5rem;font-weight:500;color:var(--gold-l)}
.mg-note{max-width:var(--max);margin:clamp(48px,6vw,80px) auto 0;padding:0 var(--gut);font-size:.78rem;color:rgba(246,242,234,.55)}

.mg-people{list-style:none;max-width:1080px;margin:clamp(50px,7vw,90px) auto 0;padding:0 var(--gut);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(36px,4vw,60px) clamp(28px,4vw,56px)}
.mg-people li{border-top:1px solid var(--line);padding-top:20px}
.mg-people b{display:block;font-family:var(--serif);font-size:1.55rem;font-weight:500;line-height:1.15;color:var(--navy)}
.mg-people p{margin-top:10px;font-size:.98rem;line-height:1.75;color:#4a5262}

.mg-road{list-style:none;max-width:860px;margin:clamp(50px,7vw,90px) auto 0;padding:0 var(--gut)}
.mg-road li{display:grid;grid-template-columns:110px 1fr;gap:24px;padding:34px 0;border-top:1px solid rgba(210,174,98,.25)}
.mg-road li:last-child{border-bottom:1px solid rgba(210,174,98,.25)}
.mg-road span{font-family:var(--serif);font-style:italic;font-size:3rem;line-height:1;color:var(--gold-l)}
.mg-road h3{font-size:clamp(1.7rem,2.6vw,2.2rem);font-weight:500;margin-bottom:10px}
.mg-road p{font-size:1.05rem;line-height:1.8;color:rgba(246,242,234,.8)}
.mg-facts{max-width:860px;margin:clamp(50px,6vw,80px) auto 0;padding:0 var(--gut);display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.mg-facts div{border-top:1px solid var(--gold);padding-top:14px}
.mg-facts dt{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.mg-facts dd{font-family:var(--serif);font-size:1.4rem;font-weight:500;line-height:1.2;margin-top:6px;color:var(--navy)}
.mg-name{margin:2.2em 0 .6em;padding:26px 30px;border-left:2px solid var(--gold);background:#fff}
.mg-name p:not(.k){margin-top:10px;font-size:1.02rem;line-height:1.8;color:#3a4252}
.mg-name b{font-family:var(--serif);font-size:1.2rem;color:var(--navy)}
.gt-mail{font-size:clamp(1.2rem,2.1vw,1.85rem)!important}

@media (max-width:1020px){
  .mg-pair,.mg-ed,.mg-ed:nth-of-type(even){grid-template-columns:1fr}
  .mg-ed:nth-of-type(even) figure{order:0}
  .mg-people{grid-template-columns:1fr 1fr}
  .mg-facts{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .mg-blocks,.mg-people,.mg-series{grid-template-columns:1fr}
  .mg-road li{grid-template-columns:1fr;gap:6px}
  .mg-hero::after{background:linear-gradient(0deg,rgba(13,24,40,.96) 0%,rgba(13,24,40,.7) 55%,rgba(13,24,40,.2) 100%)}
  .mg-scroll{display:none}
}

/* E-Mail-Adresse immer einzeilig: Schrift passt sich der verfuegbaren Breite an */
a[href^="mailto:info@lighthouseprojectsinternational"]{white-space:nowrap}
.contact .grid>div{min-width:0;container-type:inline-size}
.contact .mail{font-size:clamp(.95rem,5.2vw,2.3rem)}
.gt-mail{font-size:clamp(.95rem,5.2vw,1.85rem)!important}
.legal a[href^="mailto:info@lighthouseprojectsinternational"]{font-size:min(1em,4.1vw)}
@supports (font-size:1cqi){
  .contact .mail{font-size:min(2.3rem,5.7cqi)}
  .gt-mail{font-size:min(1.85rem,5.7cqi)!important}
  .legal{container-type:inline-size}
  .legal a[href^="mailto:info@lighthouseprojectsinternational"]{font-size:min(1em,4.6cqi)}
}
