/* MLR Development — hand-built for Website Launch Pro preview */
:root{
  --ink:#131211; --ink-2:#1d1b19; --alabaster:#F6F3ED; --stone:#E6DFD5;
  --taupe:#AC9D8D; --taupe-d:#8d7f70; --line:rgba(19,18,17,.14);
  --lineL:rgba(246,243,237,.22);
  --disp:"Playfair Display",Georgia,serif;
  --sans:"Raleway",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --ui:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif;
  --pvh:44px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--alabaster);color:var(--ink);font-family:var(--sans);
  font-size:17px;line-height:1.72;font-weight:400;padding-top:0;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
figure{margin:0}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--disp);font-weight:400;margin:0;letter-spacing:-.01em;line-height:1.06}
h1+p,h2+p,h3+p,h2+.lead,h1+.lead{margin-top:22px}
p{margin:0 0 20px}
.wrap{width:min(1240px,100% - 48px);margin-inline:auto}
.narrow{width:min(880px,100% - 48px);margin-inline:auto}
.eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:.22em;text-indent:.22em;
  text-transform:uppercase;color:var(--taupe-d);margin:0 0 26px}
.eyebrow.l{color:rgba(246,243,237,.72)}
.lead{font-size:21px;line-height:1.66}
.rule{height:1px;background:var(--line);border:0;margin:0}

/* preview banner */
.pv{position:fixed;inset:0 0 auto 0;z-index:120;background:var(--ink);color:var(--alabaster);
  display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:nowrap;
  padding:9px 16px;font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase}
.pv .pv-long{display:inline}.pv .pv-short{display:none}
.pv a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:var(--taupe);
  color:var(--ink);text-decoration:none;letter-spacing:.14em;text-indent:.14em;font-size:11.5px;white-space:nowrap}
@media(max-width:760px){.pv .pv-long{display:none}.pv .pv-short{display:inline;white-space:nowrap}
  .pv{gap:10px;font-size:11.5px}.pv a{padding:0 12px}}

/* nav */
.nav{position:fixed;left:0;right:0;top:var(--pvh);z-index:100;display:flex;align-items:center;
  justify-content:space-between;padding:20px 24px 30px;transition:background .35s,padding .35s;
  background:linear-gradient(to bottom,rgba(19,18,17,.62),rgba(19,18,17,0));pointer-events:none}
.nav>*{pointer-events:auto}
.nav a{text-decoration:none}
.brand{display:flex;align-items:center;gap:12px;padding:6px 0;color:var(--alabaster)}
.brand img{width:34px;height:35px;object-fit:contain;flex:0 0 auto}
.brand span{font-family:var(--disp);font-size:19px;letter-spacing:.16em;text-indent:.16em;text-transform:uppercase}
.nlinks{display:flex;align-items:center;gap:34px}
.nlinks a{font-family:var(--mono);font-size:12.5px;letter-spacing:.18em;text-indent:.18em;
  text-transform:uppercase;color:var(--alabaster);padding:11px 0;opacity:.9}
.nlinks a:hover,.nlinks a[aria-current=page]{opacity:1;border-bottom:1px solid var(--taupe)}
.nav .cta{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:1px solid var(--lineL);
  color:var(--alabaster);font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-indent:.16em;text-transform:uppercase}
.nav .cta:hover{background:var(--alabaster);color:var(--ink)}
.nav.solid{background:rgba(19,18,17,.94);padding:14px 24px;backdrop-filter:blur(8px)}
.nav.plain{background:var(--alabaster);border-bottom:1px solid var(--line);padding:16px 24px}
.nav.plain .brand,.nav.plain .nlinks a,.nav.plain .cta{color:var(--ink)}
.nav.plain .cta{border-color:var(--line)}
.nav.plain .cta:hover{background:var(--ink);color:var(--alabaster)}
.nav.plain .brand img{filter:invert(1) brightness(.15)}
.burger{display:none;background:none;border:0;padding:11px;cursor:pointer}
.burger i{display:block;width:26px;height:1.5px;background:var(--alabaster);margin:5px 0}
.nav.plain .burger i{background:var(--ink)}
@media(max-width:1000px){
  .nlinks,.nav .cta{display:none}
  .burger{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:44px;min-width:44px}
}
.mmenu{position:fixed;inset:0;z-index:130;background:var(--ink);color:var(--alabaster);
  display:none;flex-direction:column;padding:26px 26px 40px}
