/* mdnLAB — shared stylesheet */

:root{--pad:clamp(20px,4vw,64px);
  --bg:#fff;--fg:#0A0A0A;--acc:#6D4FE0;--soft:rgba(0,0,0,.5);--line:rgba(0,0,0,.12);
  --panel:#F3F2F6;--chip:rgba(0,0,0,.06)}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Schibsted Grotesk",system-ui,sans-serif;background:var(--bg);color:var(--fg);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .35s ease,color .35s ease}
em{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;color:var(--acc)}
a{color:inherit}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}


/* header */
header{display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:22px var(--pad);flex-wrap:wrap}
.mark{font-family:"Unbounded","Schibsted Grotesk",sans-serif;font-weight:400;
  letter-spacing:-.045em;text-decoration:none;line-height:1;font-size:21px}
nav{display:flex;align-items:center;gap:clamp(14px,2vw,28px)}
nav a{font-size:15px;text-decoration:none;color:var(--soft)}
nav a:hover,nav a[aria-current="page"]{color:var(--fg)}
.top-link{font-size:15px;text-decoration:none;color:var(--bg);background:var(--fg);
  padding:10px 20px;border-radius:99px;white-space:nowrap}
.top-link:hover{opacity:.85}

/* page head */
.phead-band{padding:clamp(40px,8vh,110px) var(--pad) clamp(24px,4vh,48px);max-width:1620px;margin:0 auto}
.phead-band h1{font-weight:400;font-size:clamp(34px,5.4vw,88px);line-height:1.03;letter-spacing:-.04em;
  max-width:18ch;text-wrap:balance}
.phead-band.one-line h1{max-width:none;white-space:nowrap}
@media (max-width:900px){.phead-band.one-line h1{white-space:normal}}
.phead-band p{margin-top:clamp(14px,2vh,22px);font-size:clamp(16px,1.3vw,20px);color:var(--soft);max-width:none}

/* filters */
.filters{display:flex;flex-wrap:wrap;gap:8px;padding:0 var(--pad) clamp(26px,4vh,44px);
  max-width:1620px;margin:0 auto}
.filters button{font:400 15px/1 "Schibsted Grotesk",sans-serif;color:var(--fg);background:var(--chip);
  border:0;cursor:pointer;padding:11px 20px;border-radius:99px;transition:background .2s ease}
.filters button[aria-pressed="true"]{background:var(--fg);color:var(--bg)}
.filters .count{color:var(--soft);font-size:15px;align-self:center;margin-left:6px}

/* case grid */
.grid{display:grid;gap:clamp(16px,2vw,28px);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  max-width:1620px;margin:0 auto;padding:0 var(--pad) clamp(50px,9vh,120px)}
.tile{text-decoration:none;display:block}
.tile .frame{overflow:hidden;border-radius:18px;aspect-ratio:4/5;background:var(--panel)}
.tile .frame img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.tile:hover .frame img{transform:scale(1.04)}
.tile .meta{padding-top:12px;display:flex;flex-direction:column;gap:3px}
.tile .meta b{font-weight:500;font-size:17px}
.tile .meta span{color:var(--soft);font-size:14px}
.tile.empty .frame{display:grid;place-items:center;border:1px dashed var(--line);background:none}
.tile.empty .frame::after{content:attr(data-slot);color:var(--soft);font-size:14px;padding:0 20px;
  text-align:center;line-height:1.5}

/* case page */
.cover{max-width:1620px;margin:0 auto;padding:0 var(--pad)}
.cover img{width:100%;display:block;border-radius:20px;background:var(--panel);aspect-ratio:16/10;object-fit:cover}
.intro{max-width:1620px;margin:0 auto;padding:clamp(30px,5vh,64px) var(--pad) clamp(30px,5vh,60px);
  display:grid;gap:clamp(22px,4vw,60px);grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  align-items:start}
@media (max-width:820px){.intro{grid-template-columns:1fr}}
.intro h1{font-weight:400;font-size:clamp(30px,4.2vw,64px);line-height:1.04;letter-spacing:-.04em}
.intro p{margin-top:18px;font-size:clamp(16px,1.25vw,19px);line-height:1.5;color:var(--soft);max-width:56ch}
.facts{list-style:none;display:grid;gap:9px;padding-top:8px}
.facts li{font-size:15.5px;line-height:1.45;color:var(--soft);padding-left:15px;position:relative}
.facts li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;border-radius:50%;
  background:var(--acc)}

