/* ==========================================================================
   Tokens
   ========================================================================== */
:root{
  --ink:#0e0d0c; --surface:#161412; --text:#efe9df; --muted:#b3aa9d;
  --line:#2a2622; --control:#6e675e; --accent:#c9a983;
  --serif:"Fraunces", Georgia, "Times New Roman", serif;
  --sans:"Inter Tight", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  /* shared grid: mobile 4 / 12 / 16 */
  --cols:4; --gap:12px; --m:16px; --hdr:64px; --maxw:1320px;
  --sec:clamp(96px, 12vw, 160px);
}
@media (min-width:600px){ :root{ --cols:8; --gap:16px; --m:32px; } }
@media (min-width:1024px){ :root{ --cols:12; --gap:24px; --m:48px; --hdr:72px; } }

/* ==========================================================================
   Base
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; background:var(--ink); }
@media (prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
body{
  margin:0; min-width:0; background:var(--ink); color:var(--text);
  font:400 16px/1.6 var(--sans);
  font-variant-numeric:tabular-nums lining-nums;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
@media (min-width:768px){ body{ font-size:17px; } }
h1,h2,h3,p,ul,ol,dl,dd,figure{ margin:0; }
ul,ol{ padding:0; list-style:none; }
img,video,svg{ display:block; max-width:100%; }
img{ color:transparent; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; letter-spacing:inherit; }
button{ cursor:pointer; background:none; border:0; padding:0; border-radius:0; }
h1,h2,h3{ font-family:var(--serif); font-weight:300; font-optical-sizing:auto; text-wrap:balance; }
p,li,dd{ text-wrap:pretty; }
em{ font-style:italic; }
::selection{ background:var(--accent); color:var(--ink); }
:focus-visible{ outline:1px solid var(--accent); outline-offset:4px; }
:focus:not(:focus-visible){ outline:none; }
[id]{ scroll-margin-top:var(--hdr); }
section[id]{ scroll-margin-top:0; }

.visually-hidden{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}
.skip{
  position:fixed; left:var(--m); top:12px; z-index:100; transform:translateY(-200%);
  background:var(--text); color:var(--ink); padding:12px 16px; border-radius:2px;
  font-weight:500; font-size:15px;
}
.skip:focus{ transform:none; }

/* ==========================================================================
   Layout
   ========================================================================== */
.wrap{ width:100%; max-width:calc(var(--maxw) + 2 * var(--m)); margin-inline:auto; padding-inline:var(--m); }
.grid{ display:grid; grid-template-columns:repeat(var(--cols), minmax(0,1fr)); column-gap:var(--gap); }
.grid > *{ grid-column:1 / -1; min-width:0; }

.section{ padding-top:var(--sec); }
.section > .grid::before{ /* top hairline across the content width */
  content:""; grid-column:1 / -1; height:1px; background:var(--line); margin-bottom:24px;
}
.sec-head{ margin-top:16px; }
@media (min-width:1024px){
  .section > .grid{ align-items:start; }
  .sec-label{ grid-column:1 / 4; grid-row:2; align-self:baseline; }
  .sec-head{ grid-column:4 / 13; grid-row:2; align-self:baseline; margin-top:0; }
}

/* ==========================================================================
   Type
   ========================================================================== */