.mmenu.open{display:flex}
.mmenu .mtop{display:flex;align-items:center;justify-content:space-between}
.mmenu .mtop img{width:36px;height:37px;object-fit:contain;flex:0 0 auto}
.mclose{background:none;border:0;color:var(--alabaster);font-size:30px;line-height:1;padding:8px 12px;cursor:pointer;min-height:44px}
.mmenu nav{display:flex;flex-direction:column;gap:6px;margin-top:44px}
.mmenu nav a{font-family:var(--disp);font-size:34px;text-decoration:none;color:var(--alabaster);padding:10px 0}
.mmenu nav a[aria-current=page]{color:var(--taupe)}
.mfoot{margin-top:auto;font-family:var(--mono);font-size:13px;letter-spacing:.06em;line-height:2}
.mfoot a{color:var(--alabaster);text-decoration:none;display:inline-block;padding:9px 0}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;background:var(--ink);overflow:hidden}
.hero video,.hero .hbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero:after{content:"";position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(19,18,17,.5),rgba(19,18,17,.15) 42%,rgba(19,18,17,.82))}
.hero .hin{position:relative;z-index:2;width:min(1240px,100% - 48px);margin:0 auto;padding:0 0 clamp(56px,9vh,110px);color:var(--alabaster)}
.hero h1{font-size:clamp(40px,7.4vw,104px);line-height:1.02;max-width:15ch}
.hero h1 em{font-style:italic;color:var(--taupe)}
.hero .hsub{max-width:48ch;font-size:19px;color:rgba(246,243,237,.86);margin-top:26px}
.hbtns{display:flex;gap:14px;margin-top:38px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 30px;
  text-decoration:none;font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;text-indent:.16em;
  text-transform:uppercase;border:1px solid transparent;transition:.25s}
.btn-p{background:var(--alabaster);color:var(--ink)}
.btn-p:hover{background:var(--taupe)}
.btn-g{border-color:rgba(246,243,237,.5);color:var(--alabaster)}
.btn-g:hover{background:rgba(246,243,237,.12)}
.btn-d{background:var(--ink);color:var(--alabaster)}
.btn-d:hover{background:var(--taupe);color:var(--ink)}
.btn-o{border-color:var(--line);color:var(--ink)}
.btn-o:hover{background:var(--ink);color:var(--alabaster)}
@media(max-width:760px){.hbtns{flex-direction:column;align-items:stretch}.hbtns .btn{width:100%}}
.scrollhint{position:absolute;right:24px;bottom:34px;z-index:2;writing-mode:vertical-rl;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:rgba(246,243,237,.6)}
@media(max-width:900px){.scrollhint{display:none}}

/* page head (interior) */
.phead{padding:calc(var(--pvh) + 130px) 0 60px;background:var(--alabaster)}
.phead h1{font-size:clamp(38px,6vw,78px)}
.phead .lead{max-width:62ch;color:#4a453f}
.crumb{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--taupe-d);margin-bottom:26px}
.crumb a{text-decoration:none;display:inline-block;min-height:44px;line-height:44px;padding:0 9px;margin:0 -9px}

