/* Century 99. One 12-column grid: section titles take columns 1–4, content
   takes 5–12, and the hero copy lines up with the content column.
   8px spacing scale. Public Sans 400/700; Source Serif 4 for the quotation
   and article text. */
:root {
  --ink:#17251d;
  --green:#16523c;
  --green-dark:#103e2d;
  --muted:#59635d;
  --line:#cbd1cc;
  --paper:#f1f3ef;
  --white:#fff;
  --sans:'Public Sans','Helvetica Neue',Arial,sans-serif;
  --serif:'Source Serif 4',Georgia,serif;
  --edge:max(40px,calc((100vw - 1312px)/2));
  --gap:32px;
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:40px;--s6:48px;--s8:64px;--s10:80px;--s12:96px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
h1,h2,h3,p,figure,blockquote,dl,dd,ul{margin:0}
ul{padding:0;list-style:none}
h1,h2,h3{font-weight:700;letter-spacing:-.03em;text-wrap:balance}
h2{font-size:32px;line-height:1.25}
h3{font-size:32px;line-height:1.25}
p{max-width:65ch;color:var(--muted);text-wrap:pretty}
address{font-style:normal}
a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--green);outline-offset:4px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--green);outline-offset:4px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
[hidden]{display:none!important}

.button{display:inline-flex;align-items:center;justify-content:center;padding:var(--s2) var(--s3);min-height:56px;border:1px solid var(--green);background:var(--green);color:#fff;font-weight:700;transition:background .15s}
.button:hover{background:var(--green-dark);text-decoration:none}
.button:disabled{cursor:wait;opacity:.65}
.button.secondary{background:transparent;color:var(--green)}
.button.secondary:hover{background:var(--paper)}
.button.small{min-height:44px;padding:var(--s1) var(--s2);font-size:14px}
.text-link{font-weight:700;color:var(--green);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.skip-link{position:fixed;top:-100px;left:var(--s3);padding:var(--s2);background:#fff;z-index:60}
.skip-link:focus{top:var(--s2)}

/* Header */
.header{position:sticky;top:0;z-index:20;height:80px;padding:0 var(--edge);display:flex;align-items:center;justify-content:space-between;gap:var(--s4);background:var(--white);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;min-height:44px;width:260px;max-width:calc(100vw - 112px);flex-shrink:0}
.brand img{width:100%;height:auto}
.header nav{display:flex;gap:var(--s4);font-size:15px}
.header nav a{padding:var(--s2) 0;white-space:nowrap}
.header .nav-enquiry{color:var(--green);font-weight:700}
.menu-toggle{display:none;min-height:44px;padding:0 0 0 var(--s2);border:0;background:none;color:var(--ink);font-size:15px;font-weight:700}

/* Grid */
.hero,.section{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:var(--s12) var(--edge)}
.section{border-top:1px solid var(--line)}
.section-title{grid-column:1/5}
.section-title .text-link{display:inline-block;margin-top:var(--s2)}
.section-body{grid-column:5/13;min-width:0}

/* Hero */
.hero{padding-top:var(--s10);padding-bottom:var(--s8);row-gap:var(--s5)}
.hero-welcome{grid-column:1/-1;margin-bottom:var(--s3);font-size:16px;color:var(--green);font-weight:700}
.hero h1{grid-column:1/11;font-size:clamp(48px,6.2vw,88px);line-height:1.05;letter-spacing:-.04em;max-width:16ch}
.hero-intro{grid-column:5/13}
.hero-intro p{font-size:20px;line-height:1.5;color:var(--ink);max-width:44ch}
.hero-actions{display:flex;align-items:center;gap:var(--s4);margin-top:var(--s4)}
.hero-phone{font-weight:700}
.hero-photograph{grid-column:1/13;margin-top:var(--s3)}
.hero-photograph img{width:100%;height:480px;object-fit:cover;object-position:center 58%}

/* Clients */
.client-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4) var(--gap)}
.client-logo{display:flex;align-items:center;gap:var(--s2);min-height:48px}
.client-logo img{width:32px;height:32px;object-fit:contain}
.client-logo.wordmark img{width:104px;height:40px}
.client-logo.wordmark:last-child img{width:168px;height:48px}
.client-logo.wordmark span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* Services and FAQ share the expanding row */
.service-row,.faq-list details{border-bottom:1px solid var(--line)}
.service-row:first-child,.faq-list details:first-child{border-top:1px solid var(--ink)}
.service-row summary{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 20px;gap:var(--s4);align-items:baseline;padding:var(--s4) 0;cursor:pointer;list-style:none}
.service-row summary>p{font-size:16px}
summary::-webkit-details-marker{display:none}
.expand-mark{position:relative;width:20px;height:20px;align-self:center;color:var(--green)}
.expand-mark:before,.expand-mark:after{content:'';position:absolute;background:currentColor}
.expand-mark:before{top:9px;left:1px;width:18px;height:2px}
.expand-mark:after{top:1px;left:9px;width:2px;height:18px;transition:transform .15s}
details[open]>summary .expand-mark:after{transform:scaleY(0)}
.service-detail{margin-left:calc(50% - 10px);padding:0 0 var(--s4) var(--s2)}
.service-detail p{margin-bottom:var(--s2)}
.faq-list summary{display:flex;justify-content:space-between;gap:var(--s4);padding:var(--s3) 0;font-weight:700;cursor:pointer;list-style:none}
.faq-list details>p{padding:0 var(--s5) var(--s3) 0}

/* About */
.about-copy blockquote{font-family:var(--serif);font-size:40px;line-height:1.25;letter-spacing:-.02em;margin-bottom:var(--s5);hanging-punctuation:first}
.about-copy p+p{margin-top:var(--s2)}
.company-detail{margin-top:var(--s5)}
.company-detail h3{margin-bottom:var(--s2)}
.contact-details .inspection-note{font-size:14px;margin-top:var(--s1);max-width:32ch}

/* Platforms */
.platform-directory{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.platform-directory li{border-top:1px solid var(--ink);padding-top:var(--s3)}
.platform-directory p{margin:var(--s1) 0 var(--s2)}
.platform-directory a{font-weight:700;color:var(--green)}
.platform-access{margin-top:var(--s5);font-size:14px}
.platform-access a{color:var(--green);font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* Articles */
.articles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.article-card{border-top:1px solid var(--ink);padding-top:var(--s3)}
.article-meta{font-size:14px}
.article-card h3{font-size:22px;line-height:1.3;letter-spacing:-.02em;margin:var(--s2) 0 var(--s1)}
.article-card p:last-child{font-size:15px}

/* Contact */
.contact-details{margin-top:var(--s5)}
.contact-details div+div{margin-top:var(--s3)}
.contact-details dt{font-size:14px;color:var(--muted)}
.contact-details dd{font-size:18px}
.form-intro{margin-bottom:var(--s5)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.enquiry-form label{display:block;margin-bottom:var(--s4);font-size:14px;font-weight:700}
.enquiry-form input:not([type=checkbox]),.enquiry-form select,.enquiry-form textarea{display:block;width:100%;margin-top:var(--s1);padding:var(--s1) 0;border:0;border-bottom:1px solid #838f85;border-radius:0;background:transparent;color:var(--ink);font-size:16px;font-weight:400}
.enquiry-form textarea{resize:vertical;min-height:128px}
.enquiry-form input::placeholder{color:#657267;opacity:1}
.optional{font-weight:400;color:var(--muted)}
.enquiry-form .consent{display:flex;align-items:flex-start;gap:var(--s2);font-weight:400}
.consent input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--green);flex-shrink:0}
.consent a{text-decoration:underline;text-underline-offset:3px}
.form-submit{display:flex;align-items:center;gap:var(--s4)}
.form-note{font-size:14px}
#form-status{margin-top:var(--s3);color:var(--ink)}
#form-status:empty{display:none}
.enquiry-actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s2)}

/* Footer */
.footer{padding:var(--s8) var(--edge) var(--s4);border-top:1px solid var(--ink);font-size:14px}
.footer-top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.footer-brand{font-weight:700;color:var(--ink);margin-bottom:var(--s1)}
.footer-top h3{font-size:14px;letter-spacing:0;margin-bottom:var(--s1)}
.footer-top address{color:var(--muted)}
.footer-top>div>a{display:block;color:var(--muted)}
.footer-bottom{display:flex;justify-content:space-between;gap:var(--s4);margin-top:var(--s8);color:var(--muted)}
.footer-bottom>div{display:flex;gap:var(--s3)}
.text-button{border:0;padding:0;background:none;color:inherit}
.text-button:hover{text-decoration:underline;text-underline-offset:4px}

.cookie-notice{position:fixed;left:var(--s3);right:var(--s3);bottom:var(--s3);z-index:40;max-width:720px;display:flex;align-items:center;gap:var(--s4);padding:var(--s3);background:var(--white);border:1px solid var(--ink)}
.cookie-notice p{font-size:14px;margin-top:var(--s1)}
.cookie-notice p a{text-decoration:underline}
.cookie-actions{display:flex;gap:var(--s1);flex-shrink:0}

/* Inner-page headers stack their copy; the shared section grid is for the homepage. */
.page-heading,.article-header{display:block}

/* Inner pages */
.page-heading{padding:var(--s10) var(--edge) var(--s8);border-bottom:1px solid var(--line)}
.page-heading h1{font-size:64px;line-height:1.1;letter-spacing:-.04em;max-width:16ch;margin-bottom:var(--s3)}
.page-heading p{font-size:20px;max-width:48ch;margin-bottom:var(--s4)}
.breadcrumb{display:block;font-size:14px;color:var(--muted);margin-bottom:var(--s5)}
.article-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);padding:var(--s8) var(--edge) var(--s12)}
.article-header{padding:var(--s10) var(--edge) var(--s6)}
.article-header h1{font-size:56px;line-height:1.1;letter-spacing:-.04em;max-width:22ch;margin:var(--s2) 0 var(--s3)}
.article-header>p:not(.article-meta):not(.byline){font-size:20px;max-width:48ch}
.byline{font-size:14px;margin-top:var(--s3)}
.article-cover{width:calc(100% - var(--edge)*2);max-width:1312px;height:432px;object-fit:cover;margin:auto}
.article-content{max-width:720px;padding:0 var(--s4);margin:var(--s8) auto var(--s12)}
.article-content h2{font-size:28px;line-height:1.3;margin:var(--s6) 0 var(--s2)}
.article-content p{font-family:var(--serif);font-size:19px;line-height:1.6;color:var(--ink);margin-bottom:var(--s3)}
.article-content ul{list-style:disc;padding-left:var(--s3);margin:var(--s3) 0 var(--s4);line-height:1.6}
.article-content li+li{margin-top:var(--s1)}
.article-content li a{text-decoration:underline;text-underline-offset:3px}
.article-toc{border-block:1px solid var(--line);padding:var(--s3) 0;margin-bottom:var(--s6)}
.article-toc h2{font-size:24px;margin:0}
.article-toc ul{margin-bottom:0}
.article-content section[id]{scroll-margin-top:112px}
.article-sources,.related-reading{border-top:1px solid var(--line);margin-top:var(--s6)}
.article-content p a{text-decoration:underline;text-underline-offset:3px}
.article-content .editorial-note{font-family:var(--sans);font-size:14px;color:var(--muted);border-top:1px solid var(--line);padding-top:var(--s3);margin-top:var(--s6)}
.article-cta{border-top:1px solid var(--ink);padding-top:var(--s4);margin:var(--s6) 0}
.article-cta h2{margin:0 0 var(--s1)}
.article-cta p{font-family:var(--sans);font-size:16px;color:var(--muted)}
.quiet-link{font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* Navigation collapses at 1100px */
@media(max-width:1100px){
  html{scroll-padding-top:88px}
  .menu-toggle{display:block}
  .header nav{display:none;position:absolute;top:80px;left:0;right:0;flex-direction:column;gap:0;padding:var(--s1) var(--edge) var(--s3);background:var(--white);border-bottom:1px solid var(--line);max-height:calc(100dvh - 80px);overflow-y:auto;overscroll-behavior:contain}
  .header nav.open{display:flex}
  .header nav a{display:flex;align-items:center;min-height:48px;font-size:16px;border-bottom:1px solid var(--line)}
  .header nav a:last-child{border-bottom:0}
  .text-link,.footer-top a,.footer-bottom a,.footer-bottom button,.platform-directory a,.platform-access a{min-height:44px;display:inline-flex;align-items:center}
}

/* Single column below 900px */
@media(max-width:900px){
  .section-title,.section-body,.hero h1,.hero-intro{grid-column:1/-1}
  .section-title{margin-bottom:var(--s4)}
  .hero-photograph img{height:400px}
  .articles-grid,.article-index{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr 1fr}
}

@media(max-width:760px){
  :root{--edge:32px;--gap:24px}
  .hero,.section{padding-top:var(--s8);padding-bottom:var(--s8)}
  .hero{padding-top:var(--s6);row-gap:var(--s4)}
  .hero h1{font-size:clamp(40px,11vw,56px)}
  .hero-intro p{font-size:18px}
  .hero-actions{flex-wrap:wrap;gap:var(--s3)}
  .hero-photograph{margin-top:0}
  .hero-photograph img{height:300px;object-position:46% center}
  .client-directory{grid-template-columns:1fr 1fr;gap:var(--s3)}
  .client-logo.wordmark:last-child{grid-column:1/-1}
  .service-row summary{grid-template-columns:1fr 20px;gap:var(--s1) var(--s3)}
  .service-row summary h3{grid-column:1}
  .service-row summary>p{grid-column:1;grid-row:2}
  .service-row summary>.expand-mark{grid-column:2;grid-row:1}
  .service-detail{margin-left:0;padding-left:0}
  .about-copy blockquote{font-size:32px}
  .platform-directory{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr;gap:0}
  .form-submit{flex-direction:column;align-items:stretch;gap:var(--s2)}
  .enquiry-actions .button{flex:1}
  .footer-bottom{flex-direction:column;gap:var(--s1)}
  .page-heading,.article-header{padding-top:var(--s6)}
  .page-heading h1{font-size:44px}
  .article-header h1{font-size:38px;line-height:1.15}
  .article-header>p:not(.article-meta):not(.byline),.page-heading p{font-size:18px}
  .article-cover{height:280px}
  .article-content{padding:0 var(--edge);margin-top:var(--s6)}
  .article-content p{font-size:18px}
  .cookie-notice{display:block;left:var(--s2);right:var(--s2);bottom:var(--s2)}
  .cookie-actions{margin-top:var(--s2)}
  .cookie-actions .button{flex:1}
}

@media(max-width:380px){
  :root{--edge:24px}
  .brand{width:208px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
@supports(padding:max(0px)){
  .header{padding-left:max(var(--edge),env(safe-area-inset-left));padding-right:max(var(--edge),env(safe-area-inset-right))}
  .cookie-notice{bottom:max(var(--s2),env(safe-area-inset-bottom))}
}