:root{
    --bg: #090c0a;
    --bg-alt: #0d100e;
    --ink: #f5f3ee;
    --ink-dim: #b0b0aa;
    --ink-dimmer: #6b6b66;
    --emerald: #5fb489;
    --emerald-bright: #7dd6a8;
    --brass: #6fcf97;
    --line: rgba(245,243,238,0.10);
    --card: rgba(255,255,255,0.03);
    --display: 'Bricolage Grotesque', sans-serif;
    --body: 'Inter', sans-serif;
    --ease: cubic-bezier(.16,.84,.32,1);
    --ease-soft: cubic-bezier(.22,.68,.36,1);
    --glass-bg: rgba(16,20,17,0.42);
    --glass-border: rgba(255,255,255,0.12);
    --grad-emerald: linear-gradient(120deg, var(--emerald) 0%, var(--brass) 50%, var(--emerald-bright) 100%);
    --mx: 50%; --my: 50%;
  }

  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:var(--body);
    line-height:1.5;
    overflow-x:hidden;
    opacity:0;
    transition:opacity .6s var(--ease-soft);
  }
  body.loaded{opacity:1;}
  ::selection{background:var(--emerald);color:#060907;}

  /* ---------- FROSTED GLASS UTILITY ---------- */
  .frost{
    background:var(--glass-bg);
    backdrop-filter:blur(16px) saturate(140%);
    -webkit-backdrop-filter:blur(16px) saturate(140%);
    border:1px solid var(--glass-border);
  }

  /* ---------- MAGNETIC ELEMENTS ---------- */
  .magnetic{transition:transform .35s var(--ease-soft);will-change:transform;}
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  ul{list-style:none;}

  .wrap{max-width:1320px;margin:0 auto;padding:0 40px;}

  /* ---------- NAV ---------- */
  header{
    position:fixed;top:0;left:0;right:0;z-index:100;
    background:rgba(10,13,11,0.72);
    backdrop-filter:blur(14px) saturate(140%);
    -webkit-backdrop-filter:blur(14px) saturate(140%);
    border-bottom:1px solid var(--line);
    transition:box-shadow .4s ease, background .4s ease;
  }
  header.scrolled{background:rgba(9,12,10,0.86);box-shadow:0 12px 40px -18px rgba(0,0,0,0.65);}
  nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:22px 40px;max-width:1320px;margin:0 auto;
  }
  .logo{
    font-family:var(--display);
    font-weight:800;
    font-size:1.9rem;
    letter-spacing:-0.01em;
  }
  .logo em{font-style:italic;font-weight:500;color:var(--ink-dim);}
  .nav-links{display:flex;gap:40px;align-items:center;}
  .nav-links a{
    font-family:var(--display);
    font-weight:600;
    font-size:0.98rem;
    letter-spacing:0.01em;
    color:var(--ink);
    position:relative;
    padding:4px 0;
    transition:color .25s ease;
  }
  .nav-links a::after{
    content:'';position:absolute;left:0;bottom:0;width:0;height:1px;
    background:var(--emerald-bright);transition:width .3s ease;
  }
  .nav-links a:hover{color:var(--emerald-bright);}
  .nav-links a:hover::after{width:100%;}
  .nav-toggle{display:none;}

  /* ---------- HERO ---------- */
  .hero{
    position:relative;min-height:100vh;
    display:flex;flex-direction:column;justify-content:center;
    padding:140px 40px 80px;
    overflow:hidden;
  }
  .hero-bg{
    position:absolute;inset:-4%;
    will-change:transform, filter;
    backface-visibility:hidden;
    background-image:
      linear-gradient(180deg, rgba(4,6,5,0.72) 0%, rgba(4,6,5,0.45) 35%, rgba(4,6,5,0.92) 100%),
      url('../assets/hero-bg.jpg');
    background-size:cover;background-position:center 38%;
    filter:saturate(1.02) blur(6px);
    transform:scale(1.16) translate3d(calc((var(--mx) - 50%) * -0.04), calc((var(--my) - 50%) * -0.04), 0);
    transition:transform 1.9s var(--ease), filter 1.6s ease-out;
  }
  .hero-bg.in{
    filter:saturate(1.02) blur(0);
    transform:scale(1.045) translate3d(calc((var(--mx) - 50%) * -0.04), calc((var(--my) - 50%) * -0.04), 0);
  }
  .hero-content{position:relative;z-index:2;max-width:1320px;margin:0 auto;width:100%;}
  .eyebrow{
    font-family:var(--display);font-weight:600;font-size:0.8rem;
    letter-spacing:0.22em;text-transform:uppercase;color:var(--brass);
    display:inline-flex;align-items:center;gap:12px;margin-bottom:22px;
  }
  .eyebrow::after{content:'';width:36px;height:1px;background:var(--brass);opacity:0.6;}
  .hero h1{
    font-family:var(--display);
    font-weight:700;
    font-size:clamp(2.6rem, 6vw, 5rem);
    line-height:1.05;
    letter-spacing:-0.01em;
    max-width:920px;
  }
  .hero h1 em{font-style:italic;font-weight:500;color:var(--ink-dim);}
  .hero-accent-line{
    width:120px;height:2px;
    background:linear-gradient(90deg,var(--brass),transparent);
    margin:28px 0;
  }
  .hero-sub{
    font-size:1.2rem;color:var(--ink-dim);max-width:520px;margin-bottom:44px;line-height:1.5;
  }
  .pill-row{display:flex;gap:14px;flex-wrap:wrap;}
  .pill{
    display:inline-flex;align-items:center;gap:10px;
    padding:12px 22px;border-radius:100px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.10);
    font-size:0.92rem;font-weight:500;color:var(--ink);
    backdrop-filter:blur(10px) saturate(140%);
    -webkit-backdrop-filter:blur(10px) saturate(140%);
    transition:transform .35s var(--ease-soft), border-color .3s ease, background .3s ease;
  }
  .pill:hover{border-color:rgba(125,214,168,0.45);background:rgba(255,255,255,0.09);}
  .pill .dot{width:7px;height:7px;border-radius:50%;background:var(--emerald-bright);box-shadow:0 0 10px var(--emerald-bright);}
  .scroll-cue{
    position:absolute;bottom:34px;left:50%;transform:translateX(-50%);
    display:flex;flex-direction:column;align-items:center;gap:8px;
    font-family:var(--display);font-size:0.72rem;letter-spacing:0.18em;
    text-transform:uppercase;color:var(--ink-dimmer);z-index:2;
  }
  .scroll-cue .line{width:1px;height:34px;background:linear-gradient(var(--ink-dimmer),transparent);
    animation:scrollpulse 2s ease-in-out infinite;}
  @keyframes scrollpulse{0%,100%{opacity:.3;}50%{opacity:1;}}

  /* ---------- SECTION GENERIC ---------- */
  section{padding:130px 0;}
  .section-head{max-width:760px;margin-bottom:70px;}
  .section-head .eyebrow::after{background:var(--brass);}
  .section-head h2{
    font-family:var(--display);font-weight:700;
    font-size:clamp(2rem, 4vw, 3.2rem);line-height:1.1;letter-spacing:-0.01em;
  }
  .section-head h2 em{font-style:italic;font-weight:500;color:var(--ink-dim);}
  .section-head p{margin-top:22px;color:var(--ink-dim);font-size:1.05rem;max-width:640px;}
  .gallery-lead{
    font-family:var(--display);font-weight:700;font-size:clamp(1.5rem,3.2vw,2.3rem);
    line-height:1.35;color:var(--ink);max-width:820px;margin-top:8px;
  }

  .reveal{
    opacity:0;transform:translateY(36px) scale(.985);
    transition:opacity 1s var(--ease), transform 1s var(--ease);
    transition-delay:var(--reveal-delay, 0s);
  }
  .reveal.in{opacity:1;transform:translateY(0) scale(1);}

  .doodle{position:absolute;pointer-events:none;opacity:0.16;color:var(--emerald-bright);z-index:0;}
  @media (max-width:900px){.doodle{display:none;}}

  /* ---------- ABOUT ---------- */
  .about{background:var(--bg-alt);border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;}
  .about-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:80px;align-items:center;}
  .about-copy p{color:var(--ink-dim);margin-bottom:20px;font-size:1.02rem;max-width:560px;}
  .stat-row{display:flex;gap:56px;margin-top:48px;padding-top:36px;border-top:1px solid var(--line);flex-wrap:wrap;}
  .stat b{
    display:block;font-family:var(--display);font-weight:700;font-size:1.9rem;margin-bottom:4px;
    background:var(--grad-emerald);-webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .stat span{color:var(--ink-dimmer);font-size:0.85rem;letter-spacing:0.02em;}
  .about-image{
    position:relative;border-radius:6px;overflow:hidden;
    aspect-ratio:3/2;
    box-shadow:0 30px 80px -20px rgba(0,0,0,0.6);
  }
  .about-image img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease;}
  .about-image:hover img{transform:scale(1.04);}

  /* ---------- GALLERY ---------- */
  .gallery-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:32px;
  }
  .gallery-item{
    position:relative;border-radius:10px;overflow:hidden;aspect-ratio:6/5;
    background:var(--card);border:1px solid var(--line);
  }
  .gallery-item img{
    width:100%;height:100%;object-fit:cover;
    transition:transform .7s ease, filter .5s ease;
    filter:brightness(0.92);
  }
  .gallery-item:hover img{transform:scale(1.06);filter:brightness(1.05);}
  .gallery-caption{
    position:absolute;inset:0;
    display:flex;align-items:flex-end;
    padding:28px 26px;
    background:linear-gradient(0deg, rgba(6,8,7,0.92) 15%, rgba(6,8,7,0.35) 55%, rgba(6,8,7,0.05) 100%);
    opacity:0;transition:opacity .4s ease;
  }
  .gallery-item:hover .gallery-caption{opacity:1;}
  .gallery-caption p{
    font-family:var(--display);font-weight:700;font-size:0.92rem;letter-spacing:0.03em;
    color:var(--emerald-bright);text-transform:uppercase;
  }

  /* ---------- OFFER ---------- */
  .offer{position:relative;padding:0;}
  .offer-tabs{
    position:relative;min-height:640px;display:flex;align-items:flex-end;
    padding:80px 0;overflow:hidden;
  }
  .offer-bg{
    position:absolute;inset:0;background-size:cover;background-position:center;
    transition:opacity .6s ease;
  }
  .offer-bg::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(0deg, rgba(6,8,7,0.95) 20%, rgba(6,8,7,0.55) 55%, rgba(6,8,7,0.7) 100%);
  }
  .offer-body{position:relative;z-index:2;width:100%;}
  .offer-body h3{
    font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,4.5vw,3.4rem);
    margin-bottom:18px;transition:opacity .4s ease;
  }
  .offer-body p{color:var(--ink-dim);max-width:560px;font-size:1.02rem;margin-bottom:40px;}
  .offer-pills{display:flex;gap:12px;flex-wrap:wrap;}
  .offer-pill{
    padding:13px 26px;border-radius:100px;font-family:var(--display);
    font-weight:600;font-size:0.95rem;cursor:pointer;
    border:1px solid rgba(255,255,255,0.14);
    background:rgba(255,255,255,0.05);color:var(--ink-dim);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    transition:transform .35s var(--ease-soft), background .3s ease, color .3s ease, border-color .3s ease;
  }
  .offer-pill.active{background:var(--grad-emerald);color:#06110c;border-color:transparent;font-weight:700;}
  .offer-pill:hover{border-color:rgba(255,255,255,0.4);}

  /* ---------- CONTACT ---------- */
  .contact{background:var(--bg-alt);border-top:1px solid var(--line);}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;}
  .contact-info-item{
    display:flex;gap:18px;margin-bottom:42px;
  }
  .icon-circle{
    width:46px;height:46px;border-radius:50%;flex-shrink:0;
    background:rgba(95,180,137,0.12);border:1px solid rgba(95,180,137,0.3);
    display:flex;align-items:center;justify-content:center;color:var(--emerald-bright);
  }
  .contact-label{
    font-family:var(--display);font-size:0.74rem;letter-spacing:0.16em;
    text-transform:uppercase;color:var(--ink-dimmer);margin-bottom:6px;
  }
  .contact-info-item p{color:var(--ink);font-size:1.02rem;}
  .form-card{
    background:var(--card);border:1px solid var(--line);border-radius:10px;padding:40px;
  }
  .map-embed{
    margin-top:36px;border-radius:10px;overflow:hidden;
    border:1px solid var(--line);filter:grayscale(0.3) invert(0.92) contrast(0.9);
    aspect-ratio:16/9;
  }
  .map-embed iframe{width:100%;height:100%;border:0;display:block;}
  .field{margin-bottom:20px;}
  .field input, .field textarea{
    width:100%;padding:16px 18px;border-radius:8px;
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.10);
    color:var(--ink);font-family:var(--body);font-size:0.98rem;
    transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
  }
  .field input:focus, .field textarea:focus{
    outline:none;border-color:var(--emerald);
    box-shadow:0 0 0 4px rgba(95,180,137,0.14);
    background:rgba(255,255,255,0.06);
  }
  .field textarea{resize:vertical;min-height:130px;}
  .submit-btn{
    width:100%;padding:17px;border-radius:8px;border:none;
    background:var(--ink);color:#0a0d0b;font-family:var(--display);
    font-weight:700;font-size:1rem;cursor:pointer;
    transition:background .25s ease, transform .2s ease;
  }
  .submit-btn:hover{background:var(--emerald-bright);transform:translateY(-1px);}

  /* ---------- FOOTER ---------- */
  footer{padding:80px 0 32px;border-top:1px solid var(--line);position:relative;overflow:hidden;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:60px;margin-bottom:60px;}
  .footer-desc{color:var(--ink-dim);margin:20px 0 24px;max-width:420px;}
  .footer-contact-line{display:flex;align-items:center;gap:10px;color:var(--ink-dim);margin-bottom:10px;font-size:0.95rem;}
  .footer-social{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap;}
  .footer-social a{
    display:flex;align-items:center;gap:10px;
    padding:13px 22px;border-radius:100px;
    border:1px solid rgba(255,255,255,0.14);
    background:rgba(255,255,255,0.04);
    font-family:var(--display);font-weight:600;font-size:0.92rem;
    transition:all .25s ease;
  }
  .footer-social a:hover{border-color:var(--emerald-bright);color:var(--emerald-bright);background:rgba(95,180,137,0.1);transform:translateY(-2px);}
  .footer-social svg{width:18px;height:18px;flex-shrink:0;}
  .footer-col h5{font-family:var(--display);font-weight:700;margin-bottom:20px;font-size:1rem;}
  .footer-col a{display:block;color:var(--ink-dim);margin-bottom:14px;font-size:0.95rem;transition:color .2s ease;}
  .footer-col a:hover{color:var(--emerald-bright);}
  .footer-bottom{
    border-top:1px solid var(--line);padding-top:28px;
    text-align:center;color:var(--ink-dimmer);font-size:0.85rem;
  }

  @media (max-width:900px){
    .nav-links{
      position:fixed;top:76px;left:24px;right:24px;
      background:rgba(10,13,11,0.98);
      border-radius:28px;
      flex-direction:column;padding:12px;gap:0;
      border:1.5px solid rgba(95,180,137,0.4);
      box-shadow:0 24px 60px -20px rgba(0,0,0,0.65);
      transform:translateY(-24px) scale(.97);opacity:0;
      transition:transform .35s var(--ease-soft), opacity .3s ease;
      pointer-events:none;
    }
    .nav-links.open{transform:translateY(0) scale(1);opacity:1;pointer-events:auto;}
    .nav-links li{width:100%;border-bottom:1px solid var(--line);}
    .nav-links li:last-child{border-bottom:none;}
    .nav-links a{
      display:flex;align-items:center;justify-content:center;
      width:100%;padding:17px 24px;border-radius:20px;
      transition:background .25s ease, color .25s ease;
    }
    .nav-links a::after{display:none;}
    .nav-links a:hover, .nav-links a:active{
      background:rgba(95,180,137,0.1);
      color:var(--emerald-bright);
    }
    .nav-toggle{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;
  width:44px;height:44px;border-radius:8px;
  background:none;border:none;
  cursor:pointer;transition:background .25s ease;
    }
    .nav-toggle:hover, .nav-toggle:active{background:rgba(255,255,255,0.08);}
    .nav-toggle .bar{
      width:20px;height:2px;border-radius:2px;
      background:var(--ink);
      transition:transform .3s ease, opacity .2s ease;
    }
    .nav-toggle.open .bar:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .nav-toggle.open .bar:nth-child(2){opacity:0;}
    .nav-toggle.open .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    .about-grid, .contact-grid{grid-template-columns:1fr;gap:50px;}
    .about-image{order:-1;}
    .gallery-grid{grid-template-columns:repeat(2,1fr);gap:16px;}
    .gallery-caption{opacity:0;background:linear-gradient(0deg, rgba(6,8,7,0.88) 25%, rgba(6,8,7,0.1) 100%);padding:18px 16px;}
    .gallery-item:active .gallery-caption{opacity:1;}
    .gallery-caption p{font-size:0.8rem;}
    .offer-tabs{min-height:520px;padding:60px 0;}
    .offer-pill{padding:11px 18px;font-size:0.85rem;}
    .footer-grid{grid-template-columns:1fr;gap:36px;}
    .wrap{padding:0 24px;}
    nav{padding:20px 24px;}
    .hero{padding:120px 24px 70px;}
  }

  @media (max-width:480px){
    .gallery-grid{grid-template-columns:1fr;}
    .form-card, .about-image, .map-embed{border-radius:8px;}
    .pill{padding:10px 16px;font-size:0.85rem;}
    .footer-social a{padding:11px 16px;font-size:0.85rem;}
  }

  @media (prefers-reduced-motion: reduce){
    *{animation:none !important;transition:none !important;}
  }
