/* ==========================================================================
   ANUPAM BIHAR RESORT & RESTAURANT
   base.css — Design tokens, reset, app shell, shared components
   Region cue: Mithila (Samastipur, Bihar) — gold line-art, arch frames,
   marigold + mango-orchard palette. Two themes: .t-royal / .t-modern
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  /* Neutrals shared by both designs */
  --white:#ffffff;
  --ink:#0A1017;
  --ink-70:rgba(10,16,23,.70);
  --ink-55:rgba(10,16,23,.55);
  --ink-40:rgba(10,16,23,.40);
  --grey-100:#F4F5F7;
  --grey-200:#E7E9EE;
  --grey-300:#D3D7E0;

  /* Type */
  --f-display:'Playfair Display', Georgia, serif;
  --f-body:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-ui:'Montserrat', system-ui, sans-serif;
  --f-alt:'Poppins', system-ui, sans-serif;

  --t-xs:clamp(.70rem,.68rem + .1vw,.76rem);
  --t-sm:clamp(.82rem,.80rem + .15vw,.90rem);
  --t-base:clamp(.95rem,.92rem + .18vw,1.04rem);
  --t-lg:clamp(1.08rem,1.02rem + .3vw,1.25rem);
  --t-xl:clamp(1.35rem,1.2rem + .7vw,1.75rem);
  --t-2xl:clamp(1.7rem,1.4rem + 1.4vw,2.6rem);
  --t-3xl:clamp(2.1rem,1.6rem + 2.4vw,3.6rem);
  --t-4xl:clamp(2.6rem,1.7rem + 4vw,5rem);

  /* Space + shape */
  --sp-section:clamp(3.5rem,2rem + 6vw,7rem);
  --gutter:clamp(1rem,.6rem + 1.6vw,2rem);
  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px; --r-pill:999px;

  --shadow-s:0 2px 10px rgba(10,16,23,.06);
  --shadow-m:0 14px 34px -14px rgba(10,16,23,.22);
  --shadow-l:0 30px 70px -28px rgba(10,16,23,.38);

  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:.45s;

  --header-h:74px;
  --appbar-h:66px;

  /* Defaults overridden per theme */
  --bg:#ffffff;
  --surface:#ffffff;
  --brand-900:#08183A;
  --brand-700:#0E2A5C;
  --brand-500:#1A46A0;
  --accent-500:#C8A227;
  --accent-300:#E7CC7A;
  --soft:#FBF6EA;
  --hairline:rgba(200,162,39,.34);
  --on-brand:#ffffff;
}

/* Theme A — Mithila Royal (indigo + gold + cream) */
.t-royal{
  --bg:#FBF6EA;
  --surface:#ffffff;
  --brand-900:#071633;
  --brand-700:#0E2A5C;
  --brand-500:#1A46A0;
  --accent-500:#C8A227;
  --accent-300:#E7CC7A;
  --soft:#FBF6EA;
  --soft-2:#F3EAD6;
  --hairline:rgba(200,162,39,.36);
  --heading-font:var(--f-display);
  --ui-font:var(--f-ui);
}

/* Theme B — Bagicha Modern (emerald + marigold + sand) */
.t-modern{
  --bg:#F6F2E9;
  --surface:#ffffff;
  --brand-900:#06251B;
  --brand-700:#0C4433;
  --brand-500:#12805C;
  --accent-500:#F2A03D;
  --accent-300:#FFD08A;
  --soft:#F6F2E9;
  --soft-2:#EAF2EC;
  --sky:#8FD3E8;
  --hairline:rgba(12,68,51,.14);
  --heading-font:var(--f-alt);
  --ui-font:var(--f-alt);
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 12px)}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--f-body); font-size:var(--t-base); line-height:1.68;
  overflow-x:hidden; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg,video{max-width:100%; display:block; height:auto}
img{background:var(--soft-2,var(--grey-100)); color:transparent}
a{color:inherit; text-decoration:none}
button,input,select,textarea{font:inherit; color:inherit}
button{cursor:pointer; border:0; background:none}
h1,h2,h3,h4,h5{margin:0 0 .5em; font-family:var(--heading-font,var(--f-display)); line-height:1.15; font-weight:700; letter-spacing:-.01em}
p{margin:0 0 1em}
ul{margin:0; padding:0; list-style:none}
:focus-visible{outline:3px solid var(--accent-500); outline-offset:3px; border-radius:4px}
::selection{background:var(--accent-500); color:var(--brand-900)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
}