.slides{max-width:1620px;margin:0 auto;padding:0 var(--pad) clamp(40px,7vh,90px);
  display:grid;gap:clamp(14px,1.6vw,24px);grid-template-columns:repeat(auto-fit,minmax(420px,1fr))}
.slides img{width:100%;display:block;border-radius:12px;background:var(--panel);aspect-ratio:16/10;object-fit:cover}
/* reports and papers: double-page spreads need the full width to stay readable */
.slides.spreads{grid-template-columns:1fr}
.slides.spreads img{aspect-ratio:3/2}
.slides.sheets{grid-template-columns:1fr}
.slides.sheets img{aspect-ratio:4/3}


/* next case */
.next{max-width:1620px;margin:0 auto;padding:0 var(--pad) clamp(40px,7vh,80px)}
.next a{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;
  text-decoration:none;padding:clamp(22px,3vw,34px);border-radius:20px;background:var(--panel)}
.next span{color:var(--soft);font-size:15px}
.next b{font-weight:400;font-size:clamp(22px,2.6vw,38px);letter-spacing:-.035em}

/* cta */
.end{padding:clamp(40px,7vh,90px) var(--pad);display:flex;flex-wrap:wrap;gap:24px;
  align-items:end;justify-content:space-between;max-width:1620px;margin:0 auto;border-top:1px solid var(--line)}
.end h2{font-weight:400;font-size:clamp(26px,3.2vw,52px);letter-spacing:-.04em;line-height:1.05;
  max-width:27ch;text-wrap:balance}
.btn{text-decoration:none;font-size:16px;padding:16px 30px;border-radius:99px;background:var(--fg);color:var(--bg)}
.btn:hover{opacity:.85}

/* footer */
footer{max-width:1620px;margin:0 auto;padding:clamp(40px,6vh,70px) var(--pad) 60px;
  display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  border-top:1px solid var(--line);font-size:15px}
footer a{color:var(--soft);text-decoration:none;display:block;padding:3px 0}
footer a:hover{color:var(--fg)}
footer .legal{color:var(--soft)}

/* ---------- placeholders (remove once real images land) ---------- */
.ph{background:var(--panel);border-radius:18px;display:grid;place-items:center;
  color:var(--soft);font-size:13px;text-align:center;padding:14px;line-height:1.4}
.ph.r12{border-radius:12px}

/* ---------- home ---------- */
.headline{text-align:center;padding:clamp(50px,11vh,140px) var(--pad) 0}
.headline h1{font-weight:400;font-size:clamp(34px,5.6vw,100px);line-height:1.02;letter-spacing:-.04em;
  max-width:19ch;margin:0 auto}
.headline p{margin:clamp(20px,3vh,32px) auto 0;font-size:clamp(16px,1.35vw,21px);color:var(--soft);max-width:56ch}
.air{height:clamp(46px,10vh,130px)}

.stage{overflow:hidden;padding-bottom:clamp(46px,8vh,110px);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.track{display:flex;gap:clamp(14px,1.6vw,24px);width:max-content;padding:0 12px;
  animation:slide 72s linear infinite}
.stage:hover .track{animation-play-state:paused}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.track{animation:none}}
.card{flex:0 0 auto;width:clamp(210px,20vw,320px);transition:transform .45s ease;
  text-decoration:none;color:inherit;display:block}
.card:hover{transform:translateY(-8px)}
.card .frame{display:block;overflow:hidden;border-radius:18px;aspect-ratio:4/5;background:var(--panel)}
.card .frame img,.card .frame .ph{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.card:hover .frame img{transform:scale(1.05)}
.card .cap{padding-top:11px;font-size:13.5px;display:flex;flex-direction:column;gap:2px}
.card b{font-weight:500}
.card span{color:var(--soft)}

.make{max-width:1620px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--pad);border-top:1px solid var(--line)}
.make h2{font-weight:400;font-size:clamp(26px,3.2vw,52px);letter-spacing:-.04em}
.make dl{display:grid;gap:0}
.make .row{display:grid;gap:clamp(8px,2vw,40px);grid-template-columns:minmax(200px,.9fr) minmax(0,2fr);
  padding:clamp(18px,2.6vh,28px) 0;border-top:1px solid var(--line)}
