/* ============================================================
   APEX ALPHA GRAPHIX — V5 "Precision" design system
   ONE stylesheet. Mobile-first. Near-black / white / pale grey,
   electric red #E10600 as a functional accent only.
   Anton (display) + Manrope (text). Square geometry, hairlines.
   ============================================================ */

/* ---------- Tokens & base ---------- */
:root{
  --ink:#0A0A0A;
  --ink-2:#0E0E0E;
  --panel:#131313;
  --panel-2:#181818;
  --paper:#F2F0EA;
  --paper-2:#E7E4DB;
  --white:#FFFFFF;
  --grey:#ACACAC;
  --grey-2:#7C7C7C;
  --grey-d:#4A4A48;
  --line:rgba(255,255,255,.14);
  --line-soft:rgba(255,255,255,.08);
  --line-dark:rgba(10,10,10,.16);
  --red:#E10600;
  --red-dark:#B00500;
  --hdr-h:66px;
  --wrap:min(1280px,94%);
  --sec:4.5rem;
  --sec-tight:3.25rem;
  --ease:cubic-bezier(.22,.65,.25,1);
  --font-d:'Anton',Impact,sans-serif;
  --font-b:'Manrope',Helvetica,Arial,sans-serif;
}
@media (min-width:901px){
  :root{ --hdr-h:76px; --sec:clamp(5.5rem,8vw,7rem); --sec-tight:clamp(3.5rem,5vw,4.5rem); }
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html.locked{ overflow:hidden; }
body{
  margin:0; background:var(--ink); color:var(--white);
  font-family:var(--font-b); font-size:1rem; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-d); font-weight:400; text-transform:uppercase; line-height:1.04; margin:0; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
::selection{ background:var(--red); color:#fff; }
:focus-visible{ outline:2px solid var(--red); outline-offset:3px; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip-link{
  position:absolute; left:1rem; top:-4rem; z-index:400; background:var(--red); color:#fff;
  padding:.7rem 1.1rem; font-weight:800; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase;
  text-decoration:none; transition:top .25s var(--ease);
}
.skip-link:focus{ top:1rem; }

.wrap{ width:var(--wrap); margin-inline:auto; }
.section{ padding-block:var(--sec); }
.section--tight{ padding-block:var(--sec-tight); }
.band{ background:var(--ink-2); border-block:1px solid var(--line-soft); }
.center{ text-align:center; }
.center .label{ justify-content:center; }
.lead{ font-size:1.08rem; line-height:1.65; color:var(--grey); max-width:44rem; }
.center .lead{ margin-inline:auto; }
.label{
  display:flex; align-items:center; gap:.7rem;
  font-size:.7rem; font-weight:800; letter-spacing:.32em; text-transform:uppercase; color:var(--white);
  margin-bottom:1.1rem;
}
.label::before{ content:""; width:.55rem; height:.55rem; background:var(--red); flex:none; }
.label--dark{ color:var(--ink); }
h2{ font-size:clamp(2.1rem,4.6vw,3.4rem); letter-spacing:.01em; }
h2 .thin{ color:var(--grey); }
.rule{ width:3.2rem; height:2px; background:var(--red); border:0; margin:1.3rem 0 0; }
.center .rule{ margin-inline:auto; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  font-family:var(--font-b); font-weight:800; font-size:.82rem; letter-spacing:.14em; text-transform:uppercase;
  padding:1rem 1.6rem; border:1px solid transparent; text-decoration:none; cursor:pointer;
  background:none; color:var(--white); white-space:nowrap; position:relative;
  transition:transform .35s cubic-bezier(.34,1.45,.5,1), background-color .25s, color .25s, border-color .25s;
}
.btn:active{ transform:scale(.975); }
.btn svg{ width:1.05rem; height:1.05rem; flex:none; }
.btn--white{ background:var(--white); color:var(--ink); }
.btn--white:hover{ background:var(--paper-2); }
.btn--red{ background:var(--red); color:#fff; overflow:hidden; }
.btn--red::after{
  content:""; position:absolute; left:0; bottom:0; height:3px; width:100%;
  background:#fff; transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease);
}
.btn--red:hover::after,.btn--red:focus-visible::after{ transform:scaleX(1); }
.btn--red:hover{ background:var(--red-dark); }
.btn--ghost{ border-color:var(--line); color:var(--white); }
.btn--ghost:hover{ border-color:var(--white); }
.btn--dark{ background:var(--ink); color:#fff; }
.btn--dark:hover{ background:#222; }
.btn--outline-dark{ border-color:var(--line-dark); color:var(--ink); }
.btn--outline-dark:hover{ border-color:var(--ink); }
.btn-row{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.center .btn-row{ justify-content:center; }

/* ---------- Utility strip (homepage) ---------- */
.util-strip{
  background:#000; border-bottom:1px solid var(--line-soft);
  font-size:.68rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase;
}
.util-strip .wrap{ display:flex; align-items:center; gap:1.6rem; height:2.4rem; }
.util-strip a{ color:#fff; text-decoration:none; display:inline-flex; gap:.5rem; align-items:center; }
.util-strip a svg{ width:.85rem; height:.85rem; color:var(--red); }
.util-strip .u-mid{ display:none; color:var(--grey); }
.util-strip .u-badge{ margin-left:auto; color:#fff; display:inline-flex; align-items:center; gap:.55rem; }
.util-strip .u-badge::before{ content:""; width:.5rem; height:.5rem; background:var(--red); }
@media (min-width:901px){ .util-strip .u-mid{ display:inline; } }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(10,10,10,.97); border-bottom:1px solid var(--line-soft);
}
.header-in{
  width:var(--wrap); margin-inline:auto; height:var(--hdr-h);
  display:flex; align-items:center; gap:1.4rem; position:relative;
}
.brand{ display:flex; align-items:center; gap:.7rem; text-decoration:none; flex:none; }
.brand img{ height:42px; width:auto; }
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-name{ font-weight:800; font-size:.94rem; letter-spacing:.14em; color:#fff; }
.brand-tag{
  display:none; font-size:.58rem; font-weight:700; letter-spacing:.3em;
  text-transform:uppercase; color:var(--grey);
}
@media (min-width:901px){
  .brand img{ height:52px; }
  .brand-name{ font-size:1.02rem; }
  .brand-tag{ display:block; margin-top:3px; }
}
.nav-toggle{
  margin-left:auto; width:46px; height:46px; flex:none;
  background:none; border:1px solid var(--line); cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
}
.nav-toggle span{ display:block; width:20px; height:2px; background:#fff; transition:transform .3s var(--ease), opacity .2s; }
.site-header.nav-open .nav-toggle span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.site-header.nav-open .nav-toggle span:nth-child(2){ opacity:0; }
.site-header.nav-open .nav-toggle span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
@media (min-width:901px){ .nav-toggle{ display:none; } }

/* Mobile nav panel: absolute within the sticky header, solid, simple. */
.main-nav{
  position:absolute; top:100%; left:0; right:0; z-index:99;
  background:#0C0C0C; border-bottom:1px solid var(--line);
  padding:.6rem 3% 1.4rem; max-height:calc(100dvh - var(--hdr-h)); overflow:auto;
  opacity:0; visibility:hidden; transform:translateY(-8px); pointer-events:none;
  transition:opacity .28s var(--ease), transform .28s var(--ease), visibility 0s linear .28s;
}
.site-header.nav-open .main-nav{
  opacity:1; visibility:visible; transform:none; pointer-events:auto;
  transition:opacity .28s var(--ease), transform .28s var(--ease);
}
.nav-list{ display:flex; flex-direction:column; }
.nav-list > li{ border-bottom:1px solid var(--line-soft); }
.nav-list > li:last-child{ border-bottom:0; }
.nav-link{
  display:flex; align-items:center; justify-content:space-between;
  font-family:var(--font-d); font-size:1.35rem; letter-spacing:.04em; text-transform:uppercase;
  color:#fff; text-decoration:none; padding:.85rem 0;
}
.nav-link .caret{ width:1rem; height:1rem; color:var(--red); }
.nav-link[aria-current="page"]{ color:var(--red); }
.dropdown{ padding:0 0 .9rem 1rem; display:flex; flex-direction:column; gap:.15rem; }
.dropdown a{
  display:block; padding:.42rem 0; text-decoration:none; color:var(--grey);
  font-size:.92rem; font-weight:600;
}
.dropdown a strong{ color:#fff; font-weight:800; display:block; font-size:.95rem; }
.dropdown a span{ font-size:.8rem; color:var(--grey-2); }
.dropdown a:hover strong,.dropdown a[aria-current="page"] strong{ color:var(--red); }
.header-cta{ display:none; }
@media (min-width:901px){
  .main-nav{ position:static; background:none; border:0; padding:0; max-height:none; overflow:visible;
    opacity:1; visibility:visible; transform:none; pointer-events:auto; transition:none; margin-left:auto; }
  .nav-list{ flex-direction:row; align-items:center; gap:1.9rem; }
  .nav-list > li{ border:0; position:relative; }
  .nav-link{ font-family:var(--font-b); font-size:.8rem; font-weight:800; letter-spacing:.15em; padding:.6rem 0; position:relative; }
  .nav-link::after{
    content:""; position:absolute; left:0; bottom:0; height:2px; width:100%; background:var(--red);
    transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
  }
  .nav-link:hover::after,.nav-link[aria-current="page"]::after{ transform:scaleX(1); }
  .nav-link .caret{ width:.8rem; height:.8rem; margin-left:.35rem; }
  .dropdown{
    position:absolute; top:calc(100% + 14px); left:50%; transform:translate(-50%,8px);
    min-width:320px; background:#101010; border:1px solid var(--line); padding:.7rem;
    opacity:0; visibility:hidden; pointer-events:none; transition:opacity .25s var(--ease), transform .25s var(--ease), visibility 0s linear .25s;
    box-shadow:0 24px 50px rgba(0,0,0,.55); z-index:120;
  }
  .has-dropdown:hover .dropdown,.has-dropdown:focus-within .dropdown{
    opacity:1; visibility:visible; transform:translate(-50%,0); pointer-events:auto; transition-delay:0s;
  }
  .dropdown a{ padding:.55rem .7rem; }
  .dropdown a:hover{ background:#181818; }
  .header-cta{ display:flex; align-items:center; gap:1.1rem; flex:none; }
  .header-phone{
    display:inline-flex; align-items:center; gap:.5rem; text-decoration:none;
    font-weight:800; font-size:.85rem; letter-spacing:.08em; color:#fff;
  }
  .header-phone svg{ width:1rem; height:1rem; color:var(--red); }
  .header-cta .btn{ padding:.62rem 1.2rem; }
}
@media (min-width:901px) and (max-width:1149px){
  .header-phone span{ display:none; }
  .nav-list{ gap:1.3rem; }
}
@media (min-width:901px) and (max-width:999px){
  .header-cta .btn{ display:none; }
}

/* ---------- Hero (home) ---------- */
.hero{ border-bottom:1px solid var(--line-soft); overflow:hidden; }
.hero .wrap{
  display:grid; gap:2.6rem; padding-block:3.2rem 3.6rem;
}
.hero-kick{ display:flex; align-items:center; gap:.7rem; font-size:.7rem; font-weight:800; letter-spacing:.32em; text-transform:uppercase; color:var(--grey); margin-bottom:1.4rem; }
.hero-kick::before{ content:""; width:.55rem; height:.55rem; background:var(--red); flex:none; }
.hero h1{
  font-size:clamp(3.6rem,13.5vw,7.6rem); line-height:.98; letter-spacing:.005em;
}
.hero h1 .line{ display:block; overflow:hidden; }
.hero h1 .line > span{ display:inline-block; animation:rise 1s var(--ease) both; }
.hero h1 .line:nth-child(2) > span{ animation-delay:.12s; }
.hero h1 .line:nth-child(3) > span{ animation-delay:.24s; }
.hero h1 .indent{ padding-left:.9em; }
.hero h1 .dot{ color:var(--red); }
@keyframes rise{ from{ transform:translateY(112%); } to{ transform:translateY(0); } }
.hero-sub{ margin-top:1.6rem; font-size:1.06rem; line-height:1.65; color:var(--grey); max-width:34rem; }
.hero-sub strong{ color:#fff; }
.hero-photo{ position:relative; margin:0; }
.hero-photo img{
  width:100%; height:100%; object-fit:cover; aspect-ratio:16/10;
  border:1px solid var(--line);
}
.hero-facts{
  grid-column:1 / -1; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:.7rem 2.2rem; padding-top:1.3rem;
  font-size:.72rem; font-weight:800; letter-spacing:.26em; text-transform:uppercase;
}
.hero-facts li{ display:flex; align-items:center; gap:.7rem; }
.hero-facts li::before{ content:"/"; color:var(--red); font-weight:800; }
.hero-facts li:first-child::before{ content:""; }
@media (min-width:901px){
  .hero .wrap{
    grid-template-columns:1.05fr .95fr; align-items:center; gap:3.5rem;
    padding-block:4.2rem 4.6rem; min-height:calc(100svh - var(--hdr-h) - 2.4rem);
  }
  .hero-photo{ justify-self:end; width:100%; max-width:660px; }
  .hero-photo::after{
    content:""; position:absolute; inset:0; transform:translate(14px,14px);
    border:1px solid var(--red); z-index:-1;
  }
  .hero-photo img{ aspect-ratio:4/4.7; }
}

/* ---------- Page hero (inner) ---------- */
.page-hero{ border-bottom:1px solid var(--line-soft); overflow:hidden; }
.page-hero .wrap{ display:grid; gap:2.2rem; padding-block:2.8rem 3rem; }
.crumb{ font-size:.7rem; font-weight:800; letter-spacing:.26em; text-transform:uppercase; color:var(--grey-2); margin-bottom:1.1rem; }
.crumb a{ color:var(--grey); text-decoration:none; }
.crumb a:hover{ color:#fff; }
.page-hero h1{ font-size:clamp(2.5rem,6.4vw,4.6rem); line-height:1; }
.page-hero .lead{ margin-top:1.2rem; }
.page-hero-photo{ margin:0; }
.page-hero-photo img{ width:100%; aspect-ratio:16/10; object-fit:cover; border:1px solid var(--line); }
@media (min-width:901px){
  .page-hero .wrap{ grid-template-columns:1.05fr .95fr; align-items:center; gap:3.5rem; padding-block:3.6rem 4rem; }
  .page-hero-photo{ justify-self:end; width:100%; max-width:600px; }
  .page-hero-photo img{ aspect-ratio:4/3.4; }
  .page-hero--text .wrap{ grid-template-columns:1fr; }
}

/* ---------- Services: editorial entries ---------- */
.svc-list{ margin-top:3rem; border-top:1px solid var(--line); }
.svc{
  display:grid; gap:1.4rem; padding-block:2.2rem;
  border-bottom:1px solid var(--line); position:relative;
}
.svc-num{
  font-family:var(--font-d); font-size:3rem; line-height:1; color:transparent;
  -webkit-text-stroke:1.5px var(--grey-2);
}
.svc-media{ margin:0; overflow:hidden; border:1px solid var(--line-soft); }
.svc-media img{ width:100%; aspect-ratio:16/10; object-fit:cover; transition:transform .8s var(--ease); }
.svc:hover .svc-media img{ transform:scale(1.035); }
.svc h3{ font-size:1.7rem; margin-bottom:.6rem; }
.svc p{ color:var(--grey); max-width:32rem; }
.svc-price{ display:flex; align-items:baseline; gap:.7rem; margin-top:1.1rem; }
.svc-price .tick{ width:.55rem; height:.55rem; background:var(--red); align-self:center; flex:none; }
.svc-price .from{ font-size:.68rem; font-weight:800; letter-spacing:.26em; text-transform:uppercase; color:var(--grey-2); }
.svc-price .amt{ font-family:var(--font-d); font-size:1.5rem; color:#fff; }
.svc-link{
  display:inline-flex; align-items:center; gap:.55rem; margin-top:1.1rem;
  font-weight:800; font-size:.8rem; letter-spacing:.16em; text-transform:uppercase;
  color:#fff; text-decoration:none;
}
.svc-link svg{ width:1rem; height:1rem; color:var(--red); transition:transform .3s var(--ease); }
.svc-link:hover svg{ transform:translateX(5px); }
@media (min-width:901px){
  .svc{ grid-template-columns:5.5rem 1fr 1fr; gap:2.6rem; align-items:center; padding-block:2.8rem; }
  .svc:nth-child(even) .svc-media{ order:3; }
  .svc:nth-child(even) .svc-body{ order:2; }
  .svc-num{ font-size:4.2rem; }
  .svc-media img{ aspect-ratio:4/3; }
}

/* ---------- Why AAG: pale editorial panel ---------- */
.panel-paper{ background:var(--paper); color:var(--ink); }
.panel-paper .lead{ color:var(--grey-d); }
.why-grid{ display:grid; gap:2.4rem; margin-top:3rem; }
.why-item{ border-top:2px solid var(--ink); padding-top:1.2rem; }
.why-item .w-num{ font-family:var(--font-d); color:var(--red); font-size:1rem; letter-spacing:.1em; }
.why-item h3{ font-size:1.35rem; margin:.5rem 0 .5rem; }
.why-item p{ color:var(--grey-d); font-size:.97rem; }
.why-photo{ margin:2.8rem 0 0; border:1px solid var(--line-dark); }
.why-photo img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
@media (min-width:901px){
  .why-grid{ grid-template-columns:repeat(4,1fr); gap:2rem; }
}

/* ---------- Work: filters, grid, viewer ---------- */
.filters{ display:flex; flex-wrap:wrap; gap:.5rem; margin:2.4rem 0 1.8rem; }
.filter-btn{
  font-family:var(--font-b); font-weight:800; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase;
  background:none; color:var(--grey); border:1px solid var(--line); padding:.65rem 1.1rem; cursor:pointer;
  transition:color .25s, border-color .25s, background-color .25s;
}
.filter-btn:hover{ color:#fff; border-color:#fff; }
.filter-btn[aria-pressed="true"]{ background:var(--red); border-color:var(--red); color:#fff; }
.work-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem; }
.work-item{ margin:0; position:relative; overflow:hidden; border:1px solid var(--line-soft); cursor:pointer; background:var(--panel); }
.work-item img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.work-item:hover img,.work-item:focus-visible img{ transform:scale(1.04); }
.work-item .w-cap{
  position:absolute; left:0; right:0; bottom:0; padding:1.6rem .9rem .75rem;
  background:linear-gradient(transparent, rgba(0,0,0,.88));
  font-size:.78rem; font-weight:700; line-height:1.35; color:#fff;
}
.work-item .w-cap small{ display:block; color:var(--grey); font-weight:800; font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; margin-top:.2rem; }
.work-item.o-port{ grid-column:span 1; aspect-ratio:3/3.9; }
.work-item.o-land{ grid-column:span 2; aspect-ratio:16/9.5; }
.work-item.o-sq{ grid-column:span 1; aspect-ratio:1/1.05; }
.work-item[hidden]{ display:none; }
@media (min-width:901px){
  .work-grid{ grid-template-columns:repeat(6,1fr); gap:1rem; }
  .work-item.o-port{ grid-column:span 2; aspect-ratio:3/3.6; }
  .work-item.o-land{ grid-column:span 3; aspect-ratio:16/10.8; }
  .work-item.o-sq{ grid-column:span 2; aspect-ratio:1/1.02; }
  .work-item .w-cap{ font-size:.88rem; padding:2rem 1.1rem .9rem; }
}
.viewer{
  position:fixed; inset:0; z-index:200; background:rgba(4,4,4,.97);
  display:flex; flex-direction:column; padding:1rem;
}
.viewer[hidden]{ display:none; }
.viewer-top{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-bottom:.8rem; }
.viewer-count{ font-size:.72rem; font-weight:800; letter-spacing:.26em; color:var(--grey); text-transform:uppercase; }
.viewer-btn{
  width:48px; height:48px; flex:none; display:inline-flex; align-items:center; justify-content:center;
  background:none; border:1px solid var(--line); color:#fff; cursor:pointer;
}
.viewer-btn:hover{ border-color:#fff; }
.viewer-btn svg{ width:1.2rem; height:1.2rem; }
.viewer-stage{ flex:1; display:flex; align-items:center; justify-content:center; min-height:0; }
.viewer-stage img{ max-width:100%; max-height:100%; object-fit:contain; border:1px solid var(--line-soft); }
.viewer-info{ padding-top:1rem; display:grid; gap:.8rem; }
.viewer-info h3{ font-size:1.4rem; }
.viewer-info .v-cat{ font-size:.66rem; font-weight:800; letter-spacing:.26em; text-transform:uppercase; color:var(--red); }
.viewer-info p{ color:var(--grey); font-size:.94rem; max-width:44rem; }
.viewer-nav{ display:flex; gap:.6rem; align-items:center; }
.viewer-thumbs{ display:flex; gap:.5rem; }
.viewer-thumbs button{
  width:56px; height:56px; padding:0; border:1px solid var(--line); background:none; cursor:pointer; overflow:hidden;
}
.viewer-thumbs button[aria-pressed="true"]{ border-color:var(--red); }
.viewer-thumbs img{ width:100%; height:100%; object-fit:cover; }
@media (min-width:901px){
  .viewer{ padding:1.6rem 2rem; }
  .viewer-info{ grid-template-columns:1fr auto; align-items:end; }
}

/* ---------- Commercial panel ---------- */
.comm-grid{ display:grid; gap:2.4rem; margin-top:2.6rem; }
.comm-points{ display:grid; gap:0; border-top:1px solid var(--line-dark); }
.comm-points li{
  display:flex; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line-dark);
  font-weight:700; color:var(--ink);
}
.comm-points li::before{ content:""; width:.55rem; height:.55rem; background:var(--red); flex:none; margin-top:.5rem; }
.comm-photos{ display:grid; gap:.8rem; }
.comm-photos img{ width:100%; object-fit:cover; border:1px solid var(--line-dark); }
.comm-photos .cp-a{ aspect-ratio:16/9; }
.comm-photos .cp-b{ aspect-ratio:16/10; }
@media (min-width:901px){
  .comm-grid{ grid-template-columns:1fr 1fr; gap:3.5rem; align-items:start; }
}

/* ---------- Process ---------- */
.cutline{ width:100%; height:44px; margin-top:2.6rem; }
.cutline .cl-path{ stroke:var(--red); stroke-width:2; }
.cutline circle{ fill:var(--ink); stroke:var(--red); stroke-width:2; }
.cutline .cl-blade{ fill:var(--red); }
.steps{ display:grid; gap:2rem; margin-top:1.8rem; }
.step{ border-top:1px solid var(--line); padding-top:1.3rem; }
.step .s-num{ font-family:var(--font-d); font-size:2.6rem; color:transparent; -webkit-text-stroke:1.5px var(--red); line-height:1; }
.step h3{ font-size:1.3rem; margin:.7rem 0 .5rem; }
.step p{ color:var(--grey); font-size:.96rem; }
@media (min-width:901px){ .steps{ grid-template-columns:repeat(4,1fr); gap:1.8rem; } }

/* ---------- Pricing ---------- */
.price-table{ width:100%; border-collapse:collapse; margin-top:1.6rem; }
.price-table caption{
  text-align:left; font-family:var(--font-d); font-size:1.25rem; text-transform:uppercase;
  padding-bottom:.9rem; color:#fff;
}
.price-table caption span{ font-family:var(--font-b); font-size:.8rem; color:var(--grey-2); text-transform:none; letter-spacing:0; }
.price-table th{
  text-align:left; font-size:.64rem; font-weight:800; letter-spacing:.24em; text-transform:uppercase;
  color:var(--grey-2); padding:.6rem .8rem .6rem 0; border-bottom:1px solid var(--line);
}
.price-table td{ padding:1rem .8rem 1rem 0; border-bottom:1px solid var(--line-soft); vertical-align:top; }
.price-table .svc{ font-weight:800; color:#fff; white-space:nowrap; }
.price-table .note{ color:var(--grey); font-size:.92rem; }
.price-table .amt{ font-family:var(--font-d); font-size:1.15rem; color:#fff; white-space:nowrap; }
.price-table .amt::before{ content:""; display:inline-block; width:.45rem; height:.45rem; background:var(--red); margin-right:.55rem; vertical-align:middle; }
.price-table .q-link{
  font-weight:800; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase;
  color:#fff; text-decoration:none; white-space:nowrap; border-bottom:2px solid var(--red); padding-bottom:2px;
}
.price-table .q-link:hover{ color:var(--red); }
.table-scroll{ overflow-x:auto; margin-bottom:2.6rem; }
.table-scroll .price-table{ min-width:640px; margin-top:0; }
.note-box{ border:1px solid var(--line); padding:1.6rem; background:var(--ink-2); }
.note-box h3{ font-size:1.15rem; margin-bottom:.5rem; }
.note-box p{ color:var(--grey); font-size:.96rem; }
.note-grid{ display:grid; gap:1rem; margin-top:1rem; }
@media (min-width:901px){ .note-grid{ grid-template-columns:repeat(3,1fr); } }
.price-chips{ display:grid; gap:.8rem; margin-top:2.6rem; }
.price-chip{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  border:1px solid var(--line); padding:1.1rem 1.3rem; background:var(--ink-2);
}
.price-chip .p-name{ font-weight:800; letter-spacing:.06em; text-transform:uppercase; font-size:.85rem; }
.price-chip .p-amt{ font-family:var(--font-d); font-size:1.3rem; }
.price-chip .p-amt small{ font-family:var(--font-b); font-size:.62rem; font-weight:800; letter-spacing:.22em; color:var(--grey-2); text-transform:uppercase; margin-right:.4rem; }
@media (min-width:901px){ .price-chips{ grid-template-columns:repeat(5,1fr); } .price-chip{ flex-direction:column; align-items:flex-start; gap:.4rem; } }

/* ---------- Reviews / areas / misc blocks ---------- */
.review-panel{ border:1px solid var(--line); padding:2.2rem 1.6rem; text-align:center; background:var(--ink-2); }
.review-panel .label{ justify-content:center; }
.review-panel .lead{ margin:1rem auto 0; }
@media (min-width:901px){ .review-panel{ padding:3.2rem; } }
.area-list{ display:flex; flex-wrap:wrap; gap:.55rem; margin-top:1.6rem; }
.area-list a,.area-list span{
  display:inline-block; border:1px solid var(--line); padding:.55rem 1rem;
  font-size:.8rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:#fff; text-decoration:none;
}
.area-list a:hover{ border-color:var(--red); color:var(--red); }
.check-list{ display:grid; gap:.85rem; margin-top:1.6rem; }
.check-list li{ display:flex; gap:.8rem; align-items:flex-start; color:var(--grey); }
.check-list li strong{ color:#fff; }
.check-list svg{ width:1.1rem; height:1.1rem; flex:none; color:var(--red); margin-top:.25rem; }
.split{ display:grid; gap:2.4rem; }
.split-media{ margin:0; }
.split-media img{ width:100%; aspect-ratio:4/3.4; object-fit:cover; border:1px solid var(--line); }
@media (min-width:901px){
  .split{ grid-template-columns:1fr 1fr; gap:3.5rem; align-items:center; }
}
.mini-gallery{ display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem; }
.mini-gallery figure{ margin:0; overflow:hidden; border:1px solid var(--line-soft); }
.mini-gallery img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
@media (min-width:901px){ .mini-gallery{ grid-template-columns:repeat(4,1fr); } .mini-gallery--3{ grid-template-columns:repeat(3,1fr); } }
.faq{ border-bottom:1px solid var(--line); }
.faq summary{
  cursor:pointer; padding:1.15rem 0; font-weight:800; font-size:1rem; color:#fff;
  list-style:none; display:flex; justify-content:space-between; gap:1rem; align-items:center;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-family:var(--font-d); font-size:1.3rem; color:var(--red); flex:none; }
.faq[open ] summary::after{ content:"–"; }
.faq p{ color:var(--grey); padding:0 0 1.2rem; max-width:46rem; }
.two-cards{ display:grid; gap:1rem; margin-top:1rem; }
.mini-card{ border:1px solid var(--line); padding:1.7rem; background:var(--ink-2); }
.mini-card h3{ font-size:1.3rem; margin-bottom:.6rem; }
.mini-card > p{ color:var(--grey); }
.mini-card .check-list{ margin-top:1.1rem; }
.mini-card .check-list li{ color:var(--grey); }
@media (min-width:901px){ .two-cards{ grid-template-columns:1fr 1fr; } }
.city-grid{ display:grid; gap:.8rem; margin-top:2.6rem; }
.city-card{ border:1px solid var(--line); padding:1.4rem; background:var(--ink-2); }
.city-card h3{ font-size:1.25rem; }
.city-card p{ color:var(--grey); font-size:.93rem; margin-top:.45rem; }
.city-card .dist{ font-size:.68rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--grey-2); margin-top:.9rem; }
.city-card .dist strong{ color:#fff; }
.city-card .svc-link{ margin-top:.7rem; }
@media (min-width:901px){ .city-grid{ grid-template-columns:repeat(4,1fr); } }

/* ---------- Contact & form ---------- */
.contact-cards{ display:grid; gap:.8rem; }
.contact-card{ border:1px solid var(--line); padding:1.5rem; background:var(--ink-2); }
.contact-card svg{ width:1.5rem; height:1.5rem; color:var(--red); }
.contact-card h3{ font-size:1.05rem; margin:.7rem 0 .3rem; }
.contact-card a{ font-weight:800; color:#fff; text-decoration:none; word-break:break-all; }
.contact-card a:hover{ color:var(--red); }
.contact-card p{ color:var(--grey); font-size:.9rem; }
@media (min-width:901px){ .contact-cards{ grid-template-columns:repeat(3,1fr); } }
.form-shell{ display:grid; gap:2.2rem; margin-top:3rem; }
@media (min-width:901px){ .form-shell{ grid-template-columns:1.5fr 1fr; gap:3rem; align-items:start; } }
.quote-form{ border:1px solid var(--line); padding:1.7rem; background:var(--ink-2); }
.quote-form h2{ font-size:1.5rem; }
.quote-form .f-sub{ color:var(--grey); font-size:.94rem; margin-top:.5rem; }
.enquiry-toggle{
  display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line); margin:1.5rem 0 .4rem;
}
.enquiry-toggle label{ position:relative; cursor:pointer; }
.enquiry-toggle input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.enquiry-toggle .t-opt{
  display:block; text-align:center; padding:.85rem .5rem;
  font-weight:800; font-size:.76rem; letter-spacing:.16em; text-transform:uppercase; color:var(--grey);
}
.enquiry-toggle input:checked + .t-opt{ background:var(--red); color:#fff; }
.enquiry-toggle input:focus-visible + .t-opt{ outline:2px solid var(--red); outline-offset:-2px; }
fieldset{ border:0; padding:0; margin:0; min-width:0; }
fieldset[hidden]{ display:none; }
.form-grid{ display:grid; gap:1.05rem; margin-top:1.2rem; }
@media (min-width:901px){ .form-grid{ grid-template-columns:1fr 1fr; } .field--full{ grid-column:1 / -1; } }
.field label{ display:block; font-size:.72rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--grey); margin-bottom:.45rem; }
.field input,.field select,.field textarea{
  width:100%; background:#0A0A0A; border:1px solid var(--line); color:#fff;
  font-family:var(--font-b); font-size:.98rem; padding:.85rem .95rem; border-radius:0;
  appearance:none; -webkit-appearance:none;
}
.field textarea{ min-height:7.5rem; resize:vertical; }
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23E10600' stroke-width='2' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center;
}
.field input:focus,.field select:focus,.field textarea:focus{ outline:2px solid var(--red); outline-offset:0; border-color:var(--red); }
.field [aria-invalid="true"]{ border-color:var(--red); box-shadow:inset 0 0 0 1px var(--red); }
.field .err{ display:none; color:#FF6B64; font-size:.82rem; font-weight:700; margin-top:.4rem; }
.field.invalid .err{ display:block; }
.field .hint{ color:var(--grey-2); font-size:.82rem; margin-top:.4rem; }
.check-field{ display:flex; gap:.7rem; align-items:flex-start; }
.check-field input{ width:1.15rem; height:1.15rem; margin-top:.2rem; accent-color:var(--red); flex:none; }
.check-field label{ text-transform:none; letter-spacing:0; font-size:.92rem; color:#fff; font-weight:600; margin:0; }
.form-status{ margin-top:1rem; font-weight:700; color:#fff; }
.form-status:empty{ display:none; }
.form-note{ color:var(--grey-2); font-size:.86rem; margin-top:.7rem; }
.form-note a{ color:var(--grey); }
.form-aside .note-box + .note-box{ margin-top:1rem; }
.hours-list{ display:grid; gap:.5rem; color:var(--grey); }
.hours-list strong{ color:#fff; }

/* ---------- CTA band ---------- */
.cta-band{ background:var(--red); color:#fff; padding-block:var(--sec-tight); }
.cta-band .label{ color:#fff; }
.cta-band .label::before{ background:#fff; }
.cta-band h2{ font-size:clamp(2rem,4.6vw,3.4rem); }
.cta-band .btn--white:hover{ background:var(--ink); color:#fff; }
.cta-band .btn--ghost{ border-color:rgba(255,255,255,.5); }
.cta-band .btn--ghost:hover{ border-color:#fff; }

/* ---------- Footer ---------- */
.site-footer{ background:#060606; border-top:1px solid var(--line-soft); padding:3.6rem 0 2rem; }
.footer-grid{ display:grid; gap:2.4rem; }
.footer-brand img{ height:64px; width:auto; margin-bottom:1rem; }
.footer-brand p{ color:var(--grey); font-size:.94rem; max-width:20rem; }
.site-footer h4{
  font-family:var(--font-b); font-size:.7rem; font-weight:800; letter-spacing:.28em;
  text-transform:uppercase; color:#fff; margin-bottom:1rem;
}
.footer-links{ display:grid; gap:.55rem; }
.footer-links a,.footer-contact a{ color:var(--grey); text-decoration:none; font-size:.94rem; }
.footer-links a:hover,.footer-contact a:hover{ color:var(--red); }
.footer-contact{ display:grid; gap:.55rem; color:var(--grey); font-size:.94rem; }
.footer-areas{ color:var(--grey); font-size:.9rem; line-height:1.9; }
.footer-areas a{ color:var(--grey); text-decoration:none; }
.footer-areas a:hover{ color:var(--red); }
.social-row{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.4rem; }
.social-link{
  display:inline-flex; align-items:center; gap:.55rem; border:1px solid var(--line);
  padding:.6rem 1rem; color:#fff; text-decoration:none;
  font-size:.76rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
}
.social-link:hover{ border-color:var(--red); color:var(--red); }
.social-link svg{ width:1.05rem; height:1.05rem; }
.footer-bottom{
  margin-top:3rem; padding-top:1.4rem; border-top:1px solid var(--line-soft);
  display:flex; flex-wrap:wrap; gap:.5rem 2rem; justify-content:space-between;
  color:var(--grey-2); font-size:.82rem;
}
@media (min-width:901px){ .footer-grid{ grid-template-columns:1.3fr 1fr 1fr 1.2fr; } }

/* ---------- Mobile call bar ---------- */
.callbar{
  position:fixed; left:0; right:0; bottom:0; z-index:110; display:flex;
  transform:translateY(105%); transition:transform .4s var(--ease);
}
body.cb-on .callbar{ transform:none; }
body.cb-on{ padding-bottom:3.4rem; }
.callbar a{
  flex:1; text-align:center; padding:1rem .5rem; text-decoration:none;
  font-weight:800; font-size:.8rem; letter-spacing:.14em; text-transform:uppercase;
}
.callbar .cb-call{ background:var(--red); color:#fff; }
.callbar .cb-wa{ background:#101010; color:#fff; border-top:1px solid var(--line); }
@media (min-width:901px){ .callbar{ display:none; } body.cb-on{ padding-bottom:0; } }

/* ---------- 404 ---------- */
.notfound{ padding-block:var(--sec); text-align:center; }
.notfound .big{ font-family:var(--font-d); font-size:clamp(5rem,18vw,11rem); line-height:1; color:transparent; -webkit-text-stroke:2px var(--red); }
.notfound h1{ font-size:clamp(1.8rem,5vw,2.8rem); margin-top:1rem; }
.notfound p{ color:var(--grey); margin:1rem auto 0; max-width:32rem; }
.notfound .btn-row{ justify-content:center; }

/* ---------- Reveal (JS-enhanced only; content visible without JS) ---------- */
.rv-from{ opacity:0; transform:translateY(14px); }
.rv-in{ opacity:1; transform:none; transition:opacity .7s var(--ease), transform .7s var(--ease); }
.work-grid.switching{ animation:gridfade .35s var(--ease); }
@keyframes gridfade{ from{ opacity:.25; } to{ opacity:1; } }
.cutline.go .cl-path{ stroke-dasharray:1; stroke-dashoffset:1; animation:draw 1.6s var(--ease) forwards; }
.cutline.go circle{ opacity:0; animation:pop .4s var(--ease) forwards; }
.cutline.go circle:nth-of-type(1){ animation-delay:.35s; } .cutline.go circle:nth-of-type(2){ animation-delay:.8s; }
.cutline.go circle:nth-of-type(3){ animation-delay:1.2s; } .cutline.go circle:nth-of-type(4){ animation-delay:1.55s; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
@keyframes pop{ from{ opacity:0; } to{ opacity:1; } }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .rv-from{ opacity:1; transform:none; }
  .hero h1 .line > span{ animation:none; }
}

/* ---------- Addendum: service price lines, contact IG row ---------- */
.svc-price .price-rest{ color:var(--grey); font-size:.92rem; }
.price-trio{ display:flex; flex-wrap:wrap; gap:1.6rem; margin-top:1.6rem; }
.pt-item{ display:flex; flex-direction:column; }
.pt-item .amt{ font-family:var(--font-d); font-size:1.7rem; color:#fff; }
.pt-item .amt::before{ content:""; display:inline-block; width:.45rem; height:.45rem; background:var(--red); margin-right:.5rem; vertical-align:middle; }
.pt-item .pt-label{ font-size:.68rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--grey-2); }
.travel-note{ margin-top:1rem; color:var(--grey); max-width:44rem; }
.ig-row{ display:flex; flex-wrap:wrap; gap:1.1rem; align-items:center; }
.ig-row > img{ width:56px; height:74px; object-fit:contain; background:#000; border:1px solid var(--line); padding:4px; }
.ig-row h3{ margin-bottom:.2rem; }
.ig-row p{ max-width:34rem; }