/* Finishing layer v1: typography, focus, depth and motion. No layout or content changes. */
:root{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
html{scroll-padding-top:84px}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"cv11","ss03","calt"}
::selection{background:rgba(142,27,245,.55);color:#fff}
h1,h2,h3,.lead{text-wrap:balance}
p,li,dd{text-wrap:pretty}
a,button,summary,.btn{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid #c9a2ff;outline-offset:3px;border-radius:8px}
.btn:focus-visible{outline-offset:4px;border-radius:999px}
/* buttons: a little spring and a soft light sweep on the main call button */
.btn{transition:transform .22s cubic-bezier(.2,.9,.25,1.2),box-shadow .25s ease,background .18s ease,filter .2s ease;position:relative;overflow:hidden}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-call::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s ease;pointer-events:none}
.btn-call:hover::after{transform:translateX(120%)}
.btn-call:hover{box-shadow:0 16px 32px -12px rgba(142,27,245,.95),0 0 0 1px rgba(255,255,255,.12) inset}
/* cards: finer edge light and a calmer lift */
.card{background-image:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 38%);box-shadow:var(--shadow),0 1px 0 rgba(255,255,255,.06) inset}
.card.link-card{transition:transform .28s cubic-bezier(.2,.9,.25,1),box-shadow .28s ease,border-color .25s ease}
.card.link-card:hover{box-shadow:0 22px 44px -22px rgba(91,34,230,.55),0 1px 0 rgba(255,255,255,.08) inset}
/* section headings: gradient tick under the kicker line stays crisp */
.kicker{letter-spacing:.16em}
/* hero: a touch more depth in the photo and a softer join into the page */
.hero-img img{filter:saturate(1.08) contrast(1.04)}
.hero .lead{max-width:60ch}
/* inputs */
input,select,textarea{transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px rgba(109,181,255,.28);border-color:rgba(109,181,255,.7);outline:0}
/* scrollbars */
*{scrollbar-width:thin;scrollbar-color:rgba(173,196,235,.28) transparent}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media (prefers-reduced-motion:reduce){.btn,.card.link-card,.btn-call::after{transition:none}.btn:hover,.card.link-card:hover{transform:none}}
@media print{.btn-call::after{display:none}}
/* logo fit: the logo gives way before the menu button does, whatever the font or text-size setting (header and footer) */
.head .wrap{min-width:0}
.brand{flex:0 1 auto;min-width:0}
.brand .wm{min-width:0}
.brand .wm small{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu-btn{flex:none}
@media (max-width:480px){.brand .wm small{font-size:10px;letter-spacing:.06em}}
/* enquiry choices: a column may be narrower than 210px on a small phone */
.choices{grid-template-columns:repeat(auto-fill,minmax(min(210px,100%),1fr))}
/* grid children may shrink below their content width (stops the footer and contact form pushing the page sideways) */
.split>*,.foot-grid>*{min-width:0}
.foot .contact-line .i{flex:none}
.foot .contact-line,.foot .contact-line a{overflow-wrap:anywhere}
/* callouts: text column shrinks and wraps, icon keeps its size */
.callout>*:not(.i){min-width:0}
.callout .i{flex:none}
.callout p,.callout h3{overflow-wrap:anywhere}
/* tighter desktop rhythm (Nov 2026): about 30% less empty space between sections; phones unchanged */
@media (min-width:821px){
  .sec{padding:clamp(52px,4.5vw,64px) 0}
  .sec-head{margin-bottom:30px !important}
  .stats{margin-bottom:40px !important}
}