/* Nova Studios — sitio v6 (nov 2026) */
@font-face{font-family:"Montserrat";src:url(../assets/fonts/nova-sans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Montserrat";src:url(../assets/fonts/nova-sans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Montserrat";src:url(../assets/fonts/nova-sans-600.woff2) format("woff2");font-weight:600;font-display:swap}
/* Layout: black stage over faint sketch lines; panels are glass-thin gold frames; Times italic only on 1-3 words. */
:root{
  color-scheme:dark;
  --ink:#050505; --gold:#C9A94A; --gold-hi:#F3DFA2; --gold-lo:#9E7C2E;
  --metal:linear-gradient(135deg,#F3DFA2 0%,#D9B65E 28%,#C9A94A 50%,#A9862F 72%,#E8CF85 100%); --paper:#F1EDE1; --white:#FFFFFF;
  --soft:rgba(241,237,225,.66);
  --panel:rgba(201,169,74,.06);
  --panel-solid:#0B0B0B;
  --edge:#C9A94A;
  --sketch:rgba(255,255,255,.05);
  --sans:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --times:"Times New Roman",Times,"Liberation Serif","Tinos",serif;
  --t-h1:clamp(30px,3.6vw,54px); --t-h2:clamp(30px,3.4vw,52px); --t-lead:clamp(18px,1.4vw,21px); --t-body:17px; --t-small:14px;
  --space:clamp(112px,13vw,200px);
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--ink);color:var(--paper);font-family:var(--sans);font-size:var(--t-body);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,p,ul,ol,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit}
img,video{display:block;max-width:100%}
::selection{background:var(--gold);color:var(--ink)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:2px}
main,footer,.menu{position:relative;z-index:1}
.wrap{max-width:1240px;margin-inline:auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
@media (max-width:600px){.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}}

/* sketch lines behind everything */
.sketch{position:fixed;inset:0;z-index:0;pointer-events:none}
.sketch .cols{position:absolute;inset:0;max-width:1240px;margin-inline:auto;display:grid;grid-template-columns:repeat(4,1fr);padding-inline:24px}
.sketch .cols i{border-left:1px solid var(--sketch)}
.sketch .cols i:last-child{border-right:1px solid var(--sketch)}
.sketch svg{position:absolute;inset:0;width:100%;height:100%}
@media (max-width:600px){.sketch .cols{grid-template-columns:repeat(2,1fr);padding-inline:16px}}

h1{font-weight:500;font-size:var(--t-h1);line-height:1.15;letter-spacing:-.025em;text-wrap:balance}
h2{font-weight:500;font-size:var(--t-h2);line-height:1.08;letter-spacing:-.025em;text-wrap:balance}
h3{font-weight:500;font-size:20px;line-height:1.3}
em.t{font-family:var(--times);font-style:italic;font-weight:400;color:var(--gold);background:var(--metal);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right:.06em;letter-spacing:-.005em;font-size:1.1em}
.lead{font-size:var(--t-lead);line-height:1.55;color:var(--soft);max-width:40ch}
.small{font-size:var(--t-small);color:var(--soft)}

.btn{display:inline-flex;align-items:center;gap:10px;min-height:50px;padding:0 24px;border-radius:999px;background:var(--metal);background-size:200% 200%;background-position:0% 50%;color:#0A0A0A;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(0,0,0,.25);font:600 15px/1 var(--sans);text-decoration:none;border:0;cursor:pointer;transition:background-position .7s var(--ease),box-shadow .35s,color .25s,transform .25s var(--ease)}
.btn:hover{background-position:100% 50%;box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 0 28px rgba(217,182,94,.35)}
.btn:active{transform:scale(.97)}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-line{background:transparent;color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--edge)}
.btn-line:hover{background:var(--metal);color:#0A0A0A;box-shadow:0 0 28px rgba(217,182,94,.3)}
.u{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;transition:color .2s}
.u:hover{color:var(--gold)}
.panel{background:var(--panel);border:1px solid var(--edge);border-radius:10px}

/* intro */
.intro{position:fixed;inset:0;z-index:100;background:var(--ink);display:none;place-items:center;pointer-events:none}
.intro img{width:min(44vw,240px);height:auto}
.js .intro{display:grid}
.js .intro.done{display:none}
@media (prefers-reduced-motion:no-preference){
  .js .intro img{animation:introIn 1s var(--ease) both}
  .js .intro.out{animation:introOut .9s cubic-bezier(.76,0,.24,1) forwards}
}
@media (prefers-reduced-motion:reduce){.js .intro{display:none}}
@keyframes introIn{from{opacity:0;transform:translateY(14px)}}
@keyframes introOut{to{transform:translateY(-100%)}}

/* floating menu */
.menu{position:fixed;z-index:50;top:calc(14px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);width:min(calc(100% - 32px),920px);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:7px 7px 7px 20px;background:var(--panel-solid);border:1px solid var(--edge);border-radius:999px;transition:transform .55s var(--ease)}
.menu.hide{transform:translate(-50%,calc(-100% - 24px))}
.menu img{width:58px;height:auto}
.menu ul{display:flex;gap:26px;font-size:14px;font-weight:500}
.menu ul a{text-decoration:none;color:var(--soft);transition:color .2s}
.menu ul a:hover{color:var(--gold)}
.menu .btn{min-height:40px;padding:0 18px;font-size:14px}
@media (max-width:760px){.menu ul{display:none}}

/* hero: pinned while the scroll builds the scene */
.hero{position:relative;height:230vh}
.hero-pin{position:sticky;top:0;height:100vh;overflow:hidden}
.hero-copy{position:relative;z-index:3;text-align:center;padding-top:clamp(150px,22vh,220px);will-change:transform}
.hero h1{margin-inline:auto}
.hero h1 .ln{white-space:nowrap}
@media (max-width:600px){.hero h1 .ln{white-space:normal}}
.hero .acts{display:flex;justify-content:center;margin-top:34px}
.hv{position:absolute;inset:0;display:none;pointer-events:none}
body[data-hero=b] .hv-b{display:block}
/* A: real video, cut into frames, moved by the scroll */
body[data-hero=a] .hero{height:340vh}
body[data-hero=a] .hv-a{display:block}
.hv-a canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
/* the video melts into the page background at the bottom edge, no hard cut */
.hv-a{-webkit-mask-image:linear-gradient(#000 78%,transparent);mask-image:linear-gradient(#000 78%,transparent)}
/* B: photos that assemble */
.hv-b .ph{position:absolute;left:50%;top:50%;width:clamp(120px,15vw,220px);aspect-ratio:4/5;height:auto;object-fit:cover;border-radius:10px;box-shadow:0 20px 50px rgba(0,0,0,.5);will-change:transform,opacity}
@media (prefers-reduced-motion:reduce){.hero{height:auto}.hero-pin{position:relative;height:100vh}}


/* text that lights up */
.fill-sec{padding-block:var(--space)}
.fill{font-weight:500;font-size:clamp(28px,3.6vw,54px);line-height:1.2;letter-spacing:-.025em;max-width:22ch}
.fill .w{opacity:.16;transition:opacity .3s linear}
.fill .w.on{opacity:1}

/* services: full blocks that stack and pause */
.services{position:relative;height:calc(var(--n,4) * 120vh)}
.stage{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;gap:28px;padding-top:72px}
.cards{position:relative;height:min(62vh,560px);overflow:hidden;border-radius:14px}
.card{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-rows:minmax(0,1fr);overflow:hidden;background:var(--panel-solid);border:1px solid var(--edge);border-radius:14px;transform-origin:50% 0;will-change:transform}
.card-text{display:flex;flex-direction:column;justify-content:space-between;gap:24px;padding:clamp(24px,3.4vw,48px)}
.card-text h3{font-size:clamp(26px,2.7vw,42px);line-height:1.1;letter-spacing:-.025em}
.card-text p{color:var(--soft);max-width:36ch;font-size:clamp(16px,1.3vw,19px)}
.card-text .count{font-size:var(--t-small);color:var(--gold);font-weight:600}
.card img{width:100%;height:100%;min-height:0;object-fit:cover}
.card-text{min-height:0}
.dots{display:flex;gap:8px}
.dots i{width:28px;height:2px;background:rgba(241,237,225,.2);transition:background .4s}
.dots i.on{background:var(--gold)}
@media (max-width:860px){
  .cards{height:min(70vh,600px)}
  .card{grid-template-columns:1fr;grid-template-rows:minmax(0,40%) minmax(0,60%)}
  .card img{order:-1}
}
@media (prefers-reduced-motion:reduce){
  .services{height:auto}
  .stage{position:static;height:auto;padding-block:var(--space) 0}
  .cards{height:auto;display:grid;gap:16px}
  .card{position:relative;inset:auto;min-height:420px}
  .dots{display:none}
}

/* work */
.sec{padding-block:var(--space) 0}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:48px}
.sec-head p{max-width:42ch}
.reels-scroll{overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory}
.reels-scroll::-webkit-scrollbar{display:none}
.reels{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:16px}
.reel{scroll-snap-align:start}
.reel .frame{overflow:hidden;border-radius:10px;background:rgba(255,255,255,.03);transition:box-shadow .5s var(--ease)}
.reel video{opacity:.72;transition:opacity .5s var(--ease),transform .9s var(--ease)}
.reel:hover .frame{box-shadow:0 0 0 1px rgba(217,182,94,.55),0 0 42px rgba(217,182,94,.32)}
.reel:hover video{opacity:1}
.reel video{width:100%;aspect-ratio:9/16;object-fit:cover}
.reel:hover video{transform:scale(1.04)}
.reel figcaption{display:flex;justify-content:space-between;gap:10px;margin-top:12px;font-size:14px}
.reel figcaption span{color:var(--soft)}
@media (max-width:860px){.reels{grid-template-columns:repeat(4,68vw)}}

/* plans */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.plan{display:flex;flex-direction:column;gap:18px;padding:30px}
.plan.pro{border-width:2px;background:rgba(201,169,74,.1)}
.plan .head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.plan .tag{font-size:13px;font-weight:600;background:var(--metal);color:#0A0A0A;padding:5px 10px;border-radius:999px}
.plan .what{color:var(--soft);font-size:16px}
.plan .amount{font-weight:500;font-size:clamp(32px,2.8vw,42px);letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.plan .amount small{display:block;margin-top:8px;font-size:14px;letter-spacing:0;color:var(--soft)}
.plan ul{display:flex;flex-direction:column;gap:7px;font-size:16px}
.plan .per{font-size:15px;font-weight:600;color:var(--gold);margin-top:auto}
.plan .note{font-size:13px;color:var(--soft)}
.plan .btn{align-self:flex-start}
.plans-foot{margin-top:28px;display:flex;flex-direction:column;gap:6px;color:var(--soft);font-size:15px}
@media (max-width:900px){.plans{grid-template-columns:1fr}}

/* quotes */
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.quotes figure{padding:28px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.quotes blockquote{font-size:var(--t-lead);line-height:1.5}
@media (max-width:860px){.quotes{grid-template-columns:1fr}}

/* faq */
.faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:32px 64px;align-items:start}
.faq details{border-top:1px solid rgba(201,169,74,.35)}
.faq details:last-child{border-bottom:1px solid rgba(201,169,74,.35)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:22px;font-size:18px;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{position:relative;flex:0 0 14px;height:14px}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:0;top:6px;width:14px;height:2px;background:var(--gold);transition:transform .35s var(--ease)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq details p{padding-bottom:24px;color:var(--soft);max-width:60ch}
@media (max-width:860px){.faq-grid{grid-template-columns:1fr}}

/* contact */
.contact{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:40px 64px;align-items:start}
.contact .alt{display:flex;flex-direction:column;gap:4px;margin-top:28px;font-size:15px}
.contact .alt b{font-weight:500;user-select:all;margin-bottom:10px}
form{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:clamp(22px,3vw,34px)}
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.wide{grid-column:1/-1}
label{font-size:14px;font-weight:500}
input[type=text],input[type=email],select,textarea{width:100%;font:inherit;font-size:16px;color:var(--paper);background:var(--ink);border:1px solid rgba(201,169,74,.4);border-radius:8px;padding:13px 14px;transition:border-color .2s}
textarea{min-height:104px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold)}
[aria-invalid=true]{border-color:#E07A5F}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--soft);font-weight:400}
.check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--gold);flex:0 0 20px}
.legal{font-size:13px;color:var(--soft)}
.send{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.status{font-size:14px;font-weight:500}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
button[disabled]{opacity:.6;cursor:wait}
@media (max-width:860px){.contact,form{grid-template-columns:1fr}}

/* footer */
footer{margin-top:var(--space);overflow:hidden}
.foot{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding-block:40px 0;border-top:1px solid rgba(201,169,74,.35)}
.foot ul{display:flex;gap:24px;flex-wrap:wrap;font-size:14px}
.foot a{color:var(--soft);text-decoration:none}
.foot a:hover{color:var(--gold)}
.big{font-family:var(--times);font-weight:400;font-size:clamp(120px,30vw,470px);line-height:.78;letter-spacing:-.02em;text-align:center;color:transparent;-webkit-text-stroke:1px var(--gold);margin-top:36px;transform:translateY(16%);user-select:none}

/* reveals */
.ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.ln>span{display:inline-block}
@media (prefers-reduced-motion:no-preference){
  .js .ln>span{transform:translateY(105%);transition:transform 1.1s var(--ease);transition-delay:calc(var(--i,0)*.1s)}
  .js .go .ln>span,.js .ln.go>span{transform:none}
  .js .rv{transition:opacity 1s var(--ease),transform 1s var(--ease)}
  .js .rv.wait{opacity:0;transform:translateY(22px)}
}

/* legal pages */
.doc-page{background:var(--ink)}
.doc-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:28px}
.doc-top img{width:72px;height:auto}
.doc{max-width:760px;padding-block:48px 96px}
.doc h1{font-size:clamp(32px,4vw,52px);line-height:1.1;margin-bottom:14px}
.doc-meta{font-size:var(--t-small);color:var(--soft);margin-bottom:40px}
.doc section{margin-top:44px}
.doc h2{font-size:clamp(22px,2vw,28px);margin-bottom:14px}
.doc h3{font-size:18px;margin:22px 0 8px}
.doc p,.doc li{color:var(--soft);max-width:68ch}
.doc p+p{margin-top:12px}
.doc ul{display:flex;flex-direction:column;gap:8px;margin-top:10px;padding-left:20px;list-style:disc}
.doc li::marker{color:var(--gold)}
.doc strong{color:var(--paper);font-weight:600}
.doc-box{padding:clamp(22px,3vw,32px);margin-top:0}
.doc-box p{color:var(--paper)}
.doc-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:32px 48px;border-top:1px solid rgba(201,169,74,.35)}
