/* ============================================================
   AVI'S BEAUTY STUDIO — style.css
   Base styles: variables, reset, navbar, hero, sections,
   services, laser, gallery, testimonials, contact, footer
   ============================================================ */

   :root{

    --rich-black:#0b0b0c;
    --charcoal:#121212;
    --charcoal-mid:#1d1d1f;
    --warm-white:#f8f5ef;
    --cream:#181818;
    --cream-mid:#222;
    --gold:#d4af37;
    --gold-light:#f1cc5d;
    --text-on-dark:#f5f1e8;
    --muted:#b8b0a2;
    --border:rgba(212,175,55,.16);
    --text-dark:#ffffff;

--text-mid:#d6d0c5;

--text-light:#9e978d;

--charcoal-light:#d4af37;

--text-on-dark-muted:#c4b8a4;
  }
  
  /* ── RESET ── */
  *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
  html  { scroll-behavior:smooth; }
  body{
    font-family:'Jost',sans-serif;
    background:var(--rich-black);
    color:#fff;
    overflow-x:hidden;
  }
  
  /* ── NAVBAR ── */
  nav {
    position:fixed; top:0; left:0; right:0; z-index:200;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    padding:0 4rem;
    height:80px;
    background:rgba(11,11,12,.72);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(212,175,55,.12);
    transition:all .35s ease;
  }
  .logo{
    display:flex;
    align-items:center;
    gap:.85rem;
    text-decoration:none;
    justify-self:start;
  }
  .logo-icon{
    width:46px;
    height:46px;
    object-fit:contain;
    filter:drop-shadow(0 2px 8px rgba(212,175,55,.2));
  }
  .logo-text{
    font-family:'Cormorant Garamond',serif;
    font-size:1.38rem;
    color:var(--text-on-dark);
    letter-spacing:.03em;
    font-weight:400;
    line-height:1.15;
  }
  .logo-text b{
    color:var(--gold);
    font-weight:600;
  }
  .nav-links{
    display:flex;
    gap:2.1rem;
    list-style:none;
    justify-self:center;
  }
  .nav-links a{
    color:rgba(245,241,232,.72);
    text-decoration:none;
    font-size:.7rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    font-weight:400;
    transition:color .3s;
    position:relative;
    padding:.35rem 0;
  }
  .nav-links a::after{
    content:'';
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:1px;
    background:var(--gold);
    transform:scaleX(0);
    transition:transform .3s ease;
  }
  .nav-links a:hover,
  .nav-links a.active{
    color:var(--gold);
  }
  .nav-links a:hover::after,
  .nav-links a.active::after{
    transform:scaleX(1);
  }
  .nav-cta-links{
    display:flex;
    align-items:center;
    gap:.75rem;
    justify-self:end;
  }
  .nav-socials{
    display:flex;
    align-items:center;
    gap:.45rem;
  }
  .nav-social{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border-radius:50%;
    border:1px solid rgba(212,175,55,.22);
    color:rgba(212,175,55,.85);
    text-decoration:none;
    transition:.3s ease;
  }
  .nav-social:hover{
    background:rgba(212,175,55,.12);
    border-color:var(--gold);
    color:var(--gold-light);
    transform:translateY(-2px);
  }
  .nav-book{
    background:linear-gradient(135deg,var(--gold) 0%,#c9a030 100%);
    color:var(--rich-black);
    border:none;
    padding:.62rem 1.55rem;
    font-family:'Jost',sans-serif;
    font-size:.7rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    cursor:pointer;
    font-weight:600;
    transition:.3s ease;
    border-radius:40px;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 4px 18px rgba(212,175,55,.22);
  }
  .nav-book:hover{
    background:linear-gradient(135deg,var(--gold-light) 0%,var(--gold) 100%);
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(212,175,55,.32);
  }
  .hamburger{
    display:none;
    flex-direction:column;
    gap:5px;
    cursor:pointer;
    background:none;
    border:none;
    padding:.3rem;
    justify-self:end;
  }
  .hamburger span{
    display:block;
    width:24px;
    height:2px;
    background:var(--text-on-dark);
    transition:.3s;
  }
  
  /* ── HERO ── */
  .hero {
    position:relative;
    min-height:100vh;
    min-height:100dvh;
    display:flex;
    align-items:center;
    overflow:hidden;
  }
  .hero-slides{ position:absolute; inset:0; }
  .hero-slide {
    position:absolute; inset:0;
    background-size:cover;
    background-position:center;
    opacity:0;
    transition:opacity 1.4s ease;
    transform:scale(1.02);
  }
  .hero-slide.active{
    opacity:1;
    animation:heroKenBurns 18s ease-out forwards;
  }
  .hero-slide::after {
    content:'';
    position:absolute;
    inset:0;
    background:
      linear-gradient(108deg,rgba(11,11,12,.93) 0%,rgba(11,11,12,.78) 38%,rgba(11,11,12,.42) 68%,rgba(11,11,12,.25) 100%),
      linear-gradient(to top,rgba(11,11,12,.88) 0%,transparent 42%);
  }
  .hero-body {
    position:relative;
    z-index:2;
    padding:8rem 5rem 10rem;
    max-width:820px;
    animation:fadeUp 1s ease both;
  }
  .hero-eyebrow{
    display:flex;
    align-items:center;
    gap:1rem;
    flex-wrap:wrap;
    margin-bottom:1.8rem;
  }
  .hero-tag {
    display:inline-flex;
    align-items:center;
    gap:.65rem;
    font-size:.62rem;
    letter-spacing:.24em;
    text-transform:uppercase;
    color:var(--gold);
    padding:.5rem 1.1rem;
    border-radius:40px;
    background:rgba(212,175,55,.1);
    border:1px solid rgba(212,175,55,.28);
  }
  .hero-tag::before{
    content:'';
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--gold);
    box-shadow:0 0 10px rgba(212,175,55,.6);
  }
  .hero-location{
    font-size:.62rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:rgba(245,241,232,.55);
  }
  .hero h1 {
    font-family:'Cormorant Garamond',serif;
    font-size:clamp(3.4rem,6.8vw,5.8rem);
    font-weight:300;
    line-height:1.04;
    color:#fff;
    margin-bottom:1.4rem;
    letter-spacing:.01em;
    text-shadow:0 4px 48px rgba(0,0,0,.35);
  }
  .hero h1 em{
    color:var(--gold);
    font-style:italic;
    font-weight:400;
  }
  .hero-sub{
    font-size:1rem;
    color:rgba(245,241,232,.82);
    line-height:1.8;
    font-weight:300;
    max-width:520px;
    margin-bottom:2.6rem;
  }
  .hero-btns{
    display:flex;
    gap:.85rem;
    flex-wrap:wrap;
    align-items:center;
  }
  
  .btn-gold{
    background:linear-gradient(135deg,var(--gold) 0%,#c9a030 100%);
    color:var(--rich-black);
    border:none;
    padding:.92rem 2.4rem;
    font-family:'Jost',sans-serif;
    font-size:.76rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    cursor:pointer;
    font-weight:600;
    transition:.3s ease;
    text-decoration:none;
    display:inline-block;
    border-radius:40px;
    box-shadow:0 6px 22px rgba(212,175,55,.25);
  }
  .btn-gold:hover{
    background:linear-gradient(135deg,var(--gold-light) 0%,var(--gold) 100%);
    transform:translateY(-3px);
    box-shadow:0 12px 30px rgba(212,175,55,.35);
  }
  
  .btn-ghost{
    background:rgba(255,255,255,.04);
    color:var(--text-on-dark);
    border:1px solid rgba(212,196,176,.42);
    padding:.9rem 2.1rem;
    font-family:'Jost',sans-serif;
    font-size:.76rem;
    letter-spacing:.1em;
    text-transform:uppercase;
    cursor:pointer;
    font-weight:400;
    transition:.3s ease;
    text-decoration:none;
    display:inline-block;
    border-radius:40px;
    backdrop-filter:blur(8px);
  }
  .btn-ghost:hover{
    border-color:var(--gold);
    color:var(--gold);
    background:rgba(212,175,55,.08);
    transform:translateY(-3px);
  }
  .btn-phone{
    letter-spacing:.06em;
    text-transform:none;
    font-size:.82rem;
  }

  .hero-bottom{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:1.6rem 5rem 2.2rem;
    background:linear-gradient(to top,rgba(11,11,12,.92),rgba(11,11,12,.55) 55%,transparent);
    animation:fadeUp 1s .25s ease both;
  }
  .hero-stats{
    display:flex;
    align-items:center;
    gap:2.5rem;
  }
  .hero-stat{ text-align:center; }
  .hero-stat-divider{
    width:1px;
    height:42px;
    background:linear-gradient(to bottom,transparent,rgba(212,175,55,.35),transparent);
  }
  .stat-num{
    font-family:'Cormorant Garamond',serif;
    font-size:2.15rem;
    font-weight:400;
    color:var(--gold);
    line-height:1;
  }
  .stat-lbl{
    font-size:.58rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:rgba(196,184,164,.75);
    margin-top:.45rem;
  }
  .slide-dots{
    display:flex;
    gap:.55rem;
    align-items:center;
  }
  .dot{
    width:28px;
    height:3px;
    border-radius:3px;
    background:rgba(212,196,176,.22);
    cursor:pointer;
    transition:.35s ease;
  }
  .dot.active{
    background:var(--gold);
    width:44px;
    box-shadow:0 0 12px rgba(212,175,55,.4);
  }
  .hero-scroll{
    position:absolute;
    right:3rem;
    bottom:50%;
    transform:translateY(50%);
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.75rem;
    text-decoration:none;
    color:rgba(212,175,55,.7);
    font-size:.58rem;
    letter-spacing:.22em;
    text-transform:uppercase;
    transition:color .3s;
    animation:fadeUp 1s .5s ease both;
  }
  .hero-scroll:hover{ color:var(--gold); }
  .scroll-line{
    width:1px;
    height:52px;
    background:linear-gradient(to bottom,var(--gold),transparent);
    animation:scrollPulse 2s ease infinite;
  }
  @keyframes heroKenBurns{
    from{ transform:scale(1.02); }
    to{ transform:scale(1.07); }
  }
  @keyframes scrollPulse{
    0%,100%{ opacity:.4; transform:scaleY(.85); }
    50%{ opacity:1; transform:scaleY(1); }
  }
  
  /* ── SECTION BASE ── */
  .sec        { padding:7rem 5rem; }
  .sec-tag    { font-size:.65rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:.8rem; display:flex; align-items:center; gap:.8rem; }
  .sec-tag::before { content:''; width:28px; height:1px; background:var(--gold); }
  .sec-title  { font-family:'Cormorant Garamond',serif; font-size:clamp(2rem,4vw,3.4rem); font-weight:300; line-height:1.18; color:var(--text-dark); margin-bottom:1rem; }
  .sec-title em { color:var(--charcoal-light); font-style:italic; }
  .sec-lead   { font-size:.88rem; color:var(--text-mid); line-height:1.85; font-weight:300; max-width:520px; }
  
  /* ── DIVIDER ── */
  .divider { height:1px; background:linear-gradient(to right,transparent,rgba(200,169,126,.25),transparent); margin:0 5rem; }
  
  /* ── SERVICES ── */
  #services   {   background:#0f0f10; }
  .svc-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:4rem; flex-wrap:wrap; gap:2rem; }
  .svc-grid   { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(42,31,18,.08); }
  .svc-card{
    background:#151515;
    padding:2.8rem 2.2rem;
    cursor:pointer;
    transition:.4s ease;
    position:relative;
    overflow:hidden;
    min-width:0;
    border:1px solid rgba(212,175,55,.08);
  }
  .svc-card::after {
    content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
    background:var(--gold); transform:scaleX(0); transition:.35s;
  }
  .svc-card:hover::after  { transform:scaleX(1); }
  .svc-card:hover{
    background:#1d1d1f;
    transform:translateY(-4px);
  }
  .svc-card-dark          { background:var(--charcoal) !important; }
  .svc-card-dark:hover    { background:var(--charcoal-mid) !important; }
  .svc-num  { font-family:'Cormorant Garamond',serif; font-size:3.5rem; font-weight:300; color:rgba(42,31,18,.06); line-height:1; margin-bottom:1rem; }
  .svc-icon { margin-bottom:1.2rem; }
  .svc-icon svg { width:32px; height:32px; }
  .svc-card h3  { font-family:'Cormorant Garamond',serif; font-size:1.5rem; font-weight:400; color:var(--text-dark); margin-bottom:.7rem; }
  .svc-card p   { font-size:.82rem; color:var(--text-mid); line-height:1.75; font-weight:300; }
  .svc-list     { margin-top:1.2rem; border-top:1px solid var(--border); padding-top:1rem; }
  .svc-row      { display:flex; justify-content:space-between; padding:.38rem 0; font-size:.8rem; color:var(--text-mid); border-bottom:1px dashed rgba(42,31,18,.07); }
  .svc-row:last-child { border-bottom:none; }
  .svc-row span:last-child { color:var(--text-dark); font-weight:500; white-space:nowrap; margin-left:.5rem; }
  
  /* ── LASER SPOTLIGHT ── */
  #laser        { background:var(--charcoal); padding:0; }
  .laser-inner  { display:grid; grid-template-columns:1fr 1fr; min-height:560px; }
  .laser-text   { padding:7rem 5rem; display:flex; flex-direction:column; justify-content:center; }
  .laser-text .sec-title    { color:#fff; }
  .laser-text .sec-title em { color:var(--gold); }
  .laser-text .sec-lead     { color:var(--text-on-dark); }
  .laser-perks  { margin:2rem 0; display:flex; flex-direction:column; gap:.9rem; }
  .laser-perk   { display:flex; align-items:center; gap:.9rem; font-size:.83rem; color:var(--text-on-dark); font-weight:300; }
  .perk-dot     { width:6px; height:6px; border-radius:50%; background:var(--gold); flex-shrink:0; }
  .laser-img {
    background:url('https://images.unsplash.com/photo-1594824476967-48c8b964273f?w=900&q=85') center/cover no-repeat;
    position:relative; min-height:400px;
  }
  .laser-img::before { content:''; position:absolute; inset:0; background:rgba(26,20,16,.18); }
  
  /* ── GALLERY ── */
  #gallery      { background:var(--warm-white); }
  #gallery .sec-tag::before { background:var(--gold); }
  #gallery .sec-title      { color:var(--charcoal); }
  #gallery .sec-title em   { color:#8a6d1c; }
  .gallery-grid {
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    grid-template-rows:240px 240px;
    gap:8px; margin-top:3.5rem;
  }
  .g-item           { overflow:hidden; position:relative; cursor:pointer; }
  .g-item:first-child { grid-row:span 2; }
  .g-item img       { width:100%; height:100%; object-fit:cover; transition:transform .7s; display:block; }
  .g-item:hover img { transform:scale(1.07); }
  .g-item::after    { content:''; position:absolute; inset:0; background:rgba(26,20,16,0); transition:.4s; }
  .g-item:hover::after { background:rgba(26,20,16,.18); }
  
  /* ── TESTIMONIALS ── */
  #testimonials { background:var(--cream); }
  #testimonials .sec-title    { color:#fff; }
  #testimonials .sec-title em { color:var(--gold); }
  .testi-grid   { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:3.5rem; }
  .testi-card{
    padding:2.2rem;
    border:1px solid var(--border);
    position:relative;
    background:var(--warm-white);
    transition:.35s ease;
    border-radius:18px;
  }
  .testi-card::before {
    content:'\201C'; font-family:'Cormorant Garamond',serif;
    font-size:5rem; color:var(--gold); opacity:.22;
    position:absolute; top:.5rem; left:1.5rem; line-height:1;
  }
  .testi-card:hover{
    border-color:rgba(200,169,126,.4);
    transform:translateY(-4px);
    box-shadow:0 18px 40px rgba(42,31,18,.08);
  }
  .testi-text { font-size:.85rem; color:var(--text-mid); line-height:1.8; font-weight:300; margin-bottom:1.2rem; font-style:italic; }
  .testi-name { font-size:.78rem; font-weight:600; color:var(--text-dark); letter-spacing:.05em; }
  .testi-loc  { font-size:.7rem; color:var(--text-light); margin-top:.15rem; }
  .stars      { color:var(--gold); font-size:.75rem; margin-bottom:.8rem; letter-spacing:.1em; }
  
  /* ── CONTACT ── */
  #contact { background:var(--charcoal); }
  .contact-inner { display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:start; }
  #contact .sec-title     { color:#fff; }
  #contact .sec-title em  { color:var(--gold); }
  .c-item   { display:flex; gap:1rem; margin-bottom:2rem; align-items:flex-start; }
  .c-icon   { color:var(--gold); font-size:.9rem; margin-top:.2rem; flex-shrink:0; }
  .c-label  { font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-on-dark-muted); display:block; margin-bottom:.3rem; }
  .c-val    { color:var(--text-on-dark); font-size:.88rem; line-height:1.65; font-weight:300; }
  .c-val a  { color:var(--text-on-dark); text-decoration:none; transition:color .3s; }
  .c-val a:hover { color:var(--gold); }
  
  .c-form .f-label { font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-on-dark-muted); display:block; margin-bottom:.45rem; }
  .c-form .f-input {
    width:100%; padding:.75rem 1rem; background:rgba(255,255,255,.06);
    border:1px solid rgba(212,196,176,.18); color:#fff;
    font-family:'Jost',sans-serif; font-size:.88rem; outline:none; transition:border .3s;
    margin-bottom:1.2rem;
  }
  .c-form .f-input::placeholder { color:rgba(212,196,176,.3); }
  .c-form .f-input:focus { border-color:var(--gold); }
  .c-form textarea.f-input { resize:vertical; min-height:100px; }
  .c-form .f-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
  
  /* ── FOOTER ── */
  footer {
    background:var(--rich-black); padding:2rem 5rem;
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;
    border-top:1px solid rgba(200,169,126,.12);
  }
  .foot-brand     { font-family:'Cormorant Garamond',serif; font-size:1.2rem; color:var(--text-on-dark); }
  .foot-brand span { color:var(--gold); }
  footer p        { font-size:.72rem; color:rgba(212,196,176,.35); letter-spacing:.04em; }
  
  /* ── WHATSAPP BUTTON ── */
  .wa-btn{
    position:fixed;
    bottom:2rem;
    right:2rem;
    z-index:150;
    width:54px;
    height:54px;
    border-radius:50%;
    background:#141414;
    border:1px solid rgba(212,175,55,.28);
    color:#25D366;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    box-shadow:0 8px 28px rgba(0,0,0,.45);
    transition:.35s ease;
  }
  .wa-btn:hover{
    transform:translateY(-4px) scale(1.05);
    border-color:rgba(37,211,102,.5);
    box-shadow:0 12px 32px rgba(37,211,102,.22);
    background:#1a1a1a;
  }

  .deals-sec{
    background:var(--rich-black);
  }
  
  .deals-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:1.5rem;
    margin-top:4rem;
  }
  
  .deal-card{
    background:var(--charcoal);
    border:1px solid rgba(212,175,55,.12);
    padding:2.4rem 2rem;
    transition:.35s ease;
    position:relative;
    overflow:hidden;
  }
  
  .deal-card:hover{
    transform:translateY(-6px);
    border-color:rgba(212,175,55,.35);
    box-shadow:0 20px 50px rgba(0,0,0,.35);
  }
  
  .deal-badge{
    color:var(--gold);
    font-size:.78rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    margin-bottom:1rem;
    font-weight:600;
  }
  
  .deal-card h3{
    color:#fff;
    font-size:1.6rem;
    margin-bottom:1.4rem;
  }
  
  .deal-list{
    list-style:none;
    padding:0;
    margin:0 0 2rem;
  }
  
  .deal-list li{
    color:var(--text-on-dark);
    padding:.7rem 0;
    border-bottom:1px solid rgba(255,255,255,.05);
    font-size:.95rem;
  }
  
  .deal-price{
    margin-bottom:2rem;
    display:flex;
    align-items:center;
    gap:1rem;
  }
  
  .new-price{
    color:var(--gold);
    font-size:2rem;
    font-weight:600;
  }
  
  .old-price{
    color:#8d8579;
    text-decoration:line-through;
    font-size:1rem;
  }
  
  @media(max-width:1100px){
  
    .deals-grid{
      grid-template-columns:1fr 1fr;
    }
  
  }
  
  @media(max-width:700px){
  
    .deals-grid{
      grid-template-columns:1fr;
    }
  
  }

  .owner-box{
    margin-top:3rem;
    padding:2rem;
    border:1px solid rgba(212,175,55,.14);
    background:rgba(255,255,255,.02);
  }
  
  .owner-tag{
    color:var(--gold);
    text-transform:uppercase;
    letter-spacing:.12em;
    font-size:.72rem;
    margin-bottom:.8rem;
  }
  
  .owner-box h3{
    color:#fff;
    font-size:1.6rem;
    margin-bottom:1rem;
  }
  
  .owner-box p{
    color:var(--text-on-dark);
    line-height:1.8;
  }
  .premium-footer{
    background:#050505;
    color:#fff;
    padding:80px 8% 20px;
}