.make .row:last-child{border-bottom:1px solid var(--line)}
@media (max-width:720px){.make .row{grid-template-columns:1fr;gap:6px}}
.make dt{font-weight:500;font-size:clamp(18px,1.6vw,24px);letter-spacing:-.02em}
.make dd{color:var(--soft);font-size:clamp(15px,1.2vw,18px);line-height:1.5;max-width:62ch}

.numbers{padding:clamp(60px,12vh,150px) var(--pad);display:grid;gap:clamp(44px,8vh,110px);text-align:center}
.num{font-weight:400;font-size:clamp(42px,8vw,132px);line-height:.98;letter-spacing:-.045em}
.num em{font-size:1.06em}
.num-label{margin-top:clamp(10px,1.6vh,20px);font-size:clamp(15px,1.3vw,21px);color:var(--soft)}

.how{max-width:1620px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--pad);border-top:1px solid var(--line)}
.how h2{font-weight:400;font-size:clamp(26px,3.2vw,52px);letter-spacing:-.04em;margin-bottom:clamp(24px,4vh,44px)}
.how ol{list-style:none;counter-reset:s;display:grid;gap:clamp(16px,2.4vh,26px);max-width:64ch}
.how li{counter-increment:s;font-size:clamp(17px,1.5vw,23px);line-height:1.4;padding-left:44px;position:relative}
.how li::before{content:counter(s);position:absolute;left:0;top:.15em;font-size:.7em;color:var(--acc)}

.logos{max-width:1620px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--pad);border-top:1px solid var(--line)}
.logos h2{font-weight:400;font-size:clamp(20px,2vw,30px);letter-spacing:-.03em;color:var(--soft);
  margin-bottom:clamp(22px,3.4vh,40px)}
.logos .strip{display:flex;flex-wrap:wrap;gap:clamp(24px,4vw,64px);align-items:center}
.logos .strip .ph{width:120px;height:40px;border-radius:6px;font-size:11px}

.quotes{max-width:1620px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--pad);border-top:1px solid var(--line)}
.quotes .qhead{display:flex;flex-wrap:wrap;gap:16px;align-items:baseline;justify-content:space-between;
  max-width:1620px;margin:0 auto clamp(24px,4vh,44px)}
.quotes h2{font-weight:400;font-size:clamp(26px,3.2vw,52px);letter-spacing:-.04em}
.quotes .qhead a{font-size:16px;color:var(--soft);text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:3px}
.quotes .qhead a:hover{color:var(--fg)}
.quotes .qgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.8vw,24px);
  align-items:start}
@media (max-width:1100px){.quotes .qgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.quotes .qgrid{grid-template-columns:1fr}}
.quotes .qcol{display:flex;flex-direction:column;gap:clamp(16px,1.8vw,24px)}
.quotes .qgrid blockquote{margin:0}
.quotes blockquote{background:var(--panel);border-radius:24px;padding:clamp(22px,2.4vw,34px)}
.quotes blockquote p{font-size:16.5px;line-height:1.55}

.quotes blockquote footer{border:0;padding:22px 0 0;margin:0;display:flex;align-items:center;
  gap:14px;color:var(--soft);font-size:14.5px}
.quotes blockquote footer img{width:52px;height:52px;border-radius:50%;object-fit:cover;
  flex:0 0 auto;background:var(--chip);align-self:start}
.quotes blockquote footer span{display:flex;flex-direction:column;gap:2px;line-height:1.35}
.quotes blockquote footer b{font-weight:500;color:var(--fg);font-size:16px}

/* ---------- pricing ---------- */
.price{max-width:none;margin:0;padding:0}
.price .row{display:grid;gap:clamp(6px,2vw,40px);grid-template-columns:minmax(220px,1fr) auto;
  align-items:baseline;padding:clamp(20px,2.8vh,30px) 0;border-top:1px solid var(--line)}
.price dl:last-of-type .row:last-child{border-bottom:1px solid var(--line)}
@media (max-width:640px){.price .row{grid-template-columns:1fr}}
.price dt{font-weight:500;font-size:clamp(18px,1.7vw,25px);letter-spacing:-.02em}
.price dd{font-size:clamp(16px,1.35vw,20px);color:var(--soft);text-align:right}
@media (max-width:640px){.price dd{text-align:left}}
.price .note{max-width:64ch;color:var(--soft);font-size:16px;line-height:1.55;
  padding:clamp(26px,4vh,44px) 0 0}
