/* GENERATED from src/styles/site.css — edit the source. Output class: web. */
@font-face{font-family:"DM Sans";src:url(assets/dm-sans-latin-variable.woff2) format('woff2');font-weight:100 1000;font-display:swap}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{background:var(--surface);color:var(--text)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:5px}
a,button{touch-action:manipulation}
.icon{width:24px;height:24px;fill:currentColor;flex-shrink:0;vertical-align:middle}
.preview-bar{background:var(--toolbar);color:var(--toolbar-text);font-size:11px;letter-spacing:.03em;padding:9px var(--gutter-page);display:flex;justify-content:space-between}
.site-header{height:80px;padding:12px var(--gutter-page);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-dark)}
.site-header>a img{width:175px;height:58px;display:block}
.site-header__desktop{display:flex;align-items:center;gap:34px;font-size:14px}
.site-header__desktop>a:not(.btn):hover{color:var(--link-hover)}
.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:58px;padding:16px 22px;background:var(--primary);color:var(--white);font-size:15px;font-weight:650;border:1px solid var(--primary);border-radius:2px;white-space:nowrap;transition:background-color var(--ix-dur-fast) var(--ix-ease-standard),border-color var(--ix-dur-fast) var(--ix-ease-standard),transform var(--ix-dur-fast) var(--ix-ease-premium),box-shadow var(--ix-dur-base) var(--ix-ease-standard)}
.btn:hover{background:var(--primary-hover);border-color:var(--primary-hover)}
.btn--sm{min-height:48px;padding:12px 18px;gap:22px}
.site-header__toggle{display:none}
.mobile-nav[hidden]{display:none}
.hero{max-width:1600px;margin:auto;display:grid;grid-template-columns:1.1fr 1fr;min-height:590px;padding:38px var(--gutter-page) 40px;gap:40px;align-items:center}
.hero-copy{padding:18px 0}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:650;color:var(--muted);margin:0 0 26px}
h1,h2,h3,p{margin-top:0}
h1{font-size:var(--text-display);font-weight:650;letter-spacing:-.065em;line-height:1.04;margin-bottom:25px}
h1 span{color:var(--display-accent)}
h2{font-size:var(--text-xxl);font-weight:600;letter-spacing:-.05em;line-height:1.08;margin-bottom:26px}
h2 span{color:var(--heading-muted)}
p{line-height:1.65;color:var(--body-muted);font-size:17px}
.hero-intro{max-width:385px;font-size:18px;margin-bottom:30px}
.hero-image{height:510px;position:relative;isolation:isolate}
.hero-image>img{width:100%;height:100%;object-fit:cover;object-position:50% 51%;display:block}
.hero-image:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,var(--photo-scrim));z-index:0}
.image-caption{position:absolute;left:24px;right:24px;bottom:24px;z-index:1;font-size:11px;color:var(--photo-caption)}
.image-caption span{display:block;font-size:17px;color:var(--white);margin-top:5px}
.image-corner{position:absolute;width:55px;height:55px;right:-12px;top:-12px;border-top:5px solid var(--photo-corner);border-right:5px solid var(--photo-corner);z-index:1}
.service-strip{display:flex;gap:48px;align-items:center;justify-content:center;padding:23px var(--gutter-page);background:var(--primary);color:var(--white);font-size:13px;text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.service-strip span+span:before{content:'+';margin-right:48px;font-size:20px;font-weight:350;color:var(--ribbon-muted)}
.section{--gutter:var(--gutter-section);--section-space:var(--section-space-l)}
.services{background:var(--surface-light);color:var(--ink)}
.services h2 span{display:block;color:var(--accent-dark)}
.section-intro{max-width:570px;color:var(--text-on-light);margin-bottom:48px}
.service-list{margin-top:35px}
.service-row{display:grid;grid-template-columns:1.1fr 1fr 24px;gap:36px;align-items:center;padding:27px 0;border-bottom:1px solid var(--border-light)}
.service-name{font-size:23px;font-weight:600;letter-spacing:-.025em}
.service-description{font-size:15px;line-height:1.5;color:var(--text-detail)}
.service-row .icon{color:var(--link-on-light)}
.service-row:hover .service-name{color:var(--link-on-light)}
.work{padding-bottom:110px}
.work-heading{max-width:580px}
.work-gallery{display:grid;grid-template-columns:1.2fr 1fr;gap:50px;margin-top:45px;align-items:start}
.project{display:block;background:transparent;border:0;color:inherit;padding:0;text-align:left;width:100%}
.project img{width:100%;height:480px;object-fit:cover;display:block;transition:filter var(--ix-dur-base) var(--ix-ease-soft),transform var(--sf-media-dur) var(--ix-ease-premium)}
.project:hover img{filter:brightness(1.12)}
.project.second{padding-top:0}
.project.second img{height:360px}
.project>span:not(.project__media){display:flex;justify-content:space-between;align-items:center;padding:18px 0;font-size:15px;color:var(--gallery-label)}
.area{background:var(--panel);display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.area p{margin-bottom:24px}
.area-list{font-size:14px;color:var(--area-muted);line-height:1.9}
.text-link{display:inline-flex;align-items:center;gap:35px;font-weight:600;border-bottom:1px solid var(--link-border);padding:8px 0}
.text-link:hover{color:var(--text-hover)}
.closing{padding:90px var(--gutter-section) 95px;max-width:1600px;margin:auto;display:grid;grid-template-columns:1.3fr 1fr;gap:10px 50px;align-items:end}
.closing .eyebrow{grid-column:1/-1;margin-bottom:10px}
.closing h2{font-size:clamp(55px,7vw,100px);margin:0}
.closing h2 span{color:var(--display-accent)}
.closing>div{padding-bottom:5px}
.closing .btn{min-width:218px}
footer{padding:42px var(--gutter-page) 30px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:35px;border-top:1px solid var(--border-dark);align-items:center;color:var(--footer-text);font-size:13px}
footer img{width:160px;height:52px;display:block}
footer>div{display:grid;gap:8px}
footer>a:last-of-type{justify-self:end;display:flex;gap:15px;align-items:center}
footer>p{grid-column:1/-1;font-size:11px;margin:12px 0 0;color:var(--footer-muted)}
dialog{background:var(--panel);color:var(--white);border:1px solid var(--dialog-border);padding:16px;max-width:min(90vw,760px);max-height:90dvh}
dialog::backdrop{background:var(--dialog-scrim)}
dialog>img{max-height:67dvh;max-width:100%;display:block;margin:10px auto}
dialog p{font-size:14px;margin:10px 0 0}
.dialog-close{margin-left:auto;display:flex;align-items:center;gap:20px;background:none;border:0;color:var(--white);padding:8px}
.service-hero{padding-top:40px;padding-bottom:70px;background:var(--panel)}
.back-link{display:inline-flex;gap:10px;font-size:13px;color:var(--back-link);margin-bottom:48px;align-items:center}
.back-link .icon{transform:rotate(-135deg);width:18px;height:18px}
.service-hero h1{font-size:clamp(46px,6vw,86px)}
.service-hero p:not(.eyebrow){max-width:530px}
.service-hero .eyebrow{margin-bottom:20px}
.service-body{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}
.service-body img{width:100%;height:500px;object-fit:cover}
.service-body p{max-width:550px}
.prepare{background:var(--surface-light);color:var(--ink)}
.prepare ol{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:45px;counter-reset:step}
.prepare li{counter-increment:step}
.prepare li:before{content:'0' counter(step);color:var(--step-accent);font-size:14px;display:block;margin-bottom:24px}
.prepare li strong{display:block;font-size:23px;font-weight:600;margin-bottom:12px;letter-spacing:-.03em}
.prepare li span{font-size:16px;color:var(--text-on-light);line-height:1.6}
.faq{max-width:1000px}
.faq h2{font-size:40px}
 .faq details{border-bottom:1px solid var(--faq-border)}
.faq summary{cursor:pointer;padding:22px 0;font-size:18px;font-weight:500;display:flex;justify-content:space-between;align-items:center;gap:var(--space-m);list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq details p{font-size:16px;max-width:65ch;margin-bottom:24px}
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter-section);align-items:start;padding-top:70px}
.contact-layout h1{font-size:clamp(42px,5vw,70px)}
.contact-layout>div>p{max-width:420px}
.contact-details{margin-top:44px}
.contact-details dt{font-size:12px;color:var(--contact-muted);margin-top:27px;margin-bottom:7px}
.contact-details dd{margin:0;font-size:17px;overflow-wrap:anywhere}
.contact-details dd:first-of-type{font-size:30px;letter-spacing:-.03em}
.enquiry{background:var(--surface-light);color:var(--ink);padding:36px}
.enquiry h2{font-size:32px;line-height:1.15}
.enquiry .form-note{font-size:13px;color:var(--form-muted);margin-bottom:25px}
.field{display:grid;gap:8px;margin-bottom:21px}
.field label{font-size:14px;font-weight:600}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--field-border);background:var(--white);color:var(--ink);padding:12px;font-size:16px;border-radius:2px;min-height:48px}
.field textarea{resize:vertical}
#form-status{font-size:14px;color:var(--form-status);margin:20px 0 0}
#form-status:empty{display:none}

