/* Shared tokens preserve the approved photography-led identity. */
:root {
  --ink: #163545;
  --blue: #087ba8;
  --action: #096d94;
  --deep: #073b54;
  --muted: #58707b;
  --line: #cdd9df;
  --grey: #f2f5f5;
  --soft: #eef5f7;
  --page: 1200px;
  --photo-radius: 10px;
  --hero-radius: 14px 88px 14px 88px;
  --heading-font: Geist,Arial,sans-serif;
  --text-small: 12px;
  --control-radius: 999px;
  --control-height: 44px;
  --accent-light: #8ed5f3;
  --surface-feature: #f3f6f6;
  --surface-frame: #f1f5f5;
  --surface-callout: #eaf2f4;
  --control-border: #718995;
  --copy: #435c68;
  --notice-text: #526875;
  --notice-surface: #f6f8f8;
  --notice-border: #d4dde0;
  --notice-accent: #8fa8b3;
  --inverse-muted: #adc4ce;
  --inverse-copy: #cfdee5;
  --inverse-accent: #a7d9ee;
  --action-hover: #0a526e;
  --focus: #a97524;
  --loading-surface: #e8eef1;
  --quote-action: #087ca8;
}
/* Photography-led site: wide imagery, clear navigation, restrained blue. */
body { font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;min-height:100vh;min-height:100svh;display:flex;flex-direction:column }
body>main { flex:1 }
html { scroll-padding-top:170px }
body>.site-header,body>.closing-cta,body>.site-footer { flex-shrink:0 }
a { transition:color .18s,background .18s }
h1,h2,h3 { color:var(--ink);font-weight:500;letter-spacing:-.04em }
h1 { font-size:clamp(2.8rem,4.8vw,4.5rem) }
h2 { font-size:clamp(2rem,3.3vw,3.3rem) }
h3 { font-size:1.5rem;letter-spacing:-.025em }
.wrap { width:min(var(--page),calc(100% - 112px)) }
.eyebrow { display:block;text-transform:uppercase;line-height:1.6;margin-bottom:20px }
.button { border-radius:0;padding:16px 24px;min-height:54px;font-size:14px;font-weight:500;gap:20px }
.text-link { font-size:14px;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:4px;min-height:40px;width:fit-content }
.actions { gap:22px }
.skip { z-index:1000 }
.skip:focus { transform:none }
:focus-visible { outline:3px solid var(--focus);outline-offset:5px }
button { touch-action:manipulation }
p { color:inherit }
/* A distinct dark navigation band is part of the selected design. */
.site-header { position:sticky;top:0;z-index:100;background:var(--paper);box-shadow:0 1px 0 #0a34451a }
.masthead { padding:19px 0;min-height:90px;gap:30px }
.brand img { width:223px;height:auto }
.masthead-note { font-size:var(--text-small);color:var(--muted);margin:0;border-left:1px solid var(--line);padding-left:26px }
.header-phone { margin-left:auto;text-decoration:none;color:var(--deep);font-size:21px;line-height:1.3;letter-spacing:-.02em;font-weight:500;white-space:nowrap }
.header-phone span { display:block;font-size:var(--text-small);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:5px }
.header-quote { min-height:48px }
.primary-nav { background:var(--deep);border:0 }
.nav-inner { display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative }
.primary-nav #main-menu { display:flex;align-items:stretch }
.primary-nav a,.primary-nav summary { color:var(--paper);font-size:13px;font-weight:400;padding:16px 0;text-decoration:none;line-height:1.65 }
.primary-nav a:hover,.primary-nav summary:hover { color:#b9e6f5 }
.primary-nav a[aria-current="page"] { box-shadow:inset 0 -2px #84cfea }
.nav-location { font-size:var(--text-small);color:#b9ccd5;white-space:nowrap }
.nav-group { position:static }
.nav-group summary { gap:10px;display:flex;list-style:none;cursor:pointer }
.nav-group summary:after { display:none }
.nav-group summary::-webkit-details-marker { display:none }
.dropdown { position:absolute;top:100%;left:0;width:630px;padding:30px;background:var(--paper);color:var(--ink);box-shadow:0 18px 28px #092a4425;display:grid;grid-template-columns:1fr 1fr;gap:30px;border:1px solid var(--line) }
.dropdown a { color:var(--ink);font-size:15px;padding:8px 0 }
.dropdown a:hover { color:var(--action) }
.dropdown .eyebrow { color:var(--muted);margin-bottom:10px }
.menu-photo img { width:100%;height:160px;object-fit:cover }
.menu-photo p { font-size:var(--text-small);color:var(--muted);margin-top:10px }
.menu-toggle,.mobile-call { display:none }
.breadcrumb { display:flex;align-items:center;gap:12px;padding-block:27px 0;font-size:var(--text-small);color:var(--muted) }
.breadcrumb a { color:inherit;text-decoration:none }
/* Homepage */
.photo-hero { position:relative;isolation:isolate }
.hero-image,.hero-image img,.hero-shade { position:absolute;inset:0;width:100%;height:100% }
.hero-image img { object-fit:cover;object-position:center 53%;max-width:none }
.hero-shade { background:linear-gradient(90deg,rgba(2,24,35,.73),rgba(2,24,35,.17) 67%,rgba(2,24,35,.06)),linear-gradient(0deg,rgba(2,24,35,.25),transparent 40%) }
.hero-content { position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding-bottom:70px;color:var(--paper) }
.hero-content .eyebrow { color:#e4f1f5 }
.hero-content h1 { color:var(--paper) }
.hero-content p { color:#ecf2f4 }
.hero-content .actions { margin-top:27px }
.button-white { background:var(--paper);border-color:var(--paper);color:var(--deep) }
.button-white:hover { background:#d9edf5;border-color:#d9edf5;color:var(--deep) }
.hero-service { text-decoration:none;font-size:14px }
.hero-controls { position:absolute;display:flex;align-items:center;color:var(--paper) }
.slide-count { font-size:var(--text-small);letter-spacing:.09em;margin-right:15px }
.hero-controls button { border:1px solid #ffffff80;color:var(--paper);display:grid;place-items:center }
.hero-controls button:hover { background:var(--paper);color:var(--deep) }
.service-ribbon>.wrap { display:flex;align-items:center;justify-content:space-between }
.service-ribbon a { color:var(--paper);white-space:nowrap;font-size:13px }
.section-heading { display:flex;justify-content:space-between }
.section-heading>p { color:var(--muted);margin:0 0 5px }
.section-heading .eyebrow { color:var(--action) }
.door-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) }
.door-card { position:relative }
.door-card>img { width:100% }
.door-card>div { padding:26px 0 0;border-bottom:1px solid var(--line) }
.door-card .eyebrow { color:var(--muted);margin-bottom:8px }
.door-card h3 { text-transform:none }
.door-card p { color:var(--muted) }
.card-hit { position:absolute;inset:0;z-index:2;font-size:0;color:transparent }
.door-card .text-link { position:relative;z-index:3 }
.door-card:has(a:hover)>img { filter:brightness(.94) }
.service-feature { display:grid }
.service-copy { align-self:center }
.service-copy>p { color:var(--muted) }
.service-copy .eyebrow { color:var(--action) }
.service-copy .text-link { font-size:15px }
.service-small { border-top:1px solid #cad7dc;font-size:13px }
.service-small a { color:var(--ink);text-decoration:none }
.about-feature { display:grid;border-bottom:1px solid var(--line) }
.about-feature>.eyebrow { padding-top:9px;color:var(--action) }
.about-feature p { color:var(--muted) }
.project-pair { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start }
.project-pair img { width:100%;height:auto;aspect-ratio:4/3;object-fit:cover }
.project-pair figcaption { font-size:var(--text-small);color:var(--muted);padding-top:13px }
.home-help { display:grid;grid-template-columns:1fr 1fr;padding:0 0 100px }
.home-help>div { border-top:1px solid var(--line) }
.home-help h2 { margin-bottom:20px }
.home-help p { color:var(--muted) }
.home-help .eyebrow { color:var(--action) }
/* Shared content pages */
.page-hero { align-items:center }
.page-hero h1 { margin-bottom:26px }
.page-hero>div>p { color:var(--muted) }
.page-hero>img { object-fit:cover }
.page-hero>div { min-width:0 }
.page-hero .lead-time { display:inline-block;color:var(--deep);border-top:1px solid var(--line);padding-top:18px;font-size:15px;margin-top:18px }
.page-heading { padding-block:50px 45px }
.page-heading h1 { margin-bottom:24px }
.content-layout { grid-template-columns:240px minmax(0,1fr);gap:70px;padding-block:20px 60px }
.contents { top:180px;border-top:2px solid var(--deep);padding-top:22px }
.contents strong { text-transform:uppercase;font-size:var(--text-small);letter-spacing:.13em;margin-bottom:16px }
.contents a { font-size:var(--text-small);line-height:1.5;padding-block:10px;color:var(--muted) }
.chapter h3 { font-size:23px }
.chapter p { font-size:16px;max-width:62ch;color:var(--copy) }
.chapter.illustrated { gap:32px }
.chapter.illustrated>img { border-radius:0;max-height:320px;object-fit:cover }
.chapter li { font-size:15px;color:var(--copy) }
.pending { border:1px solid var(--notice-border);border-left:3px solid var(--notice-accent);background:var(--notice-surface);padding:18px 21px;margin-block:24px;border-radius:0 }
.pending>span { color:var(--notice-text);font-size:var(--text-small);letter-spacing:.11em;text-transform:uppercase;font-weight:600 }
.pending p { font-size:13px!important;color:var(--notice-text)!important;margin-top:6px }
.service-areas { padding-block:20px 30px }
.service-areas h2,.colours h2,.gallery h2,.team>h2 { font-size:32px }
.gallery { padding-block:45px }
.gallery-grid img { height:280px;width:100%;object-fit:cover;border-radius:0 }
.gallery-grid figcaption { font-size:var(--text-small);color:var(--muted) }
.crosslinks { margin-block:30px 60px;padding:38px;background:var(--soft);gap:40px }
.crosslinks h2 { font-size:28px }
.enquiry { border-top:1px solid var(--line);padding-block:70px;gap:70px;grid-template-columns:.8fr 1.2fr }
.enquiry-intro h2 { font-size:40px }
.enquiry-intro>.contact-phone { font-size:28px;color:var(--deep) }
.enquiry-intro .email { font-size:14px;overflow-wrap:anywhere }
.contact-methods { display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-block:24px 28px }
.contact-methods .contact-method { gap:12px;max-width:100%;min-height:52px;padding:14px 18px;font-size:14px;text-align:left }
.contact-method svg { width:20px;height:20px;flex:none }
.contact-method span { min-width:0;overflow-wrap:anywhere }
.contact-methods .contact-email { background:var(--paper);border-color:var(--control-border);color:var(--deep) }
.contact-methods .contact-email:hover { background:var(--soft);border-color:var(--deep) }
.preview-note { background:var(--soft);color:var(--notice-text);padding:16px;font-size:14px;line-height:1.65;margin-block:20px;border-radius:10px }
.preview-fields { background:var(--grey);padding:35px;gap:22px }
.field>span,.field>label,fieldset legend { font-size:var(--text-small);font-weight:500;color:var(--ink) }
input,textarea { border-radius:0!important }
input:not([type=checkbox]),textarea { background:white!important;border:1px solid var(--control-border)!important;padding:12px!important;width:100%;min-width:0 }
input[type=checkbox] { accent-color:var(--deep);width:17px;height:17px }
.choices { gap:12px }
.choices label { font-size:var(--text-small) }
.preview-fields .button:disabled { background:#d8e2e7;color:#405762;border-color:#c1d0d7;opacity:1 }
.repair-sections { gap:32px }
.repair-sections>div { padding:38px }
.repair-sections h2 { font-size:29px }
.repair-sections p { font-size:15px }
.repair-sections h3 { font-size:21px;line-height:1.4 }
.emergency { background:var(--deep)!important }
.emergency h2,.emergency h3,.emergency p,.emergency a { color:var(--paper) }
.help-strip { padding:38px }
.video-layout { gap:50px }
.video-placeholder { background:var(--grey);border:1px solid var(--line) }
.video-placeholder h2 { font-size:25px }
.video-layout aside h2 { font-size:28px }
.video-layout .contact-phone { font-size:25px;margin-top:24px;display:block }
.team-grid { display:none }
.acknowledgement { font-size:13px;padding-block:35px 65px }
.drive-types { max-width:1000px;padding-block:40px }
.drive-types>h2 { margin-bottom:30px }
.brand-review { padding-block:25px 65px }
.brand-review h2 { font-size:24px }
.brand-links { display:flex;gap:28px;flex-wrap:wrap }
.brand-links a { font-size:14px }
.brand-pending { padding-block:70px 100px;max-width:960px;min-height:550px }
.brand-pending .eyebrow { color:var(--muted) }
.brand-pending h1 { margin-bottom:35px }
.legal { max-width:870px;padding-block:55px 90px }
.legal p,.legal li { font-size:15px;line-height:1.9 }
.page-secure-garage-door-smart-phone-cont .page-hero { display:block;max-width:950px }
.page-secure-garage-door-smart-phone-cont .page-hero>img { width:100%;height:400px;margin-top:35px }
html { scroll-padding-top:175px }
/* Footer */
.closing-cta { background:var(--surface-callout);padding:48px 0 }
.closing-cta>.wrap { display:flex;justify-content:space-between;align-items:center;gap:35px }
.closing-cta .eyebrow { color:var(--muted);margin-bottom:10px }
.closing-cta a { color:var(--deep);font-size:clamp(23px,3vw,38px);text-decoration:none;letter-spacing:-.035em;white-space:nowrap }
.closing-cta a span { margin-left:30px }
.site-footer { background:var(--deep);color:var(--paper);border:0;padding-top:65px }
.footer-wordmark { display:flex!important;gap:12px;align-items:center;font-size:43px!important;font-weight:600;letter-spacing:-.09em;line-height:1;margin-bottom:28px;color:white!important }
.footer-wordmark>span { border-left:1px solid #ffffff60;padding-left:12px;font-weight:400;font-size:var(--text-small);line-height:1.4;letter-spacing:.04em }
.site-footer h2 { font-size:var(--text-small);letter-spacing:.04em;color:var(--paper);margin-bottom:20px }
.site-footer a { color:var(--inverse-copy);display:block;font-size:var(--text-small);padding-block:6px;text-decoration:none;overflow-wrap:anywhere }
.site-footer a:hover { color:var(--paper);text-decoration:underline }
.site-footer p { font-size:var(--text-small);color:var(--inverse-muted);line-height:1.8;margin:15px 0 }
.footer-address>a:last-child { font-size:var(--text-small) }
.footer-notice { padding-top:15px;max-width:210px }
.footer-end { border-color:#ffffff24;color:var(--inverse-muted);font-size:var(--text-small);margin-top:50px;padding-block:23px;align-items:center }
.footer-end>div { display:flex;gap:24px }
.footer-end a { font-size:var(--text-small) }
.primary-nav .mobile-call { display:none }
.footer-main nav a { color:var(--inverse-copy) }
.footer-main nav a:hover { color:var(--paper) }
.menu-toggle { width:auto }
.nav-compact { position:relative }
.compact-dropdown { width:260px;display:block;padding:18px 20px }
.primary-nav summary.is-current { box-shadow:inset 0 -2px #84cfea }
.footer-main { grid-template-columns:minmax(0,1.4fr) 1fr 1.1fr .7fr 1fr;gap:32px }
@media(min-width:1600px) {
  .hero-controls { right:calc((100vw - 1280px)/2) }
}
@media(max-width:1100px) {
  .wrap { width:calc(100% - 64px) }
  .masthead-note,.nav-location { display:none }
  .primary-nav #main-menu { gap:25px;width:100%;justify-content:space-between }
  .hero-controls { right:32px }
  .service-copy { padding:55px 35px }
  .footer-main { gap:30px }
  .content-layout { gap:35px;grid-template-columns:200px minmax(0,1fr) }
  .door-card>img { height:250px }
  .enquiry { gap:35px }
  .preview-fields { padding:25px }
}
@media(max-width:760px) {
  .wrap { width:calc(100% - 40px) }
  html { scroll-padding-top:150px }
  .site-header { position:sticky }
  .masthead { min-height:75px;padding:18px 0;gap:15px }
  .masthead .brand { min-width:0;flex:1 }
  .header-phone { display:none }
  .header-quote { margin-left:auto }
  .nav-inner { flex-wrap:wrap;gap:0 }
  .menu-toggle { display:flex;align-items:center;justify-content:space-between;gap:26px;color:var(--paper);border:0;background:transparent;padding:13px 0;font-size:13px;min-height:48px }
  .primary-nav .mobile-call { display:block;font-size:var(--text-small);padding:13px 0;margin-left:auto }
  .primary-nav #main-menu { display:none;flex-direction:column;width:100%;padding:5px 0 18px;border-top:1px solid #ffffff30;max-height:calc(100dvh - 145px);overflow:auto }
  .primary-nav #main-menu.is-open { display:flex }
  .primary-nav #main-menu>a,.primary-nav summary { padding:11px 0;font-size:15px }
  .primary-nav a[aria-current="page"] { box-shadow:none;color:#a9dbed }
  .dropdown { position:static;width:100%;padding:12px 20px;display:block;border:0;box-shadow:none;margin-bottom:12px }
  .dropdown .menu-photo,.dropdown .eyebrow { display:none }
  .dropdown a { font-size:14px!important;padding:9px 0!important }
  .nav-group summary { justify-content:space-between }
  
  .hero-image img { object-position:57% center }
  .hero-shade { background:linear-gradient(0deg,rgba(2,24,35,.89),rgba(2,24,35,.10) 100%) }
  .hero-content { padding-bottom:94px;justify-content:flex-end }
  .hero-content .button { font-size:var(--text-small);padding:12px 16px;min-height:46px }
  .hero-service { font-size:var(--text-small) }
  .slide-count { font-size:var(--text-small) }
  .service-ribbon>.wrap { display:block }
  .service-ribbon .text-link { font-size:var(--text-small) }
  .service-ribbon .eyebrow { font-size:var(--text-small);margin-bottom:10px }
  .section-heading { display:block }
  .eyebrow { font-size:var(--text-small);margin-bottom:15px }
  .door-grid { grid-template-columns:1fr }
  .door-card>div { padding:21px 0 23px }
  .door-card p { max-width:none }
  .service-feature { min-height:0 }
  .service-copy .button { font-size:var(--text-small);padding:14px 18px }
  .service-copy .text-link { font-size:14px }
  .about-feature>.eyebrow { margin-bottom:25px;padding:0 }
  .about-feature h2 { margin-bottom:23px }
  .recent-work .section-heading>a { margin-top:22px;font-size:var(--text-small) }
  .project-pair { grid-template-columns:1fr }
  .home-help { display:block }
  .home-help p { font-size:14px }
  .breadcrumb { padding-top:22px;font-size:var(--text-small);gap:9px;flex-wrap:wrap }
  .page-hero { display:flex;flex-direction:column }
  .page-hero h1 { margin-bottom:23px }
  .page-hero .actions { gap:15px }
  .page-hero .button { font-size:var(--text-small);padding:14px 18px }
  .page-hero .text-link { font-size:var(--text-small) }
  .page-heading { padding-block:32px }
  .content-layout { display:block;padding-bottom:25px }
  .contents { position:static;margin-bottom:25px;display:block;max-height:none;padding-bottom:18px;border-bottom:1px solid var(--line) }
  .contents a { padding:7px 0;margin-right:18px;font-size:var(--text-small) }
  .contents strong { display:block }
  .chapter h3 { font-size:22px }
  .chapter.illustrated { display:flex;flex-direction:column;gap:24px }
  .chapter.illustrated>img { width:100%;height:240px;max-height:none }
  .chapter p,.chapter li { font-size:16px }
  .pending { padding:16px;margin-block:20px }
  .pending p { font-size:var(--text-small)!important }
  .gallery { padding-block:30px }
  .gallery-grid { grid-template-columns:1fr }
  .gallery-grid img { height:270px }
  .gallery h2,.colours h2,.service-areas h2 { font-size:28px }
  .crosslinks { display:block;padding:25px;margin-block:25px 40px }
  .crosslinks>div+div { border-top:1px solid var(--line);padding-top:25px;margin-top:25px }
  .crosslinks h2 { font-size:25px }
  .crosslinks .button { font-size:var(--text-small);padding-inline:16px }
  .enquiry { display:block;padding-block:40px }
  .enquiry-intro h2 { font-size:34px }
  .enquiry-intro { margin-bottom:28px }
  .preview-fields { padding:22px 18px;gap:18px;grid-template-columns:1fr }
  .preview-fields .full { grid-column:1 }
  .preview-fields .field { grid-column:1 }
  .preview-fields fieldset { grid-column:1;min-width:0 }
  .choices { flex-direction:column }
  .repair-sections { grid-template-columns:1fr;gap:24px }
  .repair-sections>div { padding:27px }
  .repair-sections h2 { font-size:27px }
  .help-strip { padding:25px }
  .help-strip h2 { font-size:26px }
  .video-layout { display:block;padding-bottom:40px }
  .video-layout aside { margin-top:35px }
  .video-placeholder { padding:22px }
  .video-placeholder h2 { font-size:22px }
  .brand-review { padding-block:25px 40px }
  .brand-review h2 { font-size:23px }
  .brand-links { gap:15px 24px }
  .brand-pending { min-height:450px;padding-block:40px 65px }
  .brand-pending h1 { font-size:42px }
  .legal { padding-block:35px 55px }
  .legal p,.legal li { font-size:14px }
  .closing-cta { padding-block:36px }
  .closing-cta>.wrap { display:block }
  .closing-cta a { display:block;font-size:29px;margin-top:23px }
  .closing-cta a span { margin-left:15px }
  .site-footer { padding-top:42px }
  .footer-main { grid-template-columns:1fr 1fr;gap:35px 22px }
  .footer-address { grid-column:1/-1 }
  .footer-main>div:last-child { grid-column:1/-1;border-top:1px solid #ffffff24;padding-top:25px }
  .footer-notice { max-width:none }
  .footer-wordmark { font-size:42px!important;margin-bottom:22px }
  .site-footer a { font-size:var(--text-small);padding-block:7px }
  .site-footer p { font-size:var(--text-small) }
  .site-footer h2 { font-size:var(--text-small) }
  .footer-end { display:block;margin-top:26px }
  .footer-end>div { gap:20px;margin-top:10px }
  .footer-end a { font-size:var(--text-small) }
  html { scroll-padding-top:140px }
  .page-secure-garage-door-smart-phone-cont .page-hero>img { height:270px }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto }
  *,*:before,*:after { transition:none!important;animation:none!important }
}
@media(min-width:761px) and (max-width:1100px) {
  .primary-nav a,.primary-nav summary { font-size:var(--text-small) }
  .footer-main { grid-template-columns:repeat(4,minmax(0,1fr)) }
  .footer-address { grid-column:1/-1 }
}
@media(max-width:760px) {
  .compact-dropdown { width:100% }
  .primary-nav summary.is-current { box-shadow:none;color:#a9dbed }
}
/* A consistent button treatment for actions; ordinary navigation stays quiet. */
.button,.text-link,.hero-service,.service-small a { display:inline-flex;align-items:center;justify-content:center;width:fit-content;max-width:100%;min-height:48px;padding:13px 22px;border:1px solid transparent;border-radius:10px;gap:10px;font-size:14px;font-weight:500;line-height:1.4;text-align:center;text-decoration:none }
.button { background:var(--deep);border-color:var(--deep);color:var(--paper) }
.text-link,.service-small a { color:var(--deep) }
.text-link:hover,.service-small a:hover { color:var(--deep);text-decoration:none }
.button:hover { background:var(--action-hover);border-color:var(--action-hover);box-shadow:0 3px 10px #073b5414 }
.button-white,.service-ribbon .text-link { background:var(--paper);border-color:var(--paper);color:var(--deep) }
.button-white:hover,.service-ribbon .text-link:hover { background:#e7f1f5;border-color:#e7f1f5;color:var(--deep) }
.hero-service { background:#073b546b;border-color:#ffffff8c;color:var(--paper);backdrop-filter:blur(8px) }
.hero-service:hover { background:#073b54d9;border-color:var(--paper);color:var(--paper);text-decoration:none }
.button:active,.text-link:active,.hero-service:active { box-shadow:inset 0 2px 4px #031e3020 }
.header-quote { background:var(--quote-action);border-color:var(--quote-action);font-size:13px;padding:12px 21px }
.hero-content .actions { gap:12px }
.door-card>div { display:flex;flex-direction:column;align-items:flex-start;min-height:258px;padding-bottom:30px }
.door-card p { flex:1;margin-bottom:23px }
.door-card .text-link { margin-top:auto;font-size:13px }
.hero-controls button { width:auto;height:42px;min-width:65px;padding:0 14px;border-radius:9px;font-size:var(--text-small);background:#073b546b;backdrop-filter:blur(8px) }
.primary-nav #main-menu { gap:12px }
.primary-nav #main-menu>a,.nav-group>summary { margin-block:6px;padding:9px 11px;border-radius:8px;min-height:40px }
.nav-group>summary { background:#ffffff0c;gap:12px }
.primary-nav #main-menu>a:hover,.nav-group>summary:hover,.nav-group[open]>summary { background:#ffffff1a;color:var(--paper) }
.primary-nav #main-menu>a[aria-current="page"],.primary-nav summary.is-current { box-shadow:none;background:#ffffff20;color:var(--paper) }
.menu-indicator { width:12px;height:12px;display:inline-block;position:relative;flex:none;opacity:.75;transition:transform .18s }
.menu-indicator:after { content:"";position:absolute;top:2px;left:3px;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) }
.nav-group[open] .menu-indicator { transform:rotate(180deg) }
.dropdown { border-radius:0 0 12px 12px }
.primary-nav .dropdown a { border-radius:7px;padding:10px 12px;min-height:var(--control-height) }
.primary-nav .dropdown a:hover { background:var(--soft);color:var(--deep) }
.primary-nav .dropdown a[aria-current="page"] { background:var(--soft);box-shadow:none;color:var(--deep) }
.menu-photo img { border-radius:7px }
@media(min-width:761px) and (max-width:1100px) {
  .primary-nav #main-menu { gap:3px }
  .primary-nav #main-menu>a,.nav-group>summary { padding-inline:7px }
  .nav-group>summary { gap:6px }
}
@media(max-width:760px) {
  .primary-nav #main-menu { gap:2px }
  .primary-nav #main-menu>a,.nav-group>summary { margin-block:2px;padding:11px 12px;min-height:46px }
  .primary-nav .dropdown a { padding:10px 12px!important;min-height:var(--control-height) }
  .dropdown { border-radius:9px;margin-block:6px 12px }
  .header-quote { padding:10px 12px }
  .hero-content .button,.hero-service { min-height:46px }
  .hero-controls button { height:38px;width:auto;font-size:var(--text-small);padding-inline:12px }
  .door-card>div { min-height:0;padding-bottom:25px }
  .door-card .text-link { font-size:13px }
  .text-link,.button,.service-small a { min-height:46px }
  .home-help .text-link { font-size:13px }
  .service-copy .actions { align-items:flex-start }
}
@media(prefers-reduced-motion:reduce) {
  .menu-indicator { transition:none }
}
/* Compact photograph selector, with a full touch target around each marker. */
.hero-controls { gap:0;padding:3px 5px;border:1px solid #ffffff30;border-radius:var(--control-radius);background:#082d3f9c;backdrop-filter:blur(14px);box-shadow:0 3px 16px #00182514 }
.hero-controls .slide-dot { position:relative;display:grid;place-items:center;width:44px;min-width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;backdrop-filter:none;box-shadow:none }
.hero-controls .slide-dot:before { content:"";width:7px;height:7px;border-radius:50%;background:#ffffff80;transition:opacity .2s,background-color .2s }
.hero-controls .slide-dot:after { content:"";position:absolute;width:25px;height:7px;border-radius:var(--control-radius);background:var(--paper);opacity:0;transform:scaleX(.28);transition:transform .2s,opacity .2s }
.hero-controls .slide-dot[aria-pressed="true"]:before { opacity:0 }
.hero-controls .slide-dot[aria-pressed="true"]:after { transform:scaleX(1);opacity:1 }
.hero-controls .slide-dot:hover { background:#ffffff0c;color:var(--paper) }
.hero-controls .slide-dot:hover:before { background:var(--paper) }
.hero-controls .slide-dot:focus-visible { outline:2px solid white;outline-offset:-4px }
.visually-hidden { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0 }
@media(prefers-reduced-motion:reduce) {
  .hero-controls .slide-dot:before,.hero-controls .slide-dot:after { transition:none }
}
/* Rotating service word: reserve the longest word to keep the layout stable. */
.service-line { display:flex;flex-wrap:wrap;align-items:baseline;gap:.2em;white-space:nowrap;line-height:1.22 }
.service-rotator { display:inline-grid;max-width:100%;flex-shrink:0;overflow:hidden;color:var(--accent-light);vertical-align:bottom;line-height:1.22 }
.service-word-size,.service-word { grid-area:1/1;white-space:nowrap;text-align:right }
.service-word-size { visibility:hidden }
.service-word { display:block }
.word-motion-toggle { position:absolute;right:max(192px,calc((100% - var(--page)) / 2 + 154px));bottom:36px;width:44px;height:44px;display:grid;place-items:center;border:1px solid #ffffff40;border-radius:50%;background:#082d3f9c;color:var(--paper);backdrop-filter:blur(14px) }
.word-motion-toggle[hidden] { display:none }
.word-motion-toggle:hover { background:#073b54dd }
.word-motion-toggle:focus-visible { outline:2px solid white;outline-offset:3px }
.word-motion-toggle span { width:11px;height:13px;border-left:3px solid currentColor;border-right:3px solid currentColor }
.word-motion-toggle[data-paused="true"] span { width:0;height:0;border:0;border-left:10px solid currentColor;border-block:7px solid transparent;margin-left:3px }
@media(max-width:760px) {
  .hero-content h1 .service-line { font-size:clamp(30px,10vw,44px) }
  .word-motion-toggle { right:172px;bottom:25px }
}
/* Editorial spacing, fine rules and inset photography. */
main h1,main h2,.closing-cta h2 { font-family:var(--heading-font);font-weight:500;letter-spacing:-.025em;line-height:1.15 }
main h3 { font-weight:500;letter-spacing:-.025em;line-height:1.25 }
.eyebrow { font-size:var(--text-small);letter-spacing:.1em;font-weight:500 }
.photo-hero { width:100%;height:auto;min-height:660px;display:flex;margin:0;border:0;border-radius:0;background:var(--deep);overflow:hidden }
.hero-image,.hero-shade { border-radius:0;overflow:hidden }
.hero-image img { border-radius:inherit }
.hero-content { width:min(var(--page),calc(100% - 112px));height:auto;min-height:inherit;padding:64px 0 72px }
.hero-content h1 { font-family:var(--heading-font);font-size:clamp(48px,5.5vw,78px);font-weight:500;letter-spacing:-.035em;line-height:1.08 }
.hero-content p { font-size:16px;line-height:1.6;max-width:390px;margin-top:24px }
.hero-content .eyebrow { font-size:var(--text-small);letter-spacing:.12em;margin-bottom:25px }
.hero-controls { right:max(38px,calc((100% - var(--page)) / 2));bottom:32px }
.service-ribbon { color:var(--ink) }
.service-ribbon>.wrap { border-bottom:1px solid var(--line);padding-block:38px;gap:35px }
.service-ribbon h2 { font-family:Geist,Arial,sans-serif;font-weight:500;letter-spacing:-.025em }
.service-ribbon .eyebrow { margin-bottom:8px }
.service-ribbon .text-link { font-size:var(--text-small) }
.service-ribbon .text-link:hover { background:var(--soft);border-color:var(--deep) }
.collection { padding-block:100px 110px }
.section-heading { align-items:flex-start;margin-bottom:58px;gap:64px }
.section-heading h2 { font-size:44px;line-height:1.12;max-width:570px }
.section-heading>p { max-width:315px;margin-top:37px;font-size:15px;line-height:1.65 }
.section-heading .eyebrow { margin-bottom:23px }
.door-grid { gap:30px }
.door-card { display:flex;flex-direction:column;border-top:1px solid var(--line);padding-top:26px;min-width:0 }
.door-card>.door-card-copy { min-height:190px;padding:0 0 28px;border:0;display:block }
.door-card .eyebrow { font-size:var(--text-small);letter-spacing:.08em;margin:0 0 30px }
.door-card h3 { font-size:27px;line-height:1.2;letter-spacing:-.03em }
.door-card p { font-size:14px;line-height:1.65;max-width:335px;margin:19px 0 0 }
.door-card>img { height:auto;aspect-ratio:1.12;object-fit:cover;border-radius:var(--photo-radius) }
.door-card>.text-link { margin:23px 0 0;font-size:var(--text-small);min-height:var(--control-height) }
.text-link,.service-small a { background:var(--paper);border-color:var(--control-border);border-radius:var(--control-radius);padding:11px 21px }
.button,.hero-service { border-radius:var(--control-radius) }
.text-link:hover,.service-small a:hover { background:var(--soft);border-color:var(--deep) }
.service-feature { width:min(var(--page),calc(100% - 112px));margin:0 auto;grid-template-columns:1fr 1fr;gap:60px;align-items:center;min-height:0;padding:44px;background:var(--surface-feature);border-radius:24px }
.service-copy { padding:12px 0 }
.service-copy .eyebrow { margin-bottom:28px }
.service-copy h2 { font-size:43px;line-height:1.15;max-width:440px }
.service-copy>p { margin-top:27px;font-size:15px;line-height:1.75;max-width:410px }
.service-copy .actions { gap:12px;align-items:flex-start }
.service-copy .button,.service-copy .text-link { font-size:var(--text-small) }
.service-small { margin-top:28px;border-color:var(--line);padding-top:22px }
.service-small a { font-size:var(--text-small) }
.service-photo { padding:0;min-width:0 }
.service-photo img { height:520px;width:100%;object-fit:cover;border-radius:var(--hero-radius);box-shadow:0 8px 24px #12344509 }
.about-feature { padding-block:110px }
.about-feature h2 { font-size:43px;margin-bottom:26px }
.about-feature p { font-size:17px;line-height:1.8;max-width:680px }
.recent-work { padding-block:105px }
.project-pair { gap:34px }
.project-pair img { border-radius:var(--photo-radius) }
.home-help { padding-bottom:110px;gap:80px }
.home-help>div { padding-top:28px }
.home-help h2 { font-size:34px }
.home-help p { font-size:15px;line-height:1.75 }
.home-help .eyebrow { margin-bottom:26px }
.page-hero { gap:80px;padding-block:64px 90px }
.page-hero h1 { font-size:clamp(40px,4.2vw,60px);line-height:1.12 }
.page-hero>div>p { font-size:16px;line-height:1.8 }
.page-hero>img { border-radius:var(--hero-radius);box-shadow:0 0 0 16px var(--surface-frame);height:460px;width:100% }
.page-hero.product-hero { align-items:start;grid-template-rows:auto 1fr;row-gap:24px;padding-bottom:52px }
.product-hero>.product-heading { grid-column:1;grid-row:1 }
.product-hero>img { grid-column:2;grid-row:1 / span 2 }
.product-hero>.actions { grid-column:1;grid-row:2;margin-top:0 }
.product-intro { padding-bottom:42px;color:var(--copy) }
.product-intro>p { max-width:62ch;font-size:16px;line-height:1.8 }
.product-intro>.pending { max-width:62ch }
.product-intro>.lead-time { width:fit-content;margin-block:24px 0;padding:12px 18px;border-radius:10px;background:var(--soft);color:var(--deep) }
.chapter.illustrated>img,.gallery-grid img { border-radius:var(--photo-radius) }
.chapter { padding-block:40px }
.chapter h2 { font-size:34px }
.chapter p { line-height:1.85 }
.gallery h2,.service-areas h2,.team>h2 { font-size:35px }
.page-heading h1 { font-size:52px }
.legal h1 { font-size:48px }
.legal h2 { font-size:30px }
.page-secure-garage-door-smart-phone-cont .page-hero>img { border-radius:var(--hero-radius) }
.closing-cta h2 { font-size:37px }
@media(max-width:1100px) {
  .photo-hero { min-height:610px }
  .hero-content { width:calc(100% - 64px);padding:45px 0 70px }
  .service-feature { width:calc(100% - 64px);padding:30px;gap:35px }
  .service-copy h2 { font-size:36px }
  .service-photo img { height:490px }
  .door-card h3 { font-size:23px }
  .door-card>.door-card-copy { min-height:210px }
  .page-hero { gap:50px }
  .page-hero>img { height:410px }
}
@media(max-width:760px) {
  :root { --hero-radius:12px 52px 12px 52px;--photo-radius:9px }
  .photo-hero { min-height:620px }
  .hero-content { width:calc(100% - 40px);padding:32px 0 102px }
  .hero-content h1 { font-size:44px;line-height:1.08;letter-spacing:-.035em }
  .hero-content .eyebrow { font-size:var(--text-small);margin-bottom:22px }
  .hero-content p { font-size:14px;line-height:1.65;margin-top:22px;max-width:270px }
  .hero-content .actions { gap:10px;flex-wrap:wrap;margin-top:25px }
  .hero-content .button,.hero-service { padding:12px 14px;font-size:var(--text-small) }
  .hero-controls { right:18px;bottom:21px }
  .service-ribbon>.wrap { padding-block:28px }
  .service-ribbon h2 { line-height:1.35 }
  .collection { padding-block:64px 70px }
  .section-heading { margin-bottom:35px;gap:25px }
  .section-heading h2 { font-size:36px;line-height:1.12 }
  .section-heading .eyebrow { margin-bottom:18px }
  .section-heading>p { font-size:14px;margin-top:23px }
  .door-grid { gap:40px }
  .door-card { padding-top:22px }
  .door-card>.door-card-copy { min-height:0;padding:0 0 25px }
  .door-card .eyebrow { font-size:var(--text-small);margin-bottom:22px }
  .door-card h3 { font-size:27px }
  .door-card p { font-size:14px;margin-top:15px }
  .door-card>img { height:auto;aspect-ratio:1.15 }
  .door-card>.text-link { margin-top:20px;font-size:var(--text-small) }
  .service-feature { width:calc(100% - 40px);grid-template-columns:1fr;padding:25px;gap:34px;border-radius:18px }
  .service-copy { padding:3px 0 }
  .service-copy h2 { font-size:34px }
  .service-copy .eyebrow { margin-bottom:23px }
  .service-copy>p { font-size:14px;line-height:1.8;margin-top:23px }
  .service-copy .actions { gap:10px }
  .service-copy .button,.service-copy .text-link { font-size:var(--text-small);padding:12px 16px }
  .service-small a { font-size:var(--text-small);padding:11px 16px }
  .service-photo img { height:330px }
  .about-feature { padding-block:70px }
  .about-feature h2 { font-size:35px }
  .about-feature p { font-size:16px;line-height:1.8 }
  .recent-work { padding-block:65px }
  .project-pair { gap:28px }
  .home-help { padding-bottom:65px }
  .home-help h2 { font-size:32px }
  .home-help>div+div { margin-top:40px }
  .page-hero { padding-block:38px 55px;gap:40px }
  .page-hero h1 { font-size:40px }
  .page-hero>div>p { font-size:15px }
  .page-hero>img { width:calc(100% - 24px);height:310px;box-shadow:0 0 0 12px var(--surface-frame) }
  .page-hero.product-hero { align-items:stretch;gap:28px;padding-block:28px 36px }
  .product-hero>img { align-self:center;height:auto;aspect-ratio:4/3;max-height:310px }
  .product-hero>.product-heading>p { font-size:16px;line-height:1.7 }
  .product-intro { padding-bottom:30px }
  .chapter { padding-block:30px }
  .chapter h2 { font-size:29px }
  .gallery h2,.service-areas h2,.team>h2 { font-size:30px }
  .page-heading h1 { font-size:40px }
  .legal h1 { font-size:40px }
  .legal h2 { font-size:27px }
  .closing-cta h2 { font-size:33px }
  .page-secure-garage-door-smart-phone-cont .page-hero>img { width:calc(100% - 24px);margin-inline:auto }
}
/* The live site's team portrait keeps its full frame at every size. */
.about-feature { grid-template-columns:1.15fr 1fr;gap:64px;align-items:center }
.about-photo { margin:0;padding:16px;background:var(--surface-feature);border-radius:22px;min-width:0 }
.about-photo img { display:block;width:100%;height:auto;aspect-ratio:1600/810;object-fit:contain;border-radius:12px 52px 12px 52px }
.about-copy .eyebrow { color:var(--action);margin-bottom:25px }
.about-copy h2 { font-size:38px }
.about-copy p { font-size:16px;line-height:1.8 }
@media(max-width:1100px) {
  .about-feature { gap:35px }
  .about-copy h2 { font-size:34px }
  .about-photo { padding:12px }
}
@media(max-width:760px) {
  .about-feature { display:flex;flex-direction:column;align-items:stretch;gap:32px }
  .about-photo { padding:10px;border-radius:17px }
  .about-photo img { border-radius:9px 32px 9px 32px }
  .about-copy h2 { font-size:35px }
  .about-copy .eyebrow { margin-bottom:22px }
}
/* Service booking callout. */
.service-ribbon { padding-top:30px;background:var(--paper) }
.service-ribbon>.wrap { padding:34px 38px;border:0;border-radius:18px;background:var(--deep);color:var(--paper);box-shadow:0 8px 25px #073b540b }
.service-ribbon h2 { color:var(--paper);font-size:24px;line-height:1.35 }
.service-ribbon .eyebrow { color:var(--inverse-accent) }
.service-ribbon .text-link { background:var(--paper);border-color:var(--paper);color:var(--deep);min-height:48px;flex-shrink:0 }
.service-ribbon .text-link:hover,.service-ribbon .text-link:focus-visible { background:#dbf0f9;border-color:#dbf0f9;color:var(--deep) }
/* Feedback follows interactive elements; photographs that are not links stay still. */
.button,.text-link,.hero-service,.service-small a { transition:color .18s,background-color .18s,border-color .18s,box-shadow .22s,transform .22s }
.primary-nav a,.primary-nav summary { transition:background-color .18s,color .18s }
.door-card { transition:border-color .2s }
.door-card h3 { transition:color .2s }
.door-card>img { transition:transform .35s cubic-bezier(.16,1,.3,1),filter .25s }
.door-card:focus-within { border-color:var(--action) }
.door-card:focus-within h3 { color:var(--action) }
.text-link:focus-visible,.service-small a:focus-visible { background:var(--soft);border-color:var(--deep) }
input,textarea { transition:border-color .18s,box-shadow .18s }
input:focus-visible,textarea:focus-visible { outline:2px solid var(--action);outline-offset:3px;box-shadow:0 0 0 4px #087ba80d }
.media-loading { background:var(--loading-surface) }
.hero-outgoing { pointer-events:none }
@media(hover:hover) and (pointer:fine) {
  .button:hover,.text-link:hover,.hero-service:hover,.service-small a:hover { transform:translateY(-2px);box-shadow:0 5px 14px #073b5412 }
  .button:active,.text-link:active,.hero-service:active,.service-small a:active { transform:translateY(0);box-shadow:none }
  .door-card:hover { border-color:var(--action) }
  .door-card:hover h3 { color:var(--action) }
  .door-card:hover>img { transform:translateY(-3px);filter:brightness(1.025) }
}
@keyframes menu-entrance {
  from { opacity:.65;transform:translateY(-5px) }
  to { opacity:1;transform:translateY(0) }
}
.nav-group[open]>.dropdown { animation:menu-entrance .2s ease-out }
@media(max-width:760px) {
  .service-ribbon { padding-top:20px }
  .service-ribbon>.wrap { padding:27px 25px;border-radius:15px }
  .service-ribbon h2 { font-size:23px;max-width:290px }
  .service-ribbon .text-link { margin-top:23px }
  .primary-nav #main-menu.is-open { animation:menu-entrance .2s ease-out }
}
@media(prefers-reduced-motion:reduce) {
  .button:hover,.text-link:hover,.hero-service:hover,.service-small a:hover,.door-card:hover>img { transform:none }
  .nav-group[open]>.dropdown,.primary-nav #main-menu.is-open { animation:none }
}
/* Shared semantic headings retain the established subsection appearance. */
main h1,main h2,main h3,.closing-cta h2 { overflow-wrap:anywhere;min-width:0 }
.repair-sections>div { min-width:0;overflow-wrap:anywhere }
.chapter .content-heading { font-size:23px;font-weight:500;line-height:1.25;letter-spacing:-.025em;color:var(--deep);margin:28px 0 12px }
.chapter .content-heading:first-child { margin-top:0 }
/* Generous targets for secondary actions, including keyboard focus. */
.masthead { flex-wrap:wrap }
.header-phone { max-width:100%;white-space:normal }
.hero-content h1 { max-width:100%;min-width:0;overflow-wrap:anywhere }
.service-line { max-width:100% }
.closing-cta a { white-space:normal;overflow-wrap:anywhere }
.service-ribbon a { white-space:normal }
.footer-wordmark { flex-wrap:wrap }
.brand { min-height:var(--control-height);display:flex;align-items:center }
.contact-phone,.email,.brand-links a,.breadcrumb a { min-height:var(--control-height);display:inline-flex;align-items:center }
.breadcrumb a { min-width:44px }
.choices label { min-height:var(--control-height) }
@media(max-width:760px) {
  .chapter .content-heading { font-size:22px }
  .header-quote { font-size:13px;min-height:var(--control-height) }
  .brand img { width:clamp(150px,44.6vw,174px) }
  .site-footer a { min-height:var(--control-height);display:flex;align-items:center }
  .contents a { min-height:var(--control-height);display:inline-flex;align-items:center }
  .hero-content .eyebrow { letter-spacing:.08em }
  .hero-content .actions { padding-bottom:0 }
}

/* Enquiries reuse the existing two-column service/contact layout. */
.hero-service-heading { display:block;font-size:.77em;line-height:1.12;margin-top:.15em }
.enquiry-form { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;min-width:0 }
.enquiry-form .full { grid-column:1/-1 }
.enquiry-form .field { display:flex;flex-direction:column;gap:8px;min-width:0 }
.enquiry-form .field>span { font-size:14px;font-weight:500;color:var(--ink) }
.enquiry-form input,.enquiry-form select,.enquiry-form textarea { width:100%;max-width:100%;min-width:0;box-sizing:border-box;font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--control-border);border-radius:4px;padding:12px;min-height:48px }
.enquiry-form input[type=file] { font-size:14px;padding:10px;overflow:hidden }
.enquiry-form textarea { resize:vertical;min-height:130px }
.enquiry-form small,.form-guidance,.form-privacy { color:var(--copy);font-size:14px;line-height:1.55 }
.form-guidance,.form-privacy,.form-status { margin:0 }
.form-status:empty { display:none }
.form-status { padding:16px;background:var(--soft);overflow-wrap:anywhere }
.form-status.is-error { color:#80251c;background:#fff1ee }
.enquiry-form [hidden] { display:none }
.enquiry-form button:disabled { opacity:.65;cursor:wait }
.enquiry-link { align-items:center }
.enquiry-link>.button { justify-self:start }
.repair-sections .service-price { font-size:2.5rem;font-weight:500;line-height:1.2;margin:22px 0 12px;color:var(--deep) }
.repair-sections .emergency .service-price { color:var(--paper) }
.repair-sections .emergency .button { background:var(--paper);color:var(--deep);margin:12px 0 }
.repair-sections .emergency .button:hover { background:var(--inverse-copy) }
.page-repairs-maintenance .enquiry-intro>.contact-phone,.page-repairs-maintenance .enquiry-intro>.email { display:block;width:fit-content;margin-bottom:16px;overflow-wrap:anywhere }
.service-price span { display:block;font-size:1rem;line-height:1.5;margin-top:8px }
.fee-note { font-size:14px }
.work-order { border-top:1px solid var(--line);padding-top:55px }
.page-about-us .page-hero:has(>div:only-child) { grid-template-columns:1fr;max-width:900px }
.page-about-us .page-hero>div { max-width:72ch }
@media(max-width:760px) {
 .enquiry-form { grid-template-columns:minmax(0,1fr) }
 .enquiry-form .full { grid-column:auto }
 .hero-service-heading { font-size:.72em;line-height:1.15 }
 .repair-sections .service-price { font-size:2.25rem }
 .work-order { padding-top:36px }
}

/* Paired product actions share a baseline and stack in reading order. */
.product-actions { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding-block:40px 64px }
.product-action { display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:clamp(24px,3vw,40px);border-radius:14px;background:var(--soft) }
.product-action h2 { margin:0 0 16px;font-size:clamp(1.75rem,2.5vw,2.25rem);line-height:1.15;letter-spacing:-.03em }
.product-action p { max-width:44ch;margin:0 0 32px;color:var(--copy) }
.product-action>.button { margin-top:auto;max-width:100%;text-align:center }
.product-action-quote { background:var(--deep);color:var(--paper) }
.product-action-quote h2 { color:inherit }
.product-action-quote p { color:var(--inverse-copy) }
.product-action-quote>.button { background:var(--paper);border-color:var(--paper);color:var(--deep) }
.product-action-quote>.button:hover { background:var(--inverse-copy);border-color:var(--inverse-copy) }
@media(max-width:760px) {
 .product-actions { grid-template-columns:minmax(0,1fr);gap:16px;padding-block:24px 40px }
 .product-action>.button { width:100% }
}

/* Customer enquiries lead; property managers have a separate, clearly labelled tab. */
.booking { padding-block:62px;border-top:1px solid var(--line) }
.booking>h2 { margin-bottom:24px }
.form-switch { display:flex;gap:8px;flex-wrap:wrap;padding:8px;background:var(--soft);border-radius:14px;width:fit-content;margin-bottom:32px }
.form-switch button { min-height:48px;padding:12px 24px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--deep);font:inherit;font-weight:500;cursor:pointer }
.form-switch button[aria-selected=true] { background:var(--deep);border-color:var(--deep);color:var(--paper) }
.form-switch button:hover:not([aria-selected=true]) { background:var(--surface-callout) }
.booking-panel { display:grid;grid-template-columns:1fr 1.2fr;gap:80px;scroll-margin-top:180px }
.booking-panel .enquiry-intro h3 { font-size:28px;margin-bottom:18px }
.booking-panel+.booking-panel { margin-top:40px }
.booking:has(.form-switch:not([hidden])) .booking-panel { margin-top:0 }
.booking-panel[hidden],.form-switch[hidden],.carousel-controls[hidden] { display:none }
.carousel-controls { display:none }
@media(max-width:760px) {
 .booking { padding-block:40px }
 .booking-panel { display:block;scroll-margin-top:150px }
 .booking>h2 { font-size:34px }
 .form-switch { width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px }
 .form-switch button { padding:12px 8px;line-height:1.4;font-size:15px }
 .photo-led .mobile-carousel[data-carousel] { display:flex;flex-wrap:nowrap;align-items:flex-start;gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;max-width:100%;padding-block:6px 12px }
 .mobile-carousel::-webkit-scrollbar { display:none;width:0;height:0 }
 .mobile-carousel>* { flex:0 0 calc(100% - 32px);width:calc(100% - 32px);scroll-snap-align:start;min-width:0;overflow-wrap:break-word }
 .mobile-carousel>.door-card { align-self:stretch }
 .mobile-carousel>.door-card>.door-card-copy { flex:1 }
 .mobile-carousel>.door-card>.text-link { align-self:flex-start }
 .carousel-controls { display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:12px }
 .carousel-controls button { width:44px;height:44px;flex:0 0 44px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--deep);font-size:22px;line-height:1;cursor:pointer }
 .carousel-controls button:hover:not(:disabled) { background:var(--soft);border-color:var(--deep) }
 .carousel-controls button:disabled { opacity:.4;cursor:default }
 .carousel-count { font-size:14px;font-variant-numeric:tabular-nums;min-width:40px;text-align:center;color:var(--ink) }
}

/* Keep product labels and warranty badges visible without cropping the photographs. */
.chapter.illustrated.opener-product { display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);align-items:start;gap:32px }
.chapter.illustrated.opener-product>img { width:100%;height:auto;max-height:none;aspect-ratio:1;object-fit:contain;margin:0 }
.chapter.opener-product>div { min-width:0 }
@media(max-width:1100px) {
 .chapter.illustrated.opener-product { grid-template-columns:1fr;gap:24px }
 .chapter.illustrated.opener-product>img { max-width:360px }
}
@media(max-width:760px) {
 .chapter.illustrated.opener-product>img { max-width:280px }
}

/* Roller options retain their full descriptions inside a single mobile browsing row. */
.roller-options-heading { display:none }
@media(max-width:760px) {
 .roller-options-heading { display:block;margin:30px 0 18px;font-size:29px }
 .roller-options-track.mobile-carousel>.chapter { padding:0 0 20px;border-bottom:0 }
 .roller-options-track.mobile-carousel>.chapter>img { height:240px;width:100%;margin-bottom:0 }
 .roller-options-track.mobile-carousel>.chapter h2 { font-size:26px }
 .mobile-carousel { cursor:grab }
 .photo-led .mobile-carousel.is-dragging[data-carousel] { cursor:grabbing;scroll-snap-type:none;user-select:none }
 .mobile-carousel.is-dragging * { user-select:none }
 .mobile-carousel img { -webkit-user-drag:none }
}