:root{
    --navy: #0a1226;
    --navy-deep: #060a17;
    --navy-panel: #101a35;
    --silver: #cfd6e4;
    --silver-soft: #e9edf5;
    --champagne: #cdb27e;
    --champagne-soft: #e4d3a7;
    --line: rgba(207,214,228,0.14);
    --muted: #98a2bd;
  }
  *{ box-sizing:border-box; margin:0; padding:0; }
  html{ scroll-behavior:smooth; }
  body{
    background:var(--navy);
    color:var(--silver-soft);
    font-family:'Jost',sans-serif;
    overflow-x:hidden;
  }
  ::selection{ background:var(--champagne); color:var(--navy-deep); }

  .eyebrow{
    font-family:'Jost',sans-serif;
    font-weight:600;
    letter-spacing:.28em;
    text-transform:uppercase;
    font-size:.7rem;
    color:var(--champagne-soft);
    display:flex;
    align-items:center;
    gap:.7rem;
  }
  .eyebrow::before{
    content:'';
    width:30px; height:1px;
    background:var(--champagne-soft);
    display:inline-block;
  }
  h1,h2,h3{ font-family:'Cormorant Garamond',serif; font-weight:600; line-height:1.06; }

  /* ---------- NAV ---------- */
  nav{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:1rem clamp(1.2rem,4vw,3.5rem);
    background:linear-gradient(to bottom, rgba(6,10,23,.96), rgba(6,10,23,0));
    backdrop-filter:blur(2px);
  }
  .logo-mark{ display:flex; align-items:center; gap:.7rem; text-decoration:none; }
  .logo-mark img{ height:42px; width:auto; display:block; }
  .navlinks{ display:none; list-style:none; gap:2.2rem; }
  .navlinks a{
    color:var(--muted); text-decoration:none; font-size:.82rem; font-weight:500;
    letter-spacing:.06em; text-transform:uppercase; transition:color .25s;
  }
  .navlinks a:hover{ color:var(--champagne-soft); }
  @media(min-width:820px){ .navlinks{ display:flex; } }
  .nav-cta{
    border:1px solid var(--champagne); color:var(--champagne-soft); padding:.6rem 1.4rem;
    border-radius:1px; font-weight:600; font-size:.76rem; text-decoration:none;
    letter-spacing:.08em; text-transform:uppercase; transition:all .25s;
  }
  .nav-cta:hover{ background:var(--champagne); color:var(--navy-deep); }

  /* ---------- HERO ---------- */
  .hero{
    min-height:100vh;
    display:flex; align-items:center; justify-content:center; flex-direction:column;
    text-align:center;
    padding:8rem clamp(1.2rem,4vw,3.5rem) 4rem;
    position:relative;
    background:
      radial-gradient(ellipse at 50% 0%, rgba(205,178,126,.09), transparent 55%),
      radial-gradient(ellipse at 50% 100%, rgba(207,214,228,.05), transparent 60%),
      var(--navy);
  }
  .hero::before{
    content:''; position:absolute; inset:0;
    background-image:
      linear-gradient(rgba(207,214,228,.035) 1px, transparent 1px),
      linear-gradient(90deg, rgba(207,214,228,.035) 1px, transparent 1px);
    background-size:64px 64px;
    mask-image:radial-gradient(ellipse at 50% 40%, black 20%, transparent 70%);
    pointer-events:none;
  }
  .hero-logo{
    width:min(230px, 46vw);
    height:auto;
    margin-bottom:1.8rem;
    filter:drop-shadow(0 0 40px rgba(205,178,126,.18));
    position:relative; z-index:1;
    opacity:0;
    animation:riseIn 1.1s ease forwards .15s;
  }
  .hero h1{
    font-size:clamp(2.4rem, 6vw, 4.6rem);
    max-width:800px;
    color:var(--silver-soft);
    position:relative; z-index:1;
    opacity:0;
    animation:riseIn 1.1s ease forwards .4s;
  }
  .hero h1 em{ font-style:italic; color:var(--champagne-soft); font-weight:500; }
  .hero p{
    color:var(--muted); font-size:1.05rem; line-height:1.75; max-width:560px; margin:1.6rem 0 2.3rem;
    position:relative; z-index:1;
    opacity:0;
    animation:riseIn 1.1s ease forwards .6s;
  }
  .hero-ctas{
    display:flex; gap:1rem; flex-wrap:wrap; justify-content:center;
    position:relative; z-index:1;
    opacity:0;
    animation:riseIn 1.1s ease forwards .8s;
  }
  @keyframes riseIn{
    from{ opacity:0; transform:translateY(18px); }
    to{ opacity:1; transform:translateY(0); }
  }
  @media (prefers-reduced-motion: reduce){
    .hero-logo,.hero h1,.hero p,.hero-ctas{ animation:none; opacity:1; }
  }

  .btn{
    display:inline-flex; align-items:center; gap:.6rem;
    padding:1rem 1.9rem; border-radius:1px;
    font-weight:600; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase;
    text-decoration:none; transition:transform .2s, box-shadow .2s, background .2s;
    border:1px solid transparent;
  }
  .btn-champagne{ background:var(--champagne); color:var(--navy-deep); }
  .btn-champagne:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(205,178,126,.22); background:var(--champagne-soft); }
  .btn-outline{ border-color:var(--line); color:var(--silver-soft); }
  .btn-outline:hover{ border-color:var(--champagne-soft); color:var(--champagne-soft); }

  .scroll-cue{
    position:absolute; bottom:2.2rem; left:50%; transform:translateX(-50%);
    width:1px; height:46px;
    background:linear-gradient(to bottom, transparent, var(--champagne-soft) 60%, transparent);
    animation:scrollPulse 2.2s ease-in-out infinite;
  }
  @keyframes scrollPulse{ 0%,100%{opacity:.2;} 50%{opacity:1;} }

  /* ---------- SECTION SHELL ---------- */
  section{ padding:6.5rem clamp(1.2rem,4vw,3.5rem); }
  .section-head{ max-width:660px; margin-bottom:3.2rem; }
  .section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
  .section-head.center .eyebrow{ justify-content:center; }
  .section-head.center .eyebrow::before{ display:none; }
  .section-head h2{ font-size:clamp(2rem,3.8vw,2.8rem); margin-top:1rem; }
  .section-head p{ color:var(--muted); margin-top:1.1rem; line-height:1.8; font-size:1rem; }

  /* ---------- ABOUT ---------- */
  .about{
    background:var(--navy-panel);
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  }
  .about-grid{
    display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center;
  }
  @media(max-width:820px){ .about-grid{ grid-template-columns:1fr; gap:2.2rem; } }
  .about-copy p{ color:var(--muted); line-height:1.9; font-size:1rem; margin-bottom:1.2rem; }
  .about-copy strong{ color:var(--silver-soft); font-weight:600; }
  .stat-row{ display:flex; gap:2.4rem; margin-top:2rem; flex-wrap:wrap; }
  .stat{ }
  .stat .num{ font-family:'Cormorant Garamond',serif; font-size:2.6rem; color:var(--champagne-soft); font-weight:600; }
  .stat .label{ font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-top:.2rem; }
  .about-frame{
    position:relative; border:1px solid var(--line); padding:2.5rem;
    display:flex; align-items:center; justify-content:center;
    background:radial-gradient(ellipse at 50% 30%, rgba(205,178,126,.07), transparent 70%);
  }
  .about-frame::before,.about-frame::after{
    content:''; position:absolute; width:26px; height:26px;
    border:1px solid var(--champagne-soft);
  }
  .about-frame::before{ top:-1px; left:-1px; border-right:none; border-bottom:none; }
  .about-frame::after{ bottom:-1px; right:-1px; border-left:none; border-top:none; }
  .about-frame img{ width:min(220px, 60%); height:auto; }

  /* ---------- SERVICES ---------- */
  .service-grid{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1px;
    background:var(--line); border:1px solid var(--line);
  }
  .service-card{
    background:var(--navy); padding:2.6rem 2rem; transition:background .3s;
    position:relative;
  }
  .service-card:hover{ background:var(--navy-panel); }
  .service-card .icon{ width:32px; height:32px; color:var(--champagne-soft); margin-bottom:1.4rem; }
  .service-card h3{ font-size:1.35rem; font-weight:500; margin-bottom:.7rem; color:var(--silver-soft); }
  .service-card p{ color:var(--muted); font-size:.92rem; line-height:1.7; }

  /* ---------- REVIEWS ---------- */
  .reviews{ background:var(--navy-panel); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .reviews-top{ display:flex; align-items:baseline; gap:1.1rem; flex-wrap:wrap; justify-content:center; }
  .rating-badge{ font-family:'Cormorant Garamond',serif; font-size:3rem; color:var(--champagne-soft); font-weight:600; }
  .stars{ color:var(--champagne-soft); letter-spacing:.18em; font-size:1.1rem; }
  .review-row{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5px; margin-top:3rem;
    background:var(--line); border:1px solid var(--line);
  }
  .review-card{ background:var(--navy-panel); padding:2.2rem; }
  .review-card .quote-mark{ font-family:'Cormorant Garamond',serif; font-size:2.6rem; color:var(--champagne); line-height:1; margin-bottom:.4rem; display:block; }
  .review-card p{ color:var(--silver-soft); font-size:.98rem; line-height:1.75; font-style:italic; }
  .review-card .who{
    margin-top:1.2rem; font-style:normal; font-size:.72rem; color:var(--champagne-soft);
    font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  }

  /* ---------- VISIT / HOURS ---------- */
  .visit{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  @media(max-width:900px){ .visit{ grid-template-columns:1fr; } }
  .visit-block{ padding:3.2rem 2.4rem; border-right:1px solid var(--line); }
  .visit-block:last-child{ border-right:none; }
  @media(max-width:900px){ .visit-block{ border-right:none; border-bottom:1px solid var(--line); } }
  .visit-block h3{ font-size:1.05rem; font-weight:500; color:var(--champagne-soft); margin-bottom:1.1rem; font-family:'Jost',sans-serif; letter-spacing:.03em; }
  .visit-block p, .visit-block li{ color:var(--muted); line-height:1.85; font-size:.92rem; }
  .hours-list{ list-style:none; }
  .hours-list li{ display:flex; justify-content:space-between; padding:.35rem 0; border-bottom:1px dashed var(--line); }
  .hours-list li span:last-child{ color:var(--silver-soft); font-weight:600; }
  .link-line{
    display:inline-flex; margin-top:1rem; color:var(--champagne-soft); text-decoration:none;
    font-weight:600; font-size:.85rem; border-bottom:1px solid var(--champagne-soft); padding-bottom:2px;
  }
  .social-row{ display:flex; gap:1rem; margin-top:1.1rem; }
  .social-row a{
    width:38px; height:38px; border:1px solid var(--line); border-radius:50%;
    display:flex; align-items:center; justify-content:center; color:var(--silver-soft);
    text-decoration:none; transition:all .25s;
  }
  .social-row a:hover{ border-color:var(--champagne-soft); color:var(--champagne-soft); }
  .social-row svg{ width:17px; height:17px; }

  /* ---------- WHATSAPP BOOKING ---------- */
  .book{
    background:
      radial-gradient(ellipse at 20% 20%, rgba(205,178,126,.08), transparent 55%),
      radial-gradient(ellipse at 80% 80%, rgba(207,214,228,.05), transparent 55%),
      var(--navy-deep);
    text-align:center; position:relative; overflow:hidden;
  }
  .book-inner{ max-width:660px; margin:0 auto; position:relative; z-index:1; }
  .book .eyebrow{ justify-content:center; }
  .book .eyebrow::before{ display:none; }
  .book h2{ font-size:clamp(2.1rem,4.6vw,3.2rem); margin:1.1rem 0 1.1rem; }
  .book p{ color:var(--muted); line-height:1.8; margin-bottom:2.4rem; }
  .wa-btn{
    display:inline-flex; align-items:center; gap:.75rem;
    background:#25D366; color:#04150a; padding:1.1rem 2.4rem;
    border-radius:2px; font-weight:700; font-size:.92rem; text-decoration:none;
    letter-spacing:.03em; transition:transform .2s, box-shadow .2s;
  }
  .wa-btn:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(37,211,102,.28); }
  .wa-btn svg{ width:22px; height:22px; }
  .quick-picks{ display:flex; gap:.7rem; justify-content:center; flex-wrap:wrap; margin-top:2rem; }
  .quick-picks a{
    color:var(--muted); border:1px solid var(--line); padding:.55rem 1.1rem;
    border-radius:20px; font-size:.78rem; text-decoration:none; font-weight:500;
    transition:border-color .2s, color .2s;
  }
  .quick-picks a:hover{ border-color:var(--champagne-soft); color:var(--champagne-soft); }
  .call-line{ margin-top:1.8rem; color:var(--muted); font-size:.88rem; }
  .call-line a{ color:var(--champagne-soft); text-decoration:none; font-weight:600; }

  /* ---------- FOOTER ---------- */
  footer{
    padding:3rem clamp(1.2rem,4vw,3.5rem) 2.4rem;
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:1.5rem;
    border-top:1px solid var(--line); font-size:.82rem; color:var(--muted);
  }
  footer .fname{ font-family:'Cormorant Garamond',serif; color:var(--silver-soft); font-size:1.15rem; }

  /* ---------- FLOATING WHATSAPP ---------- */
  .float-wa{
    position:fixed; bottom:1.6rem; right:1.6rem; z-index:200;
    width:58px; height:58px; border-radius:50%; background:#25D366;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 24px rgba(0,0,0,.5);
    text-decoration:none; transition:transform .2s;
  }
  .float-wa:hover{ transform:scale(1.08); }
  .float-wa svg{ width:28px; height:28px; }

  a:focus-visible, button:focus-visible{ outline:2px solid var(--champagne-soft); outline-offset:3px; }