.label{
  font-family:var(--sans); font-weight:500; font-size:11px; line-height:1.6;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
.h1{ font-size:clamp(56px, calc(21px + 9.39vw), 156px); line-height:.92; letter-spacing:-.03em; }
.h2{ font-size:clamp(40px, calc(26px + 3.76vw), 80px); line-height:1; letter-spacing:-.02em; }
.h3{ font-size:clamp(26px, calc(20px + 1.6vw), 40px); line-height:1.1; letter-spacing:-.01em; }
.display{ font-size:clamp(44px, calc(22px + 5.9vw), 120px); line-height:.95; letter-spacing:-.03em; }
.lead{ font-size:clamp(18px, calc(16px + .56vw), 22px); line-height:1.45; }
.muted{ color:var(--muted); }
.num-i{ font-family:var(--serif); font-style:italic; font-weight:300; font-size:20px; line-height:1; }
.sec-head .lead{ margin-top:24px; max-width:40ch; color:var(--muted); }

/* middot lists that wrap cleanly: the leading dot of every line is clipped */
.dots{ overflow:hidden; }
.dots > ul{ display:flex; flex-wrap:wrap; margin-left:-2em; }
.dots li{ white-space:nowrap; }
.dots li::before{ content:"\00b7"; display:inline-block; width:2em; text-align:center; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  height:52px; padding:0 28px; border:1px solid var(--text); border-radius:2px;
  font:500 15px/1 var(--sans); letter-spacing:.01em; white-space:nowrap;
  transition:background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.btn--solid{ background:var(--text); color:var(--ink); }
.btn--solid:hover{ background:transparent; color:var(--text); }
.btn--outline{ background:transparent; color:var(--text); }
.btn--outline:hover{ background:var(--text); color:var(--ink); }
.btn--sm{ height:36px; padding:0 16px; font-size:14px; }
.btn--block{ display:flex; width:100%; height:56px; }
.btn .arr{ display:inline-block; transition:transform .25s var(--ease); }
.btn:hover .arr{ transform:translateX(4px); }

/* ==========================================================================
   Header
   ========================================================================== */
.hdr{
  position:fixed; inset:0 0 auto 0; z-index:40; height:var(--hdr);
  border-bottom:1px solid transparent;
  transition:background-color .4s var(--ease), border-color .4s var(--ease);
}
.hdr.is-scrolled{
  background:rgba(14,13,12,.85); border-bottom-color:var(--line);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
}
.hdr .wrap{ height:100%; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand{ font-family:var(--serif); font-weight:400; font-size:18px; line-height:1; letter-spacing:-.005em; white-space:nowrap; }
.nav{ display:flex; align-items:center; gap:32px; }
.nav-links{ display:none; gap:28px; }
.nav-links a{ display:inline-flex; align-items:center; height:44px; transition:color .25s var(--ease); }
.nav-links a:hover{ color:var(--text); }
@media (min-width:768px){ .nav-links{ display:flex; } }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{ padding-top:calc(var(--hdr) + clamp(40px, 7vw, 96px)); }
.hero-label{ display:flex; align-items:flex-start; gap:16px; margin-bottom:clamp(24px, 3vw, 40px); }
.hero-label::before{ /* the single accent hairline on the page, centred on the first text line */
  content:""; flex:none; width:32px; height:1px; margin-top:calc(.8em - .5px); background:var(--accent);
}
.hero-label .dots{ flex:1 1 auto; min-width:0; }
.hero-title .line{ display:block; overflow:hidden; padding:0 .1em .1em; margin:0 -.1em -.1em; }
.hero-title .line > *{ display:inline-block; }
.hero-title em{ font-weight:300; }
/* optical alignment: pull the upright E back by its side bearing, push the italic A's overhang in */
.hero-title .line:first-child > *{ margin-left:-.031em; }
.hero-title .line:last-child > *{ margin-left:.063em; }
.motion-ok .hero-title .line > *{ transform:translateY(112%); animation:lineUp 1000ms var(--ease) 120ms forwards; }
.motion-ok .hero-title .line + .line > *{ animation-delay:240ms; }
@keyframes lineUp{ to{ transform:none; } }
.hero-copy{ margin-top:clamp(32px, 4vw, 48px); }
.hero-copy .lead{ max-width:30ch; }
.hero-aud{ margin-top:16px; color:var(--muted); max-width:44ch; }
.cta-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.cta-row .btn{ flex:1 1 auto; }
.trust{ margin-top:24px; }
.hero-media{ margin-top:48px; }
.tile{ position:relative; aspect-ratio:4 / 5; background:var(--surface); border-radius:2px; overflow:hidden; }
.tile video,.tile img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .3s linear;
}
.tile .is-on{ opacity:1; }
.no-js .tile img,.no-js .media-frame img{ opacity:1; }
.no-js .tile img[data-media],.no-js .media-frame img[data-media]{ display:none; }
.hero-role{ display:block; margin-top:24px; }
.tile img.is-on{ transition-duration:.6s; }
.tile-cap{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:44px; margin-top:4px; }
.tile-toggle{ display:inline-flex; align-items:center; height:44px; margin-right:-.16em; transition:color .25s var(--ease); }
.tile-toggle:hover{ color:var(--text); }
.tile-toggle[hidden]{ display:none; }
.niches{ margin-top:clamp(64px, 8vw, 96px); padding-top:20px; border-top:1px solid var(--line); }

@media (min-width:600px){
  .cta-row .btn{ flex:0 0 auto; }
  .hero-label{ grid-column:1 / -1; grid-row:1; }
  .hero-title{ grid-column:1 / 5; grid-row:2; }
  .hero-copy{ grid-column:1 / 5; grid-row:3; }
  .hero-media{ grid-column:5 / 9; grid-row:2 / 4; align-self:start; margin-top:0; }
  .hero-copy .cta-row .btn{ flex:1 1 auto; }
}
@media (min-width:1024px){
  .hero-label{ grid-column:1 / 8; grid-row:1; }
  .hero-title{ grid-column:1 / 9; grid-row:2; }
  .hero-copy{ grid-column:1 / 7; grid-row:3; }
  .hero-copy .cta-row .btn{ flex:0 0 auto; }
  .hero-media{ grid-column:9 / 13; }
}

/* ==========================================================================
   Work
   ========================================================================== */
.gallery{ margin-top:clamp(48px, 6vw, 80px); row-gap:clamp(32px, 4vw, 56px); }
.gallery > .card{ grid-column:span 2; container-type:inline-size; }
.gallery > .card--wide,.gallery > .card--feature{ grid-column:1 / -1; }
@media (min-width:600px){ .gallery > .card{ grid-column:span 4; } .gallery > .card--wide,.gallery > .card--feature{ grid-column:1 / -1; } }
/* desktop: rows of three (10 verticals + "next film" tile + wedding film), then the two landscape films side by side */
@media (min-width:1024px){ .gallery > .card--feature{ grid-column:span 4; } .gallery > .card--wide{ grid-column:span 6; } }

.card-btn{ display:block; width:100%; text-align:left; position:relative; }
.card-btn:focus-visible{ outline-offset:6px; }
.frame{ position:relative; display:block; aspect-ratio:9 / 16; background:var(--surface); border-radius:2px; overflow:hidden; }
@media (min-width:1024px){ .frame{ aspect-ratio:4 / 5; } }
.card--wide .frame{ aspect-ratio:16 / 9; }
.gallery > .yt-card{ grid-column:1 / -1; }
/* "next film" tile: fills the free cell so every row of the grid stays full */
.gallery > .cta-card{ grid-column:1 / -1; }
@media (min-width:1024px){ .gallery > .cta-card{ grid-column:span 4; } }
.cta-tile{ display:flex; flex-direction:column; justify-content:flex-end; gap:12px; height:100%; min-height:180px;
  padding:clamp(16px, 2.4vw, 32px); border:1px solid var(--line); border-radius:2px; transition:border-color .25s var(--ease), background-color .25s var(--ease); }
.cta-t{ font-family:var(--serif); font-weight:300; font-size:clamp(20px, calc(12px + 1.6vw), 34px); line-height:1.15; letter-spacing:-.01em; }
.cta-l{ font-size:14px; color:var(--muted); }
.cta-tile:hover{ border-color:var(--text); }
.cta-tile:hover .cta-l{ color:var(--text); }
.cta-tile:focus-visible{ outline-offset:6px; }
.yt-link{ display:block; }
.yt-card .yt-frame{ aspect-ratio:16 / 9; }
.yt-frame img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.yt-link:hover .ring{ border-color:var(--text); background:rgba(14,13,12,.4); }
.yt-link:focus-visible{ outline-offset:6px; }
.frame video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .6s linear, transform 1.2s var(--ease);
}
.frame video.is-loaded{ opacity:1; }
@media (hover:hover){
  .motion-ok .card-btn:hover .frame video{ transform:scale(1.03); }
}
.ring{
  position:absolute; left:12px; bottom:12px; z-index:1; width:40px; height:40px; border-radius:50%;
  border:1px solid rgba(239,233,223,.5); background:rgba(14,13,12,.24);
  display:grid; place-items:center; transition:border-color .25s var(--ease), background-color .25s var(--ease);
}
.ring svg{ width:10px; height:12px; margin-left:2px; fill:var(--text); }
.card-btn:hover .ring{ border-color:var(--text); background:rgba(14,13,12,.4); }
.card.is-playing .ring{ opacity:0; transition:opacity .4s var(--ease); }

.cap{ display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:12px; align-items:baseline; margin-top:14px; }
.cap-t{ font-family:var(--serif); font-weight:400; font-size:18px; line-height:1.3; }
.cap-m{ grid-column:2; grid-row:1; white-space:nowrap; margin-right:-.16em; }
.cap-c{ grid-column:1 / -1; font-size:14px; line-height:1.45; color:var(--muted); margin-top:2px; }
@container (max-width:239px){
  .cap{ grid-template-columns:minmax(0,1fr); }
  .cap-m{ grid-column:1; grid-row:3; margin-top:6px; margin-right:0; }
}

/* brand film: a feature card spanning both columns below 1024px */
.fpanel{ display:none; }
@media (max-width:1023.98px){
  .card--feature .card-btn{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:var(--gap); }
  .card--feature .cap{ display:none; }
  .fpanel{ display:flex; flex-direction:column; min-width:0; border-top:1px solid var(--line); padding-top:16px; }
  .fp-t{ font-family:var(--serif); font-weight:300; font-size:clamp(22px, calc(14px + 2.4vw), 36px); line-height:1.1; letter-spacing:-.01em; }
  .fp-m{ margin-top:12px; }
  .fp-d{ margin-top:8px; font-size:14px; line-height:1.45; color:var(--muted); }
  .fp-play{ display:flex; align-items:center; gap:12px; margin-top:auto; padding-top:16px; }
  .fp-play .ring{ position:static; flex:none; }
}

/* ==========================================================================
   Services
   ========================================================================== */
.svc{ margin-top:clamp(48px, 6vw, 80px); border-top:1px solid var(--line); }
.svc-row{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); column-gap:var(--gap); row-gap:12px;
  align-items:baseline; padding:28px 0 32px; border-bottom:1px solid var(--line);
}
.svc-row > *{ min-width:0; }
.svc-row .num-i{ grid-column:1; }
.svc-row h3{ grid-column:2 / -1; }
.svc-row p{ grid-column:2 / -1; color:var(--muted); max-width:52ch; }
@media (min-width:600px){
  .svc-row{ grid-template-columns:repeat(8, minmax(0,1fr)); padding:32px 0 40px; }
  .svc-row h3{ grid-column:2 / 5; }
  .svc-row p{ grid-column:5 / 9; }
}
@media (min-width:1024px){
  .svc{ grid-column:4 / 13; }
  .svc-row{ grid-template-columns:repeat(9, minmax(0,1fr)); }
  .svc-row h3{ grid-column:2 / 6; }
  .svc-row p{ grid-column:6 / 10; }
}

