
:root{--bg:#04090c;--panel:#091116;--text:#f5f7f7;--muted:#9ba7ae;--line:rgba(255,255,255,.16);--red:#c51d26}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}
.page-watermark{position:fixed;z-index:70;inset:-35%;pointer-events:none;opacity:.19;transform:rotate(-23deg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='170'%3E%3Ctext x='0' y='100' fill='%23ffffff' font-family='Arial' font-weight='700' font-size='34' letter-spacing='5'%3ETEST PAGE • TEST PAGE%3C/text%3E%3C/svg%3E")}
.cursor-glow{position:fixed;z-index:1;width:340px;height:340px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(130,177,206,.08),transparent 68%);transform:translate(-50%,-50%);opacity:0;transition:opacity .3s}
.mobile-header{display:none}
.hero-wrap{position:relative;background:#03080b;overflow:hidden}
.hero-stage{position:relative;width:100%;line-height:0;overflow:hidden;perspective:1000px}
.hero-image{display:block;width:100%;height:auto;transform:scale(1.002);transition:transform .18s ease-out;will-change:transform}
.hero-depth{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 70% 40%,rgba(157,197,220,.08),transparent 25%);mix-blend-mode:screen;transition:transform .18s ease-out}
.hotspot,.service-hotspot{position:absolute;z-index:8;border:0;background:transparent;cursor:pointer}
.hotspot:focus-visible,.service-hotspot:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.hs-home{left:67.6%;top:2%;width:5.4%;height:7%}.hs-about{left:74%;top:2%;width:6.8%;height:7%}.hs-projects{left:81.4%;top:2%;width:7.2%;height:7%}.hs-contact{left:89%;top:2%;width:8%;height:7%}.hs-cta{left:5%;top:69.2%;width:17.4%;height:6.3%}.hs-email{left:5%;top:75%;width:17%;height:4.3%}
.s1{left:5.5%;top:83%;width:20.5%;height:8.5%}.s2{left:27%;top:83%;width:21%;height:8.5%}.s3{left:49%;top:83%;width:22%;height:8.5%}.s4{left:72%;top:83%;width:22%;height:8.5%}
.scroll-hint{position:absolute;right:2.5%;bottom:2%;z-index:7;display:flex;gap:12px;align-items:center;line-height:1;color:rgba(255,255,255,.55);font-size:9px;letter-spacing:.28em}.scroll-hint i{font-style:normal;animation:bounce 1.8s infinite}@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.content-section{padding:110px 6vw;border-top:1px solid var(--line);position:relative;z-index:2;background:linear-gradient(180deg,#050b0f,#04090c)}
.section-index{font-size:10px;letter-spacing:.35em;color:#8d989f;margin-bottom:50px}
.two-col,.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:start}
h2{font-size:clamp(48px,6vw,92px);line-height:.91;letter-spacing:-.055em;margin:0;font-weight:800}h2 span{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.55)}
.body-copy{max-width:620px;color:#aab3b9;font-size:18px;line-height:1.75}.body-copy strong{color:white}.line-link{display:inline-flex;gap:18px;align-items:center;margin-top:24px;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:8px;font-size:11px;letter-spacing:.25em;color:white}
.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.project-card{position:relative;min-height:380px;text-align:left;padding:30px;background:#071015;color:white;border:0;cursor:pointer;transition:background .25s,transform .25s}
.project-card .num{position:absolute;top:22px;right:22px;color:#68757c;font-size:10px;letter-spacing:.18em}.project-card .symbol{display:block;font-size:40px;margin:34px 0 78px}.project-card h3{font-size:22px;line-height:1.2;letter-spacing:.12em;margin:0 0 18px}.project-card p{font-size:13px;color:#919da4;line-height:1.65}.project-card i{font-style:normal;position:absolute;bottom:26px;left:30px;font-size:9px;letter-spacing:.25em;color:#d4dadc}
.statement{padding:150px 6vw;text-align:center;background:#03080b;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}.small-rule{width:1px;height:70px;background:#6e777c;margin:0 auto 35px}.statement p{font-size:clamp(55px,8vw,120px);line-height:.9;letter-spacing:.08em;margin:0;font-weight:700}.statement p span{color:#747f85}
.contact-box{padding-top:12px}.contact-box p{font-size:18px;color:#9ca7ad}.big-mail{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.45);padding:18px 0;font-size:clamp(22px,2.7vw,42px);letter-spacing:-.03em}.big-mail span{color:var(--red)}.mini{margin-top:25px;color:#737e84;font-size:9px;letter-spacing:.25em}
footer{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:20px;align-items:center;padding:30px 4vw;border-top:1px solid var(--line);font-size:8px;letter-spacing:.25em;color:#aab1b5}footer span:nth-child(2){text-align:center}footer a{text-align:right}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:none}
.modal{position:fixed;z-index:100;inset:0;display:none}.modal.open{display:block}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(7px)}.modal-card{position:relative;width:min(620px,calc(100% - 40px));margin:10vh auto 0;background:#0b1318;border:1px solid rgba(255,255,255,.18);padding:48px;box-shadow:0 30px 100px rgba(0,0,0,.5)}.modal-close{position:absolute;right:18px;top:12px;background:transparent;border:0;color:white;font-size:32px;cursor:pointer}.modal-kicker{font-size:9px;letter-spacing:.3em;color:#8b979e;margin-bottom:25px}.modal-card h3{font-size:40px;letter-spacing:.04em;margin:0 0 18px}.modal-card p{color:#a5afb5;line-height:1.7;font-size:16px}.modal-cta{display:inline-flex;gap:28px;border:1px solid rgba(255,255,255,.75);padding:14px 18px;margin-top:16px;font-size:10px;letter-spacing:.25em}
@media (hover:hover) and (pointer:fine){.project-card:hover{background:#0b171e;transform:translateY(-5px)}.hotspot:hover{background:rgba(255,255,255,.025)}.service-hotspot:hover{background:rgba(255,255,255,.035);border-top:1px solid rgba(255,255,255,.15)}}
@media(max-width:900px){.mobile-header{display:flex;position:sticky;top:0;z-index:80;height:72px;align-items:center;justify-content:space-between;padding:0 20px;background:rgba(4,9,12,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.mobile-brand{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.25em}.mobile-brand img{width:42px;height:42px;object-fit:contain;filter:invert(1) grayscale(1) brightness(2)}#menuBtn{border:1px solid var(--line);background:transparent;color:white;width:44px;height:44px;font-size:20px}#mobileNav{display:none;position:absolute;top:72px;left:0;right:0;background:#071015;border-bottom:1px solid var(--line);padding:18px 20px;flex-direction:column}#mobileNav.open{display:flex}#mobileNav a{padding:14px 0;font-size:11px;letter-spacing:.25em}.hero-stage{height:620px}.hero-image{width:auto;max-width:none;height:620px;transform:translateX(-18%)}.hotspot,.service-hotspot,.scroll-hint{display:none}.two-col,.contact-grid{grid-template-columns:1fr}.project-grid{grid-template-columns:1fr 1fr}.content-section{padding:80px 24px}.body-copy{font-size:16px}.statement{padding:110px 24px}footer{grid-template-columns:1fr;text-align:center}footer span:nth-child(2),footer a{text-align:center}}
@media(max-width:560px){.hero-stage{height:520px}.hero-image{height:520px;transform:translateX(-22%)}.project-grid{grid-template-columns:1fr}.project-card{min-height:300px}.project-card .symbol{margin-bottom:45px}.modal-card{padding:38px 24px;margin-top:6vh}.modal-card h3{font-size:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-image,.hero-depth,.reveal,.project-card{transition:none!important}.scroll-hint i{animation:none}.reveal{opacity:1;transform:none}}

/* iPhone / mobile layout fix */
.mobile-hero-actions{display:none}
@media(max-width:900px){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .mobile-header{height:calc(68px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 16px 0;}
  #mobileNav{top:calc(68px + env(safe-area-inset-top));padding-left:20px;padding-right:20px}
  .hero-stage{height:auto;min-height:0;overflow:hidden;perspective:none;background:#03080b}
  .hero-image{display:block;width:100%;height:auto;max-width:100%;transform:none!important;object-fit:contain}
  .hero-depth{display:none}
  .mobile-hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 16px 18px;background:#03080b;border-top:1px solid rgba(255,255,255,.10)}
  .mobile-hero-actions a{display:flex;align-items:center;justify-content:center;min-height:46px;border:1px solid rgba(255,255,255,.35);font-size:10px;letter-spacing:.18em;text-align:center}
  .mobile-hero-actions a:first-child{background:#fff;color:#071015;border-color:#fff}
  .page-watermark{inset:-45%;opacity:.12;background-size:390px 128px}
  .content-section{padding:68px 20px}
  .section-index{margin-bottom:34px}
  h2{font-size:clamp(40px,13vw,68px)}
  .statement{padding:90px 20px}
  .statement p{font-size:clamp(44px,14vw,80px)}
  footer{padding:26px 20px 30px}
}
@media(max-width:560px){
  .mobile-header{height:calc(64px + env(safe-area-inset-top))}
  #mobileNav{top:calc(64px + env(safe-area-inset-top))}
  .mobile-brand img{width:38px;height:38px}
  .hero-stage{height:auto}
  .hero-image{width:100%;height:auto;transform:none!important}
  .mobile-hero-actions{grid-template-columns:1fr}
  .project-grid{grid-template-columns:1fr}
  .project-card{min-height:285px}
  .big-mail{font-size:20px;overflow-wrap:anywhere}
}


/* iPhone hero rebuild v2: crop the cinematic art and render readable HTML copy on top */
.mobile-hero-copy{display:none}
@media(max-width:900px){
  .hero-wrap{background:#03080b}
  .hero-stage{
    position:relative;
    height:calc(100svh - 68px - env(safe-area-inset-top));
    min-height:610px;
    max-height:860px;
    overflow:hidden;
  }
  .hero-image{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:67% center;
    transform:none!important;
    filter:saturate(.92) contrast(1.03) brightness(.78);
  }
  .hero-stage::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:3;
    pointer-events:none;
    background:
      linear-gradient(180deg,rgba(3,8,11,.18) 0%,rgba(3,8,11,.10) 30%,rgba(3,8,11,.72) 73%,rgba(3,8,11,.97) 100%),
      linear-gradient(90deg,rgba(3,8,11,.88) 0%,rgba(3,8,11,.58) 52%,rgba(3,8,11,.14) 100%);
  }
  .mobile-hero-copy{
    display:block;
    position:absolute;
    z-index:6;
    left:20px;
    right:20px;
    bottom:34px;
    line-height:1.2;
  }
  .mobile-hero-kicker{
    margin-bottom:14px;
    font-size:9px;
    letter-spacing:.24em;
    color:rgba(255,255,255,.82);
    white-space:nowrap;
  }
  .mobile-hero-copy h1{
    margin:0 0 16px;
    font-size:clamp(48px,15vw,76px);
    line-height:.88;
    letter-spacing:-.055em;
    font-weight:800;
  }
  .mobile-hero-copy p{
    max-width:430px;
    margin:0 0 22px;
    font-size:15px;
    line-height:1.55;
    color:rgba(255,255,255,.88);
  }
  .mobile-primary-cta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:min(300px,100%);
    min-height:50px;
    padding:0 18px;
    border:1px solid rgba(255,255,255,.85);
    font-size:10px;
    letter-spacing:.22em;
    background:rgba(2,7,10,.28);
    backdrop-filter:blur(5px);
  }
  .mobile-primary-cta span{font-size:18px;letter-spacing:0}
  .mobile-email{
    display:inline-block;
    margin-top:13px;
    font-size:14px;
    letter-spacing:.04em;
  }
  .mobile-hero-actions{display:none!important}
}
@media(max-width:560px){
  .hero-stage{
    height:calc(100svh - 64px - env(safe-area-inset-top));
    min-height:590px;
    max-height:800px;
  }
  .hero-image{object-position:69% center}
  .mobile-hero-copy{left:18px;right:18px;bottom:28px}
  .mobile-hero-kicker{font-size:8px;letter-spacing:.18em}
  .mobile-hero-copy p{font-size:14px;max-width:92%}
}
@media(max-width:390px){
  .hero-image{object-position:71% center}
  .mobile-hero-copy h1{font-size:46px}
  .mobile-hero-kicker{white-space:normal;line-height:1.5}
}

/* Mobile v3 — do not show the desktop mockup as the mobile layout */
@media(max-width:900px){
  .hero-stage{height:auto;min-height:0;max-height:none;overflow:hidden;background:#04090c;padding-bottom:28px}
  .hero-image{position:relative;inset:auto;width:100%;height:46svh;min-height:300px;max-height:430px;object-fit:cover;object-position:67% 50%;filter:saturate(.9) contrast(1.04) brightness(.66);transform:none!important}
  .hero-stage::before{content:"";position:absolute;z-index:4;left:0;right:0;top:0;height:46svh;min-height:300px;max-height:430px;background:linear-gradient(180deg,rgba(4,9,12,.08),rgba(4,9,12,.18) 55%,#04090c 100%);pointer-events:none}
  .hero-stage::after{display:none}
  .mobile-hero-copy{display:block;position:relative;z-index:6;left:auto;right:auto;bottom:auto;margin:-72px 20px 0;padding:0;line-height:1.2}
  .mobile-hero-copy h1{font-size:clamp(50px,15vw,72px);margin:0 0 16px;line-height:.9}
  .mobile-hero-copy p{max-width:520px}
  .mobile-primary-cta{background:transparent}
  .mobile-hero-kicker{white-space:normal;line-height:1.55}
}
@media(max-width:560px){
  .hero-image{height:43svh;min-height:285px;max-height:380px;object-position:68% center}
  .hero-stage::before{height:43svh;min-height:285px;max-height:380px}
  .mobile-hero-copy{margin:-58px 18px 0}
  .mobile-hero-copy h1{font-size:clamp(48px,15vw,64px)}
}


/* ===== MOBILE V4: true responsive hero, desktop artwork never used as a full mobile layout ===== */
.mobile-service-grid{display:none}

@media(max-width:900px){
  .hero-stage{
    position:relative!important;
    min-height:720px!important;
    height:auto!important;
    max-height:none!important;
    padding:0 0 34px!important;
    overflow:hidden!important;
    background:
      linear-gradient(180deg,rgba(3,8,11,.08) 0%,rgba(3,8,11,.12) 38%,rgba(3,8,11,.72) 72%,#04090c 100%),
      url("vreezen-hero.png") 88% 50% / auto 720px no-repeat!important;
  }

  /* The desktop mockup image contains desktop text/nav. Hide it completely on mobile. */
  .hero-image{display:none!important}
  .hero-depth,.hotspot,.service-hotspot,.scroll-hint{display:none!important}

  .mobile-hero-copy{
    display:block!important;
    position:relative!important;
    z-index:6!important;
    left:auto!important;right:auto!important;bottom:auto!important;
    margin:0!important;
    padding:300px 20px 24px!important;
    line-height:1.2!important;
  }

  .mobile-hero-kicker{
    font-size:9px!important;
    letter-spacing:.20em!important;
    line-height:1.55!important;
    margin:0 0 16px!important;
    white-space:normal!important;
  }

  .mobile-hero-copy h1{
    margin:0 0 16px!important;
    font-size:clamp(50px,15vw,72px)!important;
    line-height:.88!important;
    letter-spacing:-.055em!important;
  }

  .mobile-hero-copy p{
    max-width:440px!important;
    margin:0 0 22px!important;
    font-size:15px!important;
    line-height:1.55!important;
    color:rgba(255,255,255,.90)!important;
  }

  .mobile-primary-cta{
    width:min(310px,100%)!important;
    min-height:50px!important;
    padding:0 18px!important;
    background:rgba(4,9,12,.35)!important;
    border:1px solid rgba(255,255,255,.85)!important;
  }

  .mobile-email{
    margin-top:14px!important;
    font-size:14px!important;
  }

  .mobile-service-grid{
    position:relative;
    z-index:7;
    display:grid!important;
    grid-template-columns:1fr 1fr;
    margin:4px 20px 0;
    border-top:1px solid rgba(255,255,255,.18);
    border-left:1px solid rgba(255,255,255,.18);
  }

  .mobile-service-grid button{
    min-height:112px;
    display:grid;
    grid-template-columns:44px 1fr;
    gap:12px;
    align-items:center;
    text-align:left;
    padding:18px 14px;
    color:#fff;
    background:rgba(4,9,12,.88);
    border:0;
    border-right:1px solid rgba(255,255,255,.18);
    border-bottom:1px solid rgba(255,255,255,.18);
  }

  .mobile-service-grid .m-icon{
    font-size:30px;
    line-height:1;
  }

  .mobile-service-grid button span:last-child{
    font-size:10px;
    line-height:1.55;
    letter-spacing:.15em;
  }

  .mobile-hero-actions{display:none!important}
}

@media(max-width:560px){
  .hero-stage{
    min-height:700px!important;
    background-size:auto 700px!important;
    background-position:90% 48%!important;
  }
  .mobile-hero-copy{padding:280px 18px 22px!important}
  .mobile-hero-copy h1{font-size:clamp(48px,15.5vw,64px)!important}
  .mobile-service-grid{margin-left:18px;margin-right:18px}
}

@media(max-width:390px){
  .hero-stage{
    min-height:680px!important;
    background-size:auto 680px!important;
    background-position:91% 46%!important;
  }
  .mobile-hero-copy{padding-top:265px!important}
  .mobile-hero-copy h1{font-size:46px!important}
  .mobile-service-grid button{min-height:104px;padding:16px 12px}
}


/* ===== MOBILE V5 =====
   Dedicated mobile artwork:
   - no baked HOME / ABOUT / PROJECTS / CONTACT
   - exact supplied DV logo in header
   - corrected DV logo on flight case
*/
@media(max-width:900px){
  /* No mobile menu/navigation labels */
  #menuBtn,
  #mobileNav{display:none!important}

  .mobile-header{
    justify-content:flex-start!important;
    gap:12px!important;
  }

  .mobile-brand{
    pointer-events:none!important;
    gap:13px!important;
  }

  .mobile-brand img{
    width:46px!important;
    height:46px!important;
    object-fit:contain!important;
    filter:none!important;
    background:#f2f2f2!important;
    border-radius:50%!important;
    padding:3px!important;
  }

  .mobile-brand span{
    font-size:12px!important;
    letter-spacing:.24em!important;
  }

  .hero-stage{
    position:relative!important;
    min-height:730px!important;
    height:auto!important;
    padding:0 0 30px!important;
    overflow:hidden!important;
    background:
      linear-gradient(180deg,rgba(2,7,10,.08) 0%,rgba(2,7,10,.15) 50%,rgba(2,7,10,.80) 79%,#04090c 100%),
      url("mobile-hero-bg.png") 58% 0% / cover no-repeat!important;
  }

  .hero-image{display:none!important}
  .hero-depth,.hotspot,.service-hotspot,.scroll-hint{display:none!important}

  .mobile-hero-copy{
    display:block!important;
    position:relative!important;
    z-index:6!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    margin:0!important;
    padding:295px 20px 22px!important;
  }

  .mobile-hero-kicker{
    font-size:9px!important;
    letter-spacing:.16em!important;
    line-height:1.5!important;
    margin-bottom:16px!important;
  }

  .mobile-hero-copy h1{
    font-size:clamp(48px,15vw,66px)!important;
    line-height:.9!important;
    margin:0 0 16px!important;
  }

  .mobile-hero-copy p{
    max-width:390px!important;
    font-size:15px!important;
    line-height:1.5!important;
    margin-bottom:20px!important;
  }

  /* Keep CTA on the left side, away from the flight-case logo */
  .mobile-primary-cta{
    width:min(285px,82vw)!important;
    min-height:50px!important;
    padding:0 18px!important;
  }

  .mobile-email{
    display:block!important;
    width:max-content!important;
    max-width:100%!important;
    margin-top:14px!important;
    font-size:14px!important;
  }

  .mobile-service-grid{
    margin-top:8px!important;
  }
}

@media(max-width:560px){
  .hero-stage{
    min-height:710px!important;
    background-position:60% 0%!important;
  }
  .mobile-hero-copy{
    padding:280px 18px 22px!important;
  }
  .mobile-hero-copy h1{
    font-size:clamp(46px,15.5vw,60px)!important;
  }
}

@media(max-width:390px){
  .hero-stage{
    min-height:700px!important;
    background-position:62% 0%!important;
  }
  .mobile-hero-copy{
    padding-top:268px!important;
  }
}

/* V6 approved white/red DV logo */
@media(max-width:900px){
  .mobile-brand img{
    background:transparent!important;
    padding:0!important;
    filter:none!important;
    border-radius:50%!important;
  }
}


/* ===== MOBILE V7 — deterministic layout ===== */
@media(max-width:900px){

  /* Hide all desktop hero image/UI and any legacy mobile overlays */
  .hero-image,
  .hero-depth,
  .hotspot,
  .service-hotspot,
  .scroll-hint,
  .mobile-hero-actions,
  #menuBtn,
  #mobileNav{
    display:none!important;
  }

  .mobile-header{
    position:relative!important;
    z-index:20!important;
    min-height:84px!important;
    padding:16px 18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    background:#050a0d!important;
    border-bottom:1px solid rgba(255,255,255,.12)!important;
  }

  .mobile-brand{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    pointer-events:none!important;
  }

  .mobile-brand img{
    width:46px!important;
    height:46px!important;
    object-fit:contain!important;
    background:transparent!important;
    padding:0!important;
    border-radius:50%!important;
  }

  .mobile-brand span{
    font-size:12px!important;
    letter-spacing:.22em!important;
    white-space:nowrap!important;
  }

  .hero-stage{
    position:relative!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding:0!important;
    overflow:visible!important;
    background:none!important;
  }

  /* Dedicated visual-only image panel */
  .hero-stage::before{
    content:""!important;
    display:block!important;
    width:100%!important;
    aspect-ratio:4 / 5!important;
    background:
      linear-gradient(180deg,rgba(2,7,10,.02) 0%,rgba(2,7,10,.14) 68%,rgba(2,7,10,.72) 100%),
      url("mobile-hero-bg.png") 58% 46% / cover no-repeat!important;
  }

  .mobile-hero-copy{
    display:block!important;
    position:relative!important;
    z-index:5!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    margin:0!important;
    padding:26px 20px 24px!important;
    background:#050a0d!important;
  }

  .mobile-hero-kicker{
    margin:0 0 14px!important;
    font-size:9px!important;
    line-height:1.5!important;
    letter-spacing:.16em!important;
    white-space:normal!important;
  }

  .mobile-hero-copy h1{
    margin:0 0 16px!important;
    font-size:clamp(46px,14vw,64px)!important;
    line-height:.9!important;
    letter-spacing:-.045em!important;
  }

  .mobile-hero-copy p{
    margin:0 0 20px!important;
    max-width:430px!important;
    font-size:15px!important;
    line-height:1.5!important;
    color:rgba(255,255,255,.9)!important;
  }

  .mobile-primary-cta{
    width:100%!important;
    max-width:320px!important;
    min-height:50px!important;
    padding:0 18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    background:transparent!important;
    border:1px solid rgba(255,255,255,.85)!important;
  }

  .mobile-email{
    display:block!important;
    width:auto!important;
    margin-top:14px!important;
    font-size:14px!important;
    line-height:1.4!important;
  }

  .mobile-service-grid{
    position:relative!important;
    z-index:5!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    margin:0!important;
    border-top:1px solid rgba(255,255,255,.14)!important;
    border-left:0!important;
    background:#050a0d!important;
  }

  .mobile-service-grid button{
    min-height:112px!important;
    padding:18px 14px!important;
    display:grid!important;
    grid-template-columns:42px 1fr!important;
    gap:12px!important;
    align-items:center!important;
    text-align:left!important;
    color:#fff!important;
    background:#050a0d!important;
    border:0!important;
    border-right:1px solid rgba(255,255,255,.14)!important;
    border-bottom:1px solid rgba(255,255,255,.14)!important;
  }

  .mobile-service-grid .m-icon{
    font-size:28px!important;
  }

  .mobile-service-grid button span:last-child{
    font-size:10px!important;
    line-height:1.55!important;
    letter-spacing:.14em!important;
  }
}

@media(max-width:560px){
  .hero-stage::before{
    aspect-ratio:4 / 5.2!important;
    background-position:60% 48%!important;
  }

  .mobile-hero-copy{
    padding:24px 18px 22px!important;
  }

  .mobile-hero-copy h1{
    font-size:clamp(44px,14.5vw,58px)!important;
  }
}

@media(max-width:390px){
  .mobile-brand span{
    font-size:11px!important;
    letter-spacing:.19em!important;
  }

  .hero-stage::before{
    aspect-ratio:4 / 5.35!important;
    background-position:61% 48%!important;
  }

  .mobile-hero-copy h1{
    font-size:43px!important;
  }

  .mobile-service-grid button{
    min-height:104px!important;
    padding:16px 12px!important;
  }
}


/* ===== MOBILE V8 FINAL OVERRIDES ===== */
.mobile-hero-photo{display:none}

@media(max-width:900px){
  /* Header logo: exact white/red approved asset, no filters */
  .mobile-brand img{
    width:46px!important;
    height:46px!important;
    object-fit:contain!important;
    background:transparent!important;
    padding:0!important;
    filter:none!important;
    opacity:1!important;
  }

  /* Keep desktop hero art/UI completely hidden on mobile */
  .hero-image,
  .hero-depth,
  .hotspot,
  .service-hotspot,
  .scroll-hint,
  #menuBtn,
  #mobileNav{
    display:none!important;
  }

  .hero-stage{
    position:relative!important;
    display:block!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#050a0d!important;
  }

  /* Disable all older pseudo-element hero attempts */
  .hero-stage::before,
  .hero-stage::after{
    content:none!important;
    display:none!important;
  }

  /* Real image element = guaranteed visible in Safari */
  .mobile-hero-photo{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:4 / 5!important;
    object-fit:cover!important;
    object-position:58% 48%!important;
    margin:0!important;
    padding:0!important;
    background:#050a0d!important;
  }

  .mobile-hero-copy{
    display:block!important;
    position:relative!important;
    inset:auto!important;
    margin:0!important;
    padding:26px 20px 24px!important;
    background:#050a0d!important;
    z-index:2!important;
  }

  .mobile-hero-kicker{
    margin:0 0 14px!important;
    font-size:9px!important;
    line-height:1.5!important;
    letter-spacing:.16em!important;
    white-space:normal!important;
  }

  .mobile-hero-copy h1{
    margin:0 0 16px!important;
    font-size:clamp(46px,14vw,64px)!important;
    line-height:.9!important;
    letter-spacing:-.045em!important;
  }

  .mobile-hero-copy p{
    margin:0 0 20px!important;
    max-width:430px!important;
    font-size:15px!important;
    line-height:1.5!important;
  }

  .mobile-primary-cta{
    width:100%!important;
    max-width:320px!important;
    min-height:50px!important;
  }

  .mobile-email{
    margin-top:14px!important;
    font-size:14px!important;
  }

  .mobile-service-grid{
    margin:0!important;
    background:#050a0d!important;
  }
}

@media(max-width:560px){
  .mobile-hero-photo{
    aspect-ratio:4 / 5.1!important;
    object-position:60% 48%!important;
  }
  .mobile-hero-copy{padding:24px 18px 22px!important}
  .mobile-hero-copy h1{font-size:clamp(44px,14.5vw,58px)!important}
}

@media(max-width:390px){
  .mobile-hero-photo{
    aspect-ratio:4 / 5.2!important;
    object-position:61% 48%!important;
  }
  .mobile-hero-copy h1{font-size:43px!important}
}


/* ===== MOBILE V9 FINETUNE ===== */
@media(max-width:900px){
  /* Shorter cinematic image so the headline appears earlier */
  .mobile-hero-photo{
    width:100%!important;
    height:58vh!important;
    min-height:430px!important;
    max-height:560px!important;
    aspect-ratio:auto!important;
    object-fit:cover!important;
    /* Shift source image so more of the flight case / DV mark stays visible */
    object-position:66% 52%!important;
  }

  /* Text section must never crop its contents */
  .mobile-hero-copy{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    padding:26px 20px 30px!important;
  }

  .mobile-hero-copy h1{
    display:block!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    white-space:normal!important;
    margin-bottom:18px!important;
  }

  .mobile-hero-copy p,
  .mobile-primary-cta,
  .mobile-email{
    position:relative!important;
    visibility:visible!important;
    opacity:1!important;
  }
}

@media(max-width:560px){
  .mobile-hero-photo{
    height:54vh!important;
    min-height:400px!important;
    max-height:500px!important;
    object-position:68% 52%!important;
  }

  .mobile-hero-copy{
    padding:24px 18px 28px!important;
  }

  .mobile-hero-copy h1{
    font-size:clamp(43px,13.5vw,56px)!important;
    line-height:.91!important;
  }
}

@media(max-width:390px){
  .mobile-hero-photo{
    height:51vh!important;
    min-height:375px!important;
    max-height:470px!important;
    object-position:69% 52%!important;
  }

  .mobile-hero-copy h1{
    font-size:41px!important;
  }
}