.footer-container{
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1fr;
    gap:60px;
}

.footer-col h3{
    font-size:38px;
    font-family:"Cormorant Garamond", serif;
}

.footer-col h3 span{
    color:#c9a44d;
}

.footer-col h4{
    color:#c9a44d;
    margin-bottom:20px;
}

.footer-col ul{
    list-style:none;
    padding:0;
}

.footer-col ul li{
    margin-bottom:12px;
}

.footer-col a{
    color:white;
    text-decoration:none;
}

.footer-col a:hover{
    color:#c9a44d;
}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.15);
    margin-top:50px;
    padding-top:20px;
    text-align:center;
    color:#aaa;
}
  .hours-box{
    margin-top:3rem;
    padding:2rem;
    border:1px solid rgba(212,175,55,.12);
    background:rgba(255,255,255,.02);
  }
  
  .hours-title{
    color:var(--gold);
    font-size:1.1rem;
    margin-bottom:1.5rem;
    text-transform:uppercase;
    letter-spacing:.12em;
  }
  
  .hours-grid{
    display:grid;
    gap:1rem;
  }
  
  .hours-grid div{
    display:flex;
    justify-content:space-between;
    border-bottom:1px solid rgba(255,255,255,.06);
    padding-bottom:.7rem;
  }
  
  .hours-grid span{
    color:var(--text-on-dark);
  }
  
  .hours-grid strong{
    color:#fff;
  }

  /* ═══════════════════════════════════════
   BOOKING MODAL FINAL FIX
═══════════════════════════════════════ */

.overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.72);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
  opacity:0;
  visibility:hidden;
  transition:.35s;
  padding:2rem;
}

.overlay.open{
  opacity:1;
  visibility:visible;
}

.stepper{
  display:flex;
  justify-content:space-between;
  margin-bottom:2.5rem;
  gap:1rem;
}

.step{
  flex:1;
  text-align:center;
  opacity:.45;
  padding-bottom:1rem;
  border-bottom:2px solid rgba(255,255,255,.08);
}

.step.active{
  opacity:1;
  border-color:var(--gold);
}

.step.done{
  opacity:1;
}

.step span{
  display:block;
  width:34px;
  height:34px;
  line-height:34px;
  margin:0 auto .5rem;
  border-radius:50%;
  background:#1f1f1f;
  color:#fff;
}

.step.active span,
.step.done span{
  background:var(--gold);
  color:#111;
}

.pg{
  display:none;
}

.pg.show{
  display:block;
}

.pg h3{
  margin-bottom:1.2rem;
  color:#fff;
  font-size:1.4rem;
}

.svc-pick{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin-bottom:2rem;
}

.svc-opt{
  border:1px solid rgba(255,255,255,.12);
  padding:1.2rem;
  cursor:pointer;
  border-radius:14px;
  transition:.3s;
  background:#181818;
  color:#fff;
}

