  :root{
    --navy:#12233F;
    --navy-2:#1B3A63;
    --black:#0B0C0E;
    --gray-1:#6B7280;
    --gray-2:#E4E6EA;
    --gray-3:#F4F5F6;
    --white:#FFFFFF;
  }
  *{ box-sizing:border-box; }
  body{ margin:0; background:var(--white); color:var(--black); font-family:'IBM Plex Sans', sans-serif; font-weight:400; line-height:1.6; -webkit-font-smoothing:antialiased; }
  h1,h2,h3,.display{ font-family:'Zilla Slab', serif; font-weight:600; margin:0; line-height:1.08; color:var(--navy); }
  .label{ font-family:'IBM Plex Sans', sans-serif; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; font-size:0.72rem; color:var(--gray-1); }
  a{ color:inherit; }
  img{ max-width:100%; }
  .wrap{ max-width:1160px; margin:0 auto; padding:0 28px; }
  .rule{ height:1px; background:var(--gray-2); border:none; margin:0; }

  .topbar{ background:var(--black); color:var(--white); font-size:0.78rem; font-weight:500; letter-spacing:0.02em; }
  .topbar .wrap{ display:flex; justify-content:space-between; align-items:center; padding:9px 28px; flex-wrap:wrap; gap:8px; }
  .topbar a{ text-decoration:none; color:var(--white); }
  .topbar .locs{ color:rgba(255,255,255,0.55); }

  header{ background:var(--white); border-bottom:1px solid var(--gray-2); }
  .nav{ display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1160px; margin:0 auto; }
  .brand{ display:flex; align-items:center; gap:13px; }
  .brand img,.brand svg{ width:44px; height:44px; }
  .brand-name{ font-family:'Zilla Slab', serif; font-weight:700; font-size:1.28rem; color:var(--navy); line-height:1.1; letter-spacing:0.01em; }
  .brand-name .sub{ font-family:'IBM Plex Sans', sans-serif; font-weight:600; font-size:0.58rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--gray-1); margin-top:3px; display:block; }
  nav.links ul{ list-style:none; display:flex; gap:30px; margin:0; padding:0; font-weight:600; font-size:0.85rem; }
  nav.links a{ text-decoration:none; color:var(--black); border-bottom:1px solid transparent; padding-bottom:3px; }
  nav.links a:hover{ border-color:var(--navy); color:var(--navy); }
  .nav-cta{ background:var(--navy); color:var(--white); padding:11px 22px; font-weight:700; font-size:0.82rem; text-decoration:none; letter-spacing:0.02em; }
  .nav-cta:hover{ background:var(--black); }
  @media (max-width:900px){ nav.links{ display:none; } }

  /* Hero */
  .hero{ background:var(--navy); color:var(--white); padding:76px 0 68px; text-align:center; position:relative; }
  .hero .crest{ width:118px; height:118px; margin:0 auto 30px; }
  .hero .label{ color:rgba(255,255,255,0.55); justify-content:center; display:flex; }
  .hero h1{ color:var(--white); font-size:clamp(2.4rem, 5vw, 3.6rem); font-weight:600; margin-top:16px; }
  .hero h1 em{ font-style:italic; font-weight:500; color:#C9D2E0; }
  .hero-sub{ margin:22px auto 0; max-width:52ch; font-size:1.06rem; color:rgba(255,255,255,0.72); font-weight:400; }
  .hero-actions{ display:flex; gap:16px; justify-content:center; margin-top:34px; flex-wrap:wrap; }
  .btn{ font-weight:700; font-size:0.85rem; letter-spacing:0.03em; padding:14px 28px; text-decoration:none; display:inline-block; border:1px solid; transition:all .18s; }
  .btn-solid{ background:var(--white); color:var(--navy); border-color:var(--white); }
  .btn-solid:hover{ background:transparent; color:var(--white); }
  .btn-ghost{ background:transparent; color:var(--white); border-color:rgba(255,255,255,0.5); }
  .btn-ghost:hover{ border-color:var(--white); }
  .hero-figs{ display:flex; justify-content:center; gap:60px; margin-top:52px; padding-top:34px; border-top:1px solid rgba(255,255,255,0.18); flex-wrap:wrap; }
  .hero-fig .n{ font-family:'Zilla Slab', serif; font-size:2.1rem; font-weight:600; color:var(--white); }
  .hero-fig .l{ font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.55); margin-top:4px; }

  .scroll-cue{ display:flex; flex-direction:column; align-items:center; gap:8px; margin-top:44px; color:rgba(255,255,255,0.55); text-decoration:none; font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; font-weight:600; }
  .scroll-cue:hover{ color:rgba(255,255,255,0.85); }
  .scroll-cue svg{ animation: scrollBounce 1.8s ease-in-out infinite; }
  @keyframes scrollBounce{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(5px); } }
  @media (prefers-reduced-motion: reduce){ .scroll-cue svg{ animation:none; } }

  .zulu-band{ background:var(--black); color:rgba(255,255,255,0.75); padding:18px 0; text-align:center; font-size:0.9rem; }
  .zulu-band b{ font-family:'Zilla Slab', serif; font-style:italic; font-weight:600; color:var(--white); font-size:1.05rem; margin-right:12px; }

  section{ padding:76px 0; }
  .section-head{ max-width:680px; margin:0 auto 48px; text-align:center; }
  .section-head h2{ font-size:clamp(1.9rem, 3.4vw, 2.5rem); margin-top:10px; }
  .section-head p{ margin-top:16px; color:var(--gray-1); font-size:1rem; }

  .services-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--gray-2); }
  .svc-card{ padding:36px 30px; border-right:1px solid var(--gray-2); }
  .svc-card:last-child{ border-right:none; }
  .svc-icon{ width:40px; height:40px; }
  .svc-card h3{ font-size:1.35rem; margin-top:18px; }
  .svc-card p{ margin-top:10px; font-size:0.92rem; color:var(--gray-1); }
  .svc-card ul{ margin-top:16px; padding-left:0; list-style:none; font-size:0.86rem; color:var(--black); }
  .svc-card li{ padding:6px 0; border-top:1px solid var(--gray-2); }
  .svc-card li:first-child{ border-top:none; }
  @media (max-width:900px){ .services-row{ grid-template-columns:1fr; } .svc-card{ border-right:none; border-bottom:1px solid var(--gray-2); } }

  .other-services{ background:var(--gray-3); }
  .other-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--gray-2); border:1px solid var(--gray-2); }
  .other-card{ background:var(--white); padding:24px 20px; display:flex; align-items:center; min-height:84px; }
  .other-card .oi{ width:34px; height:34px; }
  .other-card h4{ font-family:'Zilla Slab', serif; font-weight:700; font-size:1.02rem; margin-top:0; color:var(--navy); line-height:1.3; }
  .other-card p{ font-size:0.84rem; margin-top:8px; color:var(--gray-1); }
  @media (max-width:900px){ .other-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .other-grid{ grid-template-columns:1fr; } }
  .other-tagline{ text-align:center; margin-top:34px; font-family:'Zilla Slab', serif; font-style:italic; font-size:1.2rem; color:var(--navy); }

  .bulk-section{ background:var(--navy); color:var(--white); }
  .bulk-section .section-head p{ color:rgba(255,255,255,0.65); }
  .bulk-section .label{ color:rgba(255,255,255,0.5); }
  .bulk-grid{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
  .prod-pill{ border:1px solid rgba(255,255,255,0.3); padding:12px 22px; font-weight:600; font-size:0.88rem; letter-spacing:0.02em; }
  .bulk-note{ margin-top:30px; text-align:center; font-size:0.9rem; color:rgba(255,255,255,0.6); }

  .price-group{ margin-bottom:56px; }
  .price-group:last-child{ margin-bottom:0; }
  .price-group-head{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:22px; flex-wrap:wrap; border-bottom:1px solid var(--gray-2); padding-bottom:14px; }
  .price-group-head h3{ font-size:1.5rem; }
  .price-group-head .tag{ font-size:0.68rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--gray-1); }
  .tag-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:1px; background:var(--gray-2); border:1px solid var(--gray-2); }
  .tag{ background:var(--white); padding:22px 20px; position:relative; }
  .tag::before{ content:""; position:absolute; top:0; left:0; width:100%; height:2px; background:var(--navy); }
  .tag .t-cap{ font-size:0.66rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--gray-1); }
  .tag .t-name{ font-family:'Zilla Slab', serif; font-weight:700; font-size:1.15rem; margin-top:6px; color:var(--navy); }
  .tag .t-price{ font-family:'IBM Plex Sans'; font-weight:800; font-size:1.3rem; color:var(--black); margin-top:12px; }
  .tag .t-price2{ font-weight:700; font-size:0.85rem; color:var(--gray-1); margin-top:4px; }
  .tag .t-price2 .l{ font-size:0.6rem; display:block; font-weight:600; text-transform:uppercase; letter-spacing:0.05em; }
  .addon-strip{ margin-top:20px; background:var(--gray-3); border-left:2px solid var(--navy); padding:16px 20px; font-size:0.88rem; color:var(--gray-1); }
  .flag-strip{ margin-top:20px; background:var(--black); color:var(--white); padding:16px 20px; font-size:0.88rem; font-weight:500; }

  .steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--gray-2); }
  .step{ padding:28px 26px 0 0; border-right:1px solid var(--gray-2); }
  .step:last-child{ border-right:none; }
  .step .step-n{ font-family:'Zilla Slab', serif; font-style:italic; font-size:2rem; color:var(--gray-1); }
  .step h4{ font-family:'IBM Plex Sans'; font-weight:700; font-size:0.95rem; margin-top:8px; color:var(--navy); }
  .step p{ font-size:0.86rem; color:var(--gray-1); margin-top:8px; }
  @media (max-width:900px){ .steps{ grid-template-columns:1fr 1fr; } .step{ border-bottom:1px solid var(--gray-2); padding-bottom:20px; } }
  @media (max-width:520px){ .steps{ grid-template-columns:1fr; } }

  .locations{ background:var(--gray-3); text-align:center; }
  .loc-row{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
  .loc-pill{ background:var(--white); border:1px solid var(--gray-2); font-weight:600; font-size:0.85rem; padding:11px 24px; color:var(--navy); }

  .cta-band{ background:var(--black); color:var(--white); text-align:center; padding:70px 0; }
  .cta-band .crest{ width:74px; height:74px; margin:0 auto 24px; opacity:0.9; }
  .cta-band h2{ color:var(--white); font-size:clamp(1.8rem,3.4vw,2.4rem); }
  .cta-band p{ margin-top:14px; color:rgba(255,255,255,0.6); }
  .contact-strip{ margin-top:34px; display:flex; gap:34px; justify-content:center; flex-wrap:wrap; font-weight:700; font-size:0.95rem; }
  .contact-strip a{ text-decoration:none; border-bottom:1px solid rgba(255,255,255,0.3); padding-bottom:3px; }
  .contact-strip .k{ display:block; font-size:0.64rem; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.45); font-weight:600; margin-bottom:5px; }

  footer{ background:var(--white); padding:26px 0; font-size:0.82rem; color:var(--gray-1); border-top:1px solid var(--gray-2); }
  .footer-row{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; align-items:center; }
  footer strong{ color:var(--navy); font-family:'Zilla Slab', serif; font-weight:700; }

  .whatsapp-float{
    position:fixed; right:24px; bottom:24px; z-index:100;
    width:58px; height:58px; border-radius:50%;
    background:var(--navy); color:#FFFFFF;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 20px rgba(18,35,63,0.35), 0 2px 6px rgba(0,0,0,0.15);
    text-decoration:none; transition:transform .18s ease, background .18s ease;
  }
  .whatsapp-float:hover{ background:var(--black); transform:translateY(-3px); }
  .whatsapp-float svg{ width:28px; height:28px; }
  .whatsapp-float .wa-tooltip{
    position:absolute; right:68px; top:50%; transform:translateY(-50%);
    background:var(--black); color:#FFFFFF; font-family:'IBM Plex Sans', sans-serif;
    font-size:0.78rem; font-weight:600; white-space:nowrap;
    padding:8px 14px; border-radius:4px; opacity:0; pointer-events:none;
    transition:opacity .18s ease;
  }
  .whatsapp-float:hover .wa-tooltip{ opacity:1; }
  @media (max-width:600px){
    .whatsapp-float{ right:16px; bottom:16px; width:52px; height:52px; }
    .whatsapp-float svg{ width:25px; height:25px; }
    .whatsapp-float .wa-tooltip{ display:none; }
  }

  /* Deep cleaning: two-column comparison */
  .deep-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--gray-2); }
  .deep-card{ padding:36px 34px; border-right:1px solid var(--gray-2); }
  .deep-card:last-child{ border-right:none; }
  .deep-card .dc-label{ font-family:'IBM Plex Sans'; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; font-size:0.68rem; color:var(--white); background:var(--navy); display:inline-block; padding:5px 12px; }
  .deep-card h3{ font-size:1.4rem; margin-top:16px; }
  .deep-card p{ margin-top:10px; font-size:0.92rem; color:var(--gray-1); }
  .deep-card ul{ margin-top:14px; padding-left:0; list-style:none; font-size:0.88rem; }
  .deep-card li{ padding:6px 0 6px 22px; position:relative; border-top:1px solid var(--gray-2); }
  .deep-card li:first-child{ border-top:none; }
  .deep-card li::before{ content:"—"; position:absolute; left:0; color:var(--navy); }
  @media (max-width:760px){ .deep-grid{ grid-template-columns:1fr; } .deep-card{ border-right:none; border-bottom:1px solid var(--gray-2); } }

  /* Window cleaning section */
  .window-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--gray-2); }
  .window-card{ padding:36px 34px; border-right:1px solid var(--gray-2); }
  .window-card:last-child{ border-right:none; }
  .window-card h3{ font-size:1.3rem; }
  .window-card p{ margin-top:10px; font-size:0.92rem; color:var(--gray-1); }
  .window-card ul{ margin-top:12px; padding-left:18px; font-size:0.88rem; color:var(--black); }
  @media (max-width:760px){ .window-grid{ grid-template-columns:1fr; } .window-card{ border-right:none; border-bottom:1px solid var(--gray-2); } }

  /* Scroll-reveal animation system */
  [data-animate]{ opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1); }
  [data-animate].in-view{ opacity:1; transform:translateY(0); }
  [data-animate="stagger"] > *{ opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s ease; }
  [data-animate="stagger"].in-view > *{ opacity:1; transform:translateY(0); }
  [data-animate="stagger"].in-view > *:nth-child(1){ transition-delay:.05s; }
  [data-animate="stagger"].in-view > *:nth-child(2){ transition-delay:.12s; }
  [data-animate="stagger"].in-view > *:nth-child(3){ transition-delay:.19s; }
  [data-animate="stagger"].in-view > *:nth-child(4){ transition-delay:.26s; }
  [data-animate="stagger"].in-view > *:nth-child(5){ transition-delay:.33s; }
  [data-animate="stagger"].in-view > *:nth-child(6){ transition-delay:.4s; }
  [data-animate="stagger"].in-view > *:nth-child(7){ transition-delay:.47s; }
  [data-animate="stagger"].in-view > *:nth-child(8){ transition-delay:.54s; }
  @media (prefers-reduced-motion: reduce){
    [data-animate], [data-animate="stagger"] > *{ transition:none !important; opacity:1 !important; transform:none !important; }
  }

  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

  /* Card hover lift */
  .svc-card, .other-card, .deep-card, .window-card, .tag, .loc-pill{ transition:transform .25s ease, box-shadow .25s ease; }
  .svc-card:hover, .other-card:hover{ transform:translateY(-4px); box-shadow:0 10px 24px rgba(18,35,63,0.1); position:relative; z-index:1; }
  .tag:hover{ transform:translateY(-3px); box-shadow:0 8px 18px rgba(18,35,63,0.1); position:relative; z-index:1; }
  .loc-pill:hover{ transform:translateY(-2px); box-shadow:0 6px 14px rgba(18,35,63,0.12); }
  .brand img, .brand svg{ transition:transform .3s ease; }
  .brand:hover img, .brand:hover svg{ transform:scale(1.06) rotate(-2deg); }

  /* Animated counters */
  .hero-fig .n{ font-variant-numeric:tabular-nums; }

  /* WhatsApp float — brand green with subtle pulse */
  .whatsapp-float{ background:#25D366 !important; }
  .whatsapp-float:hover{ background:#1EBE57 !important; }
  .whatsapp-float::after{
    content:""; position:absolute; inset:0; border-radius:50%;
    box-shadow:0 0 0 0 rgba(37,211,102,0.55);
    animation:waPulse 2.4s ease-out infinite;
    pointer-events:none;
  }
  @keyframes waPulse{
    0%{ box-shadow:0 0 0 0 rgba(37,211,102,0.55); }
    70%{ box-shadow:0 0 0 16px rgba(37,211,102,0); }
    100%{ box-shadow:0 0 0 0 rgba(37,211,102,0); }
  }
  @media (prefers-reduced-motion: reduce){ .whatsapp-float::after{ animation:none; } }