/* ---------- 3. Layout helpers ---------- */
.wrap{width:min(1240px,100% - (var(--gutter) * 2)); margin-inline:auto}
.wrap-tight{width:min(940px,100% - (var(--gutter) * 2)); margin-inline:auto}
.section{padding-block:var(--sp-section); position:relative}
.section--soft{background:var(--soft)}
.section--tint{background:var(--soft-2,var(--soft))}
.section--dark{background:var(--brand-900); color:#fff}
.section--dark h2,.section--dark h3{color:#fff}
.grid{display:grid; gap:clamp(1rem,.6rem + 1.2vw,1.75rem)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:991px){ .g-3,.g-4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .g-2,.g-3,.g-4{grid-template-columns:1fr} }
.center{text-align:center}
.stack-sm > * + *{margin-top:.5rem}

/* ---------- 4. Section heading ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--ui-font,var(--f-ui)); font-size:var(--t-xs); font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--accent-500); margin-bottom:.9rem;
}
.eyebrow::before{content:""; width:26px; height:1px; background:var(--accent-500)}
.center .eyebrow::after{content:""; width:26px; height:1px; background:var(--accent-500)}
.sec-title{font-size:var(--t-2xl); color:var(--brand-900); margin-bottom:.6rem}
.section--dark .sec-title{color:#fff}
.sec-lede{max-width:62ch; color:var(--ink-70); font-size:var(--t-lg)}
.center .sec-lede{margin-inline:auto}
.section--dark .sec-lede{color:rgba(255,255,255,.76)}
.sec-head{margin-bottom:clamp(2rem,1.2rem + 2vw,3.2rem)}

/* ---------- 5. Buttons ---------- */
.btn{
  --btn-bg:var(--brand-700); --btn-fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:.9rem 1.6rem; min-height:50px; border-radius:var(--r-pill);
  background:var(--btn-bg); color:var(--btn-fg);
  font-family:var(--ui-font,var(--f-ui)); font-weight:600; font-size:var(--t-sm); letter-spacing:.02em;
  position:relative; overflow:hidden; isolation:isolate;
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background .3s;
  box-shadow:0 10px 24px -12px rgba(10,16,23,.5);
}
.btn:hover{transform:translateY(-3px); box-shadow:0 18px 34px -14px rgba(10,16,23,.55)}
.btn:active{transform:translateY(-1px)}
.btn i{font-size:1em}
.btn--gold{--btn-bg:linear-gradient(120deg,var(--accent-500),var(--accent-300)); --btn-fg:var(--brand-900)}
.btn--accent{--btn-bg:var(--accent-500); --btn-fg:var(--brand-900)}
.btn--ghost{--btn-bg:transparent; --btn-fg:currentColor; box-shadow:none; border:1.5px solid currentColor; opacity:.9}
.btn--ghost:hover{background:color-mix(in srgb, currentColor 12%, transparent); box-shadow:none; opacity:1}
.btn--ghost::after{display:none}
.btn--light{--btn-bg:#fff; --btn-fg:var(--brand-900)}
.btn--sm{min-height:42px; padding:.6rem 1.15rem; font-size:var(--t-xs)}
.btn--block{width:100%}
/* ripple */
.btn::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at var(--rx,50%) var(--ry,50%), rgba(255,255,255,.45), transparent 60%); opacity:0; transition:opacity .5s; z-index:-1}
.btn:hover::after{opacity:1}

.link-arrow{display:inline-flex; align-items:center; gap:.5rem; font-family:var(--ui-font); font-weight:600; font-size:var(--t-sm); color:var(--brand-500)}
.link-arrow i{transition:transform .3s var(--ease)}
.link-arrow:hover i{transform:translateX(5px)}

/* ---------- 6. Loader ---------- */
.loader{
  position:fixed; inset:0; z-index:9999; display:grid; place-items:center;
  background:var(--brand-900); transition:opacity .6s var(--ease), visibility .6s;
}
.loader.is-done{opacity:0; visibility:hidden}
.loader__mark{width:120px; height:120px}
.loader__mark path,.loader__mark circle,.loader__mark line{
  stroke:var(--accent-500); fill:none; stroke-width:2; stroke-linecap:round;
  stroke-dasharray:400; stroke-dashoffset:400; animation:draw 2.2s var(--ease) infinite;
}
@keyframes draw{0%{stroke-dashoffset:400}45%{stroke-dashoffset:0}75%{stroke-dashoffset:0; opacity:1}100%{stroke-dashoffset:-400; opacity:.2}}
.loader__name{
  margin-top:1.2rem; text-align:center; color:var(--accent-300);
  font-family:var(--f-ui); font-size:.72rem; letter-spacing:.4em; text-transform:uppercase;
}

/* ---------- 7. Header / navigation ---------- */
.topbar{
  background:var(--brand-900); color:rgba(255,255,255,.82);
  font-size:var(--t-xs); font-family:var(--f-ui);
}
.topbar__in{display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:40px; flex-wrap:wrap}
.topbar a:hover{color:var(--accent-300)}
.topbar__list{display:flex; gap:1.4rem; flex-wrap:wrap}
.topbar__list li{display:flex; align-items:center; gap:.45rem}
.topbar__list i{color:var(--accent-500)}
.topbar__social{display:flex; gap:.9rem}
@media (max-width:767px){ .topbar{display:none} }

.site-head{
  position:sticky; top:0; z-index:900; background:var(--surface);
  border-bottom:1px solid var(--hairline);
  transition:box-shadow .3s, background .3s, transform .4s var(--ease);
}
.site-head.is-stuck{box-shadow:var(--shadow-m)}
.site-head__in{display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:var(--header-h)}

.brand{display:flex; align-items:center; gap:.7rem; flex-shrink:0}
.brand__mark{
  width:44px; height:44px; border-radius:50%; display:grid; place-items:center; flex-shrink:0;
  background:linear-gradient(140deg,var(--brand-700),var(--brand-900));
  border:1.5px solid var(--accent-500);
}
.brand__mark svg{width:26px; height:26px}
.brand__name{font-family:var(--heading-font); font-weight:700; font-size:1.06rem; color:var(--brand-900); line-height:1.1}
.brand__sub{display:block; font-family:var(--f-ui); font-size:.56rem; letter-spacing:.26em; text-transform:uppercase; color:var(--accent-500); font-weight:700}

.nav{display:flex; align-items:center; gap:.25rem}
.nav a{
  padding:.55rem .8rem; border-radius:var(--r-pill); font-family:var(--ui-font); font-weight:600;
  font-size:.85rem; color:var(--ink-70); transition:color .25s, background .25s; position:relative;
}
.nav a:hover,.nav a.is-active{color:var(--brand-900)}
.nav a.is-active::after{
  content:""; position:absolute; left:50%; bottom:2px; transform:translateX(-50%);
  width:16px; height:2px; border-radius:2px; background:var(--accent-500);
}
.head-actions{display:flex; align-items:center; gap:.6rem}
@media (max-width:1350px){ .nav a{padding:.55rem .55rem; font-size:.8rem} }
@media (max-width:1220px){ .nav{display:none} }

/* design switcher pill */
.switcher{position:relative}
.switcher__btn{
  display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .9rem; border-radius:var(--r-pill);
  border:1.5px dashed var(--accent-500); color:var(--brand-900);
  font-family:var(--f-ui); font-weight:700; font-size:.72rem; letter-spacing:.04em;
}
.switcher__btn i:last-child{transition:transform .3s}
.switcher.is-open .switcher__btn i:last-child{transform:rotate(180deg)}
.switcher__menu{
  position:absolute; right:0; top:calc(100% + 10px); width:270px; padding:.5rem;
  background:var(--surface); border:1px solid var(--hairline); border-radius:var(--r-md);
  box-shadow:var(--shadow-l); display:grid; gap:.25rem; z-index:60;
  opacity:0; visibility:hidden; transform:translateY(-8px); transition:all .3s var(--ease);
}
.switcher.is-open .switcher__menu{opacity:1; visibility:visible; transform:none}
.switcher__item{display:flex; gap:.75rem; align-items:flex-start; padding:.7rem; border-radius:var(--r-sm); transition:background .2s}
.switcher__item:hover{background:var(--soft)}
.switcher__item strong{display:block; font-family:var(--f-ui); font-size:.82rem; color:var(--brand-900)}
.switcher__item span{font-size:.72rem; color:var(--ink-55); line-height:1.5}
.switcher__swatch{width:34px; height:34px; border-radius:9px; flex-shrink:0; border:1px solid rgba(0,0,0,.08)}
.sw-royal{background:linear-gradient(135deg,#0E2A5C 50%,#C8A227 50%)}
.sw-modern{background:linear-gradient(135deg,#0C4433 50%,#F2A03D 50%)}
.switcher__item.is-current{background:var(--soft); box-shadow:inset 0 0 0 1.5px var(--accent-500)}

/* burger */
.burger{
  width:46px; height:46px; border-radius:14px; display:none; place-items:center;
  background:var(--brand-900); color:#fff;
}
@media (max-width:1220px){ .burger{display:grid} }
.burger span{display:block; width:20px; height:2px; background:currentColor; border-radius:2px; transition:transform .35s var(--ease), opacity .2s}
.burger span + span{margin-top:5px}
.burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0}
.burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* mobile sheet */
.sheet{
  position:fixed; inset:0; z-index:950; background:var(--brand-900); color:#fff;
  padding:calc(env(safe-area-inset-top) + 1.2rem) var(--gutter) 2rem;
  overflow-y:auto; transform:translateY(-100%); transition:transform .55s var(--ease); visibility:hidden;
}
.sheet.is-open{transform:none; visibility:visible}
.sheet__top{display:flex; align-items:center; justify-content:space-between; margin-bottom:2rem}
.sheet__close{width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.1); color:#fff; font-size:1.1rem}
.sheet__nav{display:grid; gap:.2rem; margin-bottom:2rem}
.sheet__nav a{
  display:flex; align-items:center; justify-content:space-between; padding:.95rem .2rem;
  border-bottom:1px solid rgba(255,255,255,.1);
  font-family:var(--heading-font); font-size:1.35rem; color:#fff;
}
.sheet__nav a i{color:var(--accent-500); font-size:.85rem}
.sheet__nav a:hover{padding-left:.7rem; color:var(--accent-300)}
.sheet__grid{display:grid; grid-template-columns:1fr 1fr; gap:.7rem; margin-bottom:1.6rem}
.sheet__meta{color:rgba(255,255,255,.7); font-size:var(--t-sm)}
.sheet__meta strong{display:block; color:var(--accent-300); font-family:var(--f-ui); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; margin-bottom:.3rem}

/* ---------- 8. Mobile app bar (bottom) ---------- */
.appbar{
  position:fixed; left:0; right:0; bottom:0; z-index:920; display:none;
  background:var(--surface);
  background:color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-top:1px solid var(--hairline);
  padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -10px 30px -18px rgba(10,16,23,.5);
}
.appbar__in{display:grid; grid-template-columns:repeat(5,1fr); align-items:end; min-height:var(--appbar-h)}
.appbar a{
  display:grid; justify-items:center; gap:3px; padding:.55rem .2rem;
  font-family:var(--f-ui); font-size:.6rem; font-weight:600; letter-spacing:.04em;
  color:var(--ink-55); text-transform:uppercase;
}
.appbar a i{font-size:1.05rem}
.appbar a.is-active{color:var(--brand-700)}
.appbar a.is-active i{color:var(--accent-500)}
.appbar__cta{position:relative}
.appbar__cta i{
  width:52px; height:52px; border-radius:50%; display:grid; place-items:center;
  background:linear-gradient(140deg,var(--brand-700),var(--brand-900)); color:var(--accent-300);
  box-shadow:0 12px 24px -10px var(--brand-700); transform:translateY(-16px); font-size:1.15rem !important;
  border:2px solid var(--surface);
}
.appbar__cta span{transform:translateY(-14px)}
@media (max-width:991px){
  .appbar{display:block}
  body{padding-bottom:calc(var(--appbar-h) + env(safe-area-inset-bottom))}
}

/* ---------- 9. Floating action rail ---------- */
.frail{position:fixed; right:14px; bottom:calc(var(--appbar-h) + 18px + env(safe-area-inset-bottom)); z-index:880; display:grid; gap:.55rem}
@media (min-width:992px){ .frail{bottom:24px; right:24px} }
.frail a,.frail button{
  width:46px; height:46px; border-radius:50%; display:grid; place-items:center; color:#fff;
  box-shadow:var(--shadow-m); transition:transform .3s var(--ease); font-size:1.05rem;
}
.frail a:hover,.frail button:hover{transform:scale(1.1)}
.f-wa{background:#25D366}
.f-call{background:var(--brand-700)}
.f-map{background:var(--accent-500); color:var(--brand-900)}
.f-top{background:var(--ink); opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s, transform .3s}
.f-top.is-on{opacity:1; visibility:visible}

/* ---------- 10. Cards (shared) ---------- */
.card{
  background:var(--surface); border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-s); border:1px solid var(--hairline);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  display:flex; flex-direction:column; height:100%;
}
.card:hover{transform:translateY(-8px); box-shadow:var(--shadow-l)}
.card__media{position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--grey-100)}
.card__media img{width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease)}
.card:hover .card__media img{transform:scale(1.07)}
.card__tag{
  position:absolute; top:14px; left:14px; padding:.35rem .8rem; border-radius:var(--r-pill);
  background:var(--accent-500); color:var(--brand-900);
  font-family:var(--f-ui); font-size:.64rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
}
.card__body{padding:1.3rem; display:flex; flex-direction:column; gap:.6rem; flex:1}
.card__title{font-size:var(--t-lg); color:var(--brand-900); margin:0}
.card__text{font-size:var(--t-sm); color:var(--ink-55); margin:0}
.card__foot{margin-top:auto; padding-top:.9rem; border-top:1px dashed var(--hairline); display:flex; align-items:center; justify-content:space-between; gap:.8rem}
.price{font-family:var(--heading-font); color:var(--brand-700); font-size:1.3rem; font-weight:700; line-height:1}
.price small{font-family:var(--f-body); font-size:.68rem; color:var(--ink-40); font-weight:500; display:block; letter-spacing:.05em}
.amen{display:flex; flex-wrap:wrap; gap:.4rem}
.amen li{
  font-size:.68rem; font-family:var(--f-ui); font-weight:600; color:var(--ink-55);
  background:var(--soft); border-radius:var(--r-pill); padding:.28rem .65rem; display:flex; align-items:center; gap:.35rem;
}
.amen i{color:var(--accent-500); font-size:.7rem}

/* feature / facility tile */
.tile{
  background:var(--surface); border:1px solid var(--hairline); border-radius:var(--r-md);
  padding:1.3rem 1.1rem; display:grid; gap:.5rem; justify-items:start;
  transition:transform .35s var(--ease), background .35s, border-color .35s;
}
.tile:hover{transform:translateY(-6px); border-color:var(--accent-500)}
.tile__ico{
  width:46px; height:46px; border-radius:14px; display:grid; place-items:center; font-size:1.1rem;
  background:var(--soft); color:var(--brand-700); transition:background .35s, color .35s;
}
.tile:hover .tile__ico{background:var(--accent-500); color:var(--brand-900)}
.tile h4{font-size:var(--t-base); margin:0; color:var(--brand-900); font-family:var(--ui-font); font-weight:700}
.tile p{font-size:var(--t-sm); color:var(--ink-55); margin:0}

/* ---------- 11. Booking widget ---------- */
.bookbar{background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--shadow-l); padding:1.1rem; border:1px solid var(--hairline)}
.bookbar__tabs{display:flex; gap:.4rem; margin-bottom:1rem; overflow-x:auto; scrollbar-width:none}
.bookbar__tabs::-webkit-scrollbar{display:none}
.bookbar__tab{
  padding:.5rem 1rem; border-radius:var(--r-pill); font-family:var(--f-ui); font-weight:700;
  font-size:.74rem; color:var(--ink-55); background:var(--soft); white-space:nowrap; transition:.25s;
}
.bookbar__tab.is-active{background:var(--brand-900); color:#fff}
.bookbar__grid{display:grid; gap:.75rem; grid-template-columns:repeat(5,1fr); align-items:end}
@media (max-width:900px){ .bookbar__grid{grid-template-columns:1fr 1fr} }
@media (max-width:480px){ .bookbar__grid{grid-template-columns:1fr} }
.field{display:grid; gap:.3rem}
.field label{font-family:var(--f-ui); font-size:.63rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-40)}
.field input,.field select,.field textarea{
  width:100%; padding:.75rem .85rem; border-radius:var(--r-sm); background:var(--soft);
  border:1.5px solid transparent; font-size:var(--t-sm); transition:border-color .25s, background .25s;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--accent-500); background:var(--surface)}