.svc-opt.on{
  border-color:var(--gold);
  background:rgba(212,175,55,.12);
}

.staff-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin-bottom:2rem;
}

.staff-c{
  border:1px solid rgba(255,255,255,.12);
  padding:1.1rem;
  text-align:center;
  cursor:pointer;
  border-radius:14px;
  background:#181818;
}

.staff-c.on{
  border-color:var(--gold);
  background:rgba(212,175,55,.12);
}

#dateStrip{
  display:flex;
  gap:1rem;
  overflow-x:auto;
  margin-bottom:2rem;
}

.d-cell{
  min-width:90px;
  padding:1rem;
  text-align:center;
  border-radius:14px;
  background:#181818;
  border:1px solid rgba(255,255,255,.1);
  cursor:pointer;
}

.d-cell.on{
  border-color:var(--gold);
  background:rgba(212,175,55,.12);
}

.time-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
  margin-bottom:2rem;
}

.t-slot{
  padding:1rem;
  text-align:center;
  border-radius:12px;
  background:#181818;
  border:1px solid rgba(255,255,255,.1);
  cursor:pointer;
}

.t-slot.on{
  border-color:var(--gold);
  background:rgba(212,175,55,.12);
}

.t-slot.taken{
  opacity:.3;
  pointer-events:none;
}