/* ==========================================================================
   Sectors (rows reuse .svc / .svc-row)
   ========================================================================== */
.ind-index{ margin-top:32px; }
.ind-index ol{ display:flex; flex-wrap:wrap; column-gap:24px; margin:0; padding:0; list-style:none; }
.ind-index a{ display:inline-flex; align-items:center; min-height:44px; color:var(--muted); transition:color .25s var(--ease); }
.ind-index a:hover{ color:var(--text); }
.ind .svc{ margin-top:16px; }
.ind-row{ scroll-margin-top:calc(var(--hdr) + 16px); }
.ind-row h3{ overflow-wrap:break-word; }
.ind-body{ grid-column:2 / -1; min-width:0; }
.ind-body > p{ color:var(--muted); max-width:52ch; }
.ind-meta{ margin:20px 0 0; border-top:1px solid var(--line); max-width:52ch; }
.ind-meta > div{ padding:12px 0 14px; border-bottom:1px solid var(--line); }
.ind-meta dd{ margin:4px 0 0; font-size:15px; line-height:1.5; color:var(--text); }
@media (min-width:600px){ .ind-body{ grid-column:5 / 9; } }
.ind-any{ margin-top:32px; max-width:46ch; color:var(--muted); }
.ind-any a{ color:var(--text); border-bottom:1px solid var(--line); white-space:nowrap; }
@media (min-width:1024px){ .ind-any{ grid-column:4 / 13; grid-row:4; } }
@media (min-width:1024px){
  .ind-index{ grid-column:1 / 4; grid-row:3; align-self:start; position:sticky; top:calc(var(--hdr) + 32px); margin-top:clamp(48px, 6vw, 80px); }
  .ind-index ol{ flex-direction:column; }
  .ind-index a{ min-height:36px; }
  .ind .svc{ grid-row:3; margin-top:clamp(48px, 6vw, 80px); }
  .ind-body{ grid-column:6 / 10; }
}

