/* =====================================================================
   DARK RENDER — "NEW LOOK" design system (v2)
   Dark cinematic. Loads AFTER style.css and elevates every shared
   component site-wide. Visual-only overrides — no structural changes.
   ===================================================================== */

:root{
  --color-bg:#080808;
  --color-bg-deep:#000;
  --color-bg-elevated:#101010;
  --color-surface:#161616;
  --color-border:rgba(255,255,255,.09);
  --color-border-strong:rgba(255,255,255,.18);
  --color-text:#f6f4f1;
  --color-text-muted:#9a9a98;
  --color-accent:#E84A0A;
  --color-accent-bright:#ff6a20;
  --v2-ease:cubic-bezier(.22,1,.36,1);
  --v2-radius:14px;
}

html{scroll-behavior:smooth;}
body{background:var(--color-bg-deep);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}

/* subtle cinematic vignette over the whole page */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(130% 90% at 50% -10%,transparent 55%,rgba(0,0,0,.55) 100%);}
main,header,footer{position:relative;z-index:2;}

::selection{background:var(--color-accent);color:#fff;}

/* ---------- TYPE ---------- */
h1,h2,h3,.hero-title,.ipw-hero-title{letter-spacing:-.03em;font-weight:700;line-height:.98;}
h2{font-size:clamp(2rem,4.6vw,3.6rem);letter-spacing:-.025em;}
h3{letter-spacing:-.015em;}
.eyebrow{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.34em;text-transform:uppercase;
  color:var(--color-accent);display:inline-flex;align-items:center;gap:10px;}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--color-accent);display:inline-block;}
.section-header-description,.lead,p{color:var(--color-text-muted);}

/* ---------- HEADER ---------- */
.site-header{position:sticky;top:0;padding:16px var(--pad-x);
  background:rgba(8,8,8,.72);backdrop-filter:saturate(140%) blur(16px);-webkit-backdrop-filter:saturate(140%) blur(16px);
  border-bottom:1px solid var(--color-border);z-index:1000;transition:background .3s var(--v2-ease);}
.logo-text{letter-spacing:.16em;font-weight:700;}
.nav-link{font-size:.78rem;letter-spacing:.06em;color:var(--color-text-muted);transition:color .25s var(--v2-ease);}
.nav-link:hover,.nav-link.active{color:var(--color-text);}
.nav-cta{border:1px solid var(--color-border-strong);border-radius:999px;padding:11px 22px;font-size:.74rem;
  letter-spacing:.08em;text-transform:uppercase;transition:all .3s var(--v2-ease);}