.f-input{
  width:100%;
  padding:1rem;
  margin-bottom:1rem;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:#181818;
  color:#fff;
}

.pay-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:1rem;
  margin-bottom:1.5rem;
}

.pay-opt{
  padding:1rem;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:#181818;
  cursor:pointer;
  text-align:center;
}

.pay-opt.on{
  border-color:var(--gold);
  background:rgba(212,175,55,.12);
}

.btn-gold{
  background:var(--gold);
  color:#111;
  border:none;
  padding:1rem 2rem;
  border-radius:50px;
  cursor:pointer;
  font-weight:600;
  margin-top:1rem;
}

#summaryBox{
  background:#181818;
  border-radius:16px;
  padding:1.5rem;
  margin-bottom:2rem;
}

.s-row,
.s-total{
  display:flex;
  justify-content:space-between;
  margin-bottom:1rem;
  color:#fff;
}

#processing,
#successView{
  display:none;
  text-align:center;
  padding:4rem 2rem;
}

#processing.show,
#successView.show{
  display:block;
}

.toast-msg{
  position:fixed;
  bottom:30px;
  left:50%;
  transform:translateX(-50%);
  background:#111;
  color:#fff;
  padding:1rem 1.5rem;
  border-radius:50px;
  border:1px solid rgba(212,175,55,.2);
  opacity:0;
  visibility:hidden;
  transition:.3s;
  z-index:99999;
}