.price h2{font-weight:400;font-size:clamp(20px,2vw,30px);letter-spacing:-.03em;
  color:var(--soft);padding:clamp(38px,5vh,60px) 0 clamp(4px,.8vh,10px)}

/* ---------- about / prose ---------- */
.prose{max-width:70ch;margin:0 auto;padding:0 var(--pad) clamp(50px,9vh,110px)}
.prose p{font-size:clamp(17px,1.4vw,21px);line-height:1.6;margin-bottom:clamp(18px,2.6vh,28px)}
.prose p:first-child{font-size:clamp(19px,1.7vw,26px);line-height:1.45}

/* ---------- contact form ---------- */
.form{max-width:none;margin:0;padding:0;display:grid;gap:20px}
.form label{display:grid;gap:8px;font-size:15px;color:var(--soft)}
.form input,.form textarea,.form select{font:400 16px/1.4 "Schibsted Grotesk",sans-serif;
  color:var(--fg);background:var(--panel);border:1px solid transparent;border-radius:12px;padding:14px 16px}
.form input:focus,.form textarea:focus,.form select:focus{border-color:var(--acc);outline:none}
.form textarea{min-height:150px;resize:vertical}
.form button{justify-self:start;font:400 16px/1 "Schibsted Grotesk",sans-serif;cursor:pointer;
  border:0;padding:16px 30px;border-radius:99px;background:var(--fg);color:var(--bg)}
