:root{
    --ink:#0a0f0e;
    --ink-2:#0f1c1a;
    --ink-3:#132523;
    --teal:#1fc2ab;
    --teal-bright:#3fe0c8;
    --teal-deep:#0c433d;
    --paper:#f1f5f3;
    --paper-2:#ffffff;
    --ink-text:#0a0f0e;
    --fog:#57706a;
    --fog-on-dark:#a9c2bc;
    --line-dark:rgba(255,255,255,0.12);
    --line-light:rgba(10,15,14,0.10);
    --max:1180px;
    --font-display:'Oswald', 'Arial Narrow', sans-serif;
    --font-body:'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
  }

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

  body{
    margin:0;
    background:var(--paper);
    color:var(--ink-text);
    font-family:var(--font-body);
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  img,canvas{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  section{position:relative;}
  .wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem);}

  h1,h2,h3{
    font-family:var(--font-display);
    text-transform:uppercase;
    letter-spacing:0.01em;
    text-wrap:balance;
    margin:0;
    line-height:1.05;
  }

  .eyebrow{
    font-family:var(--font-body);
    font-weight:700;
    font-size:0.78rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--teal);
    display:flex;
    align-items:center;
    gap:0.6em;
  }
  .eyebrow::before{
    content:"";
    width:1.6em;height:2px;
    background:var(--teal);
    display:inline-block;
  }

  button, .btn{font-family:inherit;cursor:pointer;}

  /* ---------- Skip link ---------- */
  .skip-link{
    position:absolute;left:1rem;top:-3rem;
    background:var(--teal);color:var(--ink);
    padding:0.6rem 1rem;border-radius:0.4rem;
    font-weight:700;z-index:200;transition:top 0.2s;
  }
  .skip-link:focus{top:1rem;}

  :focus-visible{outline:2px solid var(--teal-bright);outline-offset:3px;}

  /* ---------- Nav ---------- */
  .nav{
    position:sticky;top:0;z-index:100;
    background:rgba(10,15,14,0.88);
    backdrop-filter:blur(10px) saturate(140%);
    -webkit-backdrop-filter:blur(10px) saturate(140%);
    border-bottom:1px solid var(--line-dark);
  }
  .nav .wrap{
    display:flex;align-items:center;justify-content:space-between;
    height:4.5rem;
  }
  .brand{display:flex;align-items:center;gap:0.65rem;color:#fff;}
  .brand svg{flex:none;}
  .brand-word{
    font-family:var(--font-display);
    font-weight:600;
    font-size:1.15rem;
    letter-spacing:0.02em;
    text-transform:uppercase;
    white-space:nowrap;
  }
  .brand-word b{color:var(--teal-bright);font-weight:600;}

  .nav-links{
    display:flex;align-items:center;gap:2rem;
    font-size:0.92rem;font-weight:600;
    color:#e8f1ef;
  }
  .nav-links a{opacity:0.85;transition:opacity 0.15s, color 0.15s;padding:0.3rem 0;border-bottom:2px solid transparent;}
  .nav-links a:hover{opacity:1;color:var(--teal-bright);}

  .nav-cta{
    display:inline-flex;align-items:center;gap:0.5rem;
    background:var(--teal);color:var(--ink);
    font-weight:700;font-size:0.88rem;
    padding:0.65rem 1.1rem;border-radius:2rem;
    white-space:nowrap;
    transition:transform 0.15s ease, background 0.15s ease;
  }
  .nav-cta:hover{background:var(--teal-bright);transform:translateY(-1px);}

  .nav-toggle{display:none;background:none;border:0;color:#fff;padding:0.4rem;}
  .nav-links .nav-cta-mobile{display:none;}

  /* ---------- Hero ---------- */
  .hero{
    background:radial-gradient(ellipse 90% 70% at 78% 8%, var(--teal-deep) 0%, var(--ink-2) 45%, var(--ink) 78%);
    color:#fff;
    padding:clamp(3.5rem,8vw,6.5rem) 0 clamp(4rem,9vw,7rem);
    overflow:hidden;
  }
  .hero-canvas{
    position:absolute;inset:0;z-index:0;opacity:0.55;pointer-events:none;
  }
  .hero .wrap{position:relative;z-index:1;}
  .hero-grid{
    display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,4rem);
    align-items:center;
  }
  .hero-badge{
    display:inline-flex;align-items:center;gap:0.5rem;
    background:rgba(31,194,171,0.12);
    border:1px solid rgba(63,224,200,0.35);
    color:var(--teal-bright);
    font-size:0.78rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;
    padding:0.45rem 0.9rem;border-radius:2rem;
    margin-bottom:1.5rem;
  }
  .hero h1{
    font-size:clamp(2.6rem,6vw,4.6rem);
    margin-bottom:1.1rem;
  }
  .hero h1 .line2{color:var(--teal-bright);}
  .hero p.lede{
    font-size:clamp(1.02rem,1.6vw,1.2rem);
    color:#d6e6e2;
    max-width:44ch;
    margin-bottom:2rem;
  }
  .hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2.5rem;}

  .btn-primary{
    display:inline-flex;align-items:center;gap:0.6rem;
    background:var(--teal);color:var(--ink);
    font-weight:700;font-size:1rem;
    padding:0.95rem 1.6rem;border-radius:0.5rem;border:0;
    box-shadow:0 10px 30px -10px rgba(31,194,171,0.55);
    transition:transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
  }
  .btn-primary:hover{background:var(--teal-bright);transform:translateY(-2px);box-shadow:0 14px 34px -8px rgba(63,224,200,0.6);}

  .btn-ghost{
    display:inline-flex;align-items:center;gap:0.6rem;
    background:transparent;color:#fff;
    font-weight:700;font-size:1rem;
    padding:0.95rem 1.6rem;border-radius:0.5rem;
    border:1px solid rgba(255,255,255,0.35);
    transition:border-color 0.15s ease, background 0.15s ease;
  }
  .btn-ghost:hover{border-color:var(--teal-bright);background:rgba(255,255,255,0.06);}

  .hero-stats{display:flex;gap:clamp(1.4rem,3vw,2.4rem);flex-wrap:wrap;}
  .hero-stat b{
    display:block;font-family:var(--font-display);font-size:1.6rem;color:var(--teal-bright);
  }
  .hero-stat span{font-size:0.82rem;color:var(--fog-on-dark);}

  .hero-visual{
    position:relative;aspect-ratio:3/2;border-radius:1rem;overflow:hidden;
    background:linear-gradient(160deg, var(--ink-3), var(--ink-2));
    border:1px solid var(--line-dark);
    box-shadow:0 30px 60px -25px rgba(0,0,0,0.55);
  }
  .hero-visual img{width:100%;height:100%;object-fit:cover;display:block;}

  /* ---------- Trust strip ---------- */
  .trust{
    background:var(--ink-2);
    border-top:1px solid var(--line-dark);
    border-bottom:1px solid var(--line-dark);
    padding:1.9rem 0;
  }
  .trust .wrap{
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:1.6rem 2rem;
  }
  .trust-item{
    display:flex;align-items:center;gap:0.75rem;
    color:#eaf3f1;font-size:0.92rem;font-weight:600;
    flex:1 1 180px;
  }
  .trust-item svg{flex:none;color:var(--teal-bright);}

  /* ---------- Section headers (light) ---------- */
  .section{padding:clamp(4rem,8vw,6.5rem) 0;}
  .section-head{
    max-width:640px;margin-bottom:clamp(2.2rem,5vw,3.2rem);
  }
  .section-head h2{
    font-size:clamp(1.9rem,3.6vw,2.7rem);
    margin-top:0.6rem;
    color:var(--ink-text);
  }
  .section-head p{color:var(--fog);font-size:1.02rem;max-width:52ch;margin-top:0.9rem;}

  /* ---------- Services ---------- */
  .services{background:var(--paper);}
  .service-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
    gap:1.25rem;
  }
  .service-card{
    background:var(--paper-2);
    border:1px solid var(--line-light);
    border-radius:0.9rem;
    padding:1.8rem 1.6rem;
    transition:transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  }
  .service-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 34px -18px rgba(10,15,14,0.25);
    border-color:rgba(31,194,171,0.4);
  }
  .service-icon{
    width:3rem;height:3rem;border-radius:0.65rem;
    background:var(--teal-deep);color:var(--teal-bright);
    display:flex;align-items:center;justify-content:center;
    margin-bottom:1.1rem;
  }
  .service-card h3{
    font-size:1.08rem;text-transform:none;letter-spacing:0;
    font-weight:700;font-family:var(--font-body);
    margin-bottom:0.5rem;color:var(--ink-text);
  }
  .service-card p{color:var(--fog);font-size:0.92rem;margin:0;}

  /* ---------- Gallery ---------- */
  .gallery{background:var(--ink);}
  .gallery .section-head h2{color:#fff;}
  .gallery .section-head p{color:var(--fog-on-dark);}
  .gallery-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:1.25rem;
  }
  .gallery-card{
    position:relative;border-radius:0.9rem;overflow:hidden;
    aspect-ratio:6/5;border:1px solid var(--line-dark);
    background:var(--ink-2);
  }
  .gallery-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.4s ease;}
  .gallery-card:hover img{transform:scale(1.05);}
  .gallery-caption{
    position:absolute;left:0;right:0;bottom:0;
    padding:1.1rem 1.2rem;
    background:linear-gradient(0deg, rgba(10,15,14,0.92), rgba(10,15,14,0));
    color:#fff;font-weight:700;font-size:0.98rem;
  }

  /* ---------- Tagline banner ---------- */
  .banner{
    background:linear-gradient(100deg, var(--teal-deep), var(--ink-2) 70%);
    color:#fff;padding:1.5rem 0;
    border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);
  }
  .banner .wrap{
    display:flex;flex-wrap:wrap;gap:0.5rem 0.8rem;align-items:baseline;
    justify-content:center;text-align:center;
  }
  .banner p{
    font-family:var(--font-display);text-transform:uppercase;
    font-size:clamp(1.05rem,2.4vw,1.5rem);letter-spacing:0.03em;margin:0;
  }
  .banner .accent{color:var(--teal-bright);}

  /* ---------- Coverage ---------- */
  .coverage{background:var(--paper);}
  .coverage-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,3.5rem);
    align-items:center;
  }
  .area-list{display:flex;flex-direction:column;gap:0.9rem;margin:1.6rem 0 0;padding:0;list-style:none;}
  .area-list li{
    display:flex;align-items:center;gap:0.8rem;
    font-family:var(--font-display);text-transform:uppercase;
    font-size:1.2rem;letter-spacing:0.02em;color:var(--ink-text);
    padding-bottom:0.9rem;border-bottom:1px solid var(--line-light);
  }
  .area-list li:last-child{border-bottom:0;}
  .area-list svg{color:var(--teal);flex:none;}
  .area-note{color:var(--fog);font-size:0.92rem;margin-top:1.2rem;}

  .map-card{
    position:relative;aspect-ratio:1/1;border-radius:1rem;
    background:radial-gradient(circle at 50% 45%, var(--teal-deep), var(--ink-2) 72%);
    border:1px solid var(--line-light);
    overflow:hidden;
  }
  .map-card svg{width:100%;height:100%;}

  /* ---------- Contact / CTA ---------- */
  .contact{
    background:var(--ink);color:#fff;
  }
  .contact-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,4rem);
    align-items:start;
  }
  .contact-copy h2{color:#fff;font-size:clamp(1.9rem,3.6vw,2.7rem);margin-top:0.6rem;}
  .contact-copy p{color:var(--fog-on-dark);font-size:1.02rem;max-width:48ch;margin-top:0.9rem;}

  .contact-cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
  .contact-card{
    background:var(--ink-2);border:1px solid var(--line-dark);
    border-radius:0.8rem;padding:1.4rem;
    display:flex;flex-direction:column;gap:0.7rem;
    transition:border-color 0.15s ease, transform 0.15s ease;
  }
  .contact-card:hover{border-color:var(--teal);transform:translateY(-2px);}
  .contact-card svg{color:var(--teal-bright);}
  .contact-card b{font-size:1rem;font-weight:700;}
  .contact-card span{font-size:0.82rem;color:var(--fog-on-dark);}

  /* ---------- Footer ---------- */
  footer{background:var(--ink-2);color:#eaf3f1;padding-top:clamp(3rem,6vw,4rem);}
  .footer-grid{
    display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:2.5rem;
    padding-bottom:2.5rem;border-bottom:1px solid var(--line-dark);
  }
  .footer-brand p{color:var(--fog-on-dark);font-size:0.92rem;max-width:32ch;margin-top:0.9rem;}
  .footer-col h4{
    font-family:var(--font-body);font-size:0.8rem;letter-spacing:0.1em;
    text-transform:uppercase;color:var(--teal-bright);margin:0 0 1rem;
  }
  .footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.7rem;}
  .footer-col a{font-size:0.92rem;color:#eaf3f1;opacity:0.9;}
  .footer-col a:hover{color:var(--teal-bright);opacity:1;}

  .footer-badges{
    display:flex;flex-wrap:wrap;gap:1.6rem 2.2rem;justify-content:center;
    padding:1.6rem 0;
  }
  .footer-badges div{
    display:flex;align-items:center;gap:0.55rem;
    font-size:0.82rem;font-weight:600;color:var(--fog-on-dark);
  }
  .footer-badges svg{color:var(--teal);}

  .footer-bottom{
    border-top:1px solid var(--line-dark);
    padding:1.3rem 0 1.8rem;
    text-align:center;font-size:0.8rem;color:var(--fog-on-dark);
  }

  /* ---------- Responsive ---------- */
  @media (max-width:900px){
    .hero-grid{grid-template-columns:1fr;}
    .hero-visual{max-width:520px;width:100%;margin:0 auto;order:-1;}
    .contact-grid{grid-template-columns:1fr;}
    .coverage-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr 1fr;}
    .footer-brand{grid-column:1/-1;}
  }
  @media (max-width:720px){
    .nav-links{
      position:fixed;inset:4.5rem 0 auto 0;
      background:var(--ink);border-bottom:1px solid var(--line-dark);
      flex-direction:column;align-items:flex-start;gap:0;
      padding:0.5rem 1.5rem 1.5rem;
      transform:translateY(-130%);opacity:0;
      transition:transform 0.25s ease, opacity 0.2s ease;
    }
    .nav-links.open{transform:translateY(0);opacity:1;}
    .nav-links a{width:100%;padding:0.85rem 0;border-bottom:1px solid var(--line-dark);}
    .nav-cta{display:none;}
    .nav-links .nav-cta-mobile{display:inline-flex;margin-top:0.9rem;}
    .nav-toggle{display:inline-flex;align-items:center;justify-content:center;}
    .contact-cards{grid-template-columns:1fr;}
  }
  @media (max-width:560px){
    .service-grid{grid-template-columns:1fr 1fr;}
    .footer-grid{grid-template-columns:1fr;}
  }