.show-toast{
  opacity:1;
  visibility:visible;
}

@media(max-width:768px){

  .svc-pick,
  .staff-grid,
  .pay-grid{
    grid-template-columns:1fr;
  }

  .time-grid{
    grid-template-columns:1fr 1fr;
  }

  .modal{
    padding:1.5rem;
  }
}

.pg,
.pg h3,
.pg p,
.step,
.step small,
.staff-c,
.svc-opt,
.pay-opt{
  color:#fff !important;
}

input,
textarea,
select{
  color:#fff !important;
}

#processing,
#successView{
  display:none;
}

body{
  background:#0b0b0c;
}

.modal{
  width:min(960px,100%);
  max-height:92vh;
  overflow-y:auto;
  background:#111111 !important;
  border-radius:28px;
  border:1px solid rgba(212,175,55,.15);
  position:relative;
  padding:2.5rem;
  color:#ffffff !important;
  box-shadow:0 30px 80px rgba(0,0,0,.55);
}

.modal *{
  color:#ffffff;
}

.pg h3{
  color:#ffffff !important;
}

.svc-opt,
.staff-c,
.pay-opt,
.t-slot,
.d-cell{
  background:#181818 !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.1);
}

.step{
  color:#ffffff !important;
}

.svc-cat-title{
  grid-column:1/-1;
  font-size:1.2rem;
  font-weight:700;
  color:#d4af37;
  margin-top:1.5rem;
  margin-bottom:.3rem;
  padding-bottom:.5rem;
  border-bottom:1px solid rgba(212,175,55,.2);
}