.field textarea{resize:vertical; min-height:120px}

/* ---------- 12. Counters, testimonials, faq, gallery ---------- */
.stat{text-align:center; padding:1rem .5rem}
.stat__num{font-family:var(--heading-font); font-size:clamp(2rem,1.4rem + 2.4vw,3.4rem); line-height:1; color:var(--accent-500); font-weight:700}
.stat__lab{font-family:var(--f-ui); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-top:.6rem}

.quote{background:var(--surface); border-radius:var(--r-lg); padding:1.6rem; height:100%; border:1px solid var(--hairline); display:flex; flex-direction:column; gap:.9rem}
.quote__stars{color:#F5A623; letter-spacing:.15em; font-size:.85rem}
.quote__text{font-size:var(--t-base); color:var(--ink-70); font-style:italic; margin:0; flex:1}
.quote__who{display:flex; align-items:center; gap:.75rem}
.quote__ava{width:44px; height:44px; border-radius:50%; object-fit:cover}
.quote__who strong{display:block; font-family:var(--f-ui); font-size:.85rem; color:var(--brand-900)}
.quote__who span{font-size:.72rem; color:var(--ink-40)}

.faq{border-bottom:1px solid var(--hairline)}
.faq__q{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; text-align:left;
  padding:1.15rem .2rem; font-family:var(--ui-font); font-weight:600; font-size:var(--t-base); color:var(--brand-900);
}
.faq__q i{color:var(--accent-500); transition:transform .35s var(--ease); flex-shrink:0}
.faq.is-open .faq__q i{transform:rotate(45deg)}
.faq__a{max-height:0; overflow:hidden; transition:max-height .45s var(--ease)}
.faq__a p{padding:0 .2rem 1.15rem; color:var(--ink-55); font-size:var(--t-sm); margin:0}

.filters{display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center; margin-bottom:1.8rem}
.filters button{
  padding:.55rem 1.1rem; border-radius:var(--r-pill); background:var(--surface); border:1px solid var(--hairline);
  font-family:var(--f-ui); font-weight:600; font-size:.76rem; color:var(--ink-55); transition:.25s;
}
.filters button.is-active{background:var(--brand-900); color:#fff; border-color:var(--brand-900)}
.gal{columns:3; column-gap:14px}
@media (max-width:900px){ .gal{columns:2} }
@media (max-width:520px){ .gal{columns:1} }
.gal__item{break-inside:avoid; margin-bottom:14px; position:relative; border-radius:var(--r-md); overflow:hidden; display:block}
.gal__item img{width:100%; transition:transform .8s var(--ease)}
.gal__item::after{
  content:"\f00e"; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; inset:0;
  display:grid; place-items:center; color:#fff; font-size:1.4rem;
  background:linear-gradient(to top,rgba(7,22,51,.75),rgba(7,22,51,.15));
  opacity:0; transition:opacity .35s;
}
.gal__item:hover::after{opacity:1}
.gal__item:hover img{transform:scale(1.06)}
.gal__item.is-hidden{display:none}

.lightbox{position:fixed; inset:0; z-index:990; background:rgba(6,12,24,.94); display:grid; place-items:center; padding:1.2rem; opacity:0; visibility:hidden; transition:opacity .35s}
.lightbox.is-open{opacity:1; visibility:visible}
.lightbox img{max-height:84vh; border-radius:var(--r-md); box-shadow:var(--shadow-l)}
.lightbox__x{position:absolute; top:18px; right:18px; width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; display:grid; place-items:center; font-size:1.2rem}

/* countdown */
.count{display:flex; gap:.6rem; flex-wrap:wrap}
.count__b{background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); border-radius:var(--r-sm); padding:.6rem .85rem; text-align:center; min-width:64px}
.count__b b{display:block; font-family:var(--heading-font); font-size:1.5rem; color:var(--accent-300); line-height:1}
.count__b span{font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.6); font-family:var(--f-ui)}

