/* Improvement pass (review branch). Loaded after style.css and revision.css.
   Direction: every opening screen answers the visitor's first question, then the page proves it.
   Palette, logo and type family are unchanged; only scale, spacing and structure move. */

:root{--ink:#3c5266;--rule:#c4d9df;--mist:#eaf4f5;--aqua-ink:#076e77}

/* ---- Readability: body copy at a comfortable size and measure ---- */
.split p,.support-path p,.form-layout>div>p{font-size:16px;line-height:1.7;color:var(--ink);max-width:62ch}
.service-grid p,.process p{font-size:15px;line-height:1.65;color:var(--ink)}
details p{font-size:15px;line-height:1.7;color:var(--ink)}
summary{font-size:16px}
.section-intro{font-size:16px;line-height:1.7;max-width:68ch}
.contact p,.contact-next p{font-size:15px;color:var(--ink)}
.story-heading>p:not(.eyebrow),.story-more{font-size:16px;line-height:1.7;color:var(--ink);max-width:66ch}
.route-card p{font-size:14px;line-height:1.6}
.closer-cards p:not(.eyebrow){font-size:15px;line-height:1.7}
.founder-bridge p{font-size:16px;line-height:1.75}
.statement p{font-size:16px}
.product p{font-size:14px;line-height:1.6}
.form-note{font-size:13px;line-height:1.6;color:#53667a}

/* ---- Rhythm: trim gaps that interrupt the journey ---- */
.section{padding:68px 0}
.page-hero{padding:64px 0 60px}

/* ---- Hero answer panel: the page's first question, answered in the opening screen ---- */
.page-hero.has-answer .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.85fr);gap:56px;align-items:center}
.page-hero.has-answer h1{max-width:none}
.hero-text{min-width:0}
.hero-text .actions{display:flex;flex-wrap:wrap;gap:12px}
.hero-answer{background:#ffffff;color:var(--navy);border-radius:14px;padding:30px 32px;box-shadow:0 18px 50px #00101f55;min-width:0}
.answer-label{font-size:13px;font-weight:700;color:var(--aqua-ink);margin:0 0 6px}
.answer-sub{font-size:14px;color:#53667a;margin:4px 0 0}
.answer-price{font-size:clamp(64px,7vw,96px);font-weight:800;letter-spacing:-4px;line-height:1;margin:6px 0 0;color:var(--navy)}
.answer-list{list-style:none;margin:22px 0 0;padding:18px 0 0;border-top:1px solid var(--rule);display:grid;gap:10px}
.answer-list li{font-size:15px;line-height:1.45;padding-left:28px;position:relative}
.answer-list li:before,.ticks li:before{content:"";position:absolute;left:2px;top:.35em;width:13px;height:7px;border-left:2.5px solid var(--aqua-ink);border-bottom:2.5px solid var(--aqua-ink);transform:rotate(-45deg)}
.answer-routes{list-style:none;margin:10px 0 0;padding:0}
.answer-routes li+li{border-top:1px solid var(--rule)}
.answer-routes a{display:flex;flex-direction:column;gap:2px;padding:14px 28px 14px 0;color:var(--navy);text-decoration:none;position:relative}
.answer-routes a:after{content:"↓";position:absolute;right:4px;top:50%;transform:translateY(-50%);color:var(--aqua-ink);font-weight:700}
.answer-routes span{font-size:14px;color:#53667a}
.answer-routes strong{font-size:17px}
.answer-routes a:hover strong{color:var(--aqua-ink)}
.answer-routes a:focus-visible{outline:3px solid #087f88;outline-offset:2px;border-radius:4px}
.answer-foot{margin:12px 0 0;padding-top:14px;border-top:1px solid var(--rule);font-size:14px;font-weight:700}
.person-answer{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:center}
.person-answer img{width:150px;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:10px;display:block}
.person-name{font-size:20px;font-weight:700;margin:0 0 8px}
.person-answer p:not(.answer-label):not(.person-name){font-size:15px;line-height:1.6;color:#42586c;margin:0}
.person-answer .text-link{margin-top:14px;color:var(--aqua-ink)}
.contact-answer .direct-email a,.contact-answer .support-email a{font-size:clamp(18px,1.7vw,22px);font-weight:700;color:var(--navy);text-decoration:underline;text-decoration-color:var(--aqua);text-underline-offset:5px;overflow-wrap:anywhere}
.contact-answer .direct-email{margin:4px 0 18px}
.contact-answer .support-email{margin:4px 0 0}
.contact-answer .support-email a{font-size:17px}

/* ---- Websites: what £500 covers ---- */
.included{background:#ffffff;border-top:1px solid #dbe8ec;border-bottom:1px solid #dbe8ec}
.included-head{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px 64px;align-items:start;margin-bottom:40px}
.included-head h2{grid-row:span 2;font-size:clamp(32px,3.4vw,46px)}
.included-head p{font-size:17px;line-height:1.7;color:var(--ink);margin:0;max-width:60ch}
.included-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;border-top:2px solid var(--navy);padding-top:32px}
.included-col h3{font-size:20px;margin:0 0 18px;letter-spacing:-.3px}
.ticks,.plain-list{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.ticks li,.plain-list li{font-size:16px;line-height:1.6;color:var(--ink);position:relative}
.ticks li{padding-left:30px}
.ticks strong,.plain-list strong{color:var(--navy)}
.own-note{margin-top:28px;padding:22px 24px;background:var(--mist);border-radius:10px}
.own-note h3{font-size:18px;margin:0 0 6px}
.own-note p{font-size:15px;line-height:1.65;color:var(--ink);margin:0}
.selector-final{background:#dceff0}
.site-showcase figcaption{font-size:13px}
.story-more{margin:28px 0 0}

/* ---- Business support: heading clears the rule below it ---- */
.grid-title{margin-bottom:36px!important}

/* ---- Digital tools: what each tool does ---- */
.product-points{list-style:none;margin:2px 0 14px;padding:0;display:grid;gap:8px}
.product-points li{font-size:14px;line-height:1.5;color:#d6e2ea;padding-left:18px;position:relative}
.product-points li:before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--aqua)}
.product .product-runs{font-size:13px;color:#9fb6c3;margin:0 0 20px}
.product[id]{scroll-margin-top:24px}
.tools .section-intro{color:#c3d3dd}

/* ---- Home: founder philosophy with the genuine portrait ---- */
.closer-cards{grid-template-columns:1fr}
.story-banner.with-portrait{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px;align-items:center}
.story-portrait{width:220px;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:12px;display:block;position:relative}
.story-copy{display:flex;flex-direction:column;align-items:flex-start;max-width:720px;position:relative}

@media(max-width:1150px){
  .page-hero.has-answer .wrap{gap:36px;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr)}
  .hero-answer{padding:26px}
}
@media(max-width:900px){
  .page-hero.has-answer .wrap{grid-template-columns:1fr;gap:32px}
  .hero-answer{max-width:560px}
  .included-head,.included-grid{grid-template-columns:1fr;gap:28px}
  .included-head h2{grid-row:auto}
}
@media(max-width:700px){
  .section{padding:48px 0}
  .page-hero{padding:40px 0 44px}
  .split p,.support-path p,.form-layout>div>p,.story-heading>p:not(.eyebrow),.story-more,.founder-bridge p{font-size:15px}
  .route-card p,.service-grid p,.process p,details p,.contact p{font-size:15px}
  .hero-answer{padding:22px}
  .answer-price{letter-spacing:-3px}
  .person-answer{grid-template-columns:96px minmax(0,1fr);gap:16px}
  .person-answer img{width:96px}
  .person-name{font-size:18px}
  .included-grid{padding-top:24px}
  .ticks li,.plain-list li{font-size:15px}
  .story-banner.with-portrait{grid-template-columns:1fr;gap:24px}
  .story-portrait{width:140px}
  .product p,.product-points li{font-size:14px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Disclosures and the ownership promise stay readable */
.art-note{font-size:12px!important;line-height:1.6;color:#a9bfcc}
.ownership-note p{font-size:14px!important}

/* ---- Content-driven pieces (rendered by cms/build.cjs) ---- */
.vat-note{font-size:14px;font-weight:600;color:var(--aqua-ink);margin:6px 0 0}
.home-offer .vat-note{margin:0 0 10px}
.included-head .vat-note{font-size:15px;margin:0}
.product-also{font-size:13px;color:#9fb6c3;margin:-8px 0 18px}
.product-also a{color:#a2e6e7;text-decoration:underline;text-underline-offset:3px}
.product-video{margin:0 0 20px}
.product-video video{width:100%;border-radius:8px;display:block;background:#02101f}
.product-video figcaption{font-size:12px;color:#9fb6c3;margin-top:6px}
.product-art video{width:100%;height:100%;object-fit:cover;display:block}
.products.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.products.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.products.four{grid-template-columns:1fr}}
#form-status.form-status-success{color:#0b6b3a;font-weight:600}
#form-status.form-status-error{color:#a3231b;font-weight:600}
#form-status a{color:inherit;text-decoration:underline}
.form-layout button:disabled{opacity:.7;cursor:progress}

/* Case studies */
.case-study+.case-study{border-top:1px solid var(--rule)}
.case-head{margin-bottom:28px}
.case-who{font-size:14px;font-weight:700;color:var(--aqua-ink);margin:0 0 8px}
.case-head h2{max-width:24ch}
.case-shots{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:0 0 32px}
.case-shot{margin:0}
.case-shot img{width:100%;height:auto;border-radius:10px;border:1px solid var(--rule);display:block}
.case-shot figcaption{font-size:13px;font-weight:700;color:var(--ink);margin-top:8px}
.case-body{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.case-body h3,.case-outcomes h3{font-size:18px;margin:0 0 10px}
.case-body p{font-size:16px;line-height:1.7;color:var(--ink);margin:0 0 14px}
.case-outcomes{margin-top:28px;padding:24px 26px;background:var(--mist);border-radius:10px}
.case-outcomes ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.case-outcomes strong{display:block;font-size:17px;color:var(--navy)}
.case-outcomes span{display:block;font-size:14px;color:#53667a;margin-top:2px}
.case-quote{margin:28px 0 0;padding-left:20px;border-left:3px solid var(--aqua)}
.case-quote p{font-size:19px;line-height:1.55;color:var(--navy);margin:0 0 8px}
.case-quote footer{font-size:14px;color:#53667a}
.case-link{margin:22px 0 0}.case-link a{font-weight:700;color:var(--aqua-ink)}
.case-approval{font-size:13px;color:#53667a;margin:18px 0 0}
@media(max-width:800px){.case-shots,.case-body{grid-template-columns:1fr;gap:20px}}