.svc-card,
.deal-card,
.testi-card,
.g-item,
.owner-box,
.hours-box{
  opacity:0;
  transform:translateY(60px);
  transition:all .9s ease;
}

.show-reveal{
  opacity:1 !important;
  transform:translateY(0) !important;
}

.svc-card:hover,
.deal-card:hover,
.testi-card:hover{

  box-shadow:
  0 0 30px rgba(212,175,55,.08),
  0 20px 50px rgba(0,0,0,.4);

}

.insta-sec{
  padding:7rem 5rem;
  text-align:center;
  background:#111;
}

.insta-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
  margin:3rem 0;
}

.insta-grid img{
  width:100%;
  height:260px;
  object-fit:cover;
  border-radius:18px;
  transition:.4s;
}

.insta-grid img:hover{
  transform:scale(1.04);
}

.cursor-glow{

  position:fixed;

  width:220px;

  height:220px;

  border-radius:50%;

  background:rgba(212,175,55,.08);

  filter:blur(70px);

  transform:translate(-50%,-50%);

  pointer-events:none;

  z-index:0;

}

.map-section{
  width:100%;
  padding:0;
  margin:0;
}

.map-wrap{
  width:100%;
}

.map-wrap iframe{
  width:100%;
  height:600px;
  border:none;
  display:block;
}

.hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 22%,rgba(212,175,55,.14),transparent 28%),
    radial-gradient(circle at 12% 88%,rgba(212,175,55,.06),transparent 22%);
  z-index:1;
  pointer-events:none;
}

.svc-card,
.deal-card,
.testi-card,
.owner-box,
.hours-box{

  backdrop-filter:blur(18px);

  background:
  rgba(255,255,255,.03);

  border:
  1px solid rgba(212,175,55,.12);

  box-shadow:
  0 10px 40px rgba(0,0,0,.35);

}

.svc-card:hover,
.deal-card:hover,
.testi-card:hover{

  transform:
  translateY(-10px);

  box-shadow:
  0 25px 60px rgba(212,175,55,.18);

}

.g-item{

  border-radius:24px;

  overflow:hidden;

}

.g-item img{

  transition:
  transform .7s ease,
  filter .7s ease;

}

.g-item:hover img{

  transform:scale(1.08);

  filter:brightness(1.15);

}
  

.insta-grid{

  display:grid;

  grid-template-columns:
  repeat(4,1fr);

  gap:1.2rem;

  margin:4rem 0;

}

.insta-grid img{

  width:100%;

  height:340px;

  object-fit:cover;

  border-radius:24px;

  transition:.45s ease;

}

.insta-grid img:hover{

  transform:translateY(-10px) scale(1.03);

  box-shadow:
  0 25px 60px rgba(212,175,55,.22);

}

.btn-gold:hover{

  background:var(--gold-light);

  transform:translateY(-4px);

  box-shadow:
  0 12px 35px rgba(212,175,55,.35);

}

.svc-card,
.deal-card,
.testi-card,
.g-item,
.owner-box,
.hours-box{

  opacity:0;

  transform:translateY(60px);

  transition:
  all .8s ease;

}

.show-reveal{

  opacity:1;

  transform:translateY(0);

}

.sec-title{

  letter-spacing:.03em;

}

.hero h1{

  letter-spacing:.02em;

}

/* ═══════════════════════════════════════
   PREMIUM LOADER
═══════════════════════════════════════ */

.lux-loader{

  position:fixed;

  inset:0;

  background:#050505;

  z-index:999999;

  display:flex;

  align-items:center;

  justify-content:center;

  transition:opacity .8s ease,
  visibility .8s ease;

}

.lux-loader.hide{

  opacity:0;

  visibility:hidden;

}

.loader-inner{

  text-align:center;

}

.loader-logo{

  font-family:
  'Cormorant Garamond',serif;

  font-size:4rem;

  color:#fff;

  letter-spacing:.04em;

  animation:
  fadeGlow 2s ease infinite alternate;

}

.loader-logo span{

  color:var(--gold);

}

.loader-line{

  width:220px;

  height:2px;

  margin:1.5rem auto;

  background:
  linear-gradient(
    to right,
    transparent,
    var(--gold),
    transparent
  );

  animation:
  lineMove 2s ease infinite;

}

.loader-text{

  color:#b8b0a2;

  letter-spacing:.25em;

  text-transform:uppercase;

  font-size:.72rem;

}

@keyframes fadeGlow{

  from{

    opacity:.6;

    transform:scale(.98);

  }

  to{

    opacity:1;

    transform:scale(1.02);

  }

}

