:root{
      --maroon: #7E1F1F;   /* primary */
      --lime:   #E6F3C8;   /* secondary */
      --gold:   #D4A24A;   /* accent */
      --dark:   #2F3436;   /* text */
      --white:  #ffffff;
      --glass:  rgba(255,255,255,0.8);
    }
    /* Basic reset */
    *{box-sizing:border-box;margin:0;padding:0}
    html,body{height:100%}
    body{font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial;padding:0;color:var(--dark);background:var(--white);-webkit-font-smoothing:antialiased}

    /* NAVBAR */
    .site-header{
      position:sticky;
      top:0;
      z-index:1200;
      transition:background .28s ease,box-shadow .28s ease,backdrop-filter .28s;
      background:transparent;
      padding:14px 24px;
    }
    .site-header.scrolled{
      background:var(--white);
      box-shadow:0 6px 18px rgba(15,20,25,0.06);
      backdrop-filter: blur(4px);
    }

    .nav{
      max-width:1200px;
      margin:0 auto;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
    }

    /* brand */
    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      text-decoration:none;
      color:var(--dark);
    }
    .brand img{height:52px; width:auto; display:block}
    .brand .brand-text{
      display:flex;
      flex-direction:column;
      line-height:1;
    }
    .brand .title{font-family:'Playfair Display',serif;font-size:18px;color:var(--maroon);letter-spacing:.6px}
    .brand .subtitle{font-size:12px;color:var(--dark);opacity:.75}

    /* menu (desktop) */
    .nav-menu{
      display:flex;
      gap:6px;
      align-items:center;
      list-style:none;
    }
    .nav-menu a{
      display:inline-block;
      padding:10px 12px;
      color:var(--dark);
      text-decoration:none;
      border-radius:8px;
      font-weight:600;
      font-size:14px;
      transition:background .18s, color .18s, transform .12s;
    }
    .nav-menu a:focus{outline:2px solid var(--gold); outline-offset:3px}
    .nav-menu a:hover{background:rgba(0,0,0,0.04); transform:translateY(-2px)}

    /* CTA */
    .btn-cta{
      background:linear-gradient(180deg,var(--maroon),#5a1515);
      color:var(--white);
      padding:9px 14px;
      border-radius:10px;
      text-decoration:none;
      font-weight:700;
      box-shadow:0 6px 18px rgba(126,31,31,0.12);
    }
    .btn-ghost{
      border:2px solid var(--maroon);
      color:var(--maroon);
      padding:8px 12px;
      border-radius:10px;
      text-decoration:none;
      font-weight:700;
    }

    /* Mobile hamburger & slide menu */
    .nav-toggle{
      display:none;
      background:transparent;
      border:0;
      font-size:22px;
      line-height:1;
      padding:8px;
      cursor:pointer;
    }
    .mobile-drawer{
      display:none;
    }

    /* Responsive */
    @media (max-width:900px){
      .nav-menu{display:none}
      .nav-toggle{display:inline-flex;align-items:center;gap:8px}
      .mobile-drawer{
        position:fixed;
        top:0; right:0;
        height:100vh;
        width:300px;
        background:var(--white);
        box-shadow:-8px 0 30px rgba(20,25,30,0.08);
        transform:translateX(110%);
        transition:transform .28s cubic-bezier(.22,.9,.29,1);
        padding:20px;
        display:flex;
        flex-direction:column;
        gap:12px;
        z-index:1250;
      }
      .mobile-drawer.open{transform:translateX(0)}
      .mobile-menu{display:flex;flex-direction:column;gap:6px;padding-top:10px}
      .mobile-menu a{padding:12px 8px;border-radius:8px;font-weight:600;color:var(--dark);text-decoration:none}
      .mobile-cta{margin-top:auto;padding-top:10px}
    }

    /* small helper */
    .spacer{flex:1}




     /* ---------- HERO (new attractive section) ---------- */
    .hero{
      position:relative;
      overflow:hidden;
      padding:36px 20px;
      background:
        radial-gradient(1000px 400px at 10% 20%, rgba(230,243,200,0.35), transparent 10%),
        linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,255,255,0.95));
    }

    .hero-wrap{
      max-width:1200px;
      margin:0 auto;
      display:grid;
      grid-template-columns: 1fr 420px;
      gap:28px;
      align-items:center;
      padding:22px;
    }

    /* Left content */
    .hero-content{
      padding:12px 6px;
    }
    .kicker{
      display:inline-block;
      background:var(--lime);
      color:var(--maroon);
      font-weight:700;
      padding:6px 10px;
      border-radius:999px;
      font-size:13px;
      margin-bottom:12px;
    }
    h1.hero-title{
      font-family:'Playfair Display',serif;
      color:var(--maroon);
      font-size:36px;
      margin-bottom:8px;
      letter-spacing:0.2px;
    }
    p.hero-sub{
      color:var(--dark);
      opacity:.85;
      margin-bottom:18px;
      font-size:15px;
    }

    /* Class selector cards */
    .class-grid{
      display:flex;
      gap:12px;
      flex-wrap:wrap;
      margin-bottom:16px;
    }
    .class-card{
      background:#fff;
      border:1px solid rgba(47,52,54,0.06);
      padding:12px 14px;
      border-radius:12px;
      min-width:140px;
      box-shadow:0 8px 20px rgba(15,20,25,0.04);
      cursor:pointer;
      transition:transform .18s ease, box-shadow .18s ease, border-color .18s;
      display:flex;
      gap:12px;
      align-items:center;
    }
    .class-card:hover{ transform:translateY(-6px); box-shadow:0 14px 30px rgba(15,20,25,0.06)}
    .class-card.active{
      border-color:var(--maroon);
      box-shadow:0 18px 34px rgba(126,31,31,0.08);
      transform:translateY(-8px);
    }
    .thumb{
      width:46px;height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;
    }
    .thumb.kids{background:linear-gradient(180deg,#ff8a65,#ff7043)}
    .thumb.teens{background:linear-gradient(180deg,#9fa8da,#6573c3)}
    .thumb.adults{background:linear-gradient(180deg,#80cbc4,#26a69a)}
    .thumb.pro{background:linear-gradient(180deg,#ffd54f,#ffb300)}
    .class-label{font-weight:700;font-size:14px}
    .class-sub{font-size:12px;color:rgba(47,52,54,0.7)}

    /* CTA row */
    .cta-row{display:flex;gap:12px;align-items:center;margin-top:6px}
    .btn-primary{
      background:linear-gradient(180deg,var(--maroon),#5a1515);
      color:#fff;padding:10px 16px;border-radius:12px;text-decoration:none;font-weight:700;box-shadow:0 8px 24px rgba(126,31,31,0.12)
    }
    .btn-secondary{border:2px solid var(--maroon);padding:8px 14px;border-radius:12px;text-decoration:none;color:var(--maroon);font-weight:700;background:transparent}

    /* Right visual panel */
    .hero-panel{
      position:relative;
      padding:18px;
      background:linear-gradient(180deg,rgba(254,248,240,0.8),#fff);
      border-radius:16px;
      box-shadow:0 10px 30px rgba(15,20,25,0.04);
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:12px;
    }

    /* SVG dancer container */
    .dancer-wrap{width:100%;display:flex;align-items:center;justify-content:center;padding:6px}
    .dancer-svg{width:220px;height:220px;display:block}

    /* quick info badges */
    .badges{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:6px}
    .badge{background:#fff;padding:8px 10px;border-radius:999px;border:1px solid rgba(47,52,54,0.06);font-weight:700;font-size:13px}

    /* Booking hint */
    .small-note{font-size:13px;color:rgba(47,52,54,0.8);text-align:center;padding:6px 12px}

    /* Modal (quick book) */
    .modal-backdrop{position:fixed;inset:0;background:rgba(10,12,14,0.52);display:none;align-items:center;justify-content:center;z-index:1500;padding:18px}
    .modal-backdrop.open{display:flex}
    .modal{background:#fff;border-radius:12px;max-width:480px;width:100%;padding:20px;box-shadow:0 18px 48px rgba(15,20,25,0.22)}
    .modal h3{font-family:'Playfair Display',serif;color:var(--maroon);margin-bottom:8px}
    .field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
    .field input{padding:10px 12px;border-radius:8px;border:1px solid rgba(47,52,54,0.12);font-size:15px}
    .modal .actions{display:flex;gap:8px;justify-content:flex-end}
    .close-btn{background:none;border:0;font-size:18px;cursor:pointer;color:rgba(47,52,54,0.7)}

    /* responsive */
    @media (max-width:980px){
      .hero-wrap{grid-template-columns:1fr;gap:18px;padding:12px}
      .hero-panel{order:2}
    }
    @media (max-width:480px){
      h1.hero-title{font-size:26px}
      .dancer-svg{width:170px;height:170px}
      .class-card{min-width:120px}
    }

    /* subtle animation for svg (floating) */
    @keyframes floaty { 0%{transform:translateY(0)}50%{transform:translateY(-6px)}100%{transform:translateY(0)} }
    .dancer-svg { animation: floaty 4s ease-in-out infinite }




    /* hero right image styles */
.spot-image-box{
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 18px;
}

.spot-img{
  width: 100%;
  max-width: 340px;
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 18px 40px rgba(0,0,0,0.45);
  border: 2px solid rgba(255,255,255,0.08);
  transition: transform .3s ease, box-shadow .3s ease;
}

.spot-img:hover{
  transform: translateY(-6px);
  box-shadow: 0 28px 70px rgba(0,0,0,0.6);
}
.spot-img-box{display:flex;justify-content:center;margin-bottom:18px}
.spot-img-gold{
  width:240px;height:240px;object-fit:cover;border-radius:50%;
  /* if LOGO1.jpeg has white bg, we hide edges with box-shadow + border */
  border:6px solid rgba(212,162,74,0.95); /* gold ring */
  box-shadow: 0 30px 70px rgba(0,0,0,0.55), inset 0 8px 20px rgba(255,255,255,0.03);
  transition:transform .35s ease, filter .35s;
  background:#fff; /* fallback */
}
/* small hover */
.spot-img-gold:hover{ transform:translateY(-8px) scale(1.02); filter:brightness(1.03) saturate(.95) }










  :root{
    --maroon:#7E1F1F;
    --gold:#D4A24A;
    --bg-dark:#0b0b0b;
    --muted:#efebe7;
    --maxw:1200px;
    --hero-img-url: url('hero-stage.webp'); /* replace with your stage photo (webp) */
    --hero-video-url: 'hero-loop.mp4'; /* optional video path */
  }

  /* container */
  .spot-hero{position:relative;min-height:86vh;display:flex;align-items:center;justify-content:center;color:var(--muted);overflow:hidden;background:#0b0b0b}
  /* background image fallback */
  .spot-hero .bg{
    position:absolute;inset:0;background-image:var(--hero-img-url);background-size:cover;background-position:center;filter:brightness(.28) contrast(.95) saturate(.9);
    z-index:0;transition:opacity .4s ease;
  }
  /* If you want to use video: add <video class="bg-video"> inside .spot-hero and remove bg image */
  .spot-hero .bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:brightness(.4);}

  /* spotlight layer (radial gradient) */
  .spot{position:absolute;left:50%;top:28%;width:70vmax;height:70vmax;transform:translate(-50%,-10%);border-radius:50%;pointer-events:none;z-index:1;mix-blend-mode:screen;
    background:radial-gradient(circle at 50% 35%, rgba(255,244,230,0.95) 0%, rgba(255,244,230,0.35) 8%, rgba(255,244,230,0.06) 22%, rgba(0,0,0,0) 40%);
    filter:blur(28px);opacity:0.95;animation:spotMove 8s ease-in-out infinite;
  }
  @keyframes spotMove{
    0%{transform:translate(-48%,-10%) scale(1)}
    50%{transform:translate(-52%,-12%) scale(1.03)}
    100%{transform:translate(-48%,-10%) scale(1)}
  }

  /* subtle stage floor gradient */
  .stage-floor{position:absolute;left:0;right:0;bottom:0;height:24vh;background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,0.45));z-index:1}

  /* content */
  .spot-inner{position:relative;z-index:2;max-width:var(--maxw);width:100%;padding:60px 22px;display:flex;align-items:flex-start;gap:40px}
  .spot-left{flex:1;max-width:780px}
  .spot-hint{display:inline-block;padding:6px 12px;border-radius:999px;background:rgba(255,244,230,0.95);color:var(--maroon);font-weight:800;margin-bottom:18px}
  .spot-title{font-family:'Playfair Display',serif;font-size:72px;line-height:0.96;margin:0 0 12px;color:#fff;text-shadow:0 24px 40px rgba(0,0,0,0.65)}
  .spot-sub{font-size:18px;color:rgba(255,255,255,0.85);max-width:60ch;margin-bottom:26px}

  /* CTA big center-ish */
  .spot-actions{display:flex;gap:14px;align-items:center}
  .btn-spot{background:linear-gradient(90deg,var(--maroon),#5c1111);color:#fff;padding:16px 24px;border-radius:12px;font-weight:900;text-decoration:none;box-shadow:0 22px 60px rgba(126,31,31,0.28);transition:transform .16s}
  .btn-spot:hover{transform:translateY(-6px)}
  .btn-ghost-spot{padding:12px 18px;border-radius:12px;border:2px solid rgba(255,255,255,0.12);color:#fff;text-decoration:none;font-weight:800}

  /* small trust row below */
  .trust-row{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap}
  .trust-pill{background:rgba(255,255,255,0.04);padding:8px 12px;border-radius:999px;font-weight:700;color:rgba(255,255,255,0.9)}

  /* right: minimal info or empty to let title breathe */
  .spot-right{width:360px;display:flex;flex-direction:column;gap:12px;align-items:center}
  .spot-card{background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02));border-radius:12px;padding:18px;width:100%;box-shadow:0 18px 40px rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.04)}
  .spot-card h4{margin:0 0 8px;color:#fff}
  .spot-card p{margin:0;color:rgba(255,255,255,0.8)}

  /* scroll cue bottom-center */
  .cue{position:absolute;left:50%;transform:translateX(-50%);bottom:18px;z-index:4;display:flex;flex-direction:column;align-items:center;gap:8px}
  .cue .ar{width:28px;height:28px;border-left:2px solid rgba(255,255,255,0.9);border-bottom:2px solid rgba(255,255,255,0.9);transform:rotate(-45deg);animation:cueAnim 1.6s infinite}
  @keyframes cueAnim{0%{transform:translateY(0) rotate(-45deg)}50%{transform:translateY(8px) rotate(-45deg)}100%{transform:translateY(0) rotate(-45deg)}}
  .cue p{color:rgba(255,255,255,0.9);font-weight:700;font-size:12px;letter-spacing:1px}

  /* responsive */
  @media (max-width:980px){
    .spot-inner{flex-direction:column;align-items:center;text-align:center;padding:36px 18px}
    .spot-left{max-width:100%}
    .spot-title{font-size:36px}
    .spot-right{width:100%}
  }
  @media (max-width:480px){
    .spot-title{font-size:26px}
    .btn-spot{width:100%}
    .btn-ghost-spot{width:100%}
    .cue{display:none}
  }







  /*-- ===== STYLES FOR SHOWCASE ===== */
  :root{
    --accent:#7E1F1F; --accent-dark:#5a1515; --muted:#444;
  }
  .filter-nav .filt{
    padding:8px 12px;border-radius:999px;border:1px solid rgba(34,40,42,0.06);background:#fff;font-weight:800;cursor:pointer;transition:all .18s;
  }
  .filter-nav .filt.active{background:linear-gradient(90deg,var(--accent),var(--accent-dark));color:#fff;border-color:transparent;box-shadow:0 12px 36px rgba(126,31,31,0.12)}

  .show-grid{display:grid;grid-template-columns:1fr 380px;gap:20px;align-items:start}
  .stack{display:flex;flex-direction:column;gap:20px}
  .tile{position:relative;border-radius:14px;overflow:hidden;cursor:pointer;box-shadow:0 12px 30px rgba(15,20,25,0.06);transition:transform .36s, box-shadow .36s}
  .tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
  .tile.big{height:520px}
  .tile.small{height:244px}
  .tile:hover{transform:translateY(-6px);box-shadow:0 40px 90px rgba(15,20,25,0.12)}
  .tile:hover img{transform:scale(1.06)}

  .tile-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.28),rgba(0,0,0,0.48));display:flex;align-items:flex-end;padding:22px}
  .tile-meta{color:#fff}
  .tile-meta .label{display:inline-block;background:rgba(255,255,255,0.08);padding:6px 10px;border-radius:999px;font-weight:800;margin-bottom:12px}
  .tile-meta h3{font-family:'Playfair Display',serif;margin:0;font-size:26px}
  .tile-meta .sub{margin:8px 0 12px;color:rgba(255,255,255,0.88);font-weight:700}

  .tile-actions{display:flex;gap:10px}
  .btn-prim{background:linear-gradient(90deg,var(--accent),var(--accent-dark));color:#fff;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:800}
  .btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.18);color:#fff;padding:8px 12px;border-radius:10px;font-weight:800}

  /* modal */
  .modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(6,8,10,0.6);z-index:2200;padding:20px}
  .modal.open{display:flex}
  .modal-panel{background:#fff;border-radius:12px;padding:20px;max-width:820px;width:100%;box-shadow:0 30px 80px rgba(15,20,25,0.3)}
  .modal-close{position:absolute;right:12px;top:12px;border:0;background:none;font-size:20px;cursor:pointer}

  /* sticky book */
  .sticky-book{position:fixed;right:18px;bottom:120px;background:linear-gradient(90deg,var(--accent),var(--accent-dark));color:#fff;padding:12px 16px;border-radius:12px;font-weight:900;z-index:2400;box-shadow:0 20px 60px rgba(126,31,31,0.18);text-decoration:none}
  @media (max-width:980px){ .show-grid{grid-template-columns:1fr;}.sticky-book{display:none} .tile.big{height:420px} .tile.small{height:220px} }

  /* accessibility focus */
  .tile:focus{outline:3px solid rgba(212,162,74,0.25);outline-offset:4px;transform:translateY(-6px)}

  


 /*<!-- ===== STYLES FOR INSTRUCTORS (paste into your CSS) ===== -->*/

  .inst-grid{grid-template-columns:repeat(3,1fr)}
  @media (max-width:980px){ .inst-grid{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:640px){ .inst-grid{grid-template-columns:1fr} }

  .inst-filter{padding:8px 12px;border-radius:999px;border:1px solid rgba(34,40,42,0.06);background:#fff;font-weight:800;cursor:pointer}
  .inst-filter.active{background:linear-gradient(90deg,#7E1F1F,#5a1515);color:#fff;border-color:transparent;box-shadow:0 10px 30px rgba(126,31,31,0.12)}

  .inst-card{background:linear-gradient(180deg,#fff,#fbfbfb);border-radius:12px;overflow:hidden;box-shadow:0 12px 30px rgba(15,20,25,0.06);transition:transform .22s,box-shadow .22s}
  .inst-card:hover{transform:translateY(-8px);box-shadow:0 32px 80px rgba(15,20,25,0.12)}
  .inst-media{position:relative;height:360px;overflow:hidden;background:#eee}
  .inst-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}
  .inst-card:hover .inst-media img{transform:scale(1.06)}
  .quick-contact{position:absolute;right:12px;bottom:12px;background:linear-gradient(90deg,#7E1F1F,#5a1515);color:#fff;border:0;padding:8px 12px;border-radius:999px;font-weight:800;cursor:pointer;box-shadow:0 12px 36px rgba(126,31,31,0.14)}
  .inst-body{padding:14px;display:flex;flex-direction:column;gap:8px}
  .inst-body h3{margin:0;font-family:'Playfair Display',serif;font-size:18px;color:#1f2626}
  .inst-role{font-weight:700;color:rgba(34,40,42,0.75);font-size:13px}
  .inst-bio{color:rgba(34,40,42,0.8);font-size:14px;margin:0}
  .inst-actions{display:flex;gap:10px;margin-top:6px}
  .btn{padding:10px 12px;border-radius:8px;font-weight:800;cursor:pointer;border:0}
  .btn.primary{background:linear-gradient(90deg,#7E1F1F,#5a1515);color:#fff}
  .btn.ghost{background:transparent;border:1px solid rgba(34,40,42,0.06);color:var(--fg)}

  /* modal */
  .modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(6,8,10,0.6);z-index:2200;padding:20px}
  .modal.open{display:flex}
  .modal-panel{background:#fff;border-radius:12px;padding:20px;max-width:900px;width:100%;box-shadow:0 30px 80px rgba(15,20,25,0.3)}
  .modal-close{position:absolute;right:14px;top:12px;border:0;background:none;font-size:20px;cursor:pointer}
  .inst-profile{display:grid;grid-template-columns:360px 1fr;gap:18px}
  @media (max-width:760px){ .inst-profile{grid-template-columns:1fr; } .inst-media{height:300px} }





  .counter-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:30px;
  }
  @media(max-width:900px){
    .counter-grid{grid-template-columns:repeat(2,1fr);}
  }
  @media(max-width:600px){
    .counter-grid{grid-template-columns:1fr;}
  }

  .counter-card{
    background:rgba(255,255,255,0.7);
    backdrop-filter:blur(6px);
    border-radius:14px;
    padding:28px;
    text-align:center;
    box-shadow:0 12px 30px rgba(15,20,25,0.06);
    transition:transform .25s;
  }
  .counter-card:hover{
    transform:translateY(-6px);
  }
  .counter-num{
    font-family:'Playfair Display',serif;
    font-size:34px;
    color:#7E1F1F;
    font-weight:900;
    margin-bottom:6px;
  }
  .counter-label{
    font-weight:700;
    color:rgba(34,40,42,0.75);
  }
  .badge-row{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
    margin-top:20px;
  }
  .badge{
    padding:10px 16px;
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(34,40,42,0.08);
    font-weight:800;
    color:#1f2626;
    box-shadow:0 10px 25px rgba(0,0,0,0.05);
  }




/* Masonry gallery layout */
.gallery-grid{
  columns:3 300px;
  column-gap:15px;
}
.gallery-grid img{
  width:100%;
  margin-bottom:15px;
  border-radius:14px;
  display:block;
  transition:transform .35s, box-shadow .35s;
  cursor:pointer;
}
.gallery-grid img:hover{
  transform:scale(1.05);
  box-shadow:0 20px 40px rgba(0,0,0,0.18);
}

/* optional shapes */
.gallery-grid .tall{height:380px; object-fit:cover;}
.gallery-grid .wide{height:260px; object-fit:cover;}

@media(max-width:800px){
  .gallery-grid{columns:2 150px;}
}
@media(max-width:500px){
  .gallery-grid{columns:1;}
}

/* Lightbox */
.lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.85);
  display:none;
  justify-content:center;
  align-items:center;
  z-index:3000;
}
.lightbox img{
  max-width:90%;
  max-height:80%;
  border-radius:10px;
  box-shadow:0 20px 60px rgba(0,0,0,0.4);
}
.lightbox .close-btn{
  position:absolute; top:20px; right:30px;
  font-size:40px; color:#fff; cursor:pointer;
}
.nav-btn{
  position:absolute;
  top:50%; transform:translateY(-50%);
  color:#fff; font-size:50px;
  padding:10px 16px;
  cursor:pointer;
  user-select:none;
}
.prev{left:30px;}
.next{right:30px;}




.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
}
@media(max-width:800px){
  .contact-grid{grid-template-columns:1fr;}
}

.c-info{
  background:linear-gradient(180deg,#ffffff,#faf7f6);
  padding:24px;
  border-radius:14px;
  box-shadow:0 12px 30px rgba(15,20,25,0.06);
}
.c-line{
  margin:6px 0;
  color:rgba(34,40,42,0.8);
  font-weight:600;
}
.socials{
  display:flex;gap:10px;margin-top:14px;
}
.s-icon{
  background:#fff;
  padding:10px;
  border-radius:10px;
  font-size:18px;
  text-decoration:none;
  box-shadow:0 12px 30px rgba(15,20,25,0.08);
}

/* FORM DESIGN */
.c-form{
  background:#fff;
  padding:24px;
  border-radius:14px;
  box-shadow:0 12px 30px rgba(15,20,25,0.07);
  display:flex;
  flex-direction:column;
  gap:14px;
}
.c-form input,
.c-form textarea{
  width:100%;
  padding:12px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,0.1);
  font-size:15px;
  font-weight:600;
  color:#222;
  background:#fafafa;
}
.form-row{
  display:flex;gap:12px;
}
@media(max-width:600px){
  .form-row{flex-direction:column;}
}

.c-btn{
  background:linear-gradient(90deg,#7E1F1F,#5a1515);
  color:#fff;
  padding:12px;
  border-radius:10px;
  font-weight:800;
  cursor:pointer;
  border:0;
  font-size:16px;
}
.success-msg,
.error-msg{
  display:none;
  margin:0;
  font-weight:700;
}
.success-msg{color:green;}
.error-msg{color:#d22;}






.btn-loc{
  background:linear-gradient(90deg,#7E1F1F,#5a1515);
  color:#fff;
  padding:12px 20px;
  border-radius:10px;
  font-weight:800;
  text-decoration:none;
}
.btn-loc-outline{
  background:#fff;
  border:2px solid #7E1F1F;
  color:#7E1F1F;
  padding:12px 20px;
  border-radius:10px;
  font-weight:800;
  text-decoration:none;
}
@media(max-width:860px){
  #location .wrap{
    grid-template-columns:1fr;
  }
}




.cta-btn-main{
  background:#fff;
  color:#7E1F1F;
  padding:13px 24px;
  font-weight:900;
  border-radius:12px;
  text-decoration:none;
  font-size:16px;
  box-shadow:0 12px 30px rgba(0,0,0,0.25);
  transition:0.2s;
}
.cta-btn-main:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 40px rgba(0,0,0,0.35);
}
.cta-btn-light{
  background:transparent;
  border:2px solid #fff;
  color:#fff;
  padding:12px 22px;
  border-radius:12px;
  font-weight:900;
  text-decoration:none;
  font-size:16px;
  transition:0.2s;
}
.cta-btn-light:hover{
  background:#fff;
  color:#7E1F1F;
}



/* Responsive improvements for About page */
:root{
  --max-width:1100px;
  --pad-lg: 56px;
  --pad-md: 28px;
  --pad-sm: 18px;
}

/* container */
.container, .wrap { max-width: var(--max-width); margin:0 auto; padding:0 18px; }

/* fluid typography */
h1, h2, h3 { line-height:1.05; }
#about-hero h1 { font-size: clamp(28px, 4.5vw, 42px); }
#about-story h2 { font-size: clamp(20px, 3.2vw, 32px); }
.mvv-card h3 { font-size: clamp(16px, 2.2vw, 18px); }

/* story image responsive */
#about-story img{
  width:100%;
  height:auto;
  max-width:100%;
  display:block;
  border-radius:14px;
  object-fit:cover;
}

/* hero padding adjustments */
#about-hero{ padding: clamp(40px, 8vw, 90px) 12px; }

/* ensure story stacks on small screens */
@media (max-width:900px){
  #about-story > div { flex:1 1 100%; }
  #about-story { padding: var(--pad-md) 12px; }
  .mvv-grid { grid-template-columns: repeat(2,1fr); gap:14px; }
}

/* small screens: single column */
@media (max-width:640px){
  .mvv-grid { grid-template-columns: 1fr; }
  .mvv-card { padding:16px; }
  .footer-inner { padding:16px; }
  .inst-media { height:220px; }
  #about-hero p { font-size: 15px; }
}

/* images in cards */
.mvv-card img, .inst-media img { width:100%; height: auto; object-fit:cover; }

/* accessible focus */
.mvv-card:focus, .inst-card:focus, .btn:focus { outline: 3px solid rgba(212,162,74,0.18); outline-offset:4px; }

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







/*<!-- ======= Styles for Admission Section ======= -->*/
.admission-section{
  padding:60px 16px;
  background:linear-gradient(180deg,#fcf9f8,#ffffff);
  font-family:'Poppins',sans-serif;
  color:#1a1a1a;
}
.admission-wrap{max-width:1200px;margin:0 auto}
.admission-header{text-align:center;margin-bottom:28px}
.admission-header h2{
  font-family:'Playfair Display',serif;
  font-size:36px;color:#6e1b1b;margin-bottom:8px;
}
.admission-header .dot{color:#d49b5a;margin-left:8px}
.admission-header .subtitle{
  max-width:850px;margin:0 auto;color:#444;
  font-weight:600;font-size:15px;line-height:1.6;
}

/* grid */
.admission-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;margin-top:20px;
}

/* cards */
.admission-card{
  background:#fff;
  border-radius:14px;
  padding:20px;
  border:1px solid rgba(110,27,27,0.08);
  box-shadow:0 10px 24px rgba(20,18,18,0.05);
  transition:.2s;
}
.admission-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 32px rgba(20,18,18,0.08);
}
.admission-card h3{
  font-family:'Playfair Display',serif;
  color:#6e1b1b;
  margin-bottom:10px;
  font-size:22px;
}
.point-list{
  list-style:none;margin:0;padding:0;
}
.point-list li{
  margin:8px 0;
  font-size:14px;
  font-weight:600;
  color:#444;
  display:flex;
  gap:8px;
}
.point-list li::before{
  content:"•";
  color:#d49b5a;
  font-weight:900;
}

/* buttons */
.admission-actions{
  display:flex;
  justify-content:center;
  gap:12px;
  margin:26px 0 10px;
}
.btn-primary{
  background:#7e1f1f;color:#fff;
  padding:12px 18px;border-radius:10px;
  font-weight:800;text-decoration:none;
}
.btn-secondary{
  border:1px solid #7e1f1f;color:#7e1f1f;
  padding:12px 18px;border-radius:10px;
  font-weight:700;text-decoration:none;
  background:transparent;
}

/* note */
.admission-note{
  max-width:850px;margin:0 auto;text-align:center;
  color:#444;font-size:14px;font-weight:600;
}

/* responsive */
@media(max-width:1100px){ .admission-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:640px){
  .admission-grid{grid-template-columns:1fr;}
  .admission-header h2{font-size:26px;}
  .admission-actions{flex-direction:column;padding:0 30px;}
  .btn-primary,.btn-secondary{width:100%;text-align:center;}
}



/*!-- ========= STYLES ========= -->*/

.fee-section{
  padding:60px 16px;
  background:linear-gradient(180deg,#fdf7f6,#ffffff);
  font-family:'Poppins',sans-serif;
  color:#1a1a1a;
}
.fee-wrap{max-width:1200px;margin:0 auto;text-align:center}

.fee-header h2{
  font-family:'Playfair Display',serif;
  font-size:38px;
  color:#6e1b1b;
  margin-bottom:10px;
}
.fee-header .dot{color:#d49b5a;margin-left:6px}
.subtitle{
  font-size:15px;
  font-weight:600;
  color:#444;
  line-height:1.5;
}
.location{
  margin-top:4px;
  font-weight:700;
  color:#7e1f1f;
}

/* Grid */
.fee-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  margin-top:30px;
}

/* Card */
.fee-card{
  background:#fff;
  padding:22px;
  border-radius:14px;
  border:1px solid rgba(110,27,27,0.08);
  box-shadow:0 10px 24px rgba(20,18,18,0.04);
  transition:.22s;
}
.fee-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 32px rgba(20,18,18,0.08);
}

.fee-card h3{
  font-family:'Playfair Display',serif;
  color:#6e1b1b;
  font-size:20px;
  margin-bottom:8px;
}
.fee-amount{
  font-size:24px;
  font-weight:800;
  color:#7e1f1f;
}
.fee-amount-big{
  font-size:28px;
  font-weight:900;
  color:#7e1f1f;
}
.classes-per-month{
  font-size:14px;
  margin-bottom:8px;
  font-weight:700;
  color:#7e1f1f;
}
.note{
  margin-top:8px;
  font-size:13px;
  color:#666;
}

/* Highlight card */
.highlight{
  border:1px solid rgba(212,155,90,0.2);
  background:linear-gradient(180deg,#fffdfc,#ffffff);
}

/* CTA buttons */
.fee-cta{
  display:flex;
  gap:12px;
  justify-content:center;
  margin-top:24px;
}
.primary{
  background:#7e1f1f;
  color:#fff;
  padding:12px 18px;
  border-radius:10px;
  font-weight:800;
  text-decoration:none;
}
.secondary{
  border:1px solid #7e1f1f;
  color:#7e1f1f;
  padding:12px 18px;
  border-radius:10px;
  font-weight:700;
  text-decoration:none;
  background:transparent;
}

/* Responsive */
@media(max-width:1100px){
  .fee-grid{grid-template-columns:repeat(2,1fr);}
  .fee-header h2{font-size:32px;}
}
@media(max-width:640px){
  .fee-grid{grid-template-columns:1fr;}
  .fee-header h2{font-size:26px;}
  .fee-cta{flex-direction:column;padding:0 30px;}
  .primary,.secondary{text-align:center;width:100%;}
}





/*<!-- ======= Styles for Class Levels (paste in your CSS) ======= -->*/

.class-levels-en{
  padding:56px 16px;
  background:linear-gradient(180deg,#fff,#fcf9f8);
  font-family:'Poppins',sans-serif;
  color:#1a1a1a;
}
.levels-wrap{max-width:1200px;margin:0 auto}
.levels-header{text-align:center;margin-bottom:18px}
.levels-header h2{font-family:'Playfair Display',serif;font-size:34px;color:#6e1b1b;margin:0 0 6px}
.levels-header .dot{color:#d49b5a;margin-left:8px}
.levels-header .subtitle{max-width:900px;margin:0 auto;color:#444;font-weight:600;line-height:1.55;font-size:15px}

/* grid */
.levels-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:18px;align-items:stretch}

/* card */
.level-card{
  background:#fff;border-radius:14px;padding:18px;border:1px solid rgba(110,27,27,0.06);
  box-shadow:0 10px 24px rgba(30,20,20,0.04);display:flex;flex-direction:column;justify-content:space-between;
  transition:transform .18s,box-shadow .18s;
}
.level-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(30,20,20,0.08)}
.level-card.highlight{border:1px solid rgba(212,155,90,0.12);background:linear-gradient(180deg,#fffdfc,#fff)}

/* top row */
.level-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.level-badge{background:#f7ecec;color:#7e1f1f;padding:6px 10px;border-radius:999px;font-weight:800;font-size:13px}
.level-duration{font-weight:700;color:#6e1b1b;font-size:13px}

/* content */
.level-card h3{font-family:'Playfair Display',serif;color:#6e1b1b;margin:6px 0;font-size:20px}
.level-desc{color:#444;font-weight:600;margin:0 0 10px;line-height:1.45}
.level-list{list-style:none;padding:0;margin:0 0 12px;color:#333;font-weight:600}
.level-list li{margin:8px 0;font-size:14px}

/* actions */
.level-actions{display:flex;gap:10px;margin-top:auto}
.btn-primary{background:#7e1f1f;color:#fff;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:800}
.btn-ghost{border:1px solid #7e1f1f;color:#7e1f1f;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:700;background:transparent}

/* note */
.levels-note{max-width:900px;margin:18px auto 0;color:#444;font-size:14px;font-weight:600;text-align:center;padding:0 12px}

/* Responsive */
@media (max-width:1100px){ .levels-grid{grid-template-columns:repeat(2,1fr)} .levels-header h2{font-size:30px} }
@media (max-width:640px){
  .levels-grid{grid-template-columns:1fr}
  .level-actions{flex-direction:column}
  .btn-primary,.btn-ghost{width:100%;text-align:center}
  .levels-wrap{padding:0 14px}
}




/* Grid responsive */
.instructors-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}
@media (max-width:1000px){
  .instructors-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:620px){
  .instructors-grid{grid-template-columns:1fr}
}

/* Card */
.inst-card{
  background:linear-gradient(180deg,#fff,#fbfbfb);
  border-radius:12px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  box-shadow:0 12px 30px rgba(15,20,25,0.06);
  transition:transform .22s, box-shadow .22s;
  outline: none;
}
.inst-card:focus{box-shadow:0 22px 60px rgba(126,31,31,0.12);transform:translateY(-6px)}

.inst-media{position:relative;height:260px;overflow:hidden;background:#eee}
.inst-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}
.inst-card:hover .inst-media img{transform:scale(1.06)}

.quick-contact{
  position:absolute;right:12px;bottom:12px;background:linear-gradient(90deg,#7E1F1F,#5a1515);color:#fff;border:0;padding:9px 12px;border-radius:999px;font-weight:800;cursor:pointer;
  box-shadow:0 12px 36px rgba(126,31,31,0.14);
}

/* Body */
.inst-body{padding:14px;display:flex;flex-direction:column;gap:8px;flex:1}
.inst-body h3{margin:0;font-family:'Playfair Display',serif;font-size:18px;color:#1f2626}
.inst-role{font-weight:800;color:rgba(34,40,42,0.72);font-size:13px}
.inst-bio{color:rgba(34,40,42,0.85);margin:0;font-size:14px;line-height:1.45}

/* Actions */
.inst-actions{display:flex;gap:10px;margin-top:auto}
.btn{padding:10px 12px;border-radius:8px;font-weight:800;cursor:pointer;border:0;text-decoration:none}
.btn.primary{background:linear-gradient(90deg,#7E1F1F,#5a1515);color:#fff;display:inline-flex;align-items:center;justify-content:center}
.btn.ghost{background:transparent;border:1px solid rgba(34,40,42,0.06);color:var(--fg);padding:9px 12px}

/* Modal */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(6,8,10,0.6);z-index:2200;padding:20px}
.modal.open{display:flex}
.modal-panel{background:#fff;border-radius:12px;padding:18px;max-width:900px;width:100%;box-shadow:0 30px 80px rgba(15,20,25,0.3);position:relative}
.modal-close{position:absolute;right:12px;top:10px;border:0;background:none;font-size:20px;cursor:pointer}
.modal-inner img{width:100%;max-width:320px;height:auto;border-radius:10px;margin-bottom:12px}

/* small screens tweak */
@media (max-width:480px){
  .inst-media{height:220px}
  .inst-body h3{font-size:16px}
  .inst-bio{font-size:13px}
}




.learn-en{
  background:linear-gradient(180deg,#fdf7f6,#ffffff);
  padding:48px 16px;
  font-family:'Poppins',sans-serif;
  color:#1a1a1a;
}
.learn-wrap{max-width:1200px;margin:0 auto;}
.learn-header{text-align:center;margin-bottom:28px}
.learn-header h2{
  font-family:'Playfair Display',serif;
  font-size:40px;
  color:#6e1b1b;
  margin:0 0 8px;
}
.learn-header .dot{color:#d49b5a;font-weight:800;margin-left:8px}
.subtitle{
  max-width:900px;margin:0 auto;
  font-size:16px;color:#444;font-weight:600;line-height:1.65;
}

.cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:22px;
}
.card{
  background:#fff;
  border-radius:14px;
  padding:18px;
  border:1px solid rgba(110,27,27,0.06);
  box-shadow:0 8px 22px rgba(30,20,20,0.04);
  transition:.22s;
}
.card:hover{
  transform:translateY(-6px);
  box-shadow:0 14px 32px rgba(30,20,20,0.08);
}
.card .icon{
  width:56px;height:56px;border-radius:10px;
  background:linear-gradient(180deg,#7e1f1f10,#fff);
  display:flex;align-items:center;justify-content:center;
  color:#7e1f1f;margin-bottom:14px;
}
.card h3{
  font-size:18px;color:#6e1b1b;margin-bottom:8px;
  font-family:'Playfair Display',serif;font-weight:800;
}
.card p{color:#444;font-weight:600;font-size:14px;line-height:1.45}

.learn-actions{
  display:flex;gap:12px;justify-content:center;margin-top:22px
}
.primary{
  background:#7e1f1f;color:#fff;padding:12px 18px;
  border-radius:10px;font-weight:800;text-decoration:none;
}
.secondary{
  border:1px solid #7e1f1f;color:#7e1f1f;
  padding:12px 18px;border-radius:10px;font-weight:700;
  text-decoration:none;background:transparent;
}

/* Responsive */
@media (max-width:1100px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .learn-header h2{font-size:34px}
}
@media (max-width:600px){
  .cards{grid-template-columns:1fr}
  .learn-header h2{font-size:26px}
  .subtitle{padding:0 12px;font-size:15px}
  .learn-actions{flex-direction:column;padding:0 40px}
  .primary,.secondary{text-align:center;width:100%}
}





  /* Footer layout */
  #site-footer{font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;}
  .footer-inner{
    max-width:1200px;
    margin:28px auto 18px;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:22px;
    padding:22px;
  }

  .footer-col h4{color:#fff;margin:0 0 10px;font-size:15px}
  .footer-col p.muted{color:#cfcfcf}
  .footer-col .muted{color:#cfcfcf;font-weight:600;line-height:1.6}

  .footer-col ul{list-style:none;padding:0;margin:0}
  .footer-col ul li{margin:8px 0;color:#cfcfcf;font-weight:700}
  .footer-col ul li a{color:#dcdcdc;text-decoration:none}
  .footer-col ul li a:hover{color:#fff;text-decoration:underline}

  .social-row{display:flex;gap:10px;margin:6px 0 12px}
  .soc{
    display:inline-flex;align-items:center;justify-content:center;
    width:42px;height:42px;border-radius:10px;background:#111;
    color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,0.03);
    transition:transform .18s, background .18s;
  }
  .soc:hover{transform:translateY(-4px);background:#7E1F1F;color:#fff}

  .badge-line{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
  .badge{background:#111;padding:6px 10px;border-radius:999px;font-weight:800;color:#ddd;border:1px solid rgba(255,255,255,0.03)}

  .footer-bottom{
    max-width:1200px;margin:0 auto 28px;padding:12px 22px;
    display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid rgba(255,255,255,0.04);
  }
  .footer-bottom .copy{color:#bdbdbd;font-weight:600}
  .footer-bottom .credit{color:#d4a24a;font-weight:800}
  .footer-bottom .credit a{color:#d4a24a;text-decoration:none}
  .footer-bottom .credit a:hover{text-decoration:underline}

  /* Responsive: collapse to 2 cols, then 1 col */
  @media (max-width:980px){
    .footer-inner{grid-template-columns:repeat(2,1fr);padding:18px}
    .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px}
  }
  @media (max-width:560px){
    .footer-inner{grid-template-columns:1fr;padding:14px;row-gap:18px}
    .footer-bottom{align-items:center;text-align:center}
    .footer-bottom .copy, .footer-bottom .credit{width:100%}
  }

  /* small tweaks */
  .brand img{max-width:160px;height:auto}
  a{color:inherit}
  @media (max-width:1000px){ .instructor-grid{grid-template-columns:repeat(2,1fr)!important;} }
  @media (max-width:640px){ .instructor-grid{grid-template-columns:1fr!important;} }
  .instructor-card:hover{transform:translateY(-6px);transition:0.18s;}



  /*<!-- ================= STYLES FOR ADDED SECTIONS ================= -->*/

/* Features grid */
.features-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:20px;
}
@media(max-width:980px){ .features-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .features-grid{grid-template-columns:1fr} }

.feature{
  background:linear-gradient(180deg,#fff,#fcfbfa);
  padding:18px;border-radius:12px;box-shadow:0 12px 32px rgba(15,20,25,0.06);
  display:flex;flex-direction:column;gap:8px;align-items:flex-start;transition:transform .22s;
}
.feature:hover, .feature:focus{transform:translateY(-6px)}
.f-icon{width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg, rgba(212,162,74,0.06), rgba(212,162,74,0.02));border:1px solid rgba(212,162,74,0.06);font-size:22px}

/* timeline */
.timeline{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:12px}
.timeline li{background:#fff;padding:16px;border-radius:10px;box-shadow:0 10px 30px rgba(15,20,25,0.04);font-weight:700;color:rgba(34,40,42,0.88)}
.timeline li strong{color:#7E1F1F;margin-right:10px}

/* studio strip */
.studio-strip{display:flex;gap:10px;overflow:hidden}
.studio-strip img{width:calc(33.333% - 6.66px);height:140px;object-fit:cover;border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,0.08)}
@media(max-width:760px){
  .studio-strip img{width:48%;height:130px}
}
@media(max-width:420px){
  .studio-strip img{width:100%;height:180px}
}

/* modal (founder) */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,0.6);z-index:3000;padding:20px}
.modal.open{display:flex}
.modal-panel{background:#fff;border-radius:12px;padding:18px;max-width:920px;width:100%;box-shadow:0 30px 80px rgba(15,20,25,0.3);position:relative}
.modal-close{position:absolute;right:12px;top:10px;border:0;background:none;font-size:20px;cursor:pointer}

/* buttons used here */
.btn{padding:10px 14px;border-radius:10px;font-weight:900;cursor:pointer}
.btn.primary{background:linear-gradient(90deg,#7E1F1F,#5a1515);color:#fff;border:0}
.btn.ghost{background:transparent;border:2px solid rgba(34,40,42,0.08);color:rgba(34,40,42,0.9)}

/* accessibility focus */
.feature:focus, .btn:focus{outline:3px solid rgba(212,162,74,0.12);outline-offset:4px}




/*<!-- ===== Styles (move to style.css) ===== -->*/

  .gallery-filter{padding:8px 12px;border-radius:999px;border:1px solid rgba(0,0,0,0.06);background:#fff;cursor:pointer;font-weight:700;color:var(--maroon,#7E1F1F)}
  .gallery-filter.active{background:var(--maroon,#7E1F1F);color:#fff;border-color:transparent}

  .gallery-grid .tile{position:relative;overflow:hidden;border-radius:10px;background:#fff;cursor:pointer;display:flex;flex-direction:column}
  .gallery-grid img{width:100%;height:220px;object-fit:cover;display:block;transition:transform .28s}
  .gallery-grid .tile:focus, .gallery-grid .tile:hover img{transform:scale(1.03)}
  .gallery-grid figcaption{padding:10px;background:#fff;border-top:1px solid rgba(0,0,0,0.03)}
  .gallery-grid .tag{font-size:12px;color:var(--maroon);font-weight:800}
  .gallery-grid .title{font-weight:800;color:#222;margin-top:6px}

  .video-thumb{position:relative}
  .video-thumb .play{position:absolute;left:12px;bottom:12px;background:rgba(0,0,0,0.55);color:#fff;padding:8px 12px;border-radius:8px;font-weight:800}

  /* Lightbox content sizing */
  #glbContent img{max-width:100%;max-height:68vh;object-fit:contain;display:block;margin:0 auto}
  #glbContent iframe, #glbContent video{width:100%;height:68vh;border:0;border-radius:6px;background:#000}

  /* responsive tweaks */
  @media (max-width:720px){
    .gallery-grid img{height:160px}
    #glbContent iframe, #glbContent video{height:50vh}
  }