/* ---------- 13. Footer ---------- */
.foot{background:var(--brand-900); color:rgba(255,255,255,.72); padding-top:clamp(3rem,2rem + 3vw,4.5rem); position:relative; overflow:hidden}
.foot__grid{display:grid; grid-template-columns:1.5fr 1fr 1fr 1.4fr; gap:2rem}
@media (max-width:900px){ .foot__grid{grid-template-columns:1fr 1fr} }
@media (max-width:560px){ .foot__grid{grid-template-columns:1fr} }
.foot h5{color:#fff; font-family:var(--f-ui); font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; margin-bottom:1.1rem}
.foot a:hover{color:var(--accent-300)}
.foot__links li{margin-bottom:.6rem; font-size:var(--t-sm)}
.foot__links i{color:var(--accent-500); font-size:.65rem; margin-right:.5rem}
.foot .brand__name{color:#fff}
.news{display:flex; gap:.5rem; margin-top:.9rem}
.news input{flex:1; padding:.7rem .9rem; border-radius:var(--r-pill); border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:#fff; font-size:var(--t-sm)}
.news input::placeholder{color:rgba(255,255,255,.4)}
.news button{width:48px; height:48px; border-radius:50%; background:var(--accent-500); color:var(--brand-900); display:grid; place-items:center; flex-shrink:0}
.socials{display:flex; gap:.55rem; margin-top:1.1rem}
.socials a{width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.08); color:#fff; transition:.3s}
.socials a:hover{background:var(--accent-500); color:var(--brand-900); transform:translateY(-3px)}
.foot__bar{margin-top:2.5rem; border-top:1px solid rgba(255,255,255,.1); padding-block:1.2rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:var(--t-xs)}
.foot__bar ul{display:flex; gap:1.2rem; flex-wrap:wrap}

/* map frame */
.map{border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--hairline); min-height:300px; box-shadow:var(--shadow-m)}
.map iframe{width:100%; height:100%; min-height:380px; border:0; display:block; filter:saturate(.9)}

/* page hero for inner pages */
.phero{position:relative; padding-block:clamp(3.5rem,2rem + 6vw,6rem); background:var(--brand-900); color:#fff; overflow:hidden; text-align:center}
.phero__bg{position:absolute; inset:0; opacity:.28; object-fit:cover; width:100%; height:100%}
.phero__in{position:relative}
.phero h1{font-size:var(--t-3xl); color:#fff; margin-bottom:.4rem}
.crumb{display:flex; gap:.6rem; justify-content:center; font-family:var(--f-ui); font-size:.76rem; color:rgba(255,255,255,.66)}
.crumb i{font-size:.6rem; align-self:center; color:var(--accent-500)}

/* reveal on scroll (no library dependency) */
[data-reveal]{opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease)}
[data-reveal].is-in{opacity:1; transform:none}
[data-reveal][data-d="1"]{transition-delay:.1s}
[data-reveal][data-d="2"]{transition-delay:.2s}
[data-reveal][data-d="3"]{transition-delay:.3s}
[data-reveal][data-d="4"]{transition-delay:.4s}
[data-reveal][data-d="5"]{transition-delay:.5s}

/* toast */
.toast{
  position:fixed; left:50%; bottom:calc(var(--appbar-h) + 22px); transform:translate(-50%,20px); z-index:995;
  background:var(--brand-900); color:#fff; padding:.85rem 1.3rem; border-radius:var(--r-pill);
  font-size:var(--t-sm); box-shadow:var(--shadow-l); opacity:0; visibility:hidden; transition:.35s var(--ease);
  display:flex; align-items:center; gap:.6rem; max-width:calc(100% - 32px);
}
.toast.is-on{opacity:1; visibility:visible; transform:translate(-50%,0)}
.toast i{color:var(--accent-300)}

/* utility */
.note{font-size:var(--t-xs); color:var(--ink-40)}
.hide-mob{display:initial}
@media (max-width:767px){ .hide-mob{display:none} }