/* Home page only (home.hbs), new brand approved 2026-10-29.
   Generated by newbrand/to_theme.py from newbrand/style.css; tokens, nav,
   footer and buttons come from mv-chrome.css. Source sets html to 62.5%;
   this page is px/clamp throughout, so reset it here only. */
html{font-size:100%;}
/* The Self-Transforming Leader, new brand. Every value comes from the design
   system (tokens.json) and happy-brand-kit/brand/tokens.yaml.
   Layout: full-width bands (concept 1), aligned as on the live site. */
*{box-sizing:border-box;border-radius:0;}
html{scroll-padding-top:96px;}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth;}}
body{margin:0;background:var(--light);color:var(--on-light);font-family:var(--body);-webkit-font-smoothing:antialiased;}
p,h1,h2,h3,ul,ol{margin:0;text-wrap:pretty;}
img{display:block;max-width:100%;}
a{color:var(--accent);text-decoration:none;}
a:hover{color:var(--accent-hover);}
input,button{font:inherit;}
:focus-visible{outline:2px solid var(--on-light);outline-offset:2px;}
.band{padding-left:var(--edge);padding-right:var(--edge);}
.num{font-weight:600;}
.mark{font-weight:600;}

/* Bands: every section runs edge to edge, one after another. Plaster bands
   carry the reading; ink bands carry a statement or a client's words; there is no surprise dark on this page. Two darks never touch: plaster sits between them. */
.band.plaster,.band.ink,.band.teal{padding-top:var(--s7);padding-bottom:var(--s7);}
.band.plaster + .band.plaster{padding-top:0;}
.band.ink{background:var(--field);color:var(--on-field);}
.band.teal{background:var(--teal);color:var(--on-teal);}
.band.ink .mute,.band.teal .mute{color:var(--mute-field);}
.band.ink :focus-visible,.band.teal :focus-visible{outline-color:var(--on-field);}
/* Alignment as on the live site: single-column sections sit in a centred
   780px column (text inside it left-aligned); the hero, About and the
   newsletter put the copy beside a 372px side column. */
.in{display:flex;flex-direction:column;gap:var(--s4);max-width:var(--measure);margin-left:auto;margin-right:auto;width:100%;}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,var(--col-side));gap:0 var(--col-gap);align-items:start;max-width:none;}
.split > .in{margin:0;}
.band.split{padding-left:max(var(--gutter), calc((100% - var(--frame)) / 2));padding-right:max(var(--gutter), calc((100% - var(--frame)) / 2));}
.side{display:flex;flex-direction:column;gap:var(--s3);}
.title-band{padding-top:var(--s6);padding-bottom:var(--s6);border-bottom:1px solid var(--on-light);container-type:inline-size;}
/* Sized to the band's width so the headline sits on two balanced lines at
   desktop and tablet widths; on a phone it wraps, never mid-word. */
.title-band .hero-title{text-align:center;margin:0 auto;font-size:clamp(32px,4.5cqi,60px);line-height:1.12;text-wrap:balance;}
.nw{white-space:nowrap;}
.hero-title em{font-style:italic;font-weight:400;}
.hero{padding-top:var(--s6);padding-bottom:var(--s7);}
/* Case studies: ink section; outcomes are plaster boxes beside each story */
.cases{display:flex;flex-direction:column;}
.cases-head{display:flex;flex-direction:column;gap:var(--s4);max-width:1000px;padding-bottom:var(--s6);}
.case-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,var(--col-side));gap:var(--s5) var(--col-gap);
  align-items:start;border-top:1px solid var(--hair-field);padding:var(--s5) 0;}
.case-row .case{max-width:var(--measure);}
.case-row + .case-row{border-top:1px solid var(--hair-field);}
.cases-close{border-top:1px solid var(--hair-field);padding-top:var(--s5);display:flex;flex-direction:column;gap:var(--s5);}
.cases-close .body{max-width:var(--measure);}
.outcome-box{background:var(--light);color:var(--on-light);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s2);}
.band.ink .outcome-box .mute{color:var(--mute-light);}
.outcome-box :focus-visible{outline-color:var(--on-light);}
.case{display:flex;flex-direction:column;gap:var(--s4);}
.photo{width:100%;aspect-ratio:420/620;overflow:hidden;}
.photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;}
.outcome{padding-top:var(--s2);}
.strong{font-weight:500;}
.h-quote{font-family:var(--display);font-weight:400;font-size:var(--t-statement);line-height:1.3;letter-spacing:-0.015em;}

/* Type */
.hero-title{font-family:var(--display);font-weight:400;font-size:var(--t-hero);line-height:1.1;letter-spacing:-0.02em;text-wrap:balance;}
.h-offer{font-family:var(--display);font-weight:400;font-size:var(--t-offer);line-height:1.1;letter-spacing:-0.02em;}
.h-opening{font-family:var(--display);font-weight:400;font-size:var(--t-opening);line-height:1.2;letter-spacing:-0.02em;}
.h-statement{font-family:var(--display);font-weight:400;font-size:var(--t-statement);line-height:1.3;letter-spacing:-0.015em;}
.h-tile{font-family:var(--display);font-weight:400;font-size:var(--t-tile);line-height:1.3;letter-spacing:-0.015em;}
.h-nl{font-family:var(--display);font-weight:400;font-size:var(--t-nl);line-height:1.2;letter-spacing:-0.02em;}
.lead{font-size:var(--t-lead);line-height:1.45;}
.body{font-size:var(--t-body);line-height:1.68;}
.mute{font-size:var(--t-small);line-height:1.55;color:var(--mute-light);}
.note{font-size:var(--t-body);line-height:1.55;color:var(--mute-light);}
.row-h{font-size:var(--t-row);line-height:1.3;font-weight:600;letter-spacing:-0.012em;}
.row-h .num{color:var(--accent);}