/* generic sections */
section{padding:clamp(70px,9vw,130px) 0}
section.tight{padding:clamp(48px,6vw,80px) 0}
.dark{background:var(--ink);color:var(--alabaster)}
.dark h2,.dark h3{color:var(--alabaster)}
.dark p{color:rgba(246,243,237,.8)}
.stone{background:var(--stone)}
h2{font-size:clamp(30px,4.4vw,58px)}
h3{font-size:clamp(21px,2.2vw,27px)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,80px);align-items:start}
.two.mid{align-items:center}
@media(max-width:900px){.two{grid-template-columns:1fr}}
.statband{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.statband div{padding:34px 26px;border-right:1px solid var(--line)}
.statband div:last-child{border-right:0}
.statband b{display:block;font-family:var(--disp);font-size:clamp(30px,3.6vw,46px);line-height:1;margin-bottom:12px}
.statband span{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe-d)}
@media(max-width:860px){.statband{grid-template-columns:1fr 1fr}
  .statband div{border-bottom:1px solid var(--line)}
  .statband div:nth-child(2n){border-right:0}
  .statband div:nth-last-child(-n+2){border-bottom:0}}
.dark .statband{border-color:var(--lineL)}
.dark .statband div{border-color:var(--lineL)}
.dark .statband span{color:var(--taupe)}

/* pillars */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:56px}
.pillars>div{background:var(--alabaster);padding:clamp(28px,3vw,42px)}
.dark .pillars{background:var(--lineL)}
.dark .pillars>div{background:var(--ink)}
.pillars .n{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--taupe-d);display:block;margin-bottom:20px}
.dark .pillars .n{color:var(--taupe)}
.pillars ul{margin:18px 0 0;padding-left:18px}
.pillars li{margin-bottom:9px;font-size:15.5px}
@media(max-width:900px){.pillars{grid-template-columns:1fr}}

/* project cards (index) */
.pcard{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(28px,4vw,64px);align-items:center;
  padding:clamp(44px,5vw,72px) 0;border-top:1px solid var(--line)}
.pcard:nth-child(even) .pc-media{order:2}
.pc-media img{width:100%;aspect-ratio:4/3;object-fit:cover}
.pcard h3{font-size:clamp(27px,3.4vw,42px)}
.pcard .loc{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--taupe-d);margin-bottom:18px}
.pcard .meta{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 24px}
.pill{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border:1px solid var(--line);
  background:var(--alabaster);color:var(--ink);font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
  text-indent:.12em;text-transform:uppercase}
.dark .pill{border-color:var(--lineL);background:transparent;color:var(--alabaster)}
.tlink{display:inline-flex;align-items:center;min-height:44px;font-family:var(--mono);font-size:12px;
  letter-spacing:.2em;text-indent:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--taupe)}
@media(max-width:900px){.pcard{grid-template-columns:1fr}.pcard:nth-child(even) .pc-media{order:0}}

/* galleries */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.grid3 img,.grid2 img{width:100%;aspect-ratio:4/3;object-fit:cover;cursor:zoom-in}
.grid3 .tall img{aspect-ratio:3/4}
@media(max-width:900px){.grid3{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid3,.grid2{grid-template-columns:1fr;gap:10px}}
.full{width:100%;aspect-ratio:16/9;object-fit:cover}
@media(max-width:620px){.full{aspect-ratio:4/3}}
.cap{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--taupe-d);margin-top:12px;text-transform:uppercase}
.dark .cap{color:var(--taupe)}

/* lightbox */
.lb{position:fixed;inset:0;z-index:200;background:rgba(12,11,10,.96);display:none;align-items:center;justify-content:center;padding:20px}
.lb.open{display:flex}
.lb img{max-width:96vw;max-height:88vh;width:auto;object-fit:contain}
.lbx{position:absolute;top:14px;right:16px;background:none;border:0;color:#fff;font-size:34px;line-height:1;padding:8px 14px;cursor:pointer;min-height:44px}

/* process */
.steps{border-top:1px solid var(--lineL)}
.step{display:grid;grid-template-columns:90px 1fr 1.1fr;gap:26px;padding:32px 0;border-bottom:1px solid var(--lineL);align-items:start}
.step .num{font-family:var(--mono);font-size:12.5px;letter-spacing:.18em;color:var(--taupe)}
.step h3{font-size:clamp(20px,2.2vw,26px)}
.step p{margin:0;font-size:16px}
@media(max-width:820px){.step{grid-template-columns:1fr;gap:12px}}

/* faq */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:26px 40px 26px 0;position:relative;
  font-family:var(--disp);font-size:clamp(19px,2.1vw,24px)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-family:var(--sans);font-size:22px;color:var(--taupe-d)}
