:root{
    --navy:#000B4D;
    --graphite:#2B2B2B;
    --black:#121212;
    --white:#FFFFFF;
    /* accent: --accent on light surfaces, --accent-hi on dark surfaces */
    --accent:#2F6FB8;
    --accent-rgb:47,111,184;
    --accent-hi:#7DB2EA;
    --accent-hi-rgb:125,178,234;
    --accent-dark:#255C9B;
    --star:#F2B01E;
    --paper:#F4F6F8;
    --paper-2:#EAEEF2;
    --ink-2:#4A5260;
    --ink-3:#7B8494;
    --line: rgba(255,255,255,.14);
    --line-dark: rgba(16,24,40,.1);
    --max: 1240px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;scroll-padding-top:80px;}
  body{
    margin:0;
    background:var(--white);
    color:var(--black);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,.display{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:800;
    letter-spacing:.01em;
    line-height:.94;
    margin:0;
    text-transform:uppercase;
  }
  a{color:inherit;text-decoration:none;}
  img{display:block;max-width:100%;}
  .wrap{max-width:var(--max);margin:0 auto;padding:0 32px;}
  .tick{
    width:1px;height:14px;background:var(--accent);display:inline-block;
  }

  /* ---------- CUSTOM CURSOR ---------- */
  .cursor-ring{
    position:fixed;top:0;left:0;
    width:34px;height:34px;
    border:1.5px solid var(--accent);
    border-radius:50%;
    pointer-events:none;
    z-index:9999;
    transform:translate(-50%,-50%);
    transition:width .22s ease, height .22s ease, background-color .22s ease, border-color .22s ease, opacity .22s ease;
    opacity:0;
  }
  .cursor-dot{
    position:fixed;top:0;left:0;
    width:6px;height:6px;
    background:var(--accent);
    border-radius:50%;
    pointer-events:none;
    z-index:9999;
    transform:translate(-50%,-50%);
    opacity:0;
    transition:opacity .22s ease, background-color .22s ease;
  }
  .cursor-ring.active, .cursor-dot.active{opacity:1;}
  .cursor-ring.hover{
    width:64px;height:64px;
    background:rgba(var(--accent-rgb),.12);
    border-color:var(--accent);
  }
  .cursor-ring.hover .cursor-dot{opacity:0;}
  @media (pointer: coarse){
    .cursor-ring, .cursor-dot{display:none;}
  }

  /* ---------- REVEAL ANIMATION (bullet lists) ---------- */
  .reveal-list > *{
    opacity:0;
    transform:translateX(64px) scale(.92);
    transition:opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1);
    will-change:transform, opacity;
  }
  .reveal-list > *:nth-child(1){transition-delay:.04s;}
  .reveal-list > *:nth-child(2){transition-delay:.13s;}
  .reveal-list > *:nth-child(3){transition-delay:.22s;}
  .reveal-list > *:nth-child(4){transition-delay:.31s;}
  .reveal-list > *:nth-child(5){transition-delay:.40s;}
  .reveal-list > *:nth-child(6){transition-delay:.49s;}
  .reveal-list > *:nth-child(7){transition-delay:.58s;}
  .reveal-list > *:nth-child(8){transition-delay:.67s;}
  .reveal-list.in-view > *{
    opacity:1;
    transform:translateX(0) scale(1);
  }
  @media (prefers-reduced-motion: reduce){
    .reveal-list > *{opacity:1;transform:none;transition:none;}
  }

  /* ---------- NAV ---------- */
  header.site{
    position:sticky;top:0;z-index:50;
    background:rgba(18,18,18,.88);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 32px;max-width:var(--max);margin:0 auto;
  }
  .logo{
    display:flex;align-items:center;gap:10px;color:var(--white);
  }
  .logo .mark{
    width:34px;height:34px;background:var(--accent);
    display:flex;align-items:center;justify-content:center;
    font-family:'Big Shoulders Display';font-weight:900;color:var(--black);
    font-size:20px;
  }
  .logo .logo-icon{
    height:40px;width:auto;display:block;
  }
  .logo .word{font-family:'Big Shoulders Display';font-weight:800;font-size:20px;letter-spacing:.03em;text-transform:uppercase;}
  .logo .word span{color:var(--accent-hi);}
  .nav-actions{display:flex;align-items:center;gap:12px;}
  .cta-btn{
    background:var(--accent);color:var(--white);
    padding:11px 22px;font-weight:700;font-size:13px;
    letter-spacing:.03em;text-transform:uppercase;
    border:none;cursor:pointer;
    transition:transform .15s ease, filter .15s ease;
    display:inline-block;
  }
  .cta-btn:hover{transform:translateY(-2px);filter:brightness(1.08);}
  .cta-btn.ghost{
    background:transparent;color:var(--white);
    border:1px solid rgba(255,255,255,.4);
  }
  .cta-btn.ghost:hover{border-color:var(--accent-hi);color:var(--accent-hi);}
  .call-btn{display:inline-flex;align-items:center;gap:8px;}
  .call-btn svg{
    width:15px;height:15px;flex:none;
    fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
  }

  /* ---------- BURGER MENU ---------- */
  .burger{
    width:40px;height:40px;flex:none;
    display:inline-flex;align-items:center;justify-content:center;
    background:transparent;border:1px solid rgba(255,255,255,.4);color:var(--white);
    cursor:pointer;padding:0;
    transition:border-color .2s ease, color .2s ease;
  }
  .burger:hover,.burger:focus-visible,.burger.is-open{border-color:var(--accent-hi);color:var(--accent-hi);}
  .burger:focus-visible{outline:2px solid var(--accent-hi);outline-offset:2px;}
  .burger-bars{position:relative;display:block;width:18px;height:12px;}
  .burger-bars span{
    position:absolute;left:0;width:100%;height:2px;background:currentColor;
    transition:transform .25s ease, top .25s ease, opacity .2s ease;
  }
  .burger-bars span:nth-child(1){top:0;}
  .burger-bars span:nth-child(2){top:5px;}
  .burger-bars span:nth-child(3){top:10px;}
  .burger.is-open .burger-bars span:nth-child(1){top:5px;transform:rotate(45deg);}
  .burger.is-open .burger-bars span:nth-child(2){opacity:0;}
  .burger.is-open .burger-bars span:nth-child(3){top:5px;transform:rotate(-45deg);}

  .site-menu{
    position:absolute;top:100%;right:0;
    width:min(380px,100%);max-height:calc(100vh - 76px);overflow-y:auto;overscroll-behavior:contain;
    background:var(--black);
    border-top:3px solid var(--accent);
    box-shadow:0 30px 50px -20px rgba(0,0,0,.7);
    visibility:hidden;opacity:0;transform:translateY(-8px);
    transition:opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
  }
  .site-menu.is-open{
    visibility:visible;opacity:1;transform:none;
    transition:opacity .22s ease, transform .22s ease, visibility 0s;
  }
  .site-menu ul{list-style:none;margin:0;padding:0;}
  .site-menu > ul{padding:10px 0 16px;}
  .site-menu a{
    display:block;padding:12px 28px;
    font-size:15px;font-weight:500;color:rgba(255,255,255,.88);
    border-left:3px solid transparent;
    transition:background-color .15s ease, color .15s ease, border-color .15s ease;
  }
  .site-menu a:hover,.site-menu a:focus-visible{
    background:rgba(255,255,255,.06);color:var(--accent-hi);border-left-color:var(--accent-hi);
  }
  .site-menu .menu-sub{padding:0 0 6px;}
  .site-menu .menu-sub a{padding:8px 28px 8px 46px;font-size:13.5px;font-weight:400;color:rgba(255,255,255,.62);}
  .menu-backdrop{
    position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.5);
    opacity:0;visibility:hidden;
    transition:opacity .22s ease, visibility 0s linear .22s;
  }
  .menu-backdrop.is-open{opacity:1;visibility:visible;transition:opacity .22s ease, visibility 0s;}
  html.menu-open .wa-float{opacity:0;pointer-events:none;}
  @media (prefers-reduced-motion: reduce){
    .site-menu,.menu-backdrop,.burger-bars span{transition:none;}
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    min-height:88vh;
    display:flex;align-items:flex-end;
    background:var(--black);
    overflow:hidden;
  }
  .hero img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    /* keep the house's gable and front door in frame as the hero crops */
    object-position:58% 42%;
    opacity:.9;
  }
  .hero::before{
    content:"";position:absolute;inset:0;
    background:
      linear-gradient(90deg, rgba(10,10,10,.62) 0%, rgba(10,10,10,.34) 42%, rgba(10,10,10,0) 72%),
      linear-gradient(180deg, rgba(10,16,24,.5) 0%, rgba(10,10,10,.3) 40%, rgba(10,10,10,.94) 100%);
  }
  .hero::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:4px;
    background:var(--accent);
  }
  .hero-inner{
    position:relative;z-index:2;
    max-width:var(--max);margin:0 auto;width:100%;
    padding:0 32px 170px;
  }
  .hero-bottom{
    width:100%;
    display:flex;flex-direction:column;align-items:flex-start;
    gap:22px;
  }
  /* rounded black panel holding the headline copy */
  .hero-panel{
    background:rgba(0,0,0,.6);
    border-radius:28px;
    padding:40px 44px 44px;
    max-width:100%;
  }
  .hero-eyebrow{
    display:flex;align-items:center;gap:10px;color:var(--accent-hi);
    font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
    margin-bottom:14px;
  }
  .hero-brand{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:800;
    font-size:clamp(18px,1.6vw,24px);
    line-height:1;
    letter-spacing:.08em;
    color:var(--white);
    text-transform:uppercase;
    margin-bottom:12px;
  }
  .hero-eyebrow .rule{width:40px;height:2px;background:var(--accent-hi);}
  h1.hero-title{
    color:var(--white);
    font-size:clamp(28px, 2.55vw, 40px);
    line-height:1.15;
    max-width:none;
    white-space:nowrap;   /* "Managed to the last detail." stays on one line on desktop */
  }
  /* light shine gliding across the hero title */
  @supports ((-webkit-background-clip:text) or (background-clip:text)){
    h1.hero-title{
      background-image:linear-gradient(105deg,
        #fff 0%, #fff 34%,
        var(--accent-hi) 43%, #E6F1FD 50%, var(--accent-hi) 57%,
        #fff 66%, #fff 100%);
      background-size:300% 100%;
      background-position:100% 0;
      background-repeat:no-repeat;
      -webkit-background-clip:text;background-clip:text;
      -webkit-text-fill-color:transparent;
      animation:heroShine 6.5s ease-in-out 1.2s infinite;
    }
  }
  @keyframes heroShine{
    0%{background-position:100% 0;}
    42%,100%{background-position:0% 0;}
  }
  @media (prefers-reduced-motion: reduce){
    h1.hero-title{animation:none;background-image:none;-webkit-text-fill-color:currentColor;}
  }
  .hero-sub{
    color:rgba(255,255,255,.78);
    font-size:clamp(16px,1.7vw,19px);
    max-width:46ch;
    margin:22px 0 0;
    line-height:1.55;
    font-weight:400;
  }
  /* CTAs + rating, right-aligned, bottom-aligned with the panel */
  .hero-actions{
    display:flex;flex-direction:column;align-items:flex-start;gap:18px;
  }
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:flex-start;}
  .hero-rating{
    display:flex;align-items:center;gap:10px;
    background:rgba(0,0,0,.6);
    border-radius:28px;
    padding:14px 22px;
  }
  .hero-stars{
    color:var(--star);font-size:16px;letter-spacing:2px;
  }
  .hero-rating-text{
    font-size:13px;color:rgba(255,255,255,.72);font-weight:500;
    border-left:1px solid rgba(255,255,255,.25);padding-left:12px;
  }
  @media (max-width: 760px){
    /* Keep the mobile hero image-led and centre the compact content vertically. */
    .hero{align-items:center;}
    .hero::before{
      background:
        linear-gradient(90deg, rgba(10,10,10,.34) 0%, rgba(10,10,10,.16) 52%, rgba(10,10,10,0) 82%),
        linear-gradient(180deg, rgba(10,16,24,.22) 0%, rgba(10,10,10,.12) 48%, rgba(10,10,10,.68) 100%);
    }
    .hero img{object-position:52% 40%;}
    .hero-inner{padding:0 18px;}
    .hero-bottom{flex-direction:column;align-items:flex-start;gap:10px;}
    .hero-panel{
      width:min(88%,330px);
      max-width:330px;
      padding:16px 18px 18px;
      border-radius:14px;
      background:rgba(0,0,0,.52);
    }
    .hero-eyebrow{
      gap:7px;
      font-size:9.5px;
      letter-spacing:.1em;
      margin-bottom:7px;
    }
    .hero-eyebrow .rule{width:24px;height:1px;}
    .hero-brand{
      font-size:14px;
      letter-spacing:.07em;
      margin-bottom:7px;
    }
    h1.hero-title{
      white-space:normal;
      font-size:clamp(20px,6.2vw,24px);
      line-height:1.08;
    }
    .hero-actions{align-items:flex-start;width:auto;gap:8px;}
    .hero-ctas{justify-content:flex-start;gap:7px;flex-wrap:nowrap;}
    .hero .cta-btn{
      padding:8px 11px;
      font-size:10px;
      letter-spacing:.025em;
      white-space:nowrap;
    }
    .hero-rating{
      border-radius:12px;
      padding:7px 10px;
      gap:7px;
      background:rgba(0,0,0,.5);
    }
    .hero-stars{font-size:11px;letter-spacing:1px;}
    .hero-rating-text{
      font-size:9.5px;
      padding-left:8px;
    }
  }

  /* ---------- MARQUEE / TRUST STRIP ---------- */
  .strip{
    background:var(--graphite);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .strip-inner{
    max-width:var(--max);margin:0 auto;padding:0 32px;
    display:grid;grid-template-columns:repeat(4,1fr);
  }
  .strip-item{
    padding:26px 24px;
    border-left:1px solid var(--line);
    color:var(--white);
  }
  .strip-item:first-child{border-left:none;}
  .strip-num{
    font-family:'Big Shoulders Display';font-weight:800;font-size:34px;
    color:var(--accent-hi);
  }
  .strip-num.strip-stars{font-size:26px;letter-spacing:3px;line-height:1.3;color:var(--star);}
  .strip-label{
    font-size:12.5px;color:rgba(255,255,255,.65);
    text-transform:uppercase;letter-spacing:.08em;margin-top:4px;
  }

  /* ---------- QUALITY & STANDARDS ---------- */
  .standards{
    background:var(--white);
    padding:64px 0 72px;
  }
  .standards-title{
    display:flex;align-items:center;gap:28px;
    color:var(--black);
    font-size:clamp(30px,3.6vw,44px);
    margin-bottom:34px;
  }
  .standards-title::after{
    content:"";flex:1;height:1px;background:var(--line-dark);
  }
  .standards-grid{
    list-style:none;margin:0;padding:0;
    display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  }
  .std-box{
    position:relative;height:100%;
    display:flex;flex-direction:column;justify-content:space-between;gap:22px;
    min-height:158px;padding:26px 24px 24px;
    background:var(--paper);
    border:1px solid rgba(16,24,40,.08);
    border-radius:4px;
    box-shadow:0 14px 30px -20px rgba(16,24,40,.35);
    transition:transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease, border-color .3s ease, background-color .3s ease;
  }
  .std-box::before{
    content:"";position:absolute;left:-1px;top:-1px;
    width:44px;height:3px;background:var(--accent);
  }
  @media (hover:hover){
    .std-box:hover{
      transform:translateY(-6px);
      background:var(--white);
      border-color:rgba(var(--accent-rgb),.4);
      box-shadow:0 26px 42px -22px rgba(16,24,40,.45);
    }
  }
  @media (prefers-reduced-motion: reduce){
    .std-box{transition:none;}
    .std-box:hover{transform:none;}
  }
  .std-figure{
    font-family:'Big Shoulders Display',sans-serif;font-weight:800;
    font-size:52px;line-height:.9;letter-spacing:.01em;
    color:var(--accent);
    height:44px;display:flex;align-items:center;
  }
  .std-icon{
    width:44px;height:44px;flex:none;
    display:flex;align-items:center;justify-content:center;
    border:1px solid rgba(var(--accent-rgb),.3);
    border-radius:50%;
    background:rgba(var(--accent-rgb),.08);
  }
  .std-icon svg{
    width:24px;height:24px;fill:none;stroke:var(--accent);
    stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
  }
  .std-label{
    margin:0;color:var(--black);
    font-size:15.5px;font-weight:600;line-height:1.35;
    max-width:22ch;
  }
  @media (max-width: 980px){
    .standards-grid{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width: 560px){
    .standards{padding:44px 0 50px;}
    .standards-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
    .std-box{
      flex-direction:column;align-items:flex-start;justify-content:space-between;
      gap:14px;min-height:138px;padding:18px 16px;
    }
    .std-figure{width:auto;flex:none;font-size:40px;}
    .std-label{max-width:none;min-width:0;font-size:13.5px;}
  }

  /* ---------- SECTION HEADERS ---------- */
  .section{padding:110px 0;}
  .section.tight{padding:90px 0;}
  .sec-head{
    display:flex;justify-content:space-between;align-items:flex-end;
    gap:40px;margin-bottom:56px;flex-wrap:wrap;
  }
  .sec-tag{
    color:var(--accent);font-weight:700;font-size:13px;
    letter-spacing:.1em;text-transform:uppercase;
    display:flex;align-items:center;gap:10px;margin-bottom:14px;
  }
  .sec-tag .rule{width:30px;height:2px;background:var(--accent);}
  h2.sec-title{
    font-size:clamp(34px,4.4vw,58px);
    max-width:16ch;
    color:var(--black);
  }
  .sec-desc{max-width:34ch;color:var(--ink-2);font-size:15.5px;line-height:1.6;}

  /* ---------- SERVICES ---------- */
  #services,#projects{background:var(--paper);}
  #services .sec-head{
    flex-direction:column;align-items:center;text-align:center;
    max-width:900px;margin-left:auto;margin-right:auto;
  }
  #services .sec-tag{justify-content:center;}
  #services h2.sec-title{
    max-width:none;white-space:nowrap;
    font-size:clamp(26px,3.4vw,44px);
  }
  #services .sec-desc{
    max-width:52ch;margin-top:18px;
  }
  @media (max-width: 700px){
    #services h2.sec-title{white-space:normal;}
  }
  .services-grid2{
    display:grid;grid-template-columns:repeat(5,1fr);gap:22px;
  }
  .svc2-card{
    background:var(--white);
    border:1px solid var(--line-dark);border-radius:10px;overflow:hidden;
    display:flex;flex-direction:column;
    box-shadow:0 18px 34px -26px rgba(16,24,40,.35);
    transition:transform .25s ease, box-shadow .25s ease;
  }
  @media (hover:hover){
    .svc2-card:hover{transform:translateY(-5px);box-shadow:0 24px 40px -22px rgba(16,24,40,.45);}
  }
  @media (prefers-reduced-motion: reduce){ .svc2-card:hover{transform:none;} }
  .svc2-photo{
    aspect-ratio:4/3;position:relative;overflow:hidden;
    background:linear-gradient(160deg,#3b3b3b 0%,var(--graphite) 55%,#1c1c1c 100%);
    display:flex;align-items:center;justify-content:center;
  }
  .svc2-photo img{width:100%;height:100%;object-fit:cover;}
  .svc2-photo-ph{
    font-size:12.5px;font-weight:500;color:rgba(255,255,255,.42);
    letter-spacing:.03em;
  }
  .svc2-body{padding:22px 22px 26px;display:flex;flex-direction:column;flex-grow:1;}
  .svc2-icon{
    width:46px;height:46px;flex:none;border-radius:10px;
    background:var(--navy);
    display:flex;align-items:center;justify-content:center;
    margin-bottom:16px;
  }
  .svc2-icon svg{
    width:22px;height:22px;fill:none;stroke:var(--accent-hi);
    stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
  }
  .svc2-title{
    font-size:19px;color:var(--black);margin:0 0 10px;line-height:1.2;
  }
  .svc2-desc{font-size:13.8px;line-height:1.6;color:var(--ink-2);margin-bottom:18px;flex-grow:1;}
  .svc2-link{
    font-size:13px;font-weight:700;
    color:var(--accent);display:inline-flex;align-items:center;gap:7px;
  }
  .svc2-arrow{transition:transform .2s ease;}
  .svc2-card:hover .svc2-arrow{transform:translateX(4px);}
  @media (max-width: 1080px){
    .services-grid2{grid-template-columns:repeat(3,1fr);}
  }
  @media (max-width: 760px){
    .services-grid2{grid-template-columns:1fr;}
  }

  /* ---------- SERVICE DETAIL ---------- */
  .svc-detail{}
  .detail-band{padding:0;}
  .detail-band.band-light{background:var(--white);}
  .detail-band.band-dark{background:var(--navy);}

  /* full-bleed layout: the image runs edge-to-edge to the browser window,
     the copy sits in the normal .wrap column on the other side */
  .detail-bleed{
    position:relative;
    display:flex;align-items:center;
    min-height:580px;
  }
  .detail-shape{position:absolute;top:0;bottom:0;width:45%;box-sizing:border-box;}
  .detail-shape.shape-left{left:0;padding-right:24px;}
  .detail-shape.shape-right{right:0;padding-left:24px;}
  .detail-bleed > .wrap{position:relative;z-index:1;width:100%;}
  .detail-copy{max-width:480px;padding:56px 0;}
  .detail-copy.copy-right{margin-left:auto;}
  .detail-copy.copy-left{margin-right:auto;}

  .detail-index{
    font-family:'Big Shoulders Display';font-weight:800;font-size:14px;
    color:var(--accent);letter-spacing:.08em;margin-bottom:16px;
  }
  .detail-title{
    font-size:clamp(26px,2.6vw,36px);color:var(--black);max-width:14ch;margin-bottom:18px;
  }
  .detail-text{font-size:15px;line-height:1.7;color:var(--ink-2);max-width:42ch;margin-bottom:24px;}
  .detail-points{margin-bottom:26px;}
  .detail-points li{
    display:flex;align-items:baseline;gap:10px;font-size:14px;color:var(--black);
    padding:9px 0;border-top:1px solid var(--line-dark);
  }
  .detail-points li::before{content:"";width:6px;height:6px;background:var(--accent);flex-shrink:0;transform:translateY(-1px);}
  .detail-link{
    font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
    color:var(--accent);display:inline-flex;align-items:center;gap:8px;
  }

  /* navy sections (02, 04): flip text to light colours for contrast */
  .band-dark .detail-index{color:var(--accent-hi);}
  .band-dark .detail-title{color:var(--white);}
  .band-dark .detail-text{color:rgba(255,255,255,.68);}
  .band-dark .detail-points li{color:var(--white);border-top-color:rgba(255,255,255,.18);}
  .band-dark .detail-points li::before{background:var(--accent-hi);}
  .band-dark .detail-link{color:var(--accent-hi);}
  .band-dark .detail-frame{stroke:var(--accent-hi);}
  .band-dark .detail-media{box-shadow:0 0 0 1px rgba(255,255,255,.12);}

  /* media panel variants */
  .detail-media{position:relative;background:var(--graphite);width:100%;height:100%;}
  .detail-media{box-shadow:0 0 0 1px rgba(16,24,40,.08);}
  /* angled corner + offset decorative line, echoing the reference layout */
  .detail-frame{
    position:absolute;inset:0;width:100%;height:100%;
    fill:none;stroke:var(--accent);stroke-width:1.8;
    pointer-events:none;
  }
  .detail-media{
    clip-path:polygon(0 0, 100% 0, 100% 38%, 78% 100%, 0 100%);
  }
  .detail-shape.shape-right .detail-media{
    clip-path:polygon(0 0, 100% 0, 100% 100%, 22% 100%, 0 38%);
  }
  /* the 3-photo gallery keeps its "+12" badge in that corner, so it stays a plain rectangle */
  .detail-media.no-clip{clip-path:none;}

  .media-image{overflow:hidden;position:relative;width:100%;height:100%;}
  .media-image img{width:100%;height:100%;object-fit:cover;}

  .media-placeholder{
    width:100%;height:100%;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
    background:linear-gradient(160deg,#3b3b3b 0%,var(--graphite) 55%,#1c1c1c 100%);
    color:rgba(255,255,255,.5);font-size:13px;font-weight:500;
  }
  .media-placeholder-icon{
    width:38px;height:38px;fill:none;stroke:var(--accent-hi);
    stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
  }

  .media-video{position:relative;overflow:hidden;cursor:pointer;width:100%;height:100%;}
  .media-video img{width:100%;height:100%;object-fit:cover;filter:brightness(.62);}
  .media-video .play-btn{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:78px;height:78px;border-radius:50%;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.5);
    display:flex;align-items:center;justify-content:center;
    backdrop-filter:blur(4px);
    transition:transform .25s ease, background .25s ease;
  }
  .media-video:hover .play-btn{transform:translate(-50%,-50%) scale(1.08);background:var(--accent);border-color:var(--accent);}
  .media-video .play-btn svg{width:22px;height:22px;fill:var(--white);margin-left:3px;}
  .media-video:hover .play-btn svg{fill:var(--white);}
  .detail-media .media-tag{
    position:absolute;bottom:18px;left:18px;color:var(--white);
    font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:700;
    display:flex;align-items:center;gap:8px;
    text-shadow:0 1px 6px rgba(0,0,0,.5);
  }
  .detail-media .media-tag .dot{width:6px;height:6px;background:var(--accent-hi);border-radius:50%;flex:none;}

  .media-gallery{
    width:100%;height:100%;
    display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:1fr 1fr;gap:6px;
  }
  .media-gallery img{width:100%;height:100%;object-fit:cover;}
  .media-gallery .g-main{grid-row:span 2;}
  .media-gallery a.g-more-wrap{position:relative;display:block;overflow:hidden;}
  .media-gallery .g-more{
    position:absolute;inset:0;background:rgba(18,18,18,.72);
    color:var(--white);display:flex;align-items:center;justify-content:center;
    font-family:'Big Shoulders Display';font-size:20px;font-weight:800;
  }

  @media (max-width: 900px){
    .detail-bleed{display:block;min-height:0;}
    .detail-shape{
      position:relative;top:auto;bottom:auto;left:auto;right:auto;
      width:100%;height:auto;aspect-ratio:5/4;
      padding:0 !important;
    }
    .detail-shape .detail-media{
      clip-path:polygon(0 0, 100% 0, 100% 70%, 68% 100%, 0 100%) !important;
    }
    .detail-media.no-clip{clip-path:none !important;}
    .detail-bleed > .wrap{padding-top:36px;}
    .detail-copy, .detail-copy.copy-right, .detail-copy.copy-left{
      max-width:none;margin:0;padding:0 0 56px;
    }
  }

  /* ---------- OUR TEAM ---------- */
  /* ---------- OUR TEAM ---------- */
  .team{
    position:relative;
    background:
      linear-gradient(180deg, rgba(10,10,10,.86) 0%, rgba(10,10,10,.56) 24%, rgba(10,10,10,.56) 76%, rgba(10,10,10,.86) 100%),
      url("../images/team-bg.jpg") center 62%/cover no-repeat;
    background-color:var(--black);
  }
  /* the photo stays put as the section scrolls over it (parallax) */
  @media (hover:hover) and (pointer:fine){
    .team{background-attachment:fixed, fixed;}
  }
  .team .sec-tag{color:var(--accent-hi);}
  .team h2.sec-title{color:var(--white);}
  .team-grid{
    list-style:none;margin:0;padding:0;
    display:grid;grid-template-columns:repeat(3,1fr);gap:28px;
  }
  .team-card{
    height:100%;background:var(--white);
    border:1px solid var(--line-dark);border-radius:4px;overflow:hidden;
    box-shadow:0 26px 44px -22px rgba(0,0,0,.75);
  }
  .team-photo{
    position:relative;aspect-ratio:4/4.4;overflow:hidden;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(160deg,#3b3b3b 0%,var(--graphite) 55%,#1c1c1c 100%);
  }
  .team-photo::before{
    content:"";position:absolute;left:0;top:0;
    width:64px;height:3px;background:var(--accent);
  }
  .team-photo img{width:100%;height:100%;object-fit:cover;object-position:center 20%;}
  .team-initials{
    width:56%;aspect-ratio:1;border-radius:50%;
    border:1px solid rgba(var(--accent-hi-rgb),.4);
    background:rgba(var(--accent-hi-rgb),.08);
    display:flex;align-items:center;justify-content:center;
    font-family:'Big Shoulders Display',sans-serif;font-weight:800;
    font-size:clamp(64px,7.4vw,104px);line-height:1;letter-spacing:.02em;
    color:var(--accent-hi);
  }
  .team-info{padding:22px 26px 28px;}
  .team-info::before{
    content:"";display:block;width:32px;height:2px;
    background:var(--accent);margin-bottom:14px;
  }
  .team-name{font-size:30px;color:var(--black);margin:0 0 10px;}
  .team-role{margin:0;font-size:14.5px;font-weight:500;color:var(--ink-2);line-height:1.4;}
  @media (max-width: 700px){
    .team-grid{grid-template-columns:1fr;gap:20px;}
    .team-photo{aspect-ratio:16/11;}
    .team-initials{width:auto;height:72%;font-size:68px;}
  }

  /* ---------- PROCESS ---------- */
  .process{
    background:var(--navy);
    color:var(--white);
    position:relative;
  }
  .process .sec-tag{color:var(--accent-hi);}
  .process h2.sec-title{color:var(--white);}
  .process .sec-desc{color:rgba(255,255,255,.6);}
  .steps{
    display:grid;grid-template-columns:repeat(4,1fr);
    margin-top:10px;
  }
  .step{
    padding:30px 26px 0;border-top:2px solid rgba(255,255,255,.2);
    position:relative;
  }
  .step.active{border-top-color:var(--accent-hi);}
  .step-no{
    font-family:'Big Shoulders Display';font-weight:900;font-size:52px;
    color:rgba(255,255,255,.18);
  }
  .step-title{
    font-family:'Big Shoulders Display';font-weight:700;font-size:21px;
    text-transform:uppercase;margin:10px 0 10px;
  }
  .step-desc{font-size:13.8px;color:rgba(255,255,255,.62);line-height:1.6;max-width:26ch;}

  /* ---------- PROJECTS / GALLERY ---------- */
  /* Neat, uniform grid: same size tiles, no scrolling mosaic */
  .gallery{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
  }
  .g-item{
    position:relative;overflow:hidden;background:var(--graphite);
    border:1px solid rgba(0,0,0,.06);border-radius:6px;
    aspect-ratio:16/10;
  }
  .g-item img{
    width:100%;height:100%;object-fit:cover;
    transition:transform .6s cubic-bezier(.22,.61,.36,1);
    filter:saturate(.96);
  }
  .g-item:hover img{transform:scale(1.045);}

  /* shimmer sweep */
  .g-item::before{
    content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
    background:linear-gradient(115deg,
      rgba(255,255,255,0) 40%,
      rgba(255,255,255,.55) 48%,
      rgba(var(--accent-rgb),.35) 50%,
      rgba(255,255,255,.55) 52%,
      rgba(255,255,255,0) 60%);
    transform:translateX(-140%);
    mix-blend-mode:overlay;
  }
  .g-item:hover::before{
    animation:shimmer-sweep 1.1s ease forwards;
  }
  @keyframes shimmer-sweep{
    to{transform:translateX(140%);}
  }

  .g-item::after{
    content:"";position:absolute;inset:0;z-index:1;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
    background:linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 34%);
    opacity:0;transition:opacity .3s ease;
  }
  .g-item:hover::after{opacity:1;}

  .g-cap{
    position:absolute;left:0;right:0;bottom:0;z-index:3;
    padding:14px 16px;
    color:var(--white);
    opacity:0;transform:translateY(8px);
    transition:opacity .3s ease, transform .3s ease;
  }
  .g-item:hover .g-cap{opacity:1;transform:translateY(0);}
  .g-cap .tag{
    font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-hi);font-weight:700;
  }
  .g-cap .name{font-family:'Big Shoulders Display';font-weight:700;font-size:15px;margin-top:2px;letter-spacing:.01em;}
  @media (max-width: 760px){
    .gallery{grid-template-columns:repeat(2,1fr);gap:8px;}
  }
  @media (max-width: 460px){
    .gallery{grid-template-columns:1fr;}
  }

  /* ---------- BEFORE & AFTER ---------- */
  .ba-block{margin-top:84px;}
  .ba-title{
    display:flex;align-items:center;gap:28px;
    font-size:clamp(28px,3.2vw,40px);color:var(--black);
    margin-bottom:30px;
  }
  .ba-title::after{content:"";flex:1;height:1px;background:var(--line-dark);}
  .ba-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;}
  .ba-item{
    margin:0;background:var(--white);
    border:1px solid var(--line-dark);border-radius:4px;overflow:hidden;
    box-shadow:0 22px 36px -24px rgba(0,0,0,.4);
  }
  .ba-panes{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--white);}
  .ba-pane{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--graphite);}
  .ba-pane img{width:100%;height:100%;object-fit:cover;}
  .ba-ph{
    width:100%;height:100%;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
    background:linear-gradient(160deg,#3b3b3b 0%,var(--graphite) 55%,#1c1c1c 100%);
    color:rgba(255,255,255,.5);font-size:13px;font-weight:500;
  }
  .ba-icon{
    width:34px;height:34px;fill:none;stroke:var(--accent-hi);
    stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
  }
  .ba-tag{
    position:absolute;left:14px;top:14px;z-index:2;
    padding:6px 12px;border-radius:2px;
    background:rgba(0,0,0,.72);color:var(--white);
    font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  }
  .ba-pane.after .ba-tag{background:var(--accent);color:var(--white);}
  .ba-cap{display:flex;flex-direction:column;gap:4px;padding:18px 22px 22px;}
  .ba-name{font-weight:700;font-size:16px;color:var(--black);}
  .ba-meta{font-size:14px;color:var(--ink-2);}
  @media (max-width: 760px){
    .ba-block{margin-top:64px;}
    .ba-grid{grid-template-columns:1fr;gap:22px;}
  }
  @media (max-width: 420px){
    .ba-panes{grid-template-columns:1fr;}
    .ba-pane{aspect-ratio:4/3;}
  }
  /* tall phone-shot pairs keep a portrait crop when the panes stack on small screens */
  @media (max-width: 420px){
    .ba-item.is-portrait .ba-pane{aspect-ratio:4/5;}
  }

  /* ---------- WHY US ---------- */
  .why{background:var(--black);color:var(--white);}
  .why-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;align-items:start;}
  .why h2.sec-title{color:var(--white);max-width:14ch;}
  .why .sec-tag{color:var(--accent-hi);}
  .why-lede{color:rgba(255,255,255,.62);font-size:16px;line-height:1.65;max-width:38ch;margin-top:22px;}
  .why-body{max-width:54ch;margin-top:18px;}
  .why-body:first-of-type{margin-top:26px;}
  .why-more{
    display:inline-flex;align-items:center;gap:8px;margin-top:30px;
    font-size:14px;font-weight:500;letter-spacing:.01em;
    color:rgba(255,255,255,.55);
    padding-bottom:3px;border-bottom:1px solid rgba(255,255,255,.22);
    transition:color .25s ease, border-color .25s ease;
  }
  .why-more span{color:var(--accent-hi);display:inline-block;transition:transform .25s ease;}
  .why-more:hover,.why-more:focus-visible{color:var(--accent-hi);border-color:var(--accent-hi);}
  .why-more:hover span,.why-more:focus-visible span{transform:translateX(4px);}
  @media (prefers-reduced-motion: reduce){.why-more span{transition:none;}}
  .why-list{margin-top:38px;}
  .why-row{
    display:flex;gap:22px;padding:22px 0;border-top:1px solid rgba(255,255,255,.14);
  }
  .why-row:last-child{border-bottom:1px solid rgba(255,255,255,.14);}
  .why-mark{
    font-family:'Big Shoulders Display';font-weight:900;font-size:20px;color:var(--accent-hi);
    flex-shrink:0;width:34px;
  }
  .why-row h4{
    font-family:'Inter';font-weight:700;font-size:16px;margin:0 0 6px;color:var(--white);
  }
  .why-row p{margin:0;font-size:14px;color:rgba(255,255,255,.58);line-height:1.6;max-width:44ch;}

  /* ---------- REVIEWS SLIDER ---------- */
  .reviews{
    background:var(--white);
    padding:100px 0 96px;
    overflow:hidden;
  }
  .reviews .sec-tag{color:var(--accent);}
  .reviews h2.sec-title{color:var(--black);max-width:none;white-space:nowrap;}
  @media (max-width: 560px){
    .reviews h2.sec-title{white-space:normal;}
  }
  .reviews .sec-desc{color:var(--ink-2);}
  .reviews .sec-head{padding:0 32px;max-width:var(--max);margin:0 auto 54px;}
  .marquee{
    width:100%;
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
    mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  }
  .marquee-track{
    display:flex;gap:22px;width:max-content;
    animation:marquee-scroll 46s linear infinite;
  }
  .marquee:hover .marquee-track{animation-play-state:paused;}
  @keyframes marquee-scroll{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
  }
  .rev-card{
    width:380px;flex-shrink:0;
    background:var(--paper);
    border:1px solid var(--line-dark);
    padding:32px 30px 28px;
  }
  .rev-stars{color:var(--star);font-size:15px;letter-spacing:3px;margin-bottom:20px;}
  .rev-quote{
    font-size:15.5px;line-height:1.65;color:#2B3340;
    min-height:100px;
  }
  .rev-foot{
    display:flex;align-items:center;gap:14px;
    margin-top:26px;padding-top:20px;border-top:1px solid var(--line-dark);
  }
  .rev-avatar{
    width:42px;height:42px;flex-shrink:0;
    background:rgba(var(--accent-rgb),.1);
    display:flex;align-items:center;justify-content:center;
    font-family:'Big Shoulders Display';font-weight:800;color:var(--accent);font-size:16px;
  }
  .rev-name{font-family:'Big Shoulders Display';font-weight:700;font-size:16px;color:var(--black);text-transform:uppercase;letter-spacing:.01em;}
  .rev-role{font-size:11.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.07em;margin-top:2px;}

  @media (max-width: 620px){
    .rev-card{width:300px;padding:26px 24px 22px;}
    .reviews{padding:70px 0 66px;}
  }

  /* ---------- FIND US ---------- */
  /* Same design as the rest of the site, scaled down so the whole
     section — including the map — fits comfortably on one screen. */
  .find-us{background:var(--paper);color:var(--black);padding:64px 0;}
  .find-us .sec-tag{color:var(--accent);}
  .find-us h2.sec-title{color:var(--black);max-width:13ch;font-size:clamp(26px,3vw,38px);}
  .find-us .why-lede{color:var(--ink-2);}
  .find-grid{
    display:grid;grid-template-columns:.85fr 1.15fr;gap:36px;align-items:stretch;
  }
  .find-lede{margin-top:10px;margin-bottom:20px;max-width:38ch;font-size:14px;}
  .find-detail{
    display:flex;flex-direction:column;gap:2px;
    padding:9px 0;border-top:1px solid var(--line-dark);
  }
  .find-detail:last-of-type{border-bottom:1px solid var(--line-dark);margin-bottom:18px;}
  .find-label{
    font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;
    color:var(--ink-3);font-weight:700;
  }
  .find-value{font-size:14px;color:var(--black);font-weight:500;}
  .find-value a{color:inherit;text-decoration:none;}
  .find-value a:hover{text-decoration:underline;}
  .find-us .cta-btn{padding:9px 18px;font-size:12px;}
  .find-map{
    position:relative;min-height:260px;
    border:1px solid rgba(16,24,40,.14);
    filter:grayscale(.15) contrast(1.05);
  }
  .find-map::before{
    content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:4px;
    background:var(--accent);z-index:2;
  }
  .find-map iframe{position:relative;z-index:1;min-height:260px;}

  @media (max-width: 980px){
    .find-us{padding:56px 0;}
    .find-grid{grid-template-columns:1fr;}
    .find-map{min-height:240px;}
    .find-map iframe{min-height:240px;}
  }

  /* ---------- FAQ ---------- */
  .faq{
    position:relative;
    background:
      linear-gradient(180deg, rgba(10,10,10,.88) 0%, rgba(10,10,10,.6) 22%, rgba(10,10,10,.6) 80%, rgba(10,10,10,.92) 100%),
      url("../images/faq-bg.jpg") center 42%/cover no-repeat;
    background-color:var(--black);
    padding:100px 0;
  }
  /* the photo stays put as the section scrolls over it, same as Our Team */
  @media (hover:hover) and (pointer:fine){
    .faq{background-attachment:fixed, fixed;}
  }
  .faq-head{
    max-width:680px;margin:0 auto 54px;text-align:center;
  }
  .faq-head .sec-tag{justify-content:center;color:var(--accent-hi);}
  .faq-head .sec-title{color:var(--white);margin:0 auto 16px;}
  .faq-lede{
    margin:0 auto;max-width:52ch;color:rgba(255,255,255,.68);
    font-size:15.5px;line-height:1.65;
  }
  .faq-list{
    display:grid;grid-template-columns:repeat(2,1fr);gap:18px;
  }
  .faq-item{
    background:rgba(255,255,255,.97);
    border:1px solid rgba(255,255,255,.08);border-radius:14px;
    overflow:hidden;
    box-shadow:0 20px 36px -22px rgba(0,0,0,.55);
  }
  .faq-q{
    width:100%;
    display:flex;align-items:center;justify-content:space-between;
    gap:20px;padding:24px 26px;
    background:none;border:none;cursor:pointer;
    text-align:left;font-family:'Inter';
  }
  .faq-q span.q-text{
    font-weight:700;font-size:16.5px;color:var(--black);letter-spacing:0;
    text-transform:none;
  }
  .faq-q .q-icon{
    flex-shrink:0;width:34px;height:34px;position:relative;
    border-radius:50%;background:var(--paper);border:1px solid var(--line-dark);
  }
  .faq-q .q-icon::before,.faq-q .q-icon::after{
    content:"";position:absolute;left:50%;top:50%;background:var(--accent);
    transition:transform .25s ease, background .25s ease;
  }
  .faq-q .q-icon::before{width:2px;height:13px;transform:translate(-50%,-50%);}
  .faq-q .q-icon::after{width:13px;height:2px;transform:translate(-50%,-50%);}
  .faq-item.open .faq-q .q-icon::before{transform:translate(-50%,-50%) scaleY(0);}
  .faq-a{
    max-height:0;overflow:hidden;
    transition:max-height .3s ease, padding .3s ease;
  }
  .faq-item.open .faq-a{max-height:260px;padding-bottom:26px;}
  .faq-a p{
    margin:0;padding:0 26px;font-size:14.5px;line-height:1.65;color:var(--ink-2);
  }

  @media (max-width: 760px){
    .faq-list{grid-template-columns:1fr;}
    .faq{padding:70px 0;}
  }

  /* ---------- CTA BANNER ---------- */
  .banner{
    background:var(--black);
    color:var(--white);
    position:relative;
  }
  .banner::before{
    content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--accent);
  }
  .banner-inner{
    max-width:var(--max);margin:0 auto;padding:80px 32px;
    display:flex;justify-content:space-between;align-items:center;gap:40px;flex-wrap:wrap;
  }
  .banner h2{font-size:clamp(30px,4vw,50px);max-width:14ch;color:var(--white);}
  .banner-ctas{display:flex;gap:16px;flex-wrap:wrap;}
  .banner .cta-btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.4);color:var(--white);}

  /* ---------- CONTACT FORM ---------- */
  .contact-form{background:var(--paper);}
  .contact-grid{
    display:grid;grid-template-columns:.75fr 1.25fr;gap:64px;align-items:start;
  }
  .contact-lede{margin-top:18px;margin-bottom:32px;max-width:36ch;color:var(--ink-2);}
  .contact-intro .why-lede{color:var(--ink-2);}
  .contact-detail{
    display:flex;align-items:center;gap:16px;
    padding:16px 0;border-top:1px solid var(--line-dark);
  }
  .contact-text{display:flex;flex-direction:column;gap:3px;min-width:0;}
  .contact-ico{
    width:44px;height:44px;flex:none;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:var(--graphite);
  }
  .contact-ico svg{
    width:20px;height:20px;fill:none;stroke:var(--accent-hi);
    stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
  }
  .contact-detail:last-of-type{border-bottom:1px solid var(--line-dark);}
  .contact-intro .find-label{color:var(--ink-3);}
  .contact-intro .find-value{color:var(--black);}

  .contact-form-panel{
    background:var(--black);
    padding:44px 44px 40px;
    position:relative;
  }
  .contact-form-panel::before{
    content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:4px;background:var(--accent);
  }
  .form-row{display:grid;grid-template-columns:1fr;gap:22px;margin-bottom:22px;}
  .form-row.two{grid-template-columns:1fr 1fr;}
  .field{display:flex;flex-direction:column;gap:9px;}
  .field label{
    font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;
    color:rgba(255,255,255,.5);font-weight:700;
  }
  .field input, .field select, .field textarea{
    background:transparent;
    border:none;border-bottom:1px solid rgba(255,255,255,.25);
    color:var(--white);font-family:'Inter';font-size:15px;
    padding:10px 2px;outline:none;
    transition:border-color .2s ease;
  }
  .field select option{background:var(--black);color:var(--white);}
  .field input::placeholder, .field textarea::placeholder{color:rgba(255,255,255,.32);}
  .field input:focus, .field select:focus, .field textarea:focus{border-bottom-color:var(--accent-hi);}
  .field textarea{resize:vertical;min-height:100px;font-family:'Inter';}
  /* photo upload */
  .upload-label{
    font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;
    color:rgba(255,255,255,.5);font-weight:700;
  }
  .upload-label em{font-style:normal;text-transform:none;letter-spacing:0;font-weight:500;color:rgba(255,255,255,.38);}
  .field .upload-input{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;border:0;
    overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;opacity:0;
  }
  .field .upload-drop{
    display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;
    padding:24px 18px;cursor:pointer;
    border:1px dashed rgba(255,255,255,.28);border-radius:6px;
    background:rgba(255,255,255,.03);
    text-transform:none;letter-spacing:0;font-weight:400;
    color:rgba(255,255,255,.8);font-size:14px;
    transition:border-color .2s ease, background-color .2s ease;
  }
  .field .upload-drop:hover,
  .field .upload-drop.is-dragover,
  .upload-input:focus-visible + .upload-drop{
    border-color:var(--accent-hi);background:rgba(var(--accent-hi-rgb),.07);
  }
  .upload-input:focus-visible + .upload-drop{outline:2px solid var(--accent-hi);outline-offset:2px;}
  .upload-icon{
    width:28px;height:28px;fill:none;stroke:var(--accent-hi);
    stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:2px;
  }
  .upload-text strong{color:var(--white);font-weight:600;}
  .upload-hint{font-size:12px;color:rgba(255,255,255,.42);}
  @media (pointer: coarse){ .upload-drag{display:none;} }
  .upload-msg{margin:0;font-size:12.5px;color:#f2a3a3;line-height:1.5;}
  .upload-msg:empty{display:none;}
  .upload-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
  .upload-list:empty{display:none;}
  .upload-item{
    display:flex;align-items:center;gap:12px;padding:8px 10px;
    border:1px solid rgba(255,255,255,.14);border-radius:6px;background:rgba(255,255,255,.04);
  }
  .upload-thumb{
    width:44px;height:44px;flex:none;border-radius:4px;overflow:hidden;
    background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;
  }
  .upload-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
  .upload-thumb svg{width:20px;height:20px;fill:none;stroke:rgba(255,255,255,.5);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
  .upload-meta{display:flex;flex-direction:column;min-width:0;flex:1;}
  .upload-name{font-size:13.5px;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .upload-size{font-size:12px;color:rgba(255,255,255,.42);}
  .upload-remove{
    flex:none;width:30px;height:30px;border-radius:50%;
    background:transparent;border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.75);
    font-size:18px;line-height:1;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:border-color .2s ease,color .2s ease;
  }
  .upload-remove:hover,.upload-remove:focus-visible{border-color:var(--accent-hi);color:var(--accent-hi);}
  .form-foot{
    display:flex;align-items:center;justify-content:space-between;gap:24px;
    margin-top:6px;flex-wrap:wrap;
  }
  .form-note{font-size:12px;color:rgba(255,255,255,.4);max-width:32ch;line-height:1.5;margin:0;}
  .form-foot .cta-btn{flex-shrink:0;border:none;cursor:pointer;font-size:13px;}
  .form-success{
    display:none;margin:20px 0 0;padding:16px 18px;
    background:rgba(var(--accent-hi-rgb),.1);border:1px solid rgba(var(--accent-hi-rgb),.4);
    color:var(--accent-hi);font-size:13.5px;
  }
  .form-success.show{display:block;}

  @media (max-width: 900px){
    .contact-grid{grid-template-columns:1fr;gap:36px;}
    .form-row.two{grid-template-columns:1fr;}
    .contact-form-panel{padding:34px 26px 30px;}
  }

  /* ---------- FOOTER ---------- */
  footer{background:var(--black);color:rgba(255,255,255,.6);padding:70px 0 26px;}
  .foot-grid{
    display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;column-gap:50px;row-gap:0;
    padding-bottom:56px;border-bottom:1px solid rgba(255,255,255,.12);
  }
  /* logo sits in row 1; every column of text starts together in row 2 */
  .foot-brand{display:contents;}
  .foot-brand .logo{grid-column:1;grid-row:1;justify-self:start;}
  .foot-brand-text{grid-column:1;grid-row:2;}
  .foot-grid > .foot-col{grid-row:2;}
  .foot-grid > .foot-col:nth-child(2){grid-column:2;}
  .foot-grid > .foot-col:nth-child(3){grid-column:3;}
  .foot-grid > .foot-col:nth-child(4){grid-column:4;}
  .foot-brand .logo{margin-bottom:18px;}
  .foot-brand .logo-full{width:250px;height:auto;}
  .foot-brand p{font-size:14px;line-height:1.65;max-width:32ch;color:rgba(255,255,255,.5);margin:0;}
  .foot-socials{list-style:none;margin:24px 0 0;padding:0;display:flex;gap:10px;flex-wrap:wrap;}
  .foot-socials a{
    width:42px;height:42px;display:flex;align-items:center;justify-content:center;
    border:1px solid var(--line);border-radius:50%;
    color:rgba(255,255,255,.7);
    transition:color .25s ease, border-color .25s ease, background-color .25s ease;
  }
  .foot-socials svg{width:18px;height:18px;fill:currentColor;}
  .foot-socials a:hover,.foot-socials a:focus-visible{
    color:var(--accent-hi);border-color:var(--accent-hi);background:rgba(var(--accent-hi-rgb),.1);
  }
  .foot-col h5{
    color:var(--white);font-size:12.5px;text-transform:uppercase;letter-spacing:.09em;
    margin:0 0 18px;font-weight:700;line-height:23px;
  }
  .foot-col a, .foot-col p{
    display:block;font-size:14px;color:rgba(255,255,255,.55);margin-bottom:12px;
    line-height:1.5;
  }
  .foot-col a:hover{color:var(--accent-hi);}
  .foot-col p.foot-contact{display:flex;align-items:flex-start;gap:12px;}
  .foot-col .foot-contact a{display:inline;margin:0;}
  .foot-ico{
    width:18px;height:18px;flex:none;margin-top:2px;
    fill:none;stroke:var(--accent-hi);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
  }
  .foot-bottom{
    display:flex;justify-content:space-between;align-items:center;
    padding-top:24px;font-size:12.5px;color:rgba(255,255,255,.4);flex-wrap:wrap;gap:10px;
  }

  .form-note a{color:inherit;text-decoration:underline;text-underline-offset:2px;}
  .form-note a:hover{color:var(--accent-hi);}
  .foot-bottom-left{display:flex;align-items:center;flex-wrap:wrap;gap:8px 24px;}
  .foot-legal{display:flex;gap:20px;flex-wrap:wrap;}
  .foot-legal a{color:rgba(255,255,255,.62);transition:color .2s ease;}
  .foot-legal a:hover,.foot-legal a:focus-visible{color:var(--accent-hi);}

  /* ---------- LEGAL PAGES (privacy / terms) ---------- */
  .legal-hero{background:var(--navy);color:var(--white);padding:76px 0 60px;position:relative;}
  .legal-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--accent);}
  .legal-hero .sec-tag{color:var(--accent-hi);}
  .legal-hero .sec-tag .rule{background:var(--accent-hi);}
  .legal-hero h1{font-size:clamp(36px,5vw,58px);color:var(--white);margin:0 0 14px;}
  .legal-updated{font-size:14px;color:rgba(255,255,255,.62);margin:0;}
  .legal-body{background:var(--white);padding:56px 0 96px;}
  .legal-inner{max-width:820px;margin:0 auto;padding:0 32px;}
  .legal-back{
    display:inline-flex;align-items:center;gap:8px;margin-bottom:30px;
    font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);
  }
  .legal-back:hover{text-decoration:underline;}
  .legal-body h2{
    font-family:'Inter',sans-serif;font-weight:700;font-size:21px;letter-spacing:0;text-transform:none;
    color:var(--black);margin:42px 0 12px;line-height:1.3;
  }
  .legal-body h2:first-of-type{margin-top:0;}
  .legal-body p,.legal-body li{font-size:15.5px;line-height:1.75;color:var(--ink-2);}
  .legal-body p{margin:0 0 14px;}
  .legal-body ul{margin:0 0 16px;padding-left:22px;}
  .legal-body li{margin-bottom:8px;}
  .legal-body strong{color:var(--black);font-weight:600;}
  .legal-body a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;}
  .legal-note{
    background:var(--paper);border-left:3px solid var(--accent);border-radius:2px;
    padding:16px 20px;margin:0 0 30px;
  }
  .legal-note p{margin:0;font-size:14.5px;}
  @media (max-width: 760px){
    .legal-hero{padding:52px 0 42px;}
    .legal-body{padding:40px 0 70px;}
    .legal-inner{padding:0 22px;}
    .legal-body h2{font-size:19px;margin-top:34px;}
  }

  /* ---------- WHATSAPP FLOATING BUTTON ---------- */
  .wa-float{
    position:fixed;right:24px;bottom:24px;z-index:60;
    width:58px;height:58px;border-radius:50%;
    background:#25D366;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 8px 20px -4px rgba(0,0,0,.4);
    animation:waFloat 3.4s ease-in-out infinite, waGlow 2.6s ease-in-out infinite;
  }
  .wa-float svg{width:29px;height:29px;fill:#fff;}
  .wa-float:hover{animation-play-state:paused;transform:translateY(-4px);}
  @keyframes waFloat{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-8px);}
  }
  @keyframes waGlow{
    0%,100%{box-shadow:0 8px 20px -4px rgba(0,0,0,.4), 0 0 0 0 rgba(37,211,102,.55);}
    50%{box-shadow:0 8px 20px -4px rgba(0,0,0,.4), 0 0 0 12px rgba(37,211,102,0);}
  }
  @media (prefers-reduced-motion: reduce){
    .wa-float{animation:none;}
  }
  @media (max-width: 560px){
    .wa-float{right:16px;bottom:16px;width:52px;height:52px;}
    .wa-float svg{width:26px;height:26px;}
  }

  /* ---------- RESPONSIVE ---------- */
  @media (max-width: 980px){
    .services-grid{grid-template-columns:repeat(2,1fr);}
    .steps{grid-template-columns:repeat(2,1fr);gap:26px 0;}
    .why-grid{grid-template-columns:1fr;gap:40px;}
    .foot-grid{grid-template-columns:1fr 1fr;column-gap:36px;}
    .foot-brand-text,.foot-grid > .foot-col:nth-child(2){margin-bottom:36px;}
    .foot-grid > .foot-col:nth-child(2){grid-column:2;grid-row:2;}
    .foot-grid > .foot-col:nth-child(3){grid-column:1;grid-row:3;}
    .foot-grid > .foot-col:nth-child(4){grid-column:2;grid-row:3;}
    .strip-inner{grid-template-columns:repeat(2,1fr);}
    .strip-item:nth-child(3){border-left:none;}
  }
  @media (max-width: 620px){
    .section{padding:70px 0;}
    .services-grid{grid-template-columns:1fr;}
    .steps{grid-template-columns:repeat(2,1fr);gap:22px 0;}
    .foot-grid{grid-template-columns:1fr;row-gap:36px;}
    .foot-brand{display:block;}
    .foot-brand-text{margin-bottom:0;}
    .foot-grid > .foot-col:nth-child(n){grid-column:auto;grid-row:auto;margin-bottom:0;}
    .banner-inner{flex-direction:column;align-items:flex-start;}
    .nav{padding-left:18px;padding-right:18px;}
    .logo .logo-icon{height:auto;width:min(172px,44vw);}
    .nav-actions{margin-left:auto;margin-right:0;gap:8px;}
    .nav-actions .cta-btn{padding:10px 12px;font-size:11px;}
    /* collapse the call button to an icon-only circle so the header stays uncrowded */
    .call-btn{padding:10px;border-radius:50%;}
    .call-btn svg{width:16px;height:16px;}
    .call-btn-text{display:none;}
    .burger{width:38px;height:38px;}
  }
  /* small phones: make room for the burger button */
  @media (max-width: 480px){
    .logo{flex:none;}
    .logo .logo-icon{width:min(148px,36vw);}
  }
  @media (max-width: 380px){
    .logo .logo-icon{width:30vw;}
    .nav-actions{gap:6px;}
    .nav-actions .cta-btn:not(.call-btn){padding:9px 9px;}
  }
  @media (max-width: 340px){
    .logo .logo-icon{width:27vw;}
    .nav-actions{gap:4px;}
    .call-btn{padding:8px;}
    .burger{width:36px;height:36px;}
  }

/* ---------- MOBILE HORIZONTAL SCROLL LOCK ---------- */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

@supports (overflow: clip){
  html,
  body{overflow-x:clip;}
}

@media (max-width: 620px){
  html,
  body{
    overscroll-behavior-x:none;
    touch-action:pan-y pinch-zoom;
  }

  body{position:relative;}

  header.site,
  section,
  footer{
    width:100%;
    max-width:100%;
  }

  .wrap,
  .nav,
  .hero-inner,
  .banner-inner,
  .reviews .sec-head{
    max-width:100%;
  }

  img,
  svg,
  iframe{
    max-width:100%;
  }

  .standards-grid,
  .steps{
    min-width:0;
  }

  .std-box,
  .step{
    min-width:0;
    overflow-wrap:anywhere;
  }
}