.nav-cta:hover{background:var(--color-accent);border-color:var(--color-accent);color:#fff;transform:translateY(-1px);}

/* ---------- BUTTONS ---------- */
.btn-primary,.btn-outline{border-radius:999px;font-family:var(--font-mono);font-size:.76rem;letter-spacing:.1em;
  text-transform:uppercase;padding:15px 30px;transition:all .3s var(--v2-ease);will-change:transform;}
.btn-primary{background:var(--color-accent);color:#fff;border:1px solid var(--color-accent);box-shadow:0 10px 34px -12px var(--color-accent-glow);}
.btn-primary:hover{background:var(--color-accent-bright);border-color:var(--color-accent-bright);transform:translateY(-2px);box-shadow:0 16px 40px -10px var(--color-accent-glow);}
.btn-outline{background:transparent;color:var(--color-text);border:1px solid var(--color-border-strong);}
.btn-outline:hover{border-color:var(--color-accent);color:#fff;background:var(--color-accent-soft);transform:translateY(-2px);}

/* ---------- SECTION RHYTHM ---------- */
.section,.pricing-section,.faq-section,.clients-section,.testimonials-section,.ipw-process,.render-gallery-section{
  padding-top:clamp(64px,9vh,120px);padding-bottom:clamp(64px,9vh,120px);}
.section-header h2{margin-top:10px;}

/* ---------- HERO ---------- */
.hero-title{font-size:clamp(2.6rem,7.2vw,6.4rem);}
.ipw-hero{padding-top:clamp(150px,18vh,220px);}
.hero-video-overlay{background:
  radial-gradient(120% 100% at 50% 0%,transparent 35%,rgba(0,0,0,.7) 100%),
  linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.15) 35%,rgba(0,0,0,.85) 100%) !important;}

/* ---------- CARDS: unified cinematic treatment ---------- */
.cap-card,.tier-card,.darkbg-stat,.ipw-stack-card,.ipw-why-card,.ipw-step{
  border-radius:var(--v2-radius);border:1px solid var(--color-border);
  background:linear-gradient(180deg,var(--color-bg-elevated),var(--color-bg));
  transition:transform .45s var(--v2-ease),border-color .45s var(--v2-ease),box-shadow .45s var(--v2-ease);}
.cap-card:hover,.tier-card:hover,.ipw-stack-card:hover{transform:translateY(-6px);
  border-color:rgba(232,74,10,.5);box-shadow:0 24px 60px -28px rgba(0,0,0,.9),0 0 0 1px rgba(232,74,10,.18) inset;}
.tier-card--featured{border-color:rgba(232,74,10,.55);box-shadow:0 0 0 1px rgba(232,74,10,.3),0 30px 70px -30px rgba(0,0,0,.9);}

/* image tiles (renders, casestudy, portfolio, founder) */
.render-tile,.casestudy-visual,.cap-thumb,.founder-portrait-frame{border-radius:var(--v2-radius);}
.render-tile img,.casestudy-visual img{transition:filter .6s var(--v2-ease),transform .9s var(--v2-ease);}

/* stats band */
.darkbg-stats-inner{border-radius:18px;overflow:hidden;}
.darkbg-stat .n{font-weight:700;letter-spacing:-.03em;}

/* trust band */
.trust-band{background:var(--color-bg);}
.trust-item{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.06em;color:var(--color-text-muted);
  border:1px solid var(--color-border);border-radius:999px;padding:10px 18px;transition:all .3s var(--v2-ease);}
.trust-item:hover{border-color:var(--color-accent);color:var(--color-text);}

/* FAQ */
.faq-item{border:1px solid var(--color-border);border-radius:12px;margin-bottom:10px;overflow:hidden;
  transition:border-color .3s var(--v2-ease);}
.faq-item[open],.faq-item:hover{border-color:var(--color-border-strong);}
.faq-item summary{padding:20px 22px;font-weight:600;cursor:pointer;}

/* CTA banner */
.cta-banner{background:
  radial-gradient(90% 140% at 50% 0%,rgba(232,74,10,.16),transparent 60%),var(--color-bg-deep);
  border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);}
.cta-banner h2{font-size:clamp(2rem,5vw,3.6rem);}

/* ---------- FOUNDER ---------- */
.founder-section{background:linear-gradient(180deg,var(--color-bg-deep),var(--color-bg));}
.founder-portrait-frame{border:1px solid var(--color-border);border-radius:16px;overflow:hidden;}

/* ---------- FOOTER ---------- */
.footer{background:#040404;border-top:1px solid var(--color-border);}
.footer a{transition:color .25s var(--v2-ease);}
.footer a:hover{color:var(--color-accent);}

/* ---------- focus + scrollbar polish ---------- */
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:4px;}
::-webkit-scrollbar{width:11px;height:11px;}
::-webkit-scrollbar-track{background:#000;}
::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:8px;border:2px solid #000;}
::-webkit-scrollbar-thumb:hover{background:var(--color-accent);}

/* keep native cursor (custom cursor removed earlier) */
.cursor,.cursor-trail{display:none !important;}

/* ---------- mobile polish ---------- */
@media(max-width:768px){
  .hero-title{font-size:clamp(2.1rem,10vw,3.4rem);}
  .btn-primary,.btn-outline{padding:14px 24px;}
  .site-header{padding:12px var(--pad-x);}
}