@font-face{font-family:Archivo;src:url("assets/fonts/archivo-variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:Barlow;src:url("assets/fonts/barlow-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url("assets/fonts/barlow-600.woff2") format("woff2");font-weight:600;font-display:swap}
:root{--paper:#f3f5f1;--white:#fff;--muted:#68716d;--line:#ccd1cc;--accent:#15735f;--ink:#17211e;--max:1240px;--pad:clamp(20px,5vw,72px);--focus:#f1ac31}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Barlow,Arial,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{display:block;width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{outline-offset:4px}
:focus-visible{outline:3px solid var(--focus)}
[hidden]{display:none!important}
.skip-link{position:fixed;left:-9999px;top:12px;z-index:1000;background:var(--ink);color:#fff;padding:10px 14px}
.skip-link:focus{left:12px}
.site-header{position:relative;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.announcement{min-height:36px;display:flex;align-items:center;justify-content:center;gap:28px;padding:6px var(--pad);background:var(--ink);color:#fff;font-size:14px}
.announcement p{margin:0}.announcement a{font-weight:600;border-bottom:1px solid currentColor}
.nav-row{width:min(var(--max),calc(100% - 2 * var(--pad)));min-height:76px;margin:auto;display:flex;align-items:center;gap:34px}
.brand{display:inline-flex;align-items:center;gap:11px;min-width:190px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;background:var(--accent);color:#fff;font:700 20px Archivo,Arial,sans-serif}.brand-copy{display:flex;flex-direction:column;font:700 17px Archivo,Arial,sans-serif;line-height:1.1}.brand-copy small{margin-top:4px;color:var(--muted);font:400 10px Barlow,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}.brand-logo{width:auto;max-width:180px;height:48px;object-fit:contain}
.site-menu{margin-left:auto;display:flex;align-items:center;gap:28px}.site-menu a{font-size:15px;font-weight:600}.site-menu a[aria-current=page],.site-menu a:hover{color:var(--accent)}
.language-switch{display:flex;gap:6px;font-size:13px;font-weight:600}.language-switch a[aria-current=true]{color:var(--accent)}
.menu-toggle{display:none;border:0;background:transparent;padding:10px;color:var(--ink)}.menu-toggle span{display:block;width:22px;height:1px;margin:5px;background:currentColor}.menu-toggle b{font-size:12px}
main{overflow:hidden}.section{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:clamp(70px,8vw,112px) 0}
.kicker{margin:0 0 18px;color:var(--accent);font:600 12px Archivo,Arial,sans-serif;letter-spacing:.11em;text-transform:uppercase}
h1,h2,h3{margin:0;font-family:Archivo,Arial,sans-serif;line-height:1.04;letter-spacing:-.035em;text-wrap:balance}h1{font-size:clamp(42px,5.5vw,78px)}h2{font-size:clamp(32px,4vw,56px)}h3{font-size:clamp(21px,2vw,28px);letter-spacing:-.02em}
p{overflow-wrap:anywhere}.button{display:inline-flex;min-height:50px;align-items:center;justify-content:center;padding:12px 22px;border:1px solid var(--ink);font-weight:600;text-align:center;transition:background .18s,color .18s,border-color .18s}.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.button.primary:hover{background:var(--ink);border-color:var(--ink)}.button.secondary{background:transparent}.button.secondary:hover{background:var(--ink);color:#fff}.text-link{display:inline-block;font-weight:600;border-bottom:1px solid currentColor;padding-bottom:3px}.text-link:hover{color:var(--accent)}
.hero{width:min(1440px,100%);margin:auto;display:grid;grid-template-columns:minmax(0,47%) minmax(0,53%);min-height:min(680px,calc(100svh - 112px));background:#fff;border-bottom:1px solid var(--line)}
.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(46px,6vw,88px) clamp(24px,5vw,76px)}.hero-copy h1{max-width:10.5ch}.hero-lede{max-width:45ch;margin:24px 0;color:#4f5955;font-size:clamp(18px,1.6vw,23px)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-media{margin:0;min-height:420px;overflow:hidden}.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center}
.story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,8vw,120px);align-items:end;border-bottom:1px solid var(--line)}.story h2{max-width:13ch}.story>div:last-child{max-width:54ch}.story>div:last-child p{font-size:20px;color:#4f5955}
.section-head{display:grid;grid-template-columns:1.1fr .75fr;gap:48px;align-items:end;margin-bottom:48px}.section-head h2{max-width:13ch}.section-head>p{max-width:40ch;color:var(--muted)}
.popular{border-bottom:1px solid var(--line)}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.service-card{min-width:0;background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.service-card-media{display:block;aspect-ratio:4/3;overflow:hidden}.service-card-media img{height:100%;object-fit:cover;transition:transform .35s}.service-card:hover .service-card-media img{transform:scale(1.025)}.service-card-copy{padding:25px}.service-meta{display:flex;justify-content:space-between;gap:12px;margin:0 0 26px;color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.06em}.service-card h3{margin-bottom:14px}.service-card-copy>p:not(.service-meta){min-height:78px;color:#58615e}.service-card .text-link{margin-top:10px}.section-link{margin-top:30px}
.craft{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(40px,8vw,110px);border-bottom:1px solid var(--line)}.craft h2{max-width:9ch}.principles{border-top:1px solid var(--line)}.principles article{display:grid;grid-template-columns:.72fr 1fr;gap:28px;padding:25px 0;border-bottom:1px solid var(--line)}.principles p{margin:0;color:var(--muted)}
.process{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(40px,8vw,110px);border-bottom:1px solid var(--line)}.process h2{max-width:11ch}.process ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.process li{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:25px 0;border-bottom:1px solid var(--line)}.process li b{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--accent);border-radius:50%;color:var(--accent)}.process li p{margin:7px 0 0;color:var(--muted)}
.room{display:grid;grid-template-columns:1.25fr .75fr;min-height:600px;background:var(--ink);color:#fff}.room figure{margin:0;overflow:hidden}.room figure img{height:100%;object-fit:cover}.room>div{display:flex;flex-direction:column;justify-content:center;padding:clamp(38px,6vw,86px)}.room h2{max-width:11ch}.room>div>p:not(.kicker){color:#cdd3d0}.room .text-link{align-self:flex-start}
.visit{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px,8vw,110px);align-items:start;border-bottom:1px solid var(--line)}.visit h2{max-width:11ch}.visit-ledger{border-top:1px solid var(--line)}.visit-ledger p{margin:0;padding:20px 0;border-bottom:1px solid var(--line)}.visit-ledger .text-link{margin-top:24px}
.quote{text-align:center;border-bottom:1px solid var(--line)}.quote blockquote{max-width:900px;margin:0 auto 18px;font:500 clamp(32px,4.5vw,62px)/1.08 Archivo,Arial,sans-serif;letter-spacing:-.04em}.quote p{color:var(--muted);font-size:14px}
.closing{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:clamp(68px,8vw,112px) 0;display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:end}.closing h2{max-width:14ch}.closing>div:last-child{display:flex;align-items:center;justify-content:flex-end;gap:24px;flex-wrap:wrap}
.site-footer{background:#fff;border-top:1px solid var(--line)}.footer-grid{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:64px 0;display:grid;grid-template-columns:1.35fr repeat(3,1fr);gap:48px}.footer-grid>div{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.footer-grid strong{margin-bottom:8px;font:600 12px Archivo,Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase}.footer-grid p{margin:0;max-width:34ch;color:var(--muted)}.footer-action{font-weight:600;color:var(--accent)}.footer-bottom{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:20px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:24px;color:var(--muted);font-size:13px}
.page-intro{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:clamp(64px,8vw,112px) 0 54px;display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:end}.page-intro h1{max-width:11ch}.page-intro>p{max-width:46ch;color:var(--muted);font-size:20px}.catalogue-search{grid-column:1/-1;display:grid;gap:8px;max-width:560px}.catalogue-search span,.field-label,label>span{font-weight:600;font-size:14px}.catalogue-search input,input,select,textarea{width:100%;border:1px solid #aeb5b1;border-radius:0;background:#fff;color:var(--ink);padding:13px 14px}.catalogue{padding-top:0}.no-results{text-align:center;padding:50px;color:var(--muted)}.empty-state{grid-column:1/-1;background:#fff;border:1px solid var(--line);padding:48px;text-align:center}.empty-state a{display:inline-block;margin-top:18px;color:var(--accent);font-weight:600}
.service-detail{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:clamp(58px,7vw,100px) 0;display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,7vw,96px);align-items:center}.service-detail-copy h1{max-width:11ch}.service-detail-lede{max-width:50ch;color:var(--muted);font-size:20px}.service-detail dl{margin:32px 0;border-top:1px solid var(--line)}.service-detail dl div{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}.service-detail dt{color:var(--muted)}.service-detail dd{margin:0;text-align:right}.service-detail figure{margin:0;aspect-ratio:4/3}.service-detail figure img{height:100%;object-fit:cover}
.about-hero{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:clamp(58px,7vw,100px) 0;display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px,7vw,96px);align-items:center}.about-hero h1{max-width:10ch}.about-hero>div>p:last-child{max-width:47ch;color:var(--muted);font-size:20px}.about-hero figure{margin:0}.about-method{border-top:1px solid var(--line);display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(40px,8vw,110px)}.about-method h2{max-width:12ch}
.contact-page{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:clamp(58px,7vw,100px) 0;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,110px)}.contact-page h1{max-width:11ch}.contact-page>div:first-child>p:not(.kicker){max-width:46ch;color:var(--muted);font-size:20px}.contact-ledger{border-top:1px solid var(--line)}.contact-ledger>div{display:grid;grid-template-columns:130px 1fr;gap:25px;padding:20px 0;border-bottom:1px solid var(--line)}.contact-ledger span{color:var(--muted);font-size:14px}.contact-ledger p{margin:0}.contact-ledger .text-link{margin-top:24px}.contact-page .sb-location-map--embedded{grid-column:1/-1;width:100%;margin-top:24px}.sb-location-map__canvas{position:relative;isolation:isolate;min-height:clamp(320px,38vw,460px)}.signal-map-preview{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;pointer-events:none}.sb-location-map__canvas iframe{position:relative;z-index:0}
.request-page{width:min(var(--max),calc(100% - 2 * var(--pad)));margin:auto;padding:clamp(58px,7vw,100px) 0;display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(40px,8vw,110px);align-items:start}.request-copy h1{max-width:10ch}.request-copy>p:not(.kicker){max-width:44ch;color:var(--muted);font-size:19px}.request-notes{margin-top:38px;border-top:1px solid var(--line)}.request-notes p{padding:17px 0;margin:0;border-bottom:1px solid var(--line)}.request-panel{background:#fff;border:1px solid var(--line);padding:clamp(24px,4vw,54px)}.request-panel form{display:grid;gap:20px}.request-panel label{display:grid;gap:8px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.consent{grid-template-columns:20px 1fr!important;align-items:start}.consent input{width:18px;height:18px;margin:3px 0 0}.slot-grid{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.slot-grid button{border:1px solid var(--line);background:#fff;padding:8px 11px}.slot-grid button.is-selected{background:var(--ink);color:#fff}.slot-note,.form-status{margin:8px 0 0;color:var(--muted);font-size:14px}.request-success h2{margin-bottom:18px}.request-success .button{margin-top:18px}
.site-footer .brand{min-width:0}
@media(max-width:980px){.site-menu{gap:17px}.nav-row{gap:18px}.hero{grid-template-columns:1fr 1fr;min-height:590px}.hero-copy{padding:48px 30px}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.craft,.process,.about-method,.request-page{grid-template-columns:1fr}.room{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}.footer-grid>div:last-child{grid-column:2/4}.page-intro{grid-template-columns:1fr}.page-intro>p{margin:0}.service-detail,.about-hero{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.announcement{justify-content:space-between;gap:14px;font-size:12px}.nav-row{width:calc(100% - 28px);min-height:64px}.menu-toggle{display:block;margin-left:auto}.site-menu{display:none;position:absolute;left:14px;right:14px;top:100%;margin:0;padding:16px;background:#fff;border:1px solid var(--line);flex-direction:column;align-items:stretch}.site-menu.is-open{display:flex}.language-switch{margin-left:0}.brand{min-width:0}.brand-copy small{display:none}.hero{grid-template-columns:1fr;min-height:0}.hero-copy{padding:42px 20px 34px}.hero-copy h1{font-size:clamp(38px,11vw,52px)}.hero-lede{font-size:17px;margin:16px 0}.hero-actions{gap:8px}.hero-actions .button{min-height:46px;padding:10px 14px;font-size:14px;flex:1}.hero-media{min-height:220px;max-height:260px}.hero-media img{object-position:center 42%}.section{width:calc(100% - 28px);padding:60px 0}.story,.section-head,.craft,.process,.visit,.closing,.page-intro,.service-detail,.about-hero,.about-method,.contact-page,.request-page{grid-template-columns:1fr}.story,.craft,.process,.visit{gap:32px}.section-head{gap:18px}.service-grid{grid-template-columns:1fr}.service-card-copy>p:not(.service-meta){min-height:0}.principles article{grid-template-columns:1fr;gap:8px}.room{grid-template-columns:1fr}.room figure{height:320px}.room>div{padding:42px 20px}.closing{width:calc(100% - 28px);gap:28px}.closing>div:last-child{justify-content:flex-start}.footer-grid{width:calc(100% - 28px);grid-template-columns:1fr 1fr;gap:36px;padding:50px 0}.footer-grid>div:first-child,.footer-grid>div:last-child{grid-column:1/-1}.footer-grid>div:last-child{grid-row:auto}.footer-bottom{width:calc(100% - 28px);flex-direction:column}.page-intro,.service-detail,.about-hero,.contact-page,.request-page{width:calc(100% - 28px);padding:54px 0}.catalogue{padding-top:0}.service-detail figure{grid-row:1}.about-hero figure{grid-row:1}.form-row{grid-template-columns:1fr}.contact-ledger>div{grid-template-columns:100px 1fr}.request-panel{padding:22px 16px}.sb-location-map--embedded{width:100%!important}}
@media(max-width:390px){.announcement p{max-width:220px}.announcement a{white-space:nowrap}.brand-copy{font-size:15px}.language-switch{font-size:12px}.hero-copy{padding-top:34px}.hero-copy .kicker{margin-bottom:12px}.hero-lede{max-width:34ch}.hero-media{min-height:205px}.footer-grid{grid-template-columns:1fr}.footer-grid>div{grid-column:1/-1!important}.button{width:100%}.closing>div:last-child{display:grid;width:100%}.contact-ledger>div{grid-template-columns:1fr;gap:4px}}
@media(max-width:340px){.announcement{padding-left:10px;padding-right:10px}.announcement p{max-width:190px}.brand-mark{width:34px;height:34px}.nav-row{width:calc(100% - 20px);gap:9px}.hero-actions{display:grid}.hero-media{min-height:190px}h1{font-size:36px}.section,.closing,.footer-grid,.footer-bottom,.page-intro,.service-detail,.about-hero,.contact-page,.request-page{width:calc(100% - 20px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.service-card-media img,.button{transition:none}}

/* Cobalt Workroom: full-width campaign-workroom system. */
:root{--paper:#f2f5f9;--white:#fff;--muted:#536171;--line:#c7d0dc;--accent:#2456e8;--ink:#14191f;--max:1280px;--pad:clamp(20px,5vw,76px);--focus:#ffb62e}
::selection{background:var(--accent);color:var(--on-accent,#fff)}
html{scrollbar-color:var(--accent) #dfe5ed}
body{background:var(--paper);color:var(--ink)}
.site-header{background:#fff;border-bottom-color:var(--line-strong,#aeb9c7)}
.announcement{background:var(--ink);min-height:40px;justify-content:space-between}
.announcement a{color:var(--accent-on-dark,#b9c9ff)}
.nav-row{width:calc(100% - 2 * var(--pad));max-width:none;min-height:72px}
.brand-mark{background:var(--accent);color:var(--on-accent,#fff);border-radius:2px}
.site-menu a{font-weight:600;letter-spacing:.015em}
.button{border-radius:2px;min-height:48px}
.button.primary:hover{background:var(--accent-hover,#153da9);border-color:var(--accent-hover,#153da9)}
h1{font-size:clamp(42px,5vw,72px);letter-spacing:-.035em}
h2{font-size:clamp(32px,3.7vw,54px);letter-spacing:-.03em}
.hero{position:relative;display:block;width:100%;max-width:none;min-height:calc(100svh - 112px);margin:0;background:#fff;border-bottom:1px solid var(--line);overflow:hidden}
.hero-media{position:absolute;inset:0;margin:0;min-height:0;max-height:none}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center center}
.hero-copy{position:relative;z-index:1;width:min(48rem,56vw);min-height:calc(100svh - 112px);padding:clamp(54px,7vw,104px) var(--pad);justify-content:center;align-items:flex-start}
.hero-copy h1{max-width:9.2ch;color:#101826;text-wrap:balance}
.hero-lede{max-width:35ch;margin:22px 0 28px;color:#2e3d4d;font-size:clamp(18px,1.45vw,22px)}
.hero-actions{gap:10px}
.hero-actions .secondary{background:#fff;border-color:#fff}
.story{grid-template-columns:1.25fr .75fr;align-items:start;padding-top:clamp(82px,9vw,132px)}
.story h2{max-width:11ch}.story>div:last-child{padding-top:9px}
.popular{width:100%;padding-left:max(var(--pad),calc((100% - var(--max))/2));padding-right:max(var(--pad),calc((100% - var(--max))/2));background:#fff}
.popular .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));border:0;gap:1px;background:var(--line)}
.popular .service-card{border:0}.popular .service-card:first-child{grid-column:1/-1;display:grid;grid-template-columns:1.12fr .88fr}
.popular .service-card:first-child .service-card-media{aspect-ratio:16/7}.popular .service-card:first-child .service-card-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(30px,5vw,70px)}
.popular .service-card:last-child:nth-child(2){grid-column:1/-1;display:grid;grid-template-columns:.88fr 1.12fr}
.popular .service-card:last-child:nth-child(2) .service-card-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(30px,5vw,70px)}
.service-card-copy{padding:30px}.service-card-media{aspect-ratio:16/9}
.craft{width:100%;max-width:none;padding-left:max(var(--pad),calc((100% - var(--max))/2));padding-right:max(var(--pad),calc((100% - var(--max))/2));grid-template-columns:.9fr 1.1fr;background:var(--ink);color:#fff;border:0}
.craft .principles{border-top-color:var(--rule-on-dark,#3c4652)}.craft .principles article{border-bottom-color:var(--rule-on-dark,#3c4652)}.craft .principles p{color:var(--muted-on-dark,#bdc7d4)}
.process{grid-template-columns:1fr;gap:44px}.process h2{max-width:16ch}.process ol{display:grid;grid-template-columns:repeat(3,1fr);border-top:0;border-left:1px solid var(--line)}
.process li{display:block;padding:30px;border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.process li b{border-radius:2px;background:var(--accent);color:#fff;border-color:var(--accent);margin-bottom:52px}
.room{grid-template-columns:.78fr 1.22fr;min-height:620px;background:#fff;color:var(--ink)}
.room figure{grid-column:2;grid-row:1}.room>div{grid-column:1;grid-row:1;border-right:1px solid var(--line)}.room>div>p:not(.kicker){color:var(--muted)}
.visit{grid-template-columns:1.2fr .8fr;align-items:end}.quote{text-align:left;background:var(--accent-wash,#dfe7ff);width:100%;max-width:none;padding-left:max(var(--pad),calc((100% - var(--max))/2));padding-right:max(var(--pad),calc((100% - var(--max))/2))}
.quote blockquote{margin:0 0 22px;max-width:20ch;font-size:clamp(32px,4vw,58px);letter-spacing:-.035em}
.closing{grid-template-columns:1fr auto}.site-footer{background:var(--ink);color:#fff}.site-footer .brand-copy small,.site-footer .footer-grid p,.site-footer .footer-bottom{color:var(--footer-muted,#b7c1ce)}.site-footer .footer-action{color:var(--accent-on-dark,#8ca8ff)}
.page-intro{grid-template-columns:1fr 1fr}.request-panel{border:1px solid var(--line)}
input,select,textarea{border-color:var(--line-strong,#8e9aaa)}.slot-grid button{border-radius:2px}
body .sb-lang{position:static!important;width:max-content;margin:22px 18px 10px!important}
body .bbfaq-bubble{position:static!important;margin:0 0 24px 18px!important}

@media(max-width:980px){.hero-copy{width:min(46rem,67vw)}.popular .service-card:first-child{grid-template-columns:1fr 1fr}.process ol{grid-template-columns:1fr}.process li b{margin-bottom:20px}.room{grid-template-columns:1fr 1fr}}
@media(max-width:760px){
  .announcement{justify-content:space-between}.nav-row{width:calc(100% - 28px)}
  .hero{display:flex;flex-direction:column;min-height:0}
  .hero-media{position:relative;inset:auto;order:1;width:100%;height:238px;min-height:238px;max-height:none}
  .hero-media img{object-position:70% center}
  .hero-copy{order:2;width:100%;min-height:0;padding:26px 18px 30px;background:#f7f9fc}
  .hero-copy h1{font-size:clamp(38px,10.5vw,49px);max-width:10ch}
  .hero-lede{margin:14px 0 18px;font-size:16px;line-height:1.45}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.hero-actions .button{width:100%;padding:9px 10px}
  .story,.visit{grid-template-columns:1fr}.popular{padding-left:14px;padding-right:14px}.popular .service-grid{grid-template-columns:1fr}.popular .service-card:first-child,.popular .service-card:last-child:nth-child(2){grid-column:auto;display:block}.popular .service-card:first-child .service-card-media{aspect-ratio:16/9}.popular .service-card:first-child .service-card-copy,.popular .service-card:last-child:nth-child(2) .service-card-copy{display:block;padding:25px}
  .craft{padding-left:14px;padding-right:14px}.process ol{display:block}.room{grid-template-columns:1fr}.room figure{grid-column:1;grid-row:1;height:300px}.room>div{grid-column:1;grid-row:2;border:0;border-top:1px solid var(--line)}
  .quote{padding-left:14px;padding-right:14px}.closing{grid-template-columns:1fr}.site-footer{background:var(--ink)}
}
@media(max-width:390px){.hero-media{height:218px;min-height:218px}.hero-copy{padding-top:22px}.hero-copy h1{font-size:38px}.hero-actions{gap:7px}.hero-actions .button{min-height:44px;font-size:13px}.hero-lede{max-width:38ch}.announcement p{max-width:225px}}
@media(max-width:340px){.hero-media{height:194px;min-height:194px}.hero-actions{grid-template-columns:1fr}.hero-copy h1{font-size:35px}}

/* Above phone width the words' block lies over the photograph. Clicks on
   its empty parts reach the photograph, so the editors can replace it
   (2026-09-23). On phones the block sits below the photograph. */
@media(min-width:761px){.hero-copy{pointer-events:none}.hero-copy>*{pointer-events:auto}}
/* >>> Signal revamp, ported 2026-09-25 */
/* Signal Conseil 2026-09-24: every engine, the business's own words, a photograph in every place. */
/* Hero (Tumi 2026-09-24: full-width hero images with the words on them, on a
   computer and on a phone): the photograph across the whole hero, the words
   directly on it in white over a dark fade from the words' side (the left on
   a computer, the bottom on a phone); the photograph itself is never tinted.
   On a phone it ends above the floating chat and basket buttons (their top
   sits about 130px over the screen's foot), so both of its own buttons show,
   clear, on the first screen. */
.hero{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr;align-items:end;width:100%;max-width:none;min-height:max(460px,calc(100svh - 250px));margin:0;background:var(--ink);border-bottom:0;overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:-2;width:100%;height:100%;min-height:0;max-height:none;margin:0}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 40%}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,rgba(12,16,15,.92) 0%,rgba(12,16,15,.74) 38%,rgba(12,16,15,.18) 72%,rgba(12,16,15,0) 100%)}
.hero-copy{position:relative;z-index:1;display:block;width:100%;max-width:none;padding:28px 20px 30px;color:#fff}
.hero-copy .kicker{color:var(--accent-on-dark,var(--accent))}
.hero-copy h1{max-width:13ch;color:#fff;font-size:clamp(36px,10vw,48px)}
.hero-lede{max-width:40ch;margin:16px 0 22px;color:#e6ebe8;font-size:17px;line-height:1.5}
.hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hero-actions .button{min-height:48px;padding:10px 12px}
.hero .button.secondary{border-color:#fff;color:#fff;background:transparent}
.hero .button.secondary:hover{background:#fff;color:var(--ink)}
@media(min-width:900px){
  .hero{align-items:center;min-height:clamp(600px,84vh,820px);padding:clamp(40px,7vh,90px) max(var(--pad),calc((100% - var(--max))/2))}
  .hero::before{background:linear-gradient(90deg,rgba(12,16,15,.9) 0%,rgba(12,16,15,.72) 36%,rgba(12,16,15,.2) 66%,rgba(12,16,15,0) 82%)}
  .hero-copy{width:min(620px,52%);padding:0}
  .hero-copy h1{font-size:clamp(46px,4.8vw,76px)}
  .hero-lede{font-size:20px}
  .hero-actions{display:flex;gap:12px}
  .hero-media img{object-position:center 42%}
}
/* The business's colours where they read: dark words on a light brand
   colour, the brand colour as small text only where it is dark enough. */
.button.primary{color:var(--on-accent,#fff)}
.button.primary:hover{color:#fff}
.kicker,.footer-action,.language-switch a[aria-current=true]{color:var(--accent-text,var(--accent))}
.room .kicker{color:var(--accent-on-dark,var(--accent))}
.process li b{background:var(--accent);border-color:var(--accent);color:var(--on-accent,#fff)}
/* The current page and a hovered link are marked with a line in the brand colour, never as pale text. */
.site-menu a[aria-current=page],.site-menu a:hover{color:var(--ink);box-shadow:inset 0 -3px 0 var(--accent)}
.text-link:hover,.empty-state a{color:var(--ink)}
/* However many pages the business switches on, the menu stays inside the screen. */
.site-menu{flex-wrap:wrap;justify-content:flex-end;row-gap:2px}
.site-menu:has(> a:nth-child(7)){gap:16px}.site-menu:has(> a:nth-child(7)) a{font-size:14px}
@media(min-width:761px){.site-menu:has(> a:nth-child(9)){max-width:62%}}
/* Headings keep whole lines; a heading keeps its words directly under it. */
h1,h2,h3{text-wrap:balance}
.section-head{display:block}.section-head>p{max-width:60ch;margin:14px 0 0}
/* A page's title reads top to bottom: its small line, the title, its words
   (the title was parked at the far right on a computer). */
.page-intro{grid-template-columns:1fr;gap:16px;align-items:start}.page-intro h1{max-width:16ch}.page-intro>p{margin:0}
/* A long service description stays four lines on its card; the service's own
   page shows all of it, its lines kept. A photo keeps its top in view (a
   poster's title, a face). */
.service-card-copy>p:not(.service-meta){display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;min-height:0}
.service-card-media img{object-position:center top}
.service-detail-lede{white-space:pre-line}
.service-detail figure img{object-position:center top}
.popular .service-grid .service-card .service-card-media{width:100%;min-width:0}
/* The services page's last row always closes: the last one or two services
   widen to fill it. */
@media(min-width:981px){
  .catalogue .service-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .catalogue .service-grid>.service-card{grid-column:span 2}
  .catalogue .service-grid>.service-card:last-child:nth-child(3n+1){grid-column:span 6}
  .catalogue .service-grid>.service-card:nth-last-child(2):nth-child(3n+1),.catalogue .service-grid>.service-card:last-child:nth-child(3n+2){grid-column:span 3}
  .catalogue .service-grid>.service-card:last-child:nth-child(3n+1) .service-card-media{aspect-ratio:4/1}
  .catalogue .service-grid>.service-card:nth-last-child(2):nth-child(3n+1) .service-card-media,.catalogue .service-grid>.service-card:last-child:nth-child(3n+2) .service-card-media{aspect-ratio:2/1}
}
@media(min-width:761px) and (max-width:980px){
  .catalogue .service-grid>.service-card:last-child:nth-child(odd){grid-column:1/-1}
  .catalogue .service-grid>.service-card:last-child:nth-child(odd) .service-card-media{aspect-ratio:8/3}
}
/* The basket's Add button under each priced service's words. */
.service-card{display:flex;flex-direction:column}.service-card-copy{flex:1}
.service-card>.sb-shop-add{display:inline-flex;align-self:flex-start;align-items:center;justify-content:center;gap:8px;min-height:44px;margin:0 25px 25px;padding:0 18px;border:1px solid var(--ink);border-radius:0;background:#fff;color:var(--ink);font:600 14px Barlow,Arial,sans-serif}
.service-card>.sb-shop-add:hover,.service-card>.sb-shop-add:focus-visible{background:var(--accent);border-color:var(--accent);color:var(--on-accent,var(--ink))}
.service-card>.sb-shop-add:hover .oi-add-label{color:inherit;mix-blend-mode:normal}
/* The map sits right under the visit words, as wide as they are. */
.visit{row-gap:clamp(28px,4vw,44px)}
.visit>.sb-location-map--embedded{grid-column:1/-1;width:100%;margin:0}
/* In the editors each photo sits in a wrapper while it can be replaced: the wrapper fills the photo's box. */
.service-card-media>[data-paurtal-img-wrap],.room figure>[data-paurtal-img-wrap],.about-hero figure>[data-paurtal-img-wrap],.service-detail figure>[data-paurtal-img-wrap]{display:block!important;width:100%;height:100%}
.hero-media>[data-paurtal-img-wrap]{position:absolute!important;inset:0;width:100%!important;height:100%!important}
/* The engines' photos fill their frames in the editors too (the photos are
   4:3, the frames 16:10), and a tap beside the hero's words reaches the
   photo, so it can be replaced on a phone; the words and buttons keep theirs. */
.eng-card__photo>[data-paurtal-img-wrap]{display:block!important;width:100%;height:100%}
.hero-copy{pointer-events:none}.hero-copy>*{pointer-events:auto}
/* The engines, in Signal's own look (the tokens engines.css reads). */
:root{--ground:#fff;--surface:var(--paper);--surface-2:#e5e9e3;--ink-soft:var(--muted);--radius:0px;--radius-sm:0px;--radius-btn:0px;--primary:var(--accent);--on-primary:var(--on-accent,#fff);--primary-text:var(--accent-text,var(--accent));--font-display:Archivo,Arial,sans-serif;--font-body:Barlow,Arial,sans-serif}
.eng-sec{border-bottom:1px solid var(--line)}
.eng-head h2{max-width:15ch}
.eng-head .eng-lead{max-width:48ch;margin:14px 0 0;color:var(--muted)}
.eng-link{font-weight:600;border-bottom:1px solid currentColor;padding-bottom:3px}
.eng-card{border:1px solid var(--line);border-radius:0;background:#fff}
.eng-card__body h3{font-family:Archivo,Arial,sans-serif;letter-spacing:-.02em}
.eng-card .button{margin-top:auto}
.eng-figures-band{background:#fff;border-top:1px solid var(--line)}
.eng-figures-band .eng-figure{border-left-color:var(--accent)}
.eng-figures-band .eng-figure strong{color:var(--ink);font-family:Archivo,Arial,sans-serif;font-size:clamp(40px,4vw,64px);letter-spacing:-.04em}
.eng-date{background:var(--ink);color:var(--accent-on-dark,var(--accent))}
.eng-review{background:#fff;border:1px solid var(--line);border-radius:0}
.eng-request__form,.eng-aside,.eng-success{background:#fff;border:1px solid var(--line);border-radius:0}
.eng-page-intro h1{max-width:13ch}
.eng-sec.eng-page{padding-top:0}
.eng-off .eng-wrap{display:grid;justify-items:center;gap:18px;text-align:center}.eng-off h1{max-width:18ch;margin-inline:auto}
@media(max-width:760px){.room figure{height:280px}.closing>div:last-child{justify-content:flex-start}}

/* Tumi 2026-09-24, "these type of texts ... should spread out": a heading
   spreads across its side of the section instead of standing in a narrow
   column at the far left. In two-column sections the heading gets the wider
   or an equal side and a moderate gap; long page titles are a size smaller;
   on a phone every heading uses the full width. */
.story h2,.craft h2,.process h2,.room h2,.visit h2,.closing h2,.about-hero h1,.about-method h2,.contact-page h1,.request-copy h1{max-width:none}
.section-head h2{max-width:26ch}
.about-hero h1,.contact-page h1,.request-copy h1{font-size:clamp(34px,3.8vw,54px)}
.story h2,.craft h2,.process h2,.visit h2,.about-method h2,.room h2{font-size:clamp(30px,3.4vw,48px)}
@media(min-width:761px){
  .story{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(32px,5vw,72px)}
  .visit{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px)}
  .room{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .room>div{padding:clamp(32px,4.5vw,64px)}
  .contact-page{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px)}
}
@media(min-width:981px){
  .craft,.process,.about-method{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,5vw,72px)}
  .request-page{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px)}
  .about-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

/* Tumi 2026-09-24, "you tend to make some sections very very huge in terms
   of space": about half the room above and below each section (two
   sections met across 200 to 270px of empty page on a laptop). */
.section,.closing{padding-block:clamp(40px,5vw,68px)}
@media(max-width:760px){.section,.closing{padding-block:40px}}
/* On a phone the words lie on the photograph too (goal 2026-09-25), over this
   design's own phone layout (the photo above, the words on a pale band). */
.hero{grid-template-rows:none}
.hero-media{position:absolute;inset:0;grid-row:auto;grid-column:auto;width:100%;height:100%;min-height:0;max-height:none}
.hero-copy{position:relative;grid-row:auto;grid-column:auto;display:block;background:none}
.hero-copy h1{color:#fff}.hero-lede{color:#e6ebe8}
@media(min-width:900px){.hero-copy{width:min(620px,52%);min-height:0;padding:0}.hero-copy h1{max-width:13ch}.hero-actions{display:flex;width:auto}.hero-actions .button{width:auto}}
@media(max-width:760px){.hero{display:grid;min-height:max(460px,calc(100svh - 250px))}.hero-media{position:absolute;inset:0;order:0;width:100%;height:100%;min-height:0;max-height:none}.hero-copy{order:0;width:100%;background:none;padding:28px 20px 30px;pointer-events:none}.hero-copy>*{pointer-events:auto}.hero-copy h1{color:#fff}.hero-lede{color:#e6ebe8}}
/* Cobalt and Wouri (Signal port): every service card the same size, the
   steps across the whole page under their heading, and on a phone every
   two-part band stacked in one column. */
:root body .popular .service-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:clamp(16px,2vw,24px);background:none;border:0}
:root body .popular .service-grid > .service-card{grid-column:auto;display:flex;flex-direction:column;border:1px solid var(--line)}
:root body .popular .service-grid > .service-card > .service-card-media{aspect-ratio:4/3}
:root body .popular .service-grid > .service-card > .service-card-copy{display:block;padding:25px}
:root body .process{grid-template-columns:1fr}
:root body .process h2{max-width:none}
@media(max-width:760px){
  :root body :is(.story,.craft,.process,.visit,.closing,.room){grid-template-columns:1fr}
  :root body .principles article{grid-template-columns:1fr;gap:6px}
}
/* <<< Signal revamp, ported 2026-09-25 */
/* Wide screens (2026-09-26, Tumi: "most hero images are cropped"): from 1500px
   the hero grows with the width (45vw: about 60% of a 4:3 photograph shows,
   instead of half), and a business's own photograph is framed on its upper
   part, where heads are; the design's own photograph keeps its faces. */
@media(min-width:1500px){.hero{min-height:max(clamp(600px,84vh,820px),45vw)}.hero-media img{object-position:50% 30%}.hero-media img[src*="cobalt-hero-workshop"]{object-position:62% 42%}}