@keyframes lineMove{

  0%{

    transform:scaleX(.4);

    opacity:.5;

  }

  100%{

    transform:scaleX(1);

    opacity:1;

  }

}
  /* ── ANIMATIONS ── */
  @keyframes fadeUp  { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:translateY(0); } }
  @keyframes slideUp { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }

/* ── PAGE HERO (subpages) ── */
.small-hero{
  min-height:58vh;
  align-items:flex-end;
  padding-bottom:4rem;
}
.small-hero .hero-stats,
.small-hero .slide-dots{
  display:none;
}
.small-hero .hero-body{
  padding-bottom:2rem;
}

/* ── ABOUT ── */
.about-sec{
  background:#0f0f10;
}
.about-inner{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:5rem;
  align-items:center;
}
.about-visual{
  position:relative;
}
.about-img{
  width:100%;
  min-height:480px;
  border-radius:24px;
  background:url('https://images.unsplash.com/photo-1560066984-138dadb4c035?w=900&q=85') center/cover no-repeat;
  border:1px solid rgba(212,175,55,.15);
}
.about-badge{
  position:absolute;
  bottom:1.5rem;
  left:1.5rem;
  background:rgba(11,11,12,.88);
  border:1px solid rgba(212,175,55,.25);
  color:var(--gold);
  padding:.65rem 1.2rem;
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  border-radius:40px;
}
.about-content .sec-title{
  color:#fff;
}
.about-content .sec-title em{
  color:var(--gold);
}
.about-founder{
  margin-top:2rem;
  padding:1.8rem;
  border:1px solid rgba(212,175,55,.14);
  background:rgba(255,255,255,.02);
  border-radius:18px;
}
.about-highlights{
  display:flex;
  gap:2rem;
  margin-top:2rem;
  flex-wrap:wrap;
}
.about-highlight{
  text-align:center;
}
.about-highlight strong{
  display:block;
  font-family:'Cormorant Garamond',serif;
  font-size:2.2rem;
  color:var(--gold);
  font-weight:400;
  line-height:1;
}
.about-highlight span{
  display:block;
  margin-top:.4rem;
  font-size:.68rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--text-on-dark-muted);
}

/* ── CTA SECTION ── */
.cta-sec{
  background:linear-gradient(135deg,#151515 0%,#0b0b0c 100%);
  border-top:1px solid rgba(212,175,55,.1);
  border-bottom:1px solid rgba(212,175,55,.1);
}
.cta-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:2rem;
  flex-wrap:wrap;
}
.cta-inner .sec-title{
  color:#fff;
}
.cta-inner .sec-title em{
  color:var(--gold);
}
.cta-actions{
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
}

/* ── MAP HEADER ── */
.sec-header{
  text-align:center;
  padding-bottom:2rem;
}
.sec-header .sec-title{
  color:#fff;
}
.sec-header .sec-title em{
  color:var(--gold);
}

/* ── FOOTER ENHANCEMENTS ── */
.social-links{
  display:flex;
  gap:1rem;
  margin-top:1.2rem;
  flex-wrap:wrap;
}
.social-links a{
  color:var(--text-on-dark);
  text-decoration:none;
  font-size:.72rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:.45rem .9rem;
  border:1px solid rgba(212,175,55,.25);
  border-radius:30px;
  transition:.3s;
}
.social-links a:hover{
  color:var(--gold);
  border-color:var(--gold);
}
.footer-col p,
.footer-col li{
  color:rgba(212,196,176,.7);
  line-height:1.7;
  font-size:.88rem;
}
.footer-col a{
  color:rgba(212,196,176,.85);
  text-decoration:none;
  transition:color .3s;
}
.footer-col a:hover{
  color:var(--gold);
}
.footer-hours{
  margin-top:.5rem;
  color:var(--gold) !important;
  font-size:.78rem !important;
  letter-spacing:.08em;
}
.footer-bottom{
  font-size:.82rem;
}

/* ── CONTACT FORM EXTRAS ── */
.c-form-note{
  margin-top:1rem;
  font-size:.82rem;
  color:var(--text-on-dark-muted);
}
.link-btn{
  background:none;
  border:none;
  color:var(--gold);
  cursor:pointer;
  font-family:'Jost',sans-serif;
  font-size:inherit;
  text-decoration:underline;
  padding:0;
}
.link-btn:hover{
  color:var(--gold-light);
}

/* ── MODAL CLOSE ── */
.modal-close{
  position:absolute;
  top:1.25rem;
  right:1.25rem;
  z-index:10;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  color:#fff;
  width:40px;
  height:40px;
  border-radius:50%;
  font-size:1.4rem;
  line-height:1;
  cursor:pointer;
  transition:.3s;
}
.modal-close:hover{
  background:rgba(212,175,55,.15);
  border-color:var(--gold);
  color:var(--gold);
}
  