/* =====================================================================
   The Ananya Grand — theme.css
   Navy & gold redesign (client mockup, Sept 2026). Loaded after
   style.css / home.css on every page and overrides tokens, chrome and
   the home hero. Nothing in the older sheets was deleted; this layer
   wins on cascade order and specificity.
   1 Tokens & type   2 Buttons   3 Utility bar   4 Header + nav
   5 Home hero + booking card   6 Icon strip   7 Showcase cards
   8 Inner pages & footer   9 Responsive
   ===================================================================== */

/* ---------- 1. TOKENS & TYPE ---------- */
:root{
  --ink:#0E1B26;            /* navy ink — text, footer */
  --grove:#0B1A24;          /* navy bands, utility bar, booking card */
  --grove-2:#16303F;        /* lit navy, hovers on dark */
  --brass:#C9A24A;          /* gold — buttons, rules, accents */
  --brass-dark:#A9842E;     /* gold hover, link text on light */
  --brass-light:#E6CC7E;    /* gold on dark */
  --brass-soft:#F6EFDD;     /* gold wash */
  --paper:#FFFFFF;
  --paper-2:#F7F4EE;        /* warm cream, alternate sections */
  --muted:#5E6A73;
  --line:#E8E2D6;
  --line-strong:#CFC5B2;
  --on-band:#F4EFE4;
  --display:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  --body:"Lato","Helvetica Neue",Arial,sans-serif;
  --util-h:44px;
  --header-h:92px;
  --r:6px;
  --r-card:12px;
  --lift:0 30px 60px -34px rgba(14,27,38,.55);
  --hover-lift:0 22px 44px -22px rgba(14,27,38,.35);
}
html[lang="mr"] :root,html[lang="hi"] :root{}
body{font-family:var(--body); color:var(--ink); font-weight:400}
h1,h2,h3,h4,.brand-name,.stat-num,.hero-title{
  font-family:var(--display); font-weight:500; letter-spacing:0;
  font-variation-settings:normal;
}
h1{font-weight:400}
h2{font-size:clamp(2rem,3.4vw,2.9rem); line-height:1.08}
h3{font-size:1.5rem}
.section-head h2::after,.about-text h2::after{background:var(--brass)}
.eyebrow,.page-eyebrow,.hero-kicker,.fac-kind,.room-meta,.f-role,.u-role,.call-role{
  text-transform:uppercase; letter-spacing:.24em; font-size:.72rem; font-weight:700;
}
.page-eyebrow{color:var(--brass-dark)}
::selection{background:var(--brass); color:#fff}

/* ---------- 2. BUTTONS ---------- */
.btn{
  border-radius:var(--r); font-family:var(--body); font-weight:700;
  letter-spacing:.01em; padding:14px 26px; font-size:.98rem;
}
.btn-solid{background:var(--brass); color:var(--ink); border-color:var(--brass)}
.btn-solid:hover{background:var(--brass-light); border-color:var(--brass-light); color:var(--ink); box-shadow:0 14px 30px -14px rgba(201,162,74,.8)}
.btn-outline{color:var(--ink); border-color:var(--line-strong)}
.btn-outline:hover{color:var(--brass-dark); border-color:var(--brass); background:var(--brass-soft)}
.btn-ghost{background:transparent; color:#fff; border:1px solid rgba(255,255,255,.55)}
.btn-ghost:hover{background:#fff; color:var(--ink)}
.btn .arrow{display:inline-block; margin-left:10px; transition:transform var(--t)}
.btn:hover .arrow{transform:translateX(4px)}
.link-more{color:var(--brass-dark)}

/* ---------- 3. UTILITY BAR ---------- */
.utility-bar{background:var(--grove); color:#fff; font-size:.88rem; line-height:1}
.utility-inner{height:var(--util-h); display:flex; align-items:center; justify-content:space-between; gap:20px}
.utility-hours{display:inline-flex; align-items:center; gap:9px; color:#fff; margin:0}
.utility-hours b{font-weight:400; color:#fff}
.utility-hours svg,.u-link svg{width:16px; height:16px; fill:none; stroke:var(--brass); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:none}
.utility-right{display:flex; align-items:center; gap:22px}
.u-link{display:inline-flex; align-items:center; gap:8px; color:#fff; white-space:nowrap; transition:color var(--t)}
.u-link:hover{color:var(--brass-light)}
.u-social{display:inline-flex; align-items:center; gap:14px}
.u-social a{display:inline-flex; width:20px; height:20px; color:var(--brass); transition:color var(--t)}
.u-social a:hover{color:#fff}
.u-social svg{width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.u-book{padding:8px 18px; font-size:.86rem; border-radius:var(--r); background:var(--brass); color:var(--ink); font-weight:700; white-space:nowrap; transition:background var(--t), transform var(--t)}
.u-book:hover{background:var(--brass-light); transform:translateY(-1px)}
.utility-calls,.track-link,.lang-pill{display:none}

/* ---------- 4. HEADER + NAV ---------- */
.site-header{height:var(--header-h); background:#fff; border-bottom:1px solid var(--line)}
.site-header.scrolled{box-shadow:0 12px 30px -24px rgba(14,27,38,.45)}
.header-inner{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:28px;
}
.header-inner .brand{grid-column:1; grid-row:1; justify-self:start}
.nav{display:contents}
.nav > ul{
  grid-column:2; grid-row:1; justify-self:center;
  display:flex; align-items:center; gap:clamp(18px,2.2vw,34px); list-style:none; margin:0; padding:0;
}
.nav > ul a{
  font-family:var(--display); font-size:1.18rem; font-weight:500; color:var(--ink);
  padding:6px 0; position:relative; white-space:nowrap;
}
.nav > ul a::after{
  content:""; position:absolute; left:0; right:0; bottom:-4px; height:1.5px;
  background:var(--brass); transform:scaleX(0); transform-origin:right; transition:transform var(--t);
}
.nav > ul a:hover{color:var(--brass-dark)}
.nav > ul a:hover::after,.nav > ul a.is-current::after{transform:scaleX(1); transform-origin:left}
.nav > ul a.is-current{color:var(--ink)}
.header-right{grid-column:3; grid-row:1; justify-self:end; display:flex; align-items:center; gap:14px}
.lang-select{position:relative; display:inline-flex; align-items:center}
.lang-select select{
  appearance:none; -webkit-appearance:none; font:inherit; font-size:.9rem; color:var(--ink);
  padding:10px 38px 10px 16px; border:1px solid var(--line-strong); border-radius:var(--r);
  background:#fff; cursor:pointer; transition:border-color var(--t);
}
.lang-select select:hover,.lang-select select:focus{border-color:var(--brass); outline:none}
.lang-select::after{
  content:""; position:absolute; right:15px; top:50%; width:7px; height:7px;
  border-right:1.5px solid var(--ink); border-bottom:1.5px solid var(--ink);
  transform:translateY(-70%) rotate(45deg); pointer-events:none;
}
.nav-cta{display:none}
.menu-toggle span{background:var(--ink)}
.header-inner .brand-logo{height:64px}
.site-header.scrolled .header-inner .brand-logo{height:56px}

/* ---------- 5. HOME HERO + BOOKING CARD ---------- */
body.home .hero{
  min-height:min(92vh,860px); align-items:center;
  padding-block:clamp(70px,9vw,120px) clamp(70px,9vw,120px);
}
body.home .hero-media::after{
  background:
    linear-gradient(180deg, rgba(8,20,30,.55) 0%, rgba(8,20,30,.15) 30%, rgba(8,20,30,.35) 70%, rgba(8,20,30,.85) 100%),
    linear-gradient(90deg, rgba(8,20,30,.72) 0%, rgba(8,20,30,.35) 45%, rgba(8,20,30,.05) 75%);
}
body.home .hero-body{
  max-width:none; width:100%; display:grid; gap:clamp(28px,4vw,64px); align-items:center;
  grid-template-columns:minmax(0,1.25fr) minmax(320px,420px);
}
body.home .hero-panel{max-width:640px}
body.home .hero-kicker{
  color:#fff; letter-spacing:.34em; font-size:.74rem; font-weight:700; margin-bottom:18px;
}
body.home .hero-kicker::before{display:none}
body.home .hero-title{
  font-size:clamp(3rem,6.6vw,5.8rem); line-height:.98; font-weight:400; margin-bottom:.32em;
  text-shadow:0 2px 30px rgba(0,0,0,.35);
}
body.home .hero-title em,body.home .hero-title .w em{font-style:italic; color:var(--brass-light); font-weight:400}
body.home .hero-lede{font-size:1.14rem; line-height:1.6; max-width:52ch; color:rgba(255,255,255,.92); margin-bottom:30px}
body.home .hero-actions .btn{padding:15px 28px}
body.home .pano-hint{bottom:18px}

.hero-book{
  position:relative; z-index:5; pointer-events:auto;
  background:rgba(11,26,36,.92); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-card); padding:28px 26px 22px; color:#fff;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.8); backdrop-filter:blur(8px);
}
.hero-book h2{
  font-family:var(--body); font-size:.8rem; letter-spacing:.34em; text-transform:uppercase;
  font-weight:700; text-align:center; color:#fff; margin:0 0 10px;
}
.hero-book h2::after{display:none}
.hero-book .book-sub{text-align:center; color:rgba(255,255,255,.8); font-size:.9rem; margin:0 0 22px}
.hero-book .booking-form{
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
  background:none; border:0; box-shadow:none; padding:0; margin:0;
}
.hero-book .field{
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.16);
  border-radius:8px; padding:12px 14px 10px; display:grid; grid-template-columns:22px 1fr; column-gap:10px;
}
.hero-book .field svg{grid-row:1/3; align-self:center; width:20px; height:20px; fill:none; stroke:var(--brass); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.hero-book label{font-size:.78rem; color:var(--brass-light); letter-spacing:.02em; margin:0 0 3px; text-transform:none; font-weight:600}
.hero-book input,.hero-book select{
  background:none; border:0; color:#fff; font:inherit; font-size:.98rem; padding:0; width:100%; min-height:0;
  color-scheme:dark; box-shadow:none; border-radius:0;
}
.hero-book input:focus,.hero-book select:focus{outline:none; box-shadow:none}
.hero-book .field:focus-within{border-color:var(--brass)}
.hero-book .field-action{grid-column:1/-1; display:block; background:none; border:0; padding:6px 0 0}
.hero-book .field-action .btn{width:100%; padding:15px 20px; font-size:1.02rem; border-radius:8px}
.hero-book .booking-msg{grid-column:1/-1; margin:8px 0 0; font-size:.88rem; min-height:0}
.hero-book .booking-msg.is-error{color:#F2B8B8}
.hero-book .booking-msg.is-ok{color:var(--brass-light)}
.hero-book .book-note{
  display:flex; align-items:center; justify-content:center; gap:8px;
  margin:16px 0 0; font-size:.8rem; color:rgba(255,255,255,.82);
}
.hero-book .book-note svg{width:14px; height:14px; fill:none; stroke:var(--brass); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
body.home .booking,body.home .hero-links,body.home .ticker{display:none}

/* ---------- 6. ICON STRIP ---------- */
.features{background:#fff; border-bottom:1px solid var(--line); padding:0}
.feature-grid{
  display:grid; grid-template-columns:repeat(5,1fr); gap:0; padding-block:34px 30px;
}
.feature{
  text-align:center; padding:6px 18px; border:0; background:none; box-shadow:none; border-radius:0;
  border-left:1px solid var(--line);
}
.feature:first-child{border-left:0}
.feature:hover{transform:none; box-shadow:none}
.feature-ico{
  display:flex; justify-content:center; width:auto; height:auto; background:none; margin:0 auto 14px;
}
.feature-ico svg{width:44px; height:44px; fill:none; stroke:var(--brass); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.feature h3{
  font-family:var(--body); font-size:.72rem; letter-spacing:.24em; text-transform:uppercase;
  font-weight:700; color:var(--ink); margin:0 0 6px;
}
.feature p{font-size:.92rem; color:var(--muted); margin:0}

/* ---------- 7. SHOWCASE CARDS ---------- */
.showcase{padding:clamp(28px,3.4vw,44px) 0 clamp(40px,5vw,72px)}
.showcase-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.show-card{
  position:relative; display:block; aspect-ratio:1.4/1; border-radius:var(--r-card); overflow:hidden;
  color:#fff; box-shadow:var(--lift); transition:transform var(--spring), box-shadow var(--spring);
}
.show-card img{width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--spring)}
.show-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,20,30,0) 40%, rgba(8,20,30,.85) 100%);
}
.show-card:hover{transform:translateY(-6px); box-shadow:var(--hover-lift)}
.show-card:hover img{transform:scale(1.05)}
.show-body{position:absolute; left:22px; right:22px; bottom:20px; z-index:2; display:flex; align-items:flex-end; justify-content:space-between; gap:16px}
.show-body h3{font-size:1.9rem; line-height:1.05; margin:0 0 4px; color:#fff}
.show-body p{margin:0; font-size:.95rem; color:rgba(255,255,255,.88)}
.show-go{
  flex:none; width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,.7);
  display:grid; place-items:center; transition:background var(--t), border-color var(--t);
}
.show-go svg{width:18px; height:18px; fill:none; stroke:#fff; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.show-card:hover .show-go{background:var(--brass); border-color:var(--brass)}
.show-card:hover .show-go svg{stroke:var(--ink)}

/* ---------- 8. INNER PAGES, CARDS, FOOTER ---------- */
.section--sage{background:var(--paper-2)}
.page-hero{background:var(--paper-2)}
.page-hero h1{font-size:clamp(2.6rem,5vw,4.2rem); font-weight:400}
.room-card,.fac,.amenity,.call-card,.spot,.room-media img{border-radius:var(--r-card)}
.room-tag{background:var(--brass); color:var(--ink); font-weight:700; letter-spacing:.06em}
.tick-list li::before,.room-feats li::before{color:var(--brass-dark)}
.hours dt,.hours-table dt{color:var(--muted)}
.contact-form{border-top:3px solid var(--brass)}
input:focus,select:focus,textarea:focus{border-color:var(--brass); box-shadow:0 0 0 3px rgba(201,162,74,.25)}
.quote blockquote{font-family:var(--display); font-weight:400}
.site-footer{background:var(--grove); color:var(--on-band)}
.site-footer h4{font-family:var(--body); font-size:.74rem; letter-spacing:.24em; text-transform:uppercase; color:var(--brass-light); font-weight:700}
.site-footer a:hover{color:var(--brass-light)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12)}
.to-top{background:var(--brass); color:var(--ink)}
.cta-band{background:var(--grove)}
.cta-band h2{color:#fff}

/* ---------- 9. RESPONSIVE ---------- */
@media (max-width:1180px){
  .nav > ul{gap:16px}
  .nav > ul a{font-size:1.06rem}
  .feature h3{letter-spacing:.16em; font-size:.68rem}
}
@media (max-width:1024px){
  body.home .hero-body{grid-template-columns:1fr; gap:36px}
  body.home .hero-panel{max-width:600px}
  .hero-book{max-width:520px}
  .feature-grid{grid-template-columns:repeat(3,1fr); row-gap:26px}
  .feature:nth-child(4){border-left:0}
  .showcase-grid{grid-template-columns:1fr 1fr}
  .showcase-grid .show-card:last-child{grid-column:1/-1; aspect-ratio:2.2/1}
}
@media (max-width:940px){
  .u-link span,.utility-hours span{display:none}
  .utility-right{gap:16px}
}
@media (max-width:880px){
  :root{--header-h:76px}
  .header-inner{display:flex; justify-content:space-between; align-items:center}
  .header-inner .brand-logo{height:50px}
  .site-header.scrolled .header-inner .brand-logo{height:46px}
  .header-right{gap:8px}
  .lang-select select{padding:8px 32px 8px 12px; font-size:.84rem}
  .nav{display:flex; background:#fff}
  .nav > ul{display:flex; flex-direction:column; width:100%; gap:0; justify-self:auto}
  .nav > ul li{border-bottom:1px solid var(--line)}
  .nav > ul a{display:block; padding:16px 0; font-size:1.3rem}
  .nav > ul a::after{display:none}
  .nav-cta{display:flex; margin-top:24px; width:100%; justify-content:center}
  body.home .hero{min-height:0}
  body.home .hero-title{font-size:clamp(2.6rem,11vw,4rem)}
  .hero-book{max-width:none}
}
@media (max-width:640px){
  .utility-inner{gap:10px}
  .u-social{display:none}
  .feature-grid{grid-template-columns:1fr 1fr; padding-block:26px 22px}
  .feature{border-left:0; padding:6px 8px}
  .feature-ico svg{width:36px; height:36px}
  .showcase-grid{grid-template-columns:1fr}
  .showcase-grid .show-card:last-child{aspect-ratio:1.4/1}
  .show-body h3{font-size:1.6rem}
  .hero-book .booking-form{grid-template-columns:1fr}
  .hero-book{padding:22px 18px 18px}
}

/* Devanagari pages keep their script fonts; the navy/gold tokens still apply */
html[lang="mr"],html[lang="hi"]{
  --display:"Noto Serif Devanagari","Cormorant Garamond",Georgia,serif;
  --body:"Noto Sans Devanagari","Lato","Helvetica Neue",Arial,sans-serif;
}

/* Footer contact links were inheriting navy text on the navy band */
.site-footer .footer-calls a{color:#fff}
.site-footer .footer-calls a:hover,.site-footer .footer-col a:hover{color:var(--brass-light)}
.site-footer .footer-calls .f-role,.site-footer .footer-address,.site-footer .footer-bottom{color:rgba(244,239,228,.72)}
.site-footer .footer-brand p{color:#fff}
.site-footer .footer-bottom a{color:rgba(244,239,228,.85)}

/* ===== Polish pass (15 Sep) ===== */
/* Icon strip: one row of five, no blob behind the icon (home.css was winning) */
body.home .feature-grid{grid-template-columns:repeat(5,1fr); padding:36px 0 30px}
body.home .feature{border-right:0; border-left:1px solid var(--line); padding:6px 14px}
body.home .feature:first-child{border-left:0}
body.home .feature-ico{width:auto; height:auto; margin:0 auto 14px; display:flex; justify-content:center}
body.home .feature-ico::before{display:none}
body.home .feature-ico svg{width:44px; height:44px; stroke-width:1.5}
body.home .feature h3{font-family:var(--body); font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; font-weight:700; margin:0 0 6px; color:var(--ink)}
@media (max-width:1180px){body.home .feature h3{letter-spacing:.14em; font-size:.66rem}}
@media (max-width:900px){body.home .feature-grid{grid-template-columns:repeat(3,1fr); row-gap:26px} body.home .feature:nth-child(4){border-left:0}}
@media (max-width:640px){body.home .feature-grid{grid-template-columns:1fr 1fr; gap:22px 0} body.home .feature{border-left:0}}

/* Wedding CTA band: white heading, readable copy, phone in one colour */
.cta-band{background:var(--grove); color:#fff}
.cta-band h2{color:#fff}
.cta-band p{color:rgba(244,239,228,.85)}
.cta-phone{gap:4px}
.cta-phone .f-role,.cta-phone a{color:var(--brass-light)}
.cta-phone .f-role{font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; font-weight:700}
.cta-phone a{font-family:var(--display); font-size:1.6rem; font-weight:500; color:#fff}
.cta-phone a:hover{color:var(--brass-light)}

/* Rooms page "live in for a week" band: light, dark readable text */
.dining{background:var(--paper-2); color:var(--ink)}
.dining h2{color:var(--ink)}
.dining p{color:#2B3944; font-size:1.05rem}
.dining .link-more{color:var(--brass-dark); font-weight:700}
.dining .hours{background:var(--line); border:1px solid var(--line); gap:1px}
.dining .hours > div{background:#fff; padding:18px 20px}
.dining .hours dt{color:var(--muted); font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700}
.dining .hours dd{color:var(--ink); font-size:1.5rem; margin-top:6px}

/* Treatments: cards with a gold leaf accent and a proper hover */
.treatment{
  position:relative; padding:20px 20px 20px 54px; border:1px solid var(--line);
  border-radius:var(--r-card); background:#fff; transition:transform var(--spring), box-shadow var(--spring), border-color var(--t);
}
.treatment::before{
  content:""; position:absolute; left:20px; top:50%; width:18px; height:18px; transform:translateY(-50%);
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A24A' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M20.5 3.5C10 3.5 3.5 10 3.5 20.5c10.5 0 17-6.5 17-17z'/><path d='M4.5 19.5 15 9'/></svg>") center/contain no-repeat;
}
.treatment:hover{border-color:var(--brass); background:#fff; transform:translateY(-4px); box-shadow:var(--hover-lift)}
.treatment h3{font-size:1.22rem; font-weight:600}
.hours-light{background:var(--line); border:1px solid var(--line); border-radius:var(--r-card); overflow:hidden}
.hours-light > div{background:#fff}
.hours-light dt{font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; font-weight:700}
.hours-light dd{font-size:1.5rem; font-weight:500}

/* General: stronger headings, heavier body contrast, consistent card hover */
h2,h3{color:var(--ink)}
.section-head p,.lede,.page-hero .lede{color:#2B3944}
.room-card,.fac,.amenity{border:1px solid var(--line); transition:transform var(--spring), box-shadow var(--spring), border-color var(--t)}
.room-card:hover,.fac:hover,.amenity:hover{transform:translateY(-6px); box-shadow:var(--hover-lift); border-color:var(--brass)}
.amenity svg{stroke:var(--brass)}
.amenity h3{font-size:1.25rem}
.room-card h3{font-size:1.7rem}
.btn-outline{font-weight:700}

/* ===== WhatsApp + language slider (15 Sep) ===== */
.u-wa svg{stroke:#25D366}
.u-wa:hover{color:#25D366}
.lang-switch{
  position:relative; display:inline-grid; grid-template-columns:repeat(3,auto); align-items:center;
  padding:3px; border:1px solid var(--line-strong); border-radius:100px; background:#fff; isolation:isolate;
}
.lang-switch::before{
  content:""; position:absolute; top:3px; bottom:3px; left:3px; width:calc((100% - 6px)/3);
  border-radius:100px; background:var(--brass); z-index:-1;
  transform:translateX(calc(var(--i,0) * 100%)); transition:transform .38s cubic-bezier(.22,1,.36,1);
}
.lang-switch a{
  padding:7px 14px; border-radius:100px; font-size:.84rem; line-height:1; text-align:center; white-space:nowrap;
  color:var(--muted); font-weight:600; transition:color var(--t);
}
.lang-switch a[lang="mr"],.lang-switch a[lang="hi"]{font-family:"Noto Sans Devanagari","Nirmala UI",system-ui,sans-serif}
.lang-switch a:hover{color:var(--ink)}
.lang-switch a.is-active{color:var(--ink); font-weight:700}
.lang-switch:hover::before{transform:translateX(calc(var(--i,0) * 100%)) scale(1.04)}
@media (max-width:880px){.lang-switch a{padding:6px 10px; font-size:.78rem}}
@media (max-width:420px){.lang-switch{display:none} .nav .lang-switch{display:inline-grid; margin-top:22px}}

/* ===== Utility icons + equal-width language chips (15 Sep) ===== */
.utility-right{gap:18px}
.u-link{gap:8px; font-weight:600; letter-spacing:.01em}
.u-link svg,.u-wa svg{width:18px; height:18px}
.u-wa{padding:6px; margin-left:-4px; border-radius:50%; transition:background var(--t)}
.u-wa:hover{background:rgba(37,211,102,.14)}
.lang-switch{grid-template-columns:repeat(3,1fr)}
.lang-switch a{min-width:78px; padding:7px 12px; font-size:.84rem; line-height:1.15; font-weight:600}
.lang-switch a[lang="mr"],.lang-switch a[lang="hi"]{font-size:.86rem; font-weight:500}
.lang-switch a.is-active{font-weight:700}
.lang-switch a.is-active[lang="mr"],.lang-switch a.is-active[lang="hi"]{font-weight:600}
@media (max-width:880px){.lang-switch a{min-width:64px; padding:6px 8px; font-size:.78rem}}

/* ===== Mobile utility bar + overflow guard (15 Sep) ===== */
html,body{overflow-x:clip}
.uh-short{display:none}
body.home .hero-body{grid-template-columns:minmax(0,1.25fr) minmax(320px,420px)}
body.home .hero-body > *{min-width:0}
body.home .hero-panel,body.home .hero-lede,body.home .hero-title{overflow-wrap:anywhere}
@media (max-width:1024px){body.home .hero-body{grid-template-columns:minmax(0,1fr)}}
@media (max-width:940px){
  .utility-hours span{display:inline}
  .u-link span{display:inline}
}
@media (max-width:640px){
  .utility-inner{gap:8px}
  .utility-hours svg{display:none}                 /* no clock on phones */
  .uh-full{display:none}
  .uh-short{display:inline; font-size:.84rem; letter-spacing:.02em}
  .utility-hours b{font-weight:700; color:var(--brass-light)}
  .utility-right{gap:8px}
  .u-link span{display:none}                       /* phone: icon only, still tap-to-call */
  .u-link{padding:6px}
  .u-wa{margin-left:0}
  .u-book{padding:7px 12px; font-size:.8rem}
}

/* ===== Utility bar: one clean row at every width (15 Sep, v3) ===== */
.utility-inner{flex-wrap:nowrap; min-height:var(--util-h); gap:16px}
.utility-hours{display:inline-flex !important; white-space:nowrap; min-width:0; overflow:hidden; text-overflow:ellipsis}
.utility-hours .uh-full{display:inline}
.utility-hours .uh-short{display:none}
.utility-right{flex:none}
@media (max-width:940px){
  .utility-hours svg{display:none}
  .utility-hours .uh-full{display:none}
  .utility-hours .uh-short{display:inline; font-size:.86rem}
  .utility-hours b{color:var(--brass-light); font-weight:700}
  .utility-inner{justify-content:space-between}
  .u-link span{display:none}
  .u-link{padding:6px}
  .u-book{padding:7px 14px; font-size:.82rem}
}

/* ---- dropdown options: dark text on white (fix white-on-white list) ---- */
.hero-book select option,
select option{color:#0B1A24; background:#fff}
.hero-book select{color-scheme:dark}

/* ---- guest details in the availability card ---- */
.hero-book .field-wide{grid-column:1/-1}
.hero-book input::placeholder{color:rgba(255,255,255,.45)}
.hero-book input[type="tel"],.hero-book input[type="email"],.hero-book input[type="text"]{min-height:24px}

/* ---- Devanagari hero: room for upper/lower vowel marks (were clipped by the word-reveal mask) ---- */
html[lang="mr"] body.home .hero-title,html[lang="hi"] body.home .hero-title{
  line-height:1.28; font-size:clamp(2.5rem,5.4vw,4.6rem); font-weight:500; text-shadow:0 2px 24px rgba(0,0,0,.45);
}
html[lang="mr"] body.home .hero-title .w,html[lang="hi"] body.home .hero-title .w{
  padding:.32em .04em .3em 0; margin:-.32em 0 -.3em;
}
html[lang="mr"] body.home .hero-title em,html[lang="hi"] body.home .hero-title em{font-style:normal; font-weight:600}
html[lang="mr"] body.home .hero-kicker,html[lang="hi"] body.home .hero-kicker{letter-spacing:.08em}
html[lang="mr"] h1,html[lang="mr"] h2,html[lang="mr"] h3,html[lang="hi"] h1,html[lang="hi"] h2,html[lang="hi"] h3{line-height:1.3}
@media (max-width:640px){
  html[lang="mr"] body.home .hero-title,html[lang="hi"] body.home .hero-title{font-size:clamp(2.1rem,9vw,3.2rem)}
}