/* V8: bounded layout and interaction corrections. No copy or palette redesign. */
:root{--brand-surface:#101213}
html{scrollbar-gutter:stable;scroll-padding-top:110px}
body{overflow-wrap:break-word}
.header,.footer{background:var(--brand-surface)}
.header{backdrop-filter:none}
.brand{max-width:100%;min-width:0}
/* V9: exact supplied icon + wordmark; crop only the empty surrounding canvas. */



.nav-wrap{min-width:0}
.nav-actions{flex-shrink:0}
.desktop-nav{gap:clamp(18px,2.2vw,32px)}
.desktop-nav a,.mobile-menu a{min-height:44px}
.menu-toggle:focus-visible{outline-offset:3px}
.mobile-menu{overscroll-behavior:contain;max-height:calc(100dvh - 150px);background:var(--brand-surface)}
.hero{min-height:min(860px,calc(100svh - 88px));justify-content:space-between}
.hero-content{padding-block:clamp(48px,6vh,80px) 38px}
.hero h1{font-size:clamp(60px,7vw,100px)}
.hero h1 em{white-space:normal}
.hero-bottom{position:relative;inset:auto;margin-top:auto;margin-bottom:24px;min-height:44px}
.hero-bottom a{align-items:center;min-height:44px}
.hero-proof{flex-wrap:wrap;gap:14px 28px}
.hero-shade{background:linear-gradient(90deg,rgba(10,10,10,.84),rgba(10,10,10,.43) 42%,rgba(10,10,10,.12)),linear-gradient(0deg,rgba(10,10,10,.92),transparent 32%)}
.section-heading,.visual-intro,.detail-grid,.terms-grid,.case-layout,.contact-layout,.closing-grid,.company-story,.process-visual{min-width:0}
.section-heading>*,.visual-intro>*,.detail-grid>*,.terms-grid>*,.case-layout>*,.contact-layout>*,.closing-grid>*,.company-story>*,.process-visual>*,.proof-glimpse>div>*,.article-list>a>*{min-width:0}
.visual-intro{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.visual-intro h1{font-size:clamp(40px,4.25vw,65px);line-height:1.12;text-wrap:balance}
h2,h3{text-wrap:balance}
.full-client-name{overflow-wrap:normal;font-size:clamp(21px,2vw,27px)!important;line-height:1.25!important}
.browser-frame{min-width:0}
.browser-frame>a{display:block;overflow:hidden}
.portfolio-switcher .browser-frame>a{aspect-ratio:8/5;background:#151515}
.portfolio-switcher .browser-frame>a>img{width:100%;height:100%;object-fit:contain}
.portfolio-switcher .project-caption{min-height:220px}
.portfolio-tabs{align-items:stretch}
.portfolio-tabs button{min-height:48px;flex:1;padding:16px;line-height:1.5}
.portfolio-tabs button:first-child{padding-left:16px}
.portfolio-tabs button:focus-visible{outline-offset:-5px}
.browser-frame figcaption{color:#d0d0d0}
.service-mock{height:auto}
.service-mock p{font-size:14px;line-height:1.6}
.mock-label{font-size:12px;min-height:42px;align-items:center}
.mock-domain{overflow-wrap:anywhere}
.intro-mock .website-mock{transform:none}
.intro-mock .service-mock,.intro-mock .browser-frame{box-shadow:0 18px 45px #0003}
.channel-grid .service-mock{height:auto;flex:1}
.channel-grid>article>h3{min-height:2.4em;line-height:1.2}
.social-action{flex-wrap:wrap}
.social-image img{object-position:center}
.process-visual{gap:clamp(36px,6vw,80px)}
.simple-steps p{line-height:1.6}
.client-bar img{object-fit:contain;filter:none}
.case-stats strong{line-height:1.15}
.case-layout{grid-template-columns:minmax(220px,280px) minmax(0,1fr);gap:clamp(40px,6vw,90px)}
.case-layout aside h2{line-height:1.25;overflow-wrap:normal}
.scope-banner .button{flex-shrink:0;max-width:100%}
.article-toc a{min-height:36px;padding:6px 0;margin-top:0}
.article-list h2{line-height:1.3}
.calculator-section{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.calculator-inputs,.calculator-output,.calc-field{min-width:0}
.calculator-inputs{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.calculator-output{background:#202020}
.calculator-output>output{font-size:clamp(32px,4vw,62px);letter-spacing:-.045em;overflow-wrap:anywhere;line-height:1.2}
.calc-results>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto);align-items:start;gap:12px}
.calc-results output{min-width:0;text-align:right;overflow-wrap:anywhere;font-size:18px}
.calc-field input[type=range]{min-height:44px;cursor:pointer}
.calc-field label{font-size:14px;min-height:3em}
.calculator-inputs input:focus-visible{outline-color:var(--accent)}
.audit-dialog{overflow-y:auto;overscroll-behavior:contain;max-height:calc(100dvh - 24px);scrollbar-gutter:stable}
.dialog-inner{padding:42px}
.dialog-close{position:sticky;top:0;margin-left:auto;margin-right:-20px;margin-top:-30px;margin-bottom:-14px;display:block;z-index:2;background:var(--paper);border-radius:50%;right:auto}
.form-grid>*{min-width:0}
.form-grid label{font-size:14px}
.form-grid input,.form-grid textarea{min-height:48px}
.form-status a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.form-status.error{padding:12px;border-left:3px solid #a32b20;background:#a32b200a}
.audit-dialog form[aria-busy=true]{cursor:progress}
.audit-dialog .button:focus-visible,.audit-dialog input:focus-visible,.audit-dialog textarea:focus-visible{outline-color:#684e00}
.audit-dialog:focus{outline:none}
.contact-options strong{line-height:1.4}
.button{text-align:left}
.footer-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr) minmax(0,1fr)}
.footer-grid a{overflow-wrap:anywhere}
.footer-bottom{flex-wrap:wrap}
.no-js-contact{padding:16px;border:1px solid var(--line);margin-block:24px}
@media(max-width:1100px){
  .calculator-inputs{grid-template-columns:minmax(0,1fr)}
  .calc-field label{min-height:0}
  .visual-intro{gap:32px}
  
}
@media(max-width:850px){
  .visual-intro,.company-story,.process-visual{grid-template-columns:minmax(0,1fr)}
  .visual-intro h1{font-size:clamp(42px,7vw,64px)}
  .intro-mock{max-width:640px}
  .channel-grid>article>h3{min-height:0}
  .portfolio-switcher .project-caption{min-height:240px}
}
@media(max-width:800px){
  .hero{min-height:0}
  .hero-content{padding-block:56px 36px}
  .hero h1{font-size:clamp(60px,10vw,84px)}
  .hero-bottom{margin-bottom:22px}
  .case-layout,.calculator-section{grid-template-columns:minmax(0,1fr)}
  .calculator-inputs{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .calculator-output>output{font-size:clamp(32px,7vw,62px)}
  .hero-shade{background:linear-gradient(90deg,#0a0a0ade,#0a0a0a73),linear-gradient(0deg,#0a0a0ae8,transparent 50%)}
  .footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .footer-grid>div:first-child{grid-column:1/-1}
}
@media(max-width:540px){
  html{scroll-padding-top:92px}
  body{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
  .header{height:76px}
  .nav-wrap{gap:14px}
  
  .hero-content{padding-block:38px 28px}
  .hero h1{font-size:clamp(46px,13.8vw,74px);line-height:1.04}
  .hero .eyebrow{font-size:11px;letter-spacing:.1em;margin-bottom:20px}
  .hero-content>p:not(.eyebrow){font-size:16px;line-height:1.65}
  .hero .actions{gap:14px}
  .hero .button{min-height:52px}
  .hero-proof{margin-top:24px;gap:16px 25px}
  .hero-proof b{font-size:22px}
  .hero-bottom{padding-top:14px;gap:4px;margin-bottom:18px;font-size:11px}
  .hero-bottom a{min-height:44px}
  .client-bar{gap:10px}
  .client-bar img{height:52px;padding:5px}
  .page-intro{padding-bottom:44px}
  .breadcrumbs{margin-bottom:34px;gap:8px}
  .visual-intro h1{font-size:clamp(36px,10vw,52px);line-height:1.14}
  .visual-intro .actions{gap:14px}
  .intro-mock{width:100%}
  .portfolio-tabs button,.portfolio-tabs button:first-child{font-size:14px;min-height:48px;padding:12px 14px}
  .portfolio-switcher .project-caption{min-height:0;padding-bottom:30px}
  .project-caption h3{font-size:28px;line-height:1.2}
  .project-caption .button{width:100%}
  .browser-top>span:nth-child(2){font-size:10px}
  .browser-top{gap:8px}
  .browser-frame figcaption{font-size:11px;line-height:1.55}
  .channel-grid>article>h3{min-height:0;font-size:28px}
  .channel-grid .service-mock{flex:auto}
  .channel-grid .text-link{min-height:44px}
  .social-image>span{font-size:22px}
  .scope-banner{padding:26px 22px}
  .scope-banner h2{font-size:27px;line-height:1.2;overflow-wrap:normal}
  .case-layout dl{grid-template-columns:88px minmax(0,1fr);gap:10px 16px}
  .case-layout dd{overflow-wrap:anywhere}
  .case-stats strong{font-size:clamp(30px,9vw,40px)}
  .calculator-inputs{grid-template-columns:minmax(0,1fr);padding:26px 22px}
  .calculator-output{padding:28px 22px}
  .calculator-output>output{font-size:clamp(29px,8.8vw,46px)}
  .calc-results output{font-size:16px}
  .calc-results span{font-size:13px}
  .dialog-inner{padding:26px 20px}
  .dialog-close{margin-right:-10px;margin-top:-14px;margin-bottom:-10px}
  .audit-dialog h2{font-size:28px;line-height:1.2}
  .form-grid{grid-template-columns:minmax(0,1fr)}
  .audit-dialog{width:calc(100% - 20px)}
  .mobile-cta{gap:8px;padding-inline:12px}
  .mobile-cta>a,.mobile-cta>.button{min-height:48px;font-size:13px}
  .mobile-cta>.button{gap:14px;padding-inline:15px}
  .footer-grid{gap:30px 22px}
  .footer-bottom{gap:16px;line-height:1.6}
  .footer-bottom>div{flex-wrap:wrap;gap:22px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.service-mock *,.website-mock *{animation:none!important;transition:none!important}}
@media print{body{padding-bottom:0}.hero{min-height:0}.hero-bottom{display:none}.portfolio-switcher .work-panel[hidden]{display:block!important}.portfolio-tabs{display:none}}

/* Clean brand lockup: transparent icon + live text wordmark (replaces the cropped PNG). */
.brand{display:inline-flex;align-items:center;gap:11px;min-width:0;max-width:100%}
.brand .brand-icon{width:auto;height:34px;flex:none;object-fit:contain;filter:none;display:block}
.brand .brand-word{display:flex;flex-direction:column;line-height:.98;letter-spacing:.14em;text-transform:uppercase;font-weight:700;font-size:15px}
.brand .brand-word b{font-weight:700;color:var(--white)}
.brand .brand-word b:last-child{color:var(--accent)}
.footer .brand .brand-icon{height:38px}
.footer .brand .brand-word{font-size:17px;letter-spacing:.13em}
@media(max-width:1100px){.brand .brand-icon{height:32px}.brand .brand-word{font-size:14px}}
@media(max-width:540px){.brand{gap:9px}.brand .brand-icon{height:30px}.brand .brand-word{font-size:13px;letter-spacing:.12em}.footer .brand .brand-icon{height:34px}.footer .brand .brand-word{font-size:15px}}

/* Footer: standalone stacked wordmark, no icon. */
.footer-brand{display:inline-flex}
.footer-brand:hover{color:inherit}
.footer .footer-wordmark{display:flex;flex-direction:column;line-height:.92;text-transform:uppercase;font-weight:900;letter-spacing:-.02em;font-size:38px}
.footer .footer-wordmark b{font-weight:900;color:var(--white)}
.footer .footer-wordmark b:last-child{color:var(--accent)}
.footer-brand:hover .footer-wordmark b{color:var(--white)}
.footer-brand:hover .footer-wordmark b:last-child{color:var(--accent)}
@media(max-width:1100px){.footer .footer-wordmark{font-size:34px}}
@media(max-width:540px){.footer .footer-wordmark{font-size:30px;letter-spacing:-.015em}}