.faq details[open] summary:after{content:"–"}
.faq .a{padding:0 clamp(0px,6vw,80px) 28px 0;max-width:78ch;color:#4a453f}

/* form */
.formwrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,80px)}
@media(max-width:900px){.formwrap{grid-template-columns:1fr}}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:620px){form .row{grid-template-columns:1fr}}
label{display:block;font-family:var(--mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(246,243,237,.72);margin:20px 0 8px}
input,select,textarea{width:100%;min-width:0;background:transparent;border:0;border-bottom:1px solid var(--lineL);
  color:var(--alabaster);font-family:var(--sans);font-size:16.5px;padding:12px 2px;min-height:48px}
select option{color:#131211}
textarea{min-height:110px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:0;border-bottom-color:var(--taupe)}
form .btn{margin-top:34px;width:100%}
.fnote{font-family:var(--mono);font-size:14px;letter-spacing:.06em;color:rgba(246,243,237,.55);margin-top:18px;line-height:1.7}
.thanks{display:none;padding:20px 0 0;color:var(--taupe);font-family:var(--mono);font-size:14px;line-height:1.8}
.cinfo{list-style:none;padding:0;margin:30px 0 0;font-size:16.5px}
.cinfo li{padding:14px 0;border-bottom:1px solid var(--lineL);overflow-wrap:anywhere}
.cinfo a{text-decoration:none;display:inline-block;padding:11px 0}
.cinfo .k{font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--taupe);display:block;margin-bottom:4px}

/* footer */
footer{background:var(--ink);color:var(--alabaster);padding:clamp(60px,7vw,96px) 0 40px}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:44px}
@media(max-width:820px){.fgrid{grid-template-columns:1fr;gap:34px}}
footer .mark{width:52px;height:54px;object-fit:contain;margin-bottom:22px}
footer h4{font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--taupe);margin:0 0 16px;font-weight:400}
footer ul{list-style:none;padding:0;margin:0}
footer ul a{text-decoration:none;display:inline-block;padding:11px 10px;margin-left:-10px;color:rgba(246,243,237,.82);font-size:15.5px}
footer ul a:hover{color:var(--alabaster)}
.fbot{margin-top:56px;padding-top:22px;border-top:1px solid var(--lineL);display:flex;justify-content:space-between;
  gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:rgba(246,243,237,.5);text-transform:uppercase}

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

/* tap-target sizing for tel/mail links */
a[href^="tel:"],a[href^="mailto:"]{display:inline-block;padding-top:9px;padding-bottom:9px}
/* failsafe: reveal even if JS never runs */
@keyframes rvsafe{to{opacity:1;transform:none}}
.rv{animation:rvsafe .4s ease 1.1s forwards}
.rv.in{animation:none}

/* ---------- nav typography: match their aktiv-grotesk (Inter) ---------- */
.nlinks a{font-family:var(--ui);font-weight:500;font-size:13px;letter-spacing:.15em;text-indent:.15em}
.nav .cta{font-family:var(--ui);font-weight:500;font-size:12px;letter-spacing:.14em;text-indent:.14em}
.mfoot,.crumb,.fbot{font-family:var(--ui);font-weight:400}
.nlinks a:hover,.nlinks a[aria-current=page]{border-bottom:0}
.nlinks a{position:relative}
.nlinks a:after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:var(--taupe);
  transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.nlinks a:hover:after,.nlinks a[aria-current=page]:after{transform:scaleX(1)}