.form button:hover{opacity:.85}
.form button:disabled{opacity:.5;cursor:default}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-status{font-size:15px;line-height:1.5;margin:0;min-height:1.5em}
.form-status.ok{color:var(--fg)}
.form-status.err{color:#B3261E}
.form-status a{color:inherit}


/* ---------- split layout: text left, content right ---------- */
.split{max-width:1620px;margin:0 auto;padding:clamp(36px,7vh,100px) var(--pad) clamp(50px,9vh,110px);
  display:grid;gap:clamp(28px,5vw,90px);grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  align-items:start}
@media (max-width:900px){.split{grid-template-columns:1fr;gap:clamp(24px,4vh,40px)}}
.split-text h1{font-weight:400;font-size:clamp(34px,4.6vw,74px);line-height:1.03;letter-spacing:-.04em}
.split-text p{margin-top:clamp(16px,2.4vh,24px);font-size:clamp(16px,1.3vw,20px);color:var(--soft);
  line-height:1.55;max-width:44ch}
@media (min-width:901px){.split-text{position:sticky;top:clamp(30px,6vh,70px)}}

/* ---------- statement (blur-in on scroll) ---------- */
.statement{padding:clamp(56px,9vh,130px) var(--pad) clamp(66px,11vh,160px);max-width:1500px;
  margin:0 auto;display:grid;gap:clamp(28px,5vh,64px)}
.statement p{font-weight:400;font-size:clamp(22px,3.1vw,52px);line-height:1.16;letter-spacing:-.03em;
  max-width:24ch;text-wrap:balance;opacity:0;filter:blur(8px);transform:translateY(10px);
  transition:opacity .8s ease,filter .9s ease,transform .9s ease}
.statement p.in{opacity:1;filter:blur(0);transform:none}
.statement p:nth-child(even){justify-self:end;text-align:right}
@media (prefers-reduced-motion:reduce){.statement p{opacity:1;filter:none;transform:none}}

/* ---------- selected work cards on home ---------- */
.selected{padding:clamp(40px,7vh,90px) var(--pad) clamp(40px,6vh,80px);border-top:1px solid var(--line)}
.selected .shead{display:flex;flex-wrap:wrap;gap:16px;align-items:baseline;justify-content:space-between;
  max-width:1620px;margin:0 auto clamp(30px,5vh,60px)}
.selected h2{font-weight:400;font-size:clamp(26px,3.2vw,52px);letter-spacing:-.04em}
.selected .all{font-size:16px;color:var(--soft);text-decoration:none}
.selected .all:hover{color:var(--fg)}
.pgrid{display:grid;gap:clamp(16px,2vw,28px);grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
  max-width:1620px;margin:0 auto}
.pcard{border-radius:24px;padding:clamp(22px,2.2vw,32px);background:var(--panel);text-decoration:none;
  display:block;color:inherit}
.phead{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px}
.phead h3{font-weight:500;font-size:clamp(21px,1.7vw,28px);letter-spacing:-.03em}
.phead .pill{font-size:14px;background:var(--chip);padding:9px 16px;border-radius:99px;white-space:nowrap}
.pcard .facts{margin-bottom:22px}
.pcard img,.pcard .ph{width:100%;display:block;border-radius:12px;aspect-ratio:16/10;object-fit:cover}

/* ---------- showreel ---------- */
.reel-band{padding:clamp(50px,9vh,120px) var(--pad) clamp(40px,7vh,90px);border-top:1px solid var(--line)}
.reel-head{max-width:1620px;margin:0 auto clamp(16px,2.4vh,30px)}
.reel-head h2{font-weight:400;font-size:clamp(26px,3vw,48px);letter-spacing:-.035em}
.reel-head p{margin-top:8px;font-size:15.5px;color:var(--soft);max-width:44ch}
.reel{position:relative;max-width:1620px;margin:0 auto;aspect-ratio:16/9;border-radius:16px;
  overflow:hidden;background:var(--panel);cursor:pointer}
.reel img,.reel .ph{width:100%;height:100%;object-fit:cover;display:block;border-radius:0;
  transition:transform .7s ease}
.reel:hover img{transform:scale(1.012)}
.reel iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.play{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.play i{display:grid;place-items:center;width:clamp(64px,6vw,96px);height:clamp(64px,6vw,96px);
  border-radius:50%;background:#fff;color:#000;font-style:normal;
  font-size:clamp(15px,1.3vw,20px);padding-left:4px}

/* ---------- logo carousel ---------- */
.logos .lstage{overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logos .ltrack{display:flex;align-items:center;gap:clamp(30px,4.5vw,72px);width:max-content;
  animation:lslide 46s linear infinite}
.logos .lstage:hover .ltrack{animation-play-state:paused}
@keyframes lslide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.logos .ltrack{animation:none;flex-wrap:wrap;width:auto}}
.logos .ltrack img{height:var(--h,30px);width:auto;display:block;flex:0 0 auto;
  opacity:.42;transition:opacity .3s ease}
@media (max-width:640px){.logos .ltrack img{height:calc(var(--h,30px) * .8)}}
.logos .ltrack img:hover{opacity:.78}
.logos .ltrack .ph{flex:0 0 auto;width:126px;height:40px;border-radius:6px;font-size:11px}

/* ---------- pricing cards ---------- */
.tiers{display:grid;gap:clamp(14px,1.6vw,22px);grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  max-width:1620px;margin:0 auto;padding:0 var(--pad) clamp(30px,5vh,56px)}
.tier{border-radius:24px;padding:clamp(24px,2.4vw,34px);background:var(--panel);display:flex;
  flex-direction:column;gap:14px}
.tier.mark-mid{background:var(--acc);color:#fff}
.tier.mark-dark{background:var(--fg);color:var(--bg)}
.tier h3{font-weight:500;font-size:clamp(17px,1.4vw,21px);letter-spacing:-.02em}
.tier .amount{font-weight:400;font-size:clamp(40px,4.4vw,68px);letter-spacing:-.045em;line-height:1}
.tier .range{font-size:15px;opacity:.7}
.tier ul{list-style:none;display:grid;gap:9px;margin-top:6px;padding-top:16px;
  border-top:1px solid currentColor;border-color:color-mix(in srgb,currentColor 18%,transparent)}
.tier li{font-size:15px;line-height:1.45;padding-left:20px;position:relative;opacity:.85}
.tier li::before{content:"";position:absolute;left:2px;top:.55em;width:9px;height:2px;background:currentColor}
.tier .go{margin-top:auto;padding-top:20px}
.tier .go a{display:inline-block;text-decoration:none;font-size:15px;padding:13px 24px;border-radius:99px;
  background:currentColor}
.tier .go a span{color:var(--panel);mix-blend-mode:normal}
.tier.mark-mid .go a span{color:var(--acc)}
.tier.mark-mid .range,.tier.mark-mid li{opacity:.92}
.tier.mark-dark .go a span{color:var(--fg)}


/* ---------- calendly ---------- */
.book{background:var(--panel);border-radius:24px;padding:clamp(22px,2.4vw,32px);margin-bottom:34px}
.book .calendly-inline-widget{border-radius:14px;overflow:hidden;background:#fff}
.book h2{font-weight:500;font-size:clamp(18px,1.5vw,23px);letter-spacing:-.02em;margin-bottom:8px}
.book p{font-size:15.5px;color:var(--soft);line-height:1.5;margin-bottom:18px;max-width:46ch}
.book a{display:inline-block;text-decoration:none;font-size:15.5px;padding:14px 26px;border-radius:99px;
  background:var(--fg);color:var(--bg)}
.book a:hover{opacity:.85}
.after-form{margin-top:22px;font-size:15.5px;color:var(--soft);line-height:1.5}
.after-form a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}

/* ---------- what we make: cards ---------- */
.mgrid{display:grid;gap:clamp(14px,1.4vw,20px);grid-template-columns:repeat(4,minmax(0,1fr));
  max-width:1620px;margin:0 auto}
@media (max-width:1180px){.mgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.mgrid{grid-template-columns:1fr}}
.make .mhead{display:flex;flex-wrap:wrap;gap:16px;align-items:baseline;justify-content:space-between;
  max-width:1620px;margin:0 auto clamp(26px,4vh,50px)}
.make .mhead a{font-size:16px;color:var(--soft);text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:3px}
.make .mhead a:hover{color:var(--fg)}

.mcard{background:var(--panel);border-radius:24px;padding:clamp(24px,2.4vw,34px);display:flex;
  flex-direction:column;gap:12px;text-decoration:none;color:inherit;min-height:clamp(240px,24vw,320px);
  transition:background .25s ease,transform .35s ease}
.mcard:hover{background:#EBE9F3;transform:translateY(-4px)}
.mcard h3{font-weight:400;font-size:clamp(24px,2.3vw,36px);letter-spacing:-.035em;line-height:1.08}
.mcard p{font-size:15.5px;line-height:1.5;color:var(--soft)}
.mcard .price-tag{margin-top:auto;padding-top:22px;font-size:clamp(20px,1.7vw,26px);
  letter-spacing:-.02em;color:var(--acc)}
.mcard .price-tag span{font-size:14.5px;color:var(--soft);letter-spacing:0;margin:0 5px}

/* ---------- extras panel ---------- */
.extras{max-width:1620px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--pad) clamp(40px,6vh,80px);
  border-top:1px solid var(--line)}
.epanel{background:var(--panel);border-radius:24px;padding:clamp(24px,2.6vw,40px);
  display:grid;gap:clamp(24px,4vw,60px);grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  align-items:start}
@media (max-width:860px){.epanel{grid-template-columns:1fr;gap:24px}}
.epanel h2{font-weight:400;font-size:clamp(23px,2.4vw,36px);letter-spacing:-.035em}
.epanel .lead{margin-top:14px;font-size:16px;line-height:1.55;color:var(--soft);max-width:42ch}
.erow{display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding:14px 0;border-bottom:1px solid var(--line)}
.erow:first-child{padding-top:0}
.erow:last-child{border-bottom:0;padding-bottom:0}
.erow b{font-weight:500;font-size:16.5px}
.erow span{font-size:15.5px;color:var(--soft);white-space:nowrap}
@media (max-width:520px){.erow{flex-direction:column;gap:3px}.erow span{white-space:normal}}


/* ---------- legal pages ---------- */
.legal-body{max-width:70ch;margin:0 auto;padding:0 var(--pad) clamp(50px,9vh,110px)}
.legal-body p{font-size:16.5px;line-height:1.65;margin-bottom:18px}
.legal-body p.meta{color:var(--soft);font-size:15px;line-height:1.6;
  padding-bottom:26px;margin-bottom:30px;border-bottom:1px solid var(--line)}
.legal-body h2{font-weight:500;font-size:clamp(19px,1.6vw,24px);letter-spacing:-.02em;
  margin:36px 0 12px}
.legal-body h3{font-weight:500;font-size:16.5px;margin:22px 0 8px}
.legal-body a{color:var(--acc)}

.rail-more{text-align:center;padding:0 var(--pad) clamp(40px,7vh,90px);margin-top:-10px}
.rail-more a{font-size:15.5px;color:var(--soft);text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:3px}
.rail-more a:hover{color:var(--fg)}

.nb{white-space:nowrap}

/* ---------- about ---------- */
.bio{max-width:1620px;margin:0 auto;padding:clamp(30px,6vh,80px) var(--pad) clamp(50px,9vh,110px);
  display:grid;gap:clamp(28px,4vw,72px);grid-template-columns:minmax(0,.58fr) minmax(0,1.42fr);
  align-items:start}
@media (max-width:900px){.bio{grid-template-columns:1fr;gap:clamp(24px,4vh,40px)}}
.bio .portrait{border-radius:20px;overflow:hidden;background:var(--panel);aspect-ratio:4/5;
  max-width:510px}
@media (max-width:900px){.bio .portrait{max-width:320px}}
.bio .portrait img{width:100%;height:100%;object-fit:cover;display:block;object-position:50% 34%}
.bio .cap{padding-top:12px;font-size:14.5px;color:var(--soft)}
.bio-text p{font-size:clamp(17px,1.3vw,21px);line-height:1.6;margin-bottom:clamp(16px,2.4vh,26px);
  max-width:62ch}
.bio-text p:first-child{font-size:clamp(19px,1.6vw,26px);line-height:1.45;letter-spacing:-.02em;
  max-width:52ch}
.bio-text p:last-child{margin-bottom:0}

/* ---------- rebuild block ---------- */
.rebuild{max-width:1620px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--pad) clamp(10px,2vh,24px)}
.rpanel{background:var(--acc);color:#fff;border-radius:28px;padding:clamp(28px,3.4vw,58px);
  display:grid;gap:clamp(28px,4vw,72px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:stretch}
@media (max-width:900px){.rpanel{grid-template-columns:1fr;gap:28px}}
.rtext{display:flex;flex-direction:column}
.rtext h2{font-weight:400;font-size:clamp(28px,3.4vw,54px);letter-spacing:-.04em;line-height:1.05;
  margin-bottom:clamp(16px,2.4vh,26px)}
.rtext p{font-size:clamp(16px,1.25vw,19px);line-height:1.6;color:rgba(255,255,255,.82);
  margin-bottom:clamp(12px,1.8vh,18px);max-width:52ch}
.rtext .btn{margin-top:auto;align-self:start;display:inline-block;background:#fff;color:var(--acc)}
.rlist{list-style:none;display:flex;flex-direction:column;justify-content:space-between;gap:0}
.rlist li{padding:clamp(16px,2.2vh,24px) 0;border-top:1px solid rgba(255,255,255,.22);
  font-size:15.5px;line-height:1.5;color:rgba(255,255,255,.82)}
.rlist li:first-child{padding-top:0;border-top:0}
.rlist li:last-child{padding-bottom:0}
.rlist b{display:block;font-weight:500;font-size:17.5px;color:#fff;margin-bottom:5px;
  letter-spacing:-.02em}

.rtext h2 em{color:#fff;opacity:.95}

/* ---------- faq ---------- */
.faq{max-width:1620px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--pad);border-top:1px solid var(--line);
  display:grid;gap:clamp(28px,4vw,72px);grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  align-items:start}
@media (max-width:900px){.faq{grid-template-columns:1fr;gap:26px}}
.faq-head h2{font-weight:400;font-size:clamp(26px,3.2vw,48px);letter-spacing:-.04em;line-height:1.05}
.faq-head p{margin-top:14px;font-size:16px;color:var(--soft);max-width:34ch}
@media (min-width:901px){.faq-head{position:sticky;top:clamp(30px,6vh,70px)}}
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-item summary{cursor:pointer;list-style:none;padding:clamp(18px,2.4vh,26px) 40px clamp(18px,2.4vh,26px) 0;
  font-size:clamp(17px,1.4vw,21px);letter-spacing:-.02em;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";position:absolute;right:8px;top:50%;width:11px;height:11px;
  border-right:1.5px solid var(--soft);border-bottom:1.5px solid var(--soft);
  transform:translateY(-70%) rotate(45deg);transition:transform .25s ease}
.faq-item[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq-item summary:hover{color:var(--acc)}
.faq-a{padding:0 40px clamp(20px,2.6vh,28px) 0}
.faq-a p{font-size:16px;line-height:1.6;color:var(--soft);max-width:62ch}