/* ==========================================================================
   Investment
   ========================================================================== */
.inv-list{ margin:clamp(48px, 6vw, 80px) 0 0; padding:0; list-style:none; border-top:1px solid var(--line); }
.inv-row{
  display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:var(--gap); row-gap:8px;
  align-items:baseline; padding:24px 0 28px; border-bottom:1px solid var(--line);
}
.inv-row > *{ min-width:0; margin:0; }
.inv-name{ grid-column:1; font-family:var(--serif); font-weight:300; font-size:clamp(22px, calc(18px + 1vw), 30px); line-height:1.15; letter-spacing:-.01em; }
.inv-price{ grid-column:2; grid-row:1; text-align:right; white-space:nowrap; font-family:var(--serif); font-weight:300; line-height:1; }
.inv-from,.inv-per{ font-style:italic; font-size:15px; letter-spacing:0; color:var(--muted); }
.inv-amt{ font-size:clamp(26px, calc(20px + 1.6vw), 40px); letter-spacing:-.015em; font-variant-numeric:proportional-nums lining-nums; }
.inv-incl{ grid-column:1 / -1; max-width:46ch; font-size:15px; line-height:1.5; color:var(--muted); }
.inv-foot{ margin-top:32px; }
.inv-note{ max-width:52ch; color:var(--muted); }
.inv-terms{ margin-top:12px; max-width:52ch; font-size:14px; color:var(--muted); }
.inv-foot .btn{ margin-top:32px; }
@media (min-width:600px){
  .inv-row{ padding:28px 0 32px; }
  .inv-incl{ grid-column:1; }
}
@media (min-width:1024px){
  .inv-list,.inv-foot{ grid-column:4 / 13; }
  .inv-row{ grid-template-columns:repeat(9, minmax(0,1fr)); padding:32px 0 36px; }
  .inv-name{ grid-column:1 / 4; }
  .inv-incl{ grid-column:4 / 7; grid-row:1; }
  .inv-price{ grid-column:7 / 10; grid-row:1; }
}