@media(min-width:1600px){.site-header,.preview-bar,footer{padding-left:max(var(--gutter-page),calc((100% - 1440px)/2));padding-right:max(var(--gutter-page),calc((100% - 1440px)/2))}
}

@media(max-width:1023px){.site-header{height:80px}
.site-header__desktop{gap:20px}
.hero{min-height:520px;gap:30px}
.hero-image{height:440px}
.hero h1{font-size:56px}
.section{--gutter:var(--gutter-tablet);--section-space:var(--section-space-m)}
.service-row{gap:22px}
.service-name{font-size:20px}
.work-gallery{gap:30px}
.area{gap:40px}
.contact-layout{gap:var(--gutter-page)}
.enquiry{padding:27px}
}

@media(max-width:767px){.preview-bar{font-size:10px;padding:8px var(--gutter-page);gap:15px}
.preview-bar span{display:none}
.site-header{height:77px;padding:8px var(--gutter-page)}
.site-header>a img{width:143px;height:48px}
.site-header__desktop{display:none}
.site-header__toggle{display:flex;gap:15px;align-items:center;background:none;border:1px solid var(--menu-border);border-radius:2px;color:var(--white);padding:9px 12px;font-size:13px}
.site-header__toggle .icon{width:18px;height:18px}
.mobile-nav{background:var(--panel);padding:10px var(--gutter-page) 22px;display:grid;gap:4px}
.mobile-nav a{padding:12px 0;font-size:16px}
.hero{padding:30px var(--gutter-page) 28px;grid-template-columns:1fr;gap:27px;min-height:0}
.hero-copy{padding:0}
.hero .eyebrow{font-size:10px;margin-bottom:16px}
.hero h1{font-size:clamp(40px,10.8vw,68px);margin-bottom:18px;line-height:1.05}
.hero-intro{font-size:16px;max-width:340px;margin-bottom:24px}
.hero .btn{min-height:50px;padding:13px 18px;font-size:14px;gap:25px}
.hero-image{height:300px;width:100%}
.image-corner{width:36px;height:36px;top:-8px;right:-7px;border-width:4px}
.image-caption{bottom:18px;left:18px;font-size:10px}
.image-caption span{font-size:15px}
.service-strip{gap:18px;padding:18px var(--gutter-page);font-size:10px;letter-spacing:.04em;flex-wrap:wrap}
.service-strip span+span:before{margin-right:18px;font-size:13px}
.section{--gutter:var(--gutter-page);--section-space:var(--section-space-s)}
h2{font-size:37px;line-height:1.1}
p{font-size:16px}
.section-intro{font-size:16px;margin-bottom:22px}
.service-list{margin-top:25px}
.service-row{grid-template-columns:1fr 22px;gap:10px 20px;padding:22px 0}
.service-name{font-size:20px}
.service-description{grid-column:1;font-size:14px}
.service-row>.icon{grid-column:2;grid-row:1/3;width:22px;height:22px}
.work-gallery{grid-template-columns:1fr;gap:22px;margin-top:30px}
.project img{height:360px}
.project.second{padding-top:0}
.project.second img{height:300px}
.area{grid-template-columns:1fr;gap:0}
.area h2{font-size:35px}
.area-list{font-size:13px}
.closing{padding:60px var(--gutter-page);grid-template-columns:1fr;gap:28px}
.closing .eyebrow{margin-bottom:-10px}
.closing h2{font-size:63px}
.closing>div p{font-size:16px}
.closing .btn{min-height:53px}
footer{padding:30px var(--gutter-page) 22px;grid-template-columns:1fr;gap:26px}
footer>a:last-of-type{justify-self:start;font-size:13px}
footer p{margin-top:0}
.service-hero{padding-top:25px}
.service-hero h1{font-size:48px}
.service-hero .eyebrow{font-size:10px}
.service-hero p:not(.eyebrow){font-size:16px}
.back-link{margin-bottom:35px}
.service-body{grid-template-columns:1fr;gap:35px}
.service-body img{height:330px}
.prepare ol{grid-template-columns:1fr;gap:35px;margin-top:32px}
.prepare li:before{margin-bottom:12px}
.faq h2{font-size:34px}
summary{font-size:16px;line-height:1.5}
.contact-layout{grid-template-columns:1fr;gap:40px;padding-top:38px}
.contact-layout h1{font-size:48px}
.contact-details{margin-top:25px}
.enquiry{padding:25px 20px}
.enquiry h2{font-size:30px}
.contact-details dd:first-of-type{font-size:29px}
.contact-details dd{font-size:16px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{transition:none!important;animation:none!important}
}




/* Client composition on canonical KD primitives. Output class: web. */
:root{--a11y-focus-color:var(--focus)}

.is-light{--heading-color:var(--ink);--text:var(--ink);--text-muted:var(--text-on-light)}

.hero-copy.l-flow{--flow-space:0}
.hero-copy.l-flow>*+*{margin-block-start:0}

.site-header{position:relative}
.site-header__mobile{display:none}
.site-header__toggle{list-style:none}
.site-header__toggle::-webkit-details-marker{display:none}

.site-header__mobile[open] .mobile-nav{display:grid;position:absolute;inset-inline:0;top:100%;z-index:10;background:var(--panel);padding:var(--space-s) var(--gutter-page);gap:var(--space-xs);border-bottom:1px solid var(--border-dark)}

.mobile-nav a{padding:.75rem 0}
.mobile-nav[hidden]{display:none}

.service-disclosure{border-bottom:1px solid var(--border-light)}
.service-disclosure>.service-row{border:0;list-style:none}
.service-disclosure>.service-row::-webkit-details-marker{display:none}
.service-disclosure[open]>.service-row{color:var(--link-on-light)}

.service-disclosure__body{padding:0 0 var(--space-m);max-width:var(--measure)}
.service-disclosure__body p{font-size:var(--text-m);color:var(--text-on-light);margin-bottom:var(--space-s)}
.service-disclosure__body a{color:var(--link-on-light);text-decoration:underline}

.project__media{display:block;overflow:hidden}
.project:focus-visible{outline:3px solid var(--focus);outline-offset:5px}

.btn[disabled]{cursor:not-allowed;opacity:.7}
.btn--primary{background:var(--primary);color:var(--action-on-fill)}

@media(max-width:767px){.site-header__mobile{display:block}
.site-header__toggle{display:flex}
.site-header__desktop{display:none}
}


.site-header__toggle{min-height:44px}
/* The compact header starts before its desktop cluster would wrap. */
.site-header,.site-header__desktop{flex-wrap:nowrap}
@media(max-width:991px){.site-header__mobile{display:block}.site-header__toggle{display:flex}.site-header__desktop{display:none}}

/* Native controls stay usable without motion or JavaScript. FX owns timing/curves. */
.site-header__mobile[open] .ix-disclosure-icon,
.service-disclosure[open] .ix-disclosure-icon,
.faq-disclosure[open] .ix-disclosure-icon{transform:rotate(45deg)}
@media(prefers-reduced-motion:no-preference){
  .site-header__mobile[open] .mobile-nav,
  .service-disclosure[open] .service-disclosure__body,
  .faq-disclosure[open] .faq-disclosure__body{animation:migsy-panel-enter var(--ix-dur-base) var(--ix-ease-premium)}
  dialog[open]{animation:migsy-photo-enter var(--ix-dur-base) var(--ix-ease-premium)}
  dialog[open]::backdrop{animation:migsy-scrim-enter var(--ix-dur-fast) var(--ix-ease-soft)}
  .btn:active{transform:translateY(1px)}
  @media(hover:none){
    .btn.ix-hover:hover{transform:none;box-shadow:none}
    .btn.ix-hover:active{transform:scale(.98)}
  }
  @keyframes migsy-panel-enter{
    from{opacity:0;transform:translateY(calc(-1 * var(--ix-shift-sm)))}
    to{opacity:1;transform:none}
  }
  @keyframes migsy-photo-enter{
    from{opacity:0;transform:scale(var(--ix-scale-start))}
    to{opacity:1;transform:none}
  }
  @keyframes migsy-scrim-enter{from{opacity:0}to{opacity:1}}
}

/* Multi-page compositions share the same section rhythm and contact flow. */
.site-header__mobile{border:0}
.site-header__desktop a[aria-current],.site-header__desktop a.is-active{color:var(--link-hover)}
.mobile-nav a[aria-current]{color:var(--link-hover)}
.footer-brand{display:grid;gap:var(--space-xs)}
.footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-s) var(--space-m);line-height:1.5}
.footer-nav a{display:flex;align-items:center;min-height:44px}
.footer-nav a:hover,.footer-nav a:focus-visible{color:var(--white)}
.page-intro{background:var(--panel)}
.page-intro h1{max-width:18ch;font-size:clamp(44px,5.8vw,80px)}
.page-intro>p:not(.eyebrow){max-width:40rem;margin-bottom:var(--space-l)}
.service-overview-link{margin-top:var(--space-l);color:var(--link-on-light);border-color:currentColor}
.service-hero{padding-block:var(--section-space-m)}
.service-hero>p:not(.eyebrow){margin-bottom:var(--space-l)}
.service-body{gap:var(--space-xxl)}
.service-body h2{max-width:15ch}
.service-body p:last-child{margin-bottom:0}
.service-body p+p,.about-story p+p{margin-top:var(--space-m)}
.closing>div>p{margin-bottom:var(--space-m)}
.service-story__image{max-height:460px}
.service-note{padding:var(--space-l);border-left:3px solid var(--primary);background:var(--panel)}
.service-note h3{font-size:var(--text-l);line-height:1.3;max-width:22ch}
.service-note h3{margin-bottom:var(--space-m)}
.service-note ul{padding-left:1.2em;margin:0;color:var(--body-muted);line-height:1.7}
.service-note li+li{margin-top:var(--space-s)}
.service-extra{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xxl);background:var(--panel)}
.service-extra p:last-child{margin-bottom:0}
.related-services{padding-top:0}
.related-services h2{font-size:var(--text-xl)}
.related-services nav{display:grid;gap:0}
.related-link{display:flex;justify-content:space-between;align-items:center;gap:var(--space-m);padding:var(--space-m) 0;border-bottom:1px solid var(--border-dark);font-size:var(--text-m)}
.related-link:hover{color:var(--link-hover)}
.about-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--space-xxl);align-items:center}
.about-hero h1{font-size:clamp(42px,5.2vw,74px)}
.about-hero>div>p:not(.eyebrow){max-width:30rem;margin-bottom:var(--space-l)}
.about-hero figure{margin:0}
.about-hero figure img{display:block;width:100%;height:470px;object-fit:cover}
.about-hero figcaption{font-size:var(--text-s);color:var(--muted);margin-top:var(--space-s);line-height:1.5}
.about-story{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xxl);background:var(--surface-light);color:var(--ink)}
.about-story h2 span{color:var(--accent-dark)}
.about-story p{color:var(--text-on-light)}
.about-story .text-link{color:var(--link-on-light);border-color:currentColor}
.about-story .text-link{margin-top:var(--space-s)}
.work-story>p{font-size:var(--text-s);max-width:40ch;color:var(--gallery-label);margin-bottom:0}
@media(max-width:1023px){
  .about-hero,.about-story,.service-extra,.service-body{gap:var(--space-l)}
  .footer-nav{grid-template-columns:1fr}
  .about-hero figure img{height:400px}
}
@media(max-width:767px){
  .page-intro h1{font-size:clamp(40px,10vw,48px)}
  .service-hero{padding-block:var(--section-space-s)}
  .service-hero h1{font-size:clamp(40px,10vw,48px)}
  .about-hero,.about-story,.service-extra{grid-template-columns:1fr}
  .about-hero h1{font-size:clamp(40px,10vw,48px)}
  .about-hero figure img{height:360px}
  .service-note{padding:var(--space-m)}
  .footer-nav{grid-template-columns:1fr 1fr}
  .footer-brand{gap:var(--space-xs)}
  .work-story .project.second{padding-top:0}
  .closing h2{font-size:clamp(48px,13vw,63px)}
}