.brand img,.brand span{transition:opacity .4s}
.brand:hover img,.brand:hover span{opacity:.72}

/* ---------- lux motion ---------- */
@keyframes kb{from{object-position:50% 42%}to{object-position:50% 58%}}
.hero video,.hero .hbg{animation:kb 30s ease-in-out infinite alternate both;will-change:object-position}
@keyframes fadeUp{to{opacity:1;transform:none}}
.hero .hin>.rv:nth-child(1){transition-delay:.1s;animation-delay:1.15s}
.hero .hin>.rv:nth-child(2){transition-delay:.24s;animation-delay:1.3s}
.hero .hin>.rv:nth-child(3){transition-delay:.38s;animation-delay:1.45s}
.hero .hin>.rv:nth-child(4){transition-delay:.52s;animation-delay:1.6s}
.hero h1 em{display:inline-block}
@keyframes cue{0%,100%{transform:translateY(0);opacity:.55}50%{transform:translateY(9px);opacity:1}}
.scrollhint{animation:cue 2.8s ease-in-out infinite}
.grid3 figure,.grid2 figure{overflow:hidden;opacity:0;transform:translateY(20px);
  animation:fadeUp .95s cubic-bezier(.2,.7,.2,1) forwards}
.grid3 figure:nth-child(2),.grid2 figure:nth-child(2){animation-delay:.09s}
.grid3 figure:nth-child(3),.grid2 figure:nth-child(3){animation-delay:.18s}
.grid3 figure:nth-child(4),.grid2 figure:nth-child(4){animation-delay:.27s}
.grid3 figure:nth-child(5),.grid2 figure:nth-child(5){animation-delay:.36s}
.grid3 figure:nth-child(6),.grid2 figure:nth-child(6){animation-delay:.45s}
.grid3 figure:nth-child(n+7){animation-delay:.54s}
.grid3 img,.grid2 img{transition:transform 1.5s cubic-bezier(.2,.7,.2,1),filter .8s}
.grid3 figure:hover img,.grid2 figure:hover img{transform:scale(1.06)}
.pc-media{overflow:hidden}
.pc-media img{transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.pcard:hover .pc-media img{transform:scale(1.05)}
.btn{transition:background .45s ease,color .45s ease,letter-spacing .45s cubic-bezier(.2,.7,.2,1),border-color .45s}
.btn:hover{letter-spacing:.21em;text-indent:.21em}
.tlink:after{content:"";display:inline-block;width:0;transition:width .5s cubic-bezier(.2,.7,.2,1)}
.tlink{transition:opacity .35s}
.tlink:hover:after{width:14px}
.pill{transition:background .4s,color .4s,border-color .4s}
.pill:hover{border-color:var(--taupe)}
.statband div{transition:background .6s}
.statband div:hover{background:rgba(172,157,141,.09)}
.faq summary{transition:color .35s}
.faq summary:hover{color:var(--taupe-d)}
.faq summary:after{transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.faq details[open] summary:after{transform:translateY(-50%) rotate(180deg)}
.faq details[open] .a{animation:fadeUp .6s ease both}
footer ul a{transition:color .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
footer ul a:hover{transform:translateX(4px)}
@keyframes growx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.rule{transform-origin:left;animation:growx 1.5s cubic-bezier(.2,.7,.2,1) .15s both}
/* scroll progress hairline */
.sprog{position:fixed;left:0;top:calc(var(--pvh) + 0px);height:2px;width:100%;z-index:119;
  background:var(--taupe);transform:scaleX(0);transform-origin:left;pointer-events:none;opacity:.85}
@media(prefers-reduced-motion:reduce){
  .hero video,.hero .hbg,.scrollhint,.rule,.faq details[open] .a{animation:none}
  .grid3 figure,.grid2 figure{animation:none;opacity:1;transform:none}
  .sprog{display:none}
}
