/* V21.1 — production responsive hardening across every public page */
html{width:100%;max-width:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{width:100%;max-width:100%;min-width:0;overflow-x:clip}
@supports not (overflow:clip){body{overflow-x:hidden}}
*,*::before,*::after{box-sizing:border-box}
main,header,footer,section,article,aside,nav,form,fieldset,figure,
.wrap,.container,.hero-inner,.hero-grid,.split,.cta-inner,.footer-grid,
.grid-2,.grid-3,.grid-4,.team-grid,.deal-grid,.editorial-grid,.archive-grid,
.youtube-video-grid,.valuation-form-grid,.valuation-impact-grid,.valuation-output-grid,
.vix-gap-grid,.vix-output-grid,.vix-proof-grid,.vix-layer-grid,.vix-decision-grid,
.vix-assets-grid,.vix-process-grid,.vix-track-record-grid{min-width:0}
img,picture,video,canvas,svg{max-width:100%;height:auto}
iframe{display:block;width:100%;max-width:100%;border:0}
table{max-width:100%}
pre,code{white-space:pre-wrap;overflow-wrap:anywhere}
h1,h2,h3,h4,h5,h6,p,li,a,span,strong,label,small,address{overflow-wrap:break-word;word-break:normal}
input,select,textarea,button{min-width:0;max-width:100%;font:inherit}
textarea{resize:vertical}

/* Consistent page gutters, including safe areas. */
.wrap{
  width:100%!important;
  max-width:1292px!important;
  margin-inline:auto!important;
  padding-left:max(clamp(20px,3.6vw,56px),env(safe-area-inset-left,0px))!important;
  padding-right:max(clamp(20px,3.6vw,56px),env(safe-area-inset-right,0px))!important;
}

/* Prevent decorative layers from affecting measured layout width. */
.hero,.dark,.jade,.valuation-awareness,.valuation-form-section,
.buy-asset-classes,.about-profile-bg,.about-expertise-bg,.about-notable-bg,
.team-how-bg,.team-pathways-bg,.media-stories-bg,.brief-thesis-bg,
.home-private-brief-bg,.vix-gap-section,.vix-output-section{overflow:clip;contain:paint}

/* Mid-width tablets: avoid cramped three- and four-column cards. */
@media (min-width:700px) and (max-width:899px){
  .grid-3,.grid-4,.deal-grid,.vix-proof-grid,.vix-decision-grid,.vix-assets-grid,
  .vix-track-record-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .grid-3>*:last-child:nth-child(odd),.vix-proof-grid>*:last-child:nth-child(odd),
  .vix-decision-grid>*:last-child:nth-child(odd),.vix-assets-grid>*:last-child:nth-child(odd){grid-column:1/-1}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cta-inner{grid-template-columns:1fr!important;gap:28px!important}
  .cta-actions{justify-content:flex-start!important}
}

/* Keep full desktop navigation only when there is genuinely enough width. */
@media (min-width:980px) and (max-width:1129px){
  .topbar .navlinks{display:none!important}
  .topbar .mobile-menu{display:block!important}
}

@media (max-width:767px){
  .wrap{padding-left:max(20px,env(safe-area-inset-left,0px))!important;padding-right:max(20px,env(safe-area-inset-right,0px))!important}
  section{scroll-margin-top:76px}
  .grid-2,.grid-3,.grid-4,.split,.deal-grid,.editorial-grid,.archive-grid,
  .youtube-video-grid,.valuation-form-grid,.vix-gap-grid,.vix-output-grid,
  .vix-proof-grid,.vix-layer-grid,.vix-decision-grid,.vix-assets-grid,
  .vix-process-grid,.vix-track-record-grid,.footer-grid{grid-template-columns:minmax(0,1fr)!important}
  .grid-3>*:last-child,.vix-proof-grid>*:last-child,.vix-decision-grid>*:last-child,
  .vix-assets-grid>*:last-child{grid-column:auto!important}
  .hero-actions,.hero-cta,.cta-actions,.member-actions,.private-brief-actions,
  .valuation-awareness-actions{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%}
  .hero-actions .btn,.hero-cta .btn,.cta-actions .btn,.member-actions .btn,
  .private-brief-actions .btn,.valuation-awareness-actions .btn{width:100%!important;max-width:100%!important;white-space:normal!important;text-align:center!important;line-height:1.3!important}
  .card,.member,.editorial,.archive-card,.youtube-video-copy,.legal-toc,.legal-callout{padding-left:clamp(20px,6vw,28px);padding-right:clamp(20px,6vw,28px)}
  .process-item,.vix-process-grid article,.vix-infra-list article{grid-template-columns:42px minmax(0,1fr)!important;gap:14px!important}
  .photo-panel,.photo-panel img{min-height:clamp(360px,110vw,470px)!important}
  .photo-caption{left:18px!important;right:18px!important;bottom:18px!important}
  .valuation-impact-grid{grid-template-columns:minmax(0,1fr)!important;gap:1px!important}
  .valuation-form,.page-valuation .valuation-form{width:100%!important;max-width:100%!important;padding:0!important}
  .valuation-form .two,.page-valuation .valuation-form .two{grid-template-columns:minmax(0,1fr)!important;column-gap:0!important}
  .valuation-form input,.valuation-form select,.valuation-form textarea{width:100%!important;font-size:16px!important}
  .page-valuation .valuation-form-copy h2,.valuation-awareness-copy h2{max-width:none!important}
  .page-valuation .vix-form-section::before,.valuation-awareness::before{right:-300px!important}
  .youtube-video-frame,.youtube-video-poster{aspect-ratio:16/9}
  .footer-bottom,.f-bot{display:grid!important;grid-template-columns:1fr!important;justify-content:start!important;gap:10px!important;text-align:left!important}
}

@media (max-width:479px){
  .wrap{padding-left:max(18px,env(safe-area-inset-left,0px))!important;padding-right:max(18px,env(safe-area-inset-right,0px))!important}
  h1{font-size:clamp(36px,11.5vw,48px)!important;line-height:1.04!important}
  h2{font-size:clamp(29px,9vw,39px)!important}
  .eyebrow{letter-spacing:.16em!important;line-height:1.5!important}
  .topbar .nav,.nav{gap:8px!important}
  .brand{min-width:0!important;white-space:normal!important}
  .brand span{display:block!important}
  .nav-cta{display:none!important}
  .stats-grid,.proof-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .stat,.proof-cell{min-width:0!important;padding-left:12px!important;padding-right:12px!important}
  .btn{min-height:48px!important;padding-left:16px!important;padding-right:16px!important}
  .floating-whatsapp{width:52px!important;height:52px!important;right:12px!important;bottom:12px!important}
  .mobile-menu-panel{left:auto!important;right:max(12px,env(safe-area-inset-right,0px))!important;width:min(300px,calc(100vw - 24px))!important}
}

@media (max-width:339px){
  .wrap{padding-left:max(14px,env(safe-area-inset-left,0px))!important;padding-right:max(14px,env(safe-area-inset-right,0px))!important}
  h1{font-size:34px!important}
  .stats-grid,.proof-grid{grid-template-columns:minmax(0,1fr)!important}
}

@media (pointer:coarse){
  a.btn,button,summary,input,select{min-height:44px}
}

@media (orientation:landscape) and (max-height:600px) and (max-width:980px){
  section{padding-top:48px!important;padding-bottom:48px!important}
  .hero-grid,.hero-inner{min-height:auto!important;padding-top:44px!important;padding-bottom:48px!important}
  .mobile-menu-panel,.nav-links.is-open{max-height:calc(100dvh - 70px)!important;overflow-y:auto!important;overscroll-behavior:contain}
}


/* V22.1 — retain the full Alvin Choo identity lock-up in every responsive header. */
@media (max-width:979px){
  .topbar .nav,
  header .nav{
    min-height:74px!important;
  }
  .brand{
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    justify-content:center!important;
    min-width:0!important;
    max-width:min(66vw,340px)!important;
    line-height:1.04!important;
    white-space:normal!important;
  }
  .brand span{
    display:block!important;
    margin-top:4px!important;
    color:var(--brass-lt)!important;
    font-family:var(--ui)!important;
    font-size:clamp(7.5px,1.25vw,9px)!important;
    font-weight:500!important;
    letter-spacing:clamp(.12em,.35vw,.20em)!important;
    line-height:1.3!important;
    overflow:visible!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
  }
}

@media (max-width:767px){
  .topbar .nav,
  header .nav{
    min-height:72px!important;
    height:auto!important;
  }
  .brand{
    max-width:calc(100% - 56px)!important;
    font-size:clamp(17px,5.4vw,21px)!important;
  }
  .brand span{
    font-size:clamp(7px,2vw,8.5px)!important;
    letter-spacing:clamp(.10em,.42vw,.16em)!important;
  }
  .topbar .nav-cta{display:none!important}
}

@media (max-width:359px){
  .brand{
    max-width:calc(100% - 52px)!important;
    font-size:16px!important;
  }
  .brand span{
    font-size:6.8px!important;
    letter-spacing:.08em!important;
  }
}

/* V22.2 — Valuation / wider body of work: preserve the desktop editorial
   composition across tablet and mobile. Copy remains on the left, Alvin's
   cut-out portrait remains on the right, and the mobile introduction expands
   beneath both columns for readability. */
@media (min-width:768px) and (max-width:979px){
  .page-valuation .vix-track-record-head{
    grid-template-columns:minmax(0,1fr) clamp(220px,30vw,282px)!important;
    align-items:end!important;
    column-gap:clamp(24px,4vw,38px)!important;
    row-gap:18px!important;
  }
  .page-valuation .vix-track-record-copy{
    max-width:none!important;
    min-width:0!important;
  }
  .page-valuation .vix-track-record-head h3{
    max-width:16ch!important;
    font-size:clamp(39px,5.6vw,50px)!important;
    line-height:1.07!important;
  }
  .page-valuation .vix-track-record-intro{
    max-width:64ch!important;
    font-size:14.5px!important;
    line-height:1.72!important;
  }
  .page-valuation .vix-track-record-head-portrait{
    width:100%!important;
    max-width:282px!important;
    align-self:end!important;
    justify-self:end!important;
    margin:0!important;
  }
}

@media (min-width:521px) and (max-width:767px){
  .page-valuation .vix-track-record-head{
    grid-template-columns:minmax(0,1fr) clamp(154px,29vw,205px)!important;
    align-items:end!important;
    column-gap:clamp(18px,3.8vw,28px)!important;
    row-gap:16px!important;
    margin-bottom:30px!important;
  }
  .page-valuation .vix-track-record-copy{
    max-width:none!important;
    min-width:0!important;
  }
  .page-valuation .vix-track-record-head h3{
    max-width:14ch!important;
    font-size:clamp(34px,6.15vw,43px)!important;
    line-height:1.07!important;
  }
  .page-valuation .vix-track-record-intro{
    max-width:58ch!important;
    font-size:14px!important;
    line-height:1.7!important;
  }
  .page-valuation .vix-track-record-head-portrait{
    width:100%!important;
    max-width:205px!important;
    align-self:end!important;
    justify-self:end!important;
    margin:0!important;
  }
}

@media (max-width:520px){
  .page-valuation .vix-track-record-head{
    grid-template-columns:minmax(0,1fr) clamp(104px,29vw,126px)!important;
    grid-template-rows:auto auto auto!important;
    align-items:end!important;
    column-gap:14px!important;
    row-gap:10px!important;
    margin-bottom:28px!important;
  }
  .page-valuation .vix-track-record-copy{
    display:contents!important;
  }
  .page-valuation .vix-track-record-copy>.eyebrow{
    grid-column:1!important;
    grid-row:1!important;
    align-self:end!important;
    margin:0 0 2px!important;
  }
  .page-valuation .vix-track-record-head h3{
    grid-column:1!important;
    grid-row:2!important;
    align-self:start!important;
    max-width:none!important;
    margin:5px 0 0!important;
    font-size:clamp(28px,8vw,34px)!important;
    line-height:1.055!important;
  }
  .page-valuation .vix-track-record-head-portrait{
    grid-column:2!important;
    grid-row:1 / span 2!important;
    width:100%!important;
    max-width:126px!important;
    align-self:end!important;
    justify-self:end!important;
    margin:0!important;
  }
  .page-valuation .vix-track-record-intro{
    grid-column:1 / -1!important;
    grid-row:3!important;
    max-width:none!important;
    margin:13px 0 0!important;
    font-size:14px!important;
    line-height:1.68!important;
  }
}

@media (max-width:359px){
  .page-valuation .vix-track-record-head{
    grid-template-columns:minmax(0,1fr) 96px!important;
    column-gap:11px!important;
  }
  .page-valuation .vix-track-record-head h3{
    font-size:27px!important;
  }
  .page-valuation .vix-track-record-head-portrait{
    max-width:96px!important;
  }
}