/* Final presentation layer: consistent spacing, hierarchy and interaction. */
:root{
  --content-max:1480px;
  --shadow-soft:0 22px 60px rgba(23,33,43,.10);
  --shadow-card:0 12px 32px rgba(23,33,43,.08)
}

html{scroll-padding-top:96px}
body{letter-spacing:.002em}

.site-header{height:88px;padding-inline:max(4.5vw,calc((100vw - var(--content-max))/2));box-shadow:0 1px 0 rgba(23,33,43,.06);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.site-header nav a{position:relative;border:0}
.site-header nav a:after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;background:var(--red);transition:right .22s ease}
.site-header nav a:hover:after,.site-header nav a:focus-visible:after{right:0}
.brand>span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.button{font-weight:700;box-shadow:0 10px 28px rgba(128,37,50,.18);transition:background .2s,border-color .2s,transform .2s,box-shadow .2s}
.button:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(23,33,43,.18)}
.button:focus-visible,.text-link:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}

.hero{min-height:min(860px,calc(100vh - 88px));padding-inline:max(4.5vw,calc((100vw - var(--content-max))/2));background:radial-gradient(circle at 78% 20%,rgba(179,138,74,.10),transparent 30%),var(--paper)}
.hero h1{font-size:clamp(68px,8vw,126px);line-height:.88;max-width:980px}
.hero-intro{max-width:670px;font-size:clamp(20px,1.5vw,24px)}
.hero-availability{display:flex;align-items:center;gap:9px;margin:28px 0 0;color:var(--muted);font-size:13px}
.hero-availability span{width:8px;height:8px;border-radius:50%;background:#287a4c;box-shadow:0 0 0 4px rgba(40,122,76,.12)}
.hero-proof{padding:24px 0 30px}
.proof-mark{font-size:clamp(62px,5vw,82px)}

.capability-strip,.positioning,.work,.project-evidence,.fidget-preview,.studio-project-preview,.services,.studio,.remote-service,.pricing,.process,.faq,.contact,footer{padding-left:max(4.5vw,calc((100vw - var(--content-max))/2));padding-right:max(4.5vw,calc((100vw - var(--content-max))/2))}
.capability-strip{background:#fff;justify-content:center;gap:clamp(22px,4vw,64px);font-size:10px}
.capability-strip span:not(:last-child):after{margin-left:clamp(22px,4vw,64px)}

.section-number{font-size:10px;font-weight:700}
.positioning>div>p,.case-grid>div:last-child,.studio>div:last-child>p{font-family:var(--sans);font-size:18px;line-height:1.72}
.project-stage{border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 70px rgba(0,0,0,.22)}
.reel-slide img{background:#fff}
.deliverables article,.evidence-scope article,.service-list article,.process li{transition:background .2s ease}
.deliverables article:hover{background:rgba(255,255,255,.035)}

.price-grid{gap:18px;border:0}
.price-grid article{border:1px solid rgba(244,240,231,.22)!important;min-height:520px}
.price-grid article:not(.featured-price){background:rgba(255,255,255,.025)}
.featured-price{box-shadow:var(--shadow-soft);transform:translateY(-10px)}
.price-head strong{font-size:40px}
.care-plan{margin-top:18px;border:1px solid rgba(244,240,231,.22)}

.faq details{transition:background .2s ease}
.faq details:hover,.faq details[open]{background:rgba(255,255,255,.55)}
.faq summary,.faq details p{padding-left:18px}
.faq summary:after{right:18px}

.contact form{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.18);padding:clamp(24px,3vw,48px);box-shadow:0 24px 60px rgba(30,8,12,.14)}
.contact input,.contact select{min-height:48px}
.contact textarea{min-height:150px}
footer{border-top:1px solid rgba(255,255,255,.12)}

@media(max-width:1100px){.site-header nav{gap:20px}.site-header nav a{font-size:9px}.hero{grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr)}}
@media(max-width:900px){.hero{grid-template-columns:1fr}.hero-proof{max-width:520px;margin-left:auto}.price-grid{gap:0}.featured-price{transform:none}.capability-strip{justify-content:flex-start;overflow-x:auto}}
@media(max-width:620px){
  html{scroll-padding-top:72px}.site-header{height:70px;padding-inline:18px}.hero{padding:68px 20px 58px;background:var(--paper)}
  .hero h1{font-size:17vw;line-height:.9}.hero-intro{font-size:18px;line-height:1.55;margin-top:28px}.hero-actions{margin-top:32px;gap:22px}.hero-availability{font-size:12px}
  .capability-strip{padding-inline:20px}.positioning,.work,.project-evidence,.fidget-preview,.studio-project-preview,.services,.studio,.remote-service,.pricing,.process,.faq,.contact{padding-left:20px;padding-right:20px}
  .positioning>div>p,.case-grid>div:last-child,.studio>div:last-child>p{font-size:16px}.contact form{padding:22px 18px}.price-head strong{font-size:34px}
}

@media(prefers-reduced-motion:reduce){.button,.site-header nav a:after,.deliverables article,.faq details{transition:none}.button:hover{transform:none}}