/* ==========================================================================
   Process
   ========================================================================== */
.proc-photo{ margin-top:clamp(40px, 6vw, 64px); }
.media-frame{ position:relative; display:block; aspect-ratio:4 / 5; background:var(--surface); border-radius:2px; overflow:hidden; }
.media-frame img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .6s linear; }
.media-frame img.is-loaded{ opacity:1; }
/* About: background-free cut-out that melts into the page */
.media-frame.cutout{ aspect-ratio:auto; background:radial-gradient(58% 46% at 50% 40%, rgba(201,169,131,.09), rgba(201,169,131,0) 72%); overflow:visible; border-radius:0; }
.media-frame.cutout img{ position:relative; inset:auto; width:100%; height:auto; object-fit:contain;
  -webkit-mask-image:linear-gradient(to bottom,#000 82%,transparent 100%); mask-image:linear-gradient(to bottom,#000 82%,transparent 100%); }
@media (max-width:599px){ .media-frame.cutout img{ width:86%; margin:0 auto; display:block; } }
.steps{ margin-top:clamp(40px, 6vw, 64px); display:grid; grid-template-columns:minmax(0,1fr); gap:32px var(--gap); }
.step{ border-top:1px solid var(--line); padding-top:16px; min-width:0; }
.step h3{ font-size:24px; line-height:1.15; letter-spacing:-.005em; margin-top:20px; }
.step p{ margin-top:12px; color:var(--muted); }
@media (min-width:600px){
  .proc-photo{ grid-column:1 / 4; grid-row:3; }
  .proc .sec-head{ grid-column:4 / 9; grid-row:3; align-self:end; margin-top:0; }
  .steps{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (min-width:1024px){
  .proc .sec-head{ grid-column:4 / 13; grid-row:2; align-self:baseline; }
  .proc-photo{ grid-column:1 / 4; grid-row:3; margin-top:clamp(48px, 5vw, 72px); }
  .steps{ grid-column:4 / 13; grid-row:3; margin-top:clamp(48px, 5vw, 72px); }
}
@media (min-width:1280px){ .steps{ grid-template-columns:repeat(4, minmax(0,1fr)); } }

/* ==========================================================================
   About
   ========================================================================== */
.about-photo{ margin-top:16px; }
.about-text{ margin-top:40px; }
.statement{ font-family:var(--serif); font-weight:300; text-wrap:balance; }
.about-text p:not(.statement){ margin-top:20px; color:var(--muted); max-width:56ch; }
.about-text .statement + p{ margin-top:32px; }
.facts{ margin-top:40px; border-top:1px solid var(--line); }
.fact{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:14px 0; border-bottom:1px solid var(--line); }
.fact dd{ font-family:var(--serif); font-size:18px; line-height:1.3; text-align:right; }
@media (min-width:600px){
  .about-photo{ grid-column:1 / 5; grid-row:3; }
  .about-text{ grid-column:5 / 9; grid-row:3; margin-top:16px; }
}
@media (min-width:1024px){
  .about .about-label{ grid-column:1 / 4; grid-row:2; }
  .about-photo{ grid-column:4 / 8; grid-row:2; margin-top:0; }
  .about-text{ grid-column:8 / 13; grid-row:2; margin-top:0; }
}

/* ==========================================================================
   Enquiry
   ========================================================================== */
.section--last{ padding-bottom:var(--sec); }
.enq-contact{ margin-top:clamp(40px, 6vw, 64px); border-top:1px solid var(--line); }
.crow{ padding:14px 0 16px; border-bottom:1px solid var(--line); min-width:0; }
.crow dd{ margin-top:4px; font-family:var(--serif); font-size:20px; line-height:1.35; overflow-wrap:anywhere; }
.crow a{ background:linear-gradient(currentColor,currentColor) 0 100% / 0 1px no-repeat; transition:background-size .4s var(--ease); }
.crow a:hover{ background-size:100% 1px; }
.form{ margin-top:clamp(40px, 6vw, 64px); container-type:inline-size; }
@media (min-width:600px){
  .enq-contact{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:var(--gap); }
}
@media (min-width:1024px){
  .enq-contact{ display:block; grid-column:4 / 8; grid-row:3; margin-top:clamp(56px, 6vw, 80px); }
  .form{ grid-column:8 / 13; grid-row:3; margin-top:clamp(56px, 6vw, 80px); padding-top:14px; border-top:1px solid var(--line); }
}

.form-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:28px var(--gap); }
@container (min-width:480px){
  .form-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .f-full{ grid-column:1 / -1; }
}
.req-note{ font-size:14px; color:var(--muted); margin-bottom:24px; }
.field{ display:flex; flex-direction:column; min-width:0; }
.field > label{ display:block; }
.field input,.field select,.field textarea{
  display:block; width:100%; min-width:0; margin-top:4px;
  background:transparent; border:0; border-bottom:1px solid var(--control); border-radius:2px 2px 0 0;
  color:var(--text); font-family:var(--sans); font-size:16px; line-height:1.4;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
  -webkit-appearance:none; appearance:none;
}
.field input,.field select{ height:52px; padding:0; }
.field textarea{ padding:14px 0; min-height:calc(5 * 1.6em + 28px); line-height:1.6; resize:vertical; }
.field select{
  padding-right:28px; cursor:pointer;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23b3aa9d' stroke-width='1.2'/%3E%3C/svg%3E") right 2px center / 12px 8px no-repeat;
}
.field select:has(option[value=""]:checked){ color:var(--muted); }
.field select option{ background:var(--surface); color:var(--text); }
.field ::placeholder{ color:#8f877c; opacity:1; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-bottom-color:var(--accent); box-shadow:0 1px 0 0 var(--accent); }
.field input:-webkit-autofill{ -webkit-text-fill-color:var(--text); box-shadow:0 0 0 100px var(--ink) inset; caret-color:var(--text); }
.form.was-validated :is(input,select,textarea):invalid{ border-bottom-color:#d9a08f; }

.check{ display:grid; grid-template-columns:20px minmax(0,1fr); gap:14px; align-items:start; }
.check input{
  -webkit-appearance:none; appearance:none; width:20px; height:20px; margin:2px 0 0;
  border:1px solid var(--control); border-radius:2px; background:transparent; cursor:pointer;
  display:grid; place-items:center; transition:background-color .2s var(--ease), border-color .2s var(--ease);
}
.check input::after{ content:""; width:10px; height:6px; border:solid var(--ink); border-width:0 0 1.5px 1.5px; transform:translateY(-1px) rotate(-45deg); opacity:0; }
.check input:checked{ background:var(--text); border-color:var(--text); }
.check input:checked::after{ opacity:1; }
.check input:focus-visible{ outline:1px solid var(--accent); outline-offset:4px; }
.form.was-validated .check input:invalid{ border-color:#d9a08f; }
.check label{ font-size:15px; line-height:1.5; color:var(--muted); cursor:pointer; }
.form .btn--block{ margin-top:8px; }
.fine{ font-size:14px; line-height:1.5; color:var(--muted); }
.fine a{ color:var(--text); border-bottom:1px solid var(--line); }

/* ==========================================================================
   Footer
   ========================================================================== */
.ftr .grid::before{ content:""; grid-column:1 / -1; height:1px; background:var(--line); }
.ftr .grid{ row-gap:12px; padding-bottom:calc(72px + env(safe-area-inset-bottom)); }
.ftr .grid > :nth-child(1){ margin-top:32px; }
.f-brand{ font-family:var(--serif); font-size:18px; line-height:1.4; }
.f-contact,.f-legal{ font-size:14px; line-height:1.6; color:var(--muted); }
.f-contact a,.f-legal a{ transition:color .25s var(--ease); }
.f-contact a:hover,.f-legal a:hover{ color:var(--text); }
.f-sep{ display:inline-block; width:1.5em; text-align:center; }
@media (min-width:768px){ .ftr .grid{ padding-bottom:48px; } }
@media (min-width:1024px){
  .ftr .grid{ align-items:baseline; }
  .ftr .grid > *{ margin-top:32px; }
  .f-brand{ grid-column:1 / 4; }
  .f-contact{ grid-column:4 / 9; }
  .f-legal{ grid-column:9 / 13; text-align:right; }
}
@media (max-width:1023.98px){ .f-contact .f-sep{ display:none; } .f-contact a{ display:block; width:max-content; } }

/* ==========================================================================
   Mobile action bar
   ========================================================================== */
.mbar{
  position:fixed; left:0; right:0; bottom:0; z-index:30;
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--gap);
  height:calc(56px + env(safe-area-inset-bottom)); align-items:stretch;
  padding:7px var(--m) calc(8px + env(safe-area-inset-bottom));
  background:rgba(14,13,12,.92); border-top:1px solid var(--line);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  transform:translateY(100%); visibility:hidden;
  transition:transform .4s var(--ease), visibility 0s linear .4s;
}
.mbar .btn{ height:auto; padding:0 12px; }
.mbar.is-visible{ transform:none; visibility:visible; transition:transform .4s var(--ease), visibility 0s; }
@media (min-width:768px){ .mbar{ display:none; } }

/* ==========================================================================
   Lightbox
   ========================================================================== */
.lb{
  position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none;
  margin:0; padding:0; border:0; background:var(--ink); color:var(--text);
  opacity:0; transition:opacity .3s var(--ease); overscroll-behavior:contain;
}
.lb.is-open{ opacity:1; }
.lb::backdrop{ background:transparent; }
.lb-inner{
  display:grid; grid-template-rows:auto minmax(0,1fr); height:100%;
  width:100%; max-width:calc(var(--maxw) + 2 * var(--m)); margin-inline:auto;
  padding:0 var(--m) calc(var(--m) + env(safe-area-inset-bottom));
}
.lb-bar{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:72px; padding-block:12px; }
.lb-meta{ min-width:0; }
.lb-title{ font-family:var(--serif); font-size:18px; line-height:1.3; }
.lb-sub{ margin-top:2px; }
.lb-ctrl{ display:flex; align-items:center; gap:4px; flex:none; }
.icon-btn{ width:44px; height:44px; display:grid; place-items:center; color:var(--muted); border-radius:2px; transition:color .25s var(--ease); }
.icon-btn:hover{ color:var(--text); }
.icon-btn svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.2; }
.lb-close{ height:44px; margin-left:8px; }
.lb-stage{ display:grid; place-items:center; min-height:0; }
.lb-frame{
  --arn:.5625; --h:min(88vh, calc(100vh - 72px - 2 * var(--m)));
  width:min(100%, calc(var(--h) * var(--arn))); aspect-ratio:var(--ar, 9 / 16);
  background:var(--surface); border-radius:2px; overflow:hidden;
}
@supports (height:100svh){ .lb-frame{ --h:min(88svh, calc(100svh - 72px - 2 * var(--m))); } }
.lb-frame video{ width:100%; height:100%; object-fit:contain; background:var(--surface); }

/* ==========================================================================
   Reveal on scroll
   ========================================================================== */
.motion-ok [data-reveal]{
  opacity:0; transform:translateY(16px);
  transition:opacity .9s var(--ease) var(--d, 0ms), transform .9s var(--ease) var(--d, 0ms);
}
.motion-ok [data-reveal].is-in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important; animation-iteration-count:1!important;
    transition-duration:.01ms!important; transition-delay:0ms!important; scroll-behavior:auto!important;
  }
  [data-reveal],.hero-title .line > *{ opacity:1!important; transform:none!important; }
}

/* ==========================================================================
   FAQ (home + landing pages)
   ========================================================================== */
.faq{ margin-top:clamp(48px, 6vw, 80px); border-top:1px solid var(--line); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{
  list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:baseline; gap:24px;
  padding:24px 0; font-family:var(--serif); font-weight:300; font-size:clamp(20px, calc(16px + .9vw), 26px);
  line-height:1.25; letter-spacing:-.005em;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; flex:none; font-family:var(--sans); font-size:22px; color:var(--muted); transition:transform .25s var(--ease); }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq summary:hover::after{ color:var(--text); }
.faq-a{ padding:0 0 28px; max-width:60ch; color:var(--muted); }
.faq-a a{ text-decoration:underline; text-underline-offset:3px; }
@media (min-width:1024px){ .faq{ grid-column:4 / 13; } }

/* links from the sector rows to the landing pages */
.ind-more{ display:inline-block; margin-top:12px; color:var(--text); text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:4px; transition:text-decoration-color .25s var(--ease); }
.ind-more:hover{ text-decoration-color:var(--accent); }
.f-links{ font-size:14px; line-height:1.6; color:var(--muted); }
.f-links a{ transition:color .25s var(--ease); }
.f-links a:hover{ color:var(--text); }
@media (min-width:1024px){ .ftr .grid > .f-links{ grid-column:1 / -1; margin-top:0; } }

/* ==========================================================================
   Landing pages
   ========================================================================== */
.lp-hero{ padding-top:calc(var(--hdr) + clamp(40px, 7vw, 96px)); }
.lp-crumb ol{ display:flex; flex-wrap:wrap; gap:0 .75em; margin:0; padding:0; list-style:none; }
.lp-crumb li + li::before{ content:"/"; margin-right:.75em; color:var(--line); }
.lp-crumb a{ transition:color .25s var(--ease); }
.lp-crumb a:hover{ color:var(--text); }
.lp-hero h1{ margin-top:24px; max-width:14ch; }
.lp-hero .lead{ margin-top:28px; max-width:44ch; color:var(--muted); }
.lp-hero .cta-row{ max-width:520px; }
.lp-hero .trust{ margin-top:24px; }
.lp-films{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--gap); margin:clamp(40px, 6vw, 64px) 0 0; padding:0; list-style:none; }
.lp-films figure{ margin:0; }
.lp-films video{ display:block; width:100%; aspect-ratio:9 / 16; object-fit:cover; background:var(--surface); border-radius:2px; }
.lp-films figcaption{ margin-top:10px; }
.lp-more{ margin-top:24px; }
.lp-more a{ text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:4px; }
.lp-more a:hover{ text-decoration-color:var(--accent); }
.lp-end .display{ margin-top:16px; }
.lp-end .lead{ margin-top:24px; max-width:44ch; color:var(--muted); }
.lp-end .cta-row{ max-width:520px; }
.lp-contact{ margin-top:32px; color:var(--muted); }
.lp-contact a{ color:var(--text); }
.lp-end{ padding-bottom:clamp(64px, 9vw, 120px); }
@media (min-width:1024px){
  .lp-films{ grid-template-columns:repeat(4, minmax(0,1fr)); grid-column:4 / 13; }
  .lp-more{ grid-column:4 / 13; }
  .lp-hero h1,.lp-hero .lead,.lp-hero .cta-row,.lp-hero .trust{ grid-column:1 / 13; }
}

.svc-row .ind-more{ grid-column:2 / -1; }
@media (min-width:600px){ .svc-row .ind-more{ grid-column:5 / 9; } }
@media (min-width:1024px){ .svc-row .ind-more{ grid-column:6 / 10; } }

.lp-wide{ margin-top:clamp(40px, 6vw, 64px); }
.lp-wide video{ display:block; width:100%; aspect-ratio:16 / 9; object-fit:cover; background:var(--surface); border-radius:2px; }
.lp-cap{ margin-top:10px; }
@media (min-width:1024px){ .lp-wide{ grid-column:4 / 13; } }