/* Hero bits */
.chips{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--s5);}
.chip{font-size:var(--t-body);line-height:1.4;border-top:1px solid var(--hair-light);padding:var(--s3) 0;}
.chip:nth-last-of-type(-n+2){border-bottom:1px solid var(--on-light);}
.hero-quote{border-top:1px solid var(--hair-light);padding-top:var(--s4);}
.hero-quote p{font-size:var(--t-body);line-height:1.55;}
.hero-quote cite{font-style:normal;color:var(--mute-light);}

/* Rows inside a band */
.rows{list-style:none;padding:0;display:flex;flex-direction:column;}
.rows > *{border-top:1px solid var(--hair-light);padding:var(--s4) 0;display:flex;flex-direction:column;gap:var(--s2);}
.rows > :last-child{border-bottom:1px solid var(--on-light);}
.rows.tight > *{padding:var(--s3) 0;}
.goals-h{padding-top:var(--s5);}
.steps-label{padding-top:var(--s3);}

/* Blog list */
.post-title{color:var(--on-light);}
.post-title:hover{color:var(--accent);}

/* Contact page */
.contact-form{display:flex;flex-direction:column;gap:var(--s4);}
.contact-form label{display:flex;flex-direction:column;gap:var(--s2);font-weight:600;font-size:var(--t-body);}
.contact-form input,.contact-form textarea{font:inherit;font-weight:400;font-size:var(--t-body);padding:var(--s3);border:1px solid var(--on-light);background:var(--light);color:var(--on-light);width:100%;}
.contact-form textarea{min-height:200px;resize:vertical;}
.contact-form button{align-self:flex-start;font:inherit;font-weight:600;font-size:var(--t-body);background:var(--accent);color:var(--on-accent);border:0;padding:var(--s3) var(--s5);cursor:pointer;}
.contact-form button:hover{background:var(--accent-hover);}

/* Offer */
.price{font-size:var(--t-row);line-height:1.3;letter-spacing:-0.014em;}
.price strong{font-weight:600;}
.price .num{color:var(--accent);}
.offer-list{display:flex;flex-direction:column;gap:var(--s3);padding-left:1.2em;}
.offer-list li{font-size:var(--t-body);line-height:1.55;}
.offer-list li::marker{color:var(--accent);}

/* Newsletter: the closing band, always ink */
.nl.split{align-items:center;}
.nl-form{display:flex;flex-direction:column;gap:var(--s3);max-width:480px;}
.nl-input{font-size:var(--t-body);line-height:1.3;height:56px;padding:0 var(--s3);border:1px solid var(--mute-field);background:var(--field);color:var(--on-field);width:100%;}
.nl-input::placeholder{color:var(--mute-field);}
.nl-btn{font-size:var(--t-body);line-height:1.3;height:56px;font-weight:600;padding:0;border:0;background:var(--accent);color:var(--on-accent);width:100%;cursor:pointer;}
.nl-btn:hover{background:var(--accent-hover);}

/* Smaller screens */
/* Same width tiers as the live site: the side column narrows before the page goes to one column. */
@media (max-width:1180px){:root{--gutter:56px;--col-side:260px;--col-gap:40px;}}
@media (max-width:980px){:root{--gutter:48px;}
  .case-row{grid-template-columns:minmax(0,1fr);}
  .split{grid-template-columns:minmax(0,1fr);}
  .split > .side{order:-1;margin-bottom:var(--s5);max-width:420px;}
  .nl.split > .side{order:0;margin-top:var(--s5);max-width:none;}
  .photo{aspect-ratio:4/5;}}
@media (max-width:760px){.nav-links > a{display:none;}}
@media (max-width:680px){
  :root{--gutter:24px;}
  .band.plaster,.band.ink,.band.teal{padding-top:var(--s6);padding-bottom:var(--s6);}
  .band.plaster + .band.plaster{padding-top:0;}
  .title-band{padding-top:var(--s5);padding-bottom:var(--s5);}
  .hero{padding-top:var(--s5);padding-bottom:var(--s6);}
  .case-row{grid-template-columns:minmax(0,1fr);}
  .chips{grid-template-columns:minmax(0,1fr);}
  .chip:nth-last-of-type(2){border-bottom:none;}
  .btn{display:block;text-align:center;white-space:normal;}
  .nav .btn-sm{display:inline-block;font-size:15px;white-space:nowrap;padding:var(--s2) var(--s3);}
}


/* Ghost members form states */
.nl-form.loading .nl-btn{opacity:.6;cursor:default;}
.nl-done{display:none;font-size:var(--t-body);line-height:1.5;color:var(--on-field);}
.nl-form.success .nl-done{display:block;}
.nl-form.success .nl-input,.nl-form.success .nl-btn{display:none;}
.nl-err{font-size:var(--t-small);line-height:1.5;color:var(--on-field);}
.nl-err:empty{display:none;}