/*
TravelHill — compiled stylesheet.

Every rule below is copied byte-for-byte from the four prototype files
(naini-kumaon-prototype.html, naini-kumaon-stay-detail.html,
naini-kumaon-trails.html, naini-kumaon-events.html) with exactly one kind of
change: where two prototypes reused the same class name for two visually
different components (e.g. the homepage's `.trail` grid card vs. the trails
archive's `.trail` list row), the selector is scoped to the ancestor
container that already existed in that page's markup (`.trail-grid .trail`
vs `.list .trail`), so both keep their original, unmodified appearance. No
color, spacing, font, or breakpoint value was altered from the source HTML.
New selectors (prefixed `.th-`) only appear for screens that had no
prototype at all (blog, search, 404, WooCommerce, etc.) and reuse the same
design tokens.
*/

/* ===================================================================
   1. Design tokens & reset — identical across all four prototypes
   =================================================================== */
:root{
  --pine:#16352C;
  --ink:#0F1F1A;
  --lake:#135E75;
  --lake-2:#2E93AC;
  --mist:#EEF3F1;
  --paper:#FFFFFF;
  --marigold:#E9A322;
  --stone:#5A6B64;
  --line:#D7E1DD;
  --radius:14px;
  --display:'Bricolage Grotesque',sans-serif;
  --body:'Albert Sans',sans-serif;
  --mono:'IBM Plex Mono',monospace;
  --btn-radius:30px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
body{font-family:var(--body);color:var(--ink);background:var(--mist);line-height:1.55;font-size:16px}
a{color:var(--lake)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--marigold);outline-offset:2px;border-radius:4px}
img{max-width:100%;height:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--pine);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:8px;top:8px}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ===================================================================
   2. Header / nav — identical across all four prototypes
   =================================================================== */
header.site{position:sticky;top:0;z-index:50;background:var(--pine);color:#fff}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.85rem 0;gap:1rem}
.brand{display:flex;align-items:center;gap:.65rem;color:#fff;text-decoration:none}
.brand svg{flex:none}
.brand img{border-radius:8px}
.brand b{font-family:var(--display);font-weight:600;font-size:1.05rem;letter-spacing:.01em;line-height:1.15}
.brand small{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
nav.main ul{display:flex;gap:1.4rem;list-style:none}
nav.main a{color:#E8F0ED;text-decoration:none;font-size:.95rem;font-weight:500}
nav.main a:hover,nav.main a[aria-current]{color:var(--marigold)}
.book-btn{background:var(--marigold);color:#2A1E04;text-decoration:none;font-weight:600;padding:.55rem 1.1rem;border-radius:30px;font-size:.92rem}
.menu-toggle{display:none;background:none;border:1.5px solid #ffffff66;color:#fff;border-radius:8px;padding:.4rem .7rem;font:inherit;cursor:pointer}
@media(max-width:840px){
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--pine);padding:1rem 20px 1.4rem;border-top:1px solid #ffffff22}
  nav.main.open{display:block}
  nav.main ul{flex-direction:column;gap:1rem}
  .menu-toggle{display:block}
  .book-btn{display:none}
}

/* header search + cart — new, not in the original prototypes */
.th-search{position:relative}
.th-search-toggle{background:none;border:1.5px solid #ffffff66;color:#fff;border-radius:8px;padding:.4rem .55rem;cursor:pointer;display:flex}
.th-search-panel{position:absolute;top:calc(100% + 8px);right:0;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 14px 34px #16352C24;padding:.9rem;width:300px;z-index:60}
.th-search-panel input{width:100%;padding:.6rem .7rem;border:1px solid var(--line);border-radius:10px;font:inherit;color:var(--ink)}
.th-search-results{margin-top:.6rem;display:grid;gap:.5rem;max-height:340px;overflow-y:auto}
.th-search-results a{display:flex;gap:.6rem;text-decoration:none;color:var(--ink);align-items:center}
.th-search-results img{width:44px;height:44px;object-fit:cover;border-radius:8px;flex:none}
.th-search-results b{font-family:var(--display);font-size:.9rem;display:block}
.th-search-results span{font-size:.78rem;color:var(--stone)}
.th-cart-link{color:#E8F0ED;text-decoration:none;font-size:.92rem;font-weight:500;white-space:nowrap}

/* ===================================================================
   3. Advisory bar / hero / conditions strip — homepage
   =================================================================== */
.advisory{background:var(--marigold);color:#2A1E04;font-size:.9rem;padding:.55rem 0}
.advisory .wrap{display:flex;gap:.75rem;align-items:center;justify-content:space-between}
.advisory strong{font-weight:600}
.advisory button{background:none;border:1.5px solid #2A1E04;border-radius:20px;padding:.1rem .7rem;font:inherit;cursor:pointer;color:#2A1E04}

.hero{background:linear-gradient(180deg,var(--pine) 0%,#1D4A50 55%,var(--lake) 100%);color:#fff;position:relative;overflow:hidden}
.hero .wrap{position:relative;z-index:2;padding-top:4.2rem;padding-bottom:0}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,5.4vw,3.9rem);line-height:1.04;max-width:13ch}
.hero h1 em{font-style:normal;color:var(--marigold)}
.hero p.lede{margin:1.1rem 0 1.6rem;font-size:1.08rem;max-width:46ch;color:#DCEAE5}
.hero .cta-row{display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:2.6rem}
.btn{display:inline-block;text-decoration:none;font-weight:600;padding:.75rem 1.4rem;border-radius:var(--btn-radius);font-size:.98rem}
.btn.primary{background:var(--marigold);color:#2A1E04}
.btn.ghost{border:1.5px solid #ffffff77;color:#fff}
.btn.ghost:hover{border-color:var(--marigold);color:var(--marigold)}
.hero svg.scene{display:block;width:100%;height:auto;margin-bottom:-4px}
.hero .th-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.5}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--marigold);margin-bottom:.9rem;display:block}

.conditions{background:var(--ink);color:#CFE6DE;font-family:var(--mono);font-size:.82rem}
.conditions .wrap{display:flex;gap:2.2rem;overflow-x:auto;padding:.7rem 20px;white-space:nowrap;align-items:center}
.conditions span b{color:var(--marigold);font-weight:500}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#4CC38A;margin-right:.45rem;animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ===================================================================
   4. Section shell shared by every content section site-wide
   =================================================================== */
section{padding:4rem 0}
h2{font-family:var(--display);font-weight:600;font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.12;margin-bottom:.5rem}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}
.section-head p{color:var(--stone);max-width:52ch}
.link-more{font-weight:600;text-decoration:none;white-space:nowrap}

/* ===================================================================
   5. Plan Visit cards — homepage only
   =================================================================== */
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:900px){.plan-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.plan-grid{grid-template-columns:1fr}}
.plan-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;text-decoration:none;color:var(--ink);display:block;transition:transform .15s ease,box-shadow .15s ease}
.plan-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px #16352C14}
.plan-card .ico{width:42px;height:42px;border-radius:10px;background:var(--mist);display:grid;place-items:center;margin-bottom:.9rem;color:var(--lake)}
.plan-card h3{font-family:var(--display);font-weight:600;font-size:1.08rem;margin-bottom:.3rem}
.plan-card p{font-size:.9rem;color:var(--stone)}

/* ===================================================================
   6. Trail card component
   Two structurally distinct uses of the same `.trail` class name, kept
   apart by the ancestor container each is always rendered inside:
     - homepage grid card  → `.trail-grid .trail` (art image + pad text)
     - archive list row    → `.list .trail`       (num + text + profile + go)
   =================================================================== */
.trails{background:var(--paper)}
.trail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:900px){.trail-grid{grid-template-columns:1fr}}
.trail-grid .trail{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--paper)}
.trail-grid .trail .art{height:140px;position:relative}
.trail-grid .trail .art svg,.trail-grid .trail .art img{width:100%;height:100%;display:block;object-fit:cover}
.trail-grid .trail .pad{padding:1.2rem 1.3rem 1.4rem}
.trail-grid .trail h3{font-family:var(--display);font-weight:600;font-size:1.12rem;margin-bottom:.35rem}
.trail-grid .trail h3 a{color:inherit;text-decoration:none}
.trail-grid .trail p{font-size:.9rem;color:var(--stone);margin-bottom:.9rem}

/* base (unbordered) .stats — trails archive rows, and the single-trail /
   single-activity highlight rows which aren't nested in `.pad` at all */
.stats{display:flex;gap:1.3rem;font-family:var(--mono);font-size:.72rem;color:var(--pine);flex-wrap:wrap}
.trail-grid .trail .stats,
.pad .stats{gap:1.2rem;font-size:.76rem;border-top:1px dashed var(--line);padding-top:.8rem}

.list .trail{display:grid;grid-template-columns:56px 1.5fr 220px auto;gap:1.4rem;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem 1.4rem;transition:transform .15s ease,box-shadow .15s ease}
.list .trail:hover{transform:translateY(-2px);box-shadow:0 10px 24px #16352C12}
.list .trail.hide{display:none}
@media(max-width:900px){.list .trail{grid-template-columns:44px 1fr;row-gap:1rem}.list .trail .profile,.list .trail .go{grid-column:2}}
.num{width:44px;height:44px;border-radius:50%;background:var(--pine);color:#fff;display:grid;place-items:center;font-family:var(--mono);font-size:1rem}
.list .trail h3{font-family:var(--display);font-weight:600;font-size:1.15rem;margin-bottom:.2rem}
.list .trail h3 a{color:inherit;text-decoration:none}
.list .trail .sub{font-size:.85rem;color:var(--stone);margin-bottom:.55rem}
.chips{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.6rem}
.chips .chip{font-size:.7rem;font-weight:600;padding:.18rem .65rem;border-radius:20px}
.chips .chip.tag{background:var(--mist);color:var(--stone)}
.profile svg{display:block;width:100%;height:64px}
.profile figcaption{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--stone);margin-top:.25rem;text-align:center}
.go{font-size:.85rem;font-weight:600;text-decoration:none;border:1.5px solid var(--pine);color:var(--pine);padding:.5rem 1.1rem;border-radius:20px;white-space:nowrap;justify-self:end}
.go:hover{background:var(--pine);color:#fff}

/* difficulty/chip colors — shared by both trail contexts */
.chip{font-size:.72rem;font-weight:600;padding:.22rem .7rem;border-radius:20px;letter-spacing:.03em}
.art .chip{position:absolute;top:12px;left:12px}
.chip.easy{background:#DFF3E7;color:#14603A}
.chip.moderate{background:#FBEECB;color:#7A5A08}
.chip.hard{background:#F9DEDA;color:#8C2F22}
.stats b{display:block;font-size:.95rem;font-weight:500}
.list .trail .stats b{font-size:.98rem}

/* map panel — trails archive */
.map-panel{background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:1.8rem 0 2rem;box-shadow:0 10px 28px #16352C10}
.map-panel .head{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.3rem;border-bottom:1px solid var(--line);flex-wrap:wrap}
.map-panel h2{font-family:var(--display);font-weight:600;font-size:1.15rem;margin-bottom:0}
.map-panel .head span{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.map-panel svg{display:block;width:100%;height:auto}
.pin{cursor:pointer}
.pin circle{transition:r .12s ease}
.pin:hover circle,.pin.active circle{fill:var(--marigold)}
.pin text{font-family:var(--mono);font-size:13px;fill:#fff;text-anchor:middle;pointer-events:none}
.notice{background:#FBEECB;border:1px solid #E8D49A;border-radius:var(--radius);padding:.9rem 1.2rem;font-size:.88rem;color:#5C4406;margin-bottom:1.4rem}
.notice b{font-weight:600}

/* toolbar / count / sort — archive pages (trails + events); the 0.1–0.6rem
   spacing gap between the two source prototypes here is treated as
   negligible rather than forked per page. */
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.filters,.months{display:flex;gap:.5rem;flex-wrap:wrap}
.filters button,.months button{font:inherit;font-size:.85rem;font-weight:600;border:1.5px solid var(--line);background:var(--paper);color:var(--stone);padding:.4rem 1rem;border-radius:20px;cursor:pointer}
.filters button[aria-pressed=true]{background:var(--pine);border-color:var(--pine);color:#fff}
.months button[aria-pressed=true]{background:var(--marigold);border-color:var(--marigold);color:#2A1E04}
.sort{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--stone)}
.sort select{font:inherit;font-size:.85rem;border:1.5px solid var(--line);border-radius:20px;padding:.35rem .8rem;background:var(--paper);color:var(--ink);cursor:pointer}
.count{font-family:var(--mono);font-size:.78rem;color:var(--stone);margin-bottom:1rem}

/* ===================================================================
   7. Stay / hotel card — one component, reused unmodified on the
   homepage scroller, the stays archive grid, and nowhere else conflicts
   =================================================================== */
.stay-row{display:grid;grid-auto-flow:column;grid-auto-columns:280px;gap:1.1rem;overflow-x:auto;padding-bottom:.8rem;scroll-snap-type:x mandatory}
.th-stay-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.1rem;margin-top:1.4rem}
.stay{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;scroll-snap-align:start;display:flex;flex-direction:column}
.stay .art{height:150px;position:relative}
.stay .art svg,.stay .art img{width:100%;height:100%;display:block;object-fit:cover}
.stay .pad{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;flex:1}
.stay .top{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem}
.stay h3{font-family:var(--display);font-weight:600;font-size:1.02rem}
.stay h3 a{color:inherit;text-decoration:none}
.rate{font-family:var(--mono);font-size:.78rem;color:var(--pine);white-space:nowrap}
.rate svg{vertical-align:-1px}
.stay p.loc{font-size:.82rem;color:var(--stone);margin:.15rem 0 .6rem}
.amen{display:flex;gap:.9rem;font-family:var(--mono);font-size:.72rem;color:var(--pine);border-top:1px dashed var(--line);padding-top:.7rem;margin-top:auto;flex-wrap:wrap}
.stay .price{display:flex;justify-content:space-between;align-items:center;margin-top:.8rem}
.stay .price b{font-size:1.05rem}
.stay .price span{font-size:.8rem;color:var(--stone);font-weight:400}
.stay .btn-sm{background:var(--pine);color:#fff}

/* ===================================================================
   8. Alerts / newsletter band — homepage
   =================================================================== */
.alerts-band{background:var(--pine);color:#fff}
.alerts-band .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
@media(max-width:840px){.alerts-band .grid{grid-template-columns:1fr}}
.alerts-band h2{color:#fff}
.alerts-band p{color:#C9DAD4;margin:.6rem 0 1.4rem;max-width:50ch}
.notify{background:#ffffff10;border:1px solid #ffffff2b;border-radius:var(--radius);padding:1.5rem}
.notify label{display:block;font-size:.85rem;margin-bottom:.4rem;color:#DCEAE5}
.notify .row{display:flex;gap:.6rem;flex-wrap:wrap}
.notify input[type=email]{flex:1;min-width:200px;padding:.7rem .9rem;border-radius:10px;border:1px solid #ffffff44;background:#ffffff14;color:#fff;font:inherit}
.notify input::placeholder{color:#ffffff77}
.notify button{background:var(--marigold);border:none;color:#2A1E04;font:inherit;font-weight:600;padding:.7rem 1.3rem;border-radius:10px;cursor:pointer}
.notify .topics{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.9rem}
.notify .topics label{display:flex;align-items:center;gap:.35rem;font-size:.8rem;background:#ffffff12;border:1px solid #ffffff2b;padding:.3rem .7rem;border-radius:20px;margin:0;cursor:pointer}
.notify .ok{margin-top:.8rem;font-size:.85rem;color:#8FE3B8;display:none}
.notify .ok.show{display:block}

/* ===================================================================
   9. Events — base (homepage, unscoped) + archive override (`#list`)
   =================================================================== */
.event-list{display:grid;gap:.8rem}
.event{display:grid;grid-template-columns:86px 1fr auto;gap:1.2rem;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.3rem}
@media(max-width:600px){.event{grid-template-columns:70px 1fr}.event .btn-sm{grid-column:2}}
.date{font-family:var(--mono);text-align:center;background:var(--mist);border-radius:10px;padding:.55rem .3rem}
.date b{display:block;font-size:1.25rem;font-weight:500;color:var(--pine)}
.date span{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--stone)}
.event h3{font-family:var(--display);font-weight:600;font-size:1.05rem}
.event h3 a{color:inherit;text-decoration:none}
.event p{font-size:.86rem;color:var(--stone)}
.tag{display:inline-block;font-size:.68rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--lake);margin-bottom:.25rem}
.btn-sm{font-size:.85rem;font-weight:600;text-decoration:none;border:1.5px solid var(--pine);color:var(--pine);padding:.45rem 1rem;border-radius:20px;white-space:nowrap;display:inline-block;cursor:pointer;background:none}
.event.hide{display:none}

/* archive-only richer treatment, scoped by the `#list` container id that
   only the events archive template uses for its event-list */
#list.event-list .event,
#list .event{transition:transform .15s ease,box-shadow .15s ease}
#list .event:hover{transform:translateY(-2px);box-shadow:0 10px 24px #16352C12}
@media(max-width:640px){#list .event{grid-template-columns:70px 1fr}#list .event .btn-sm{grid-column:2;justify-self:start}}
#list .tag{font-size:.66rem;padding:.16rem .6rem;border-radius:20px;margin-bottom:.35rem;color:inherit}
#list .tag.festival{background:#F3E7CB;color:#7A5A08}
#list .tag.outdoors{background:#DFF3E7;color:#14603A}
#list .tag.heritage{background:#E5E1F2;color:#4A3D78}
#list .tag.kids{background:#FBE3DA;color:#8C3A22}
.where{font-family:var(--mono);font-size:.72rem;color:var(--pine);margin-top:.35rem;display:block}
#list .btn-sm:hover{background:var(--pine);color:#fff}
#list .btn-sm.full,.btn-sm.full{border-color:#C4CFC9;color:#8A9891;pointer-events:none}
.empty{display:none;text-align:center;color:var(--stone);padding:2.5rem 0}
.empty.show{display:block}

/* featured event banner + submit-band — events archive only */
.featured{display:grid;grid-template-columns:1.2fr 1fr;background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:1.8rem 0 2rem;box-shadow:0 10px 28px #16352C10}
@media(max-width:800px){.featured{grid-template-columns:1fr}}
.featured .art{min-height:220px}
.featured .art svg,.featured .art img{width:100%;height:100%;min-height:220px;display:block;object-fit:cover}
.featured .pad{padding:1.8rem}
.badge{display:inline-block;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;background:var(--marigold);color:#2A1E04;font-weight:600;padding:.28rem .8rem;border-radius:20px;margin-bottom:.9rem}
.featured h2{font-family:var(--display);font-weight:700;font-size:1.7rem;line-height:1.1;margin-bottom:.5rem}
.featured p{color:var(--stone);margin-bottom:1.1rem;max-width:48ch}
.featured .when{font-family:var(--mono);font-size:.8rem;color:var(--pine);margin-bottom:1.2rem}
.featured .btn{background:var(--pine);color:#fff;padding:.65rem 1.4rem;font-size:.95rem}

.submit-band{background:var(--pine);color:#fff;border-radius:18px;margin:2.4rem 0 3rem;padding:2.2rem;display:grid;grid-template-columns:1fr 1.1fr;gap:2.4rem;align-items:start}
@media(max-width:840px){.submit-band{grid-template-columns:1fr}}
.submit-band h2{font-family:var(--display);font-weight:600;font-size:1.6rem;margin-bottom:.6rem;color:#fff}
.submit-band .intro p{color:#C9DAD4;margin-bottom:1rem;max-width:44ch}
.steps{display:grid;gap:.7rem;font-size:.88rem;color:#DCEAE5}
.steps div{display:flex;gap:.7rem;align-items:start}
.steps span{flex:none;width:24px;height:24px;border-radius:50%;background:var(--marigold);color:#2A1E04;font-family:var(--mono);font-size:.78rem;display:grid;place-items:center;margin-top:.1rem}
.sform{background:#ffffff10;border:1px solid #ffffff2b;border-radius:14px;padding:1.5rem;display:grid;gap:.8rem}
.sform label{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#B9CFC7;display:block;margin-bottom:.3rem}
.sform input,.sform select,.sform textarea{width:100%;font:inherit;font-size:.92rem;border:1px solid #ffffff44;border-radius:10px;padding:.6rem .7rem;background:#ffffff14;color:#fff}
.sform input::placeholder,.sform textarea::placeholder{color:#ffffff77}
.sform select{color:#fff}
.sform select option{color:var(--ink)}
.sform .two{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
@media(max-width:520px){.sform .two{grid-template-columns:1fr}}
.sform button{background:var(--marigold);border:none;color:#2A1E04;font:inherit;font-weight:700;padding:.8rem;border-radius:10px;cursor:pointer}
.sform .ok{display:none;background:#DFF3E7;color:#14603A;border-radius:10px;padding:.8rem .9rem;font-size:.88rem}
.sform .ok.show{display:block}

/* ===================================================================
   10. Heritage card — reused for the homepage grid, heritage archive,
   and (deliberately, since no prototype covered these) the blog list /
   search results / generic CPT archive fallback
   =================================================================== */
.heritage{background:var(--paper)}
.her-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}
@media(max-width:840px){.her-grid{grid-template-columns:1fr}}
.her{display:grid;grid-template-columns:120px 1fr;gap:1.2rem;border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;background:var(--mist)}
@media(max-width:520px){.her{grid-template-columns:1fr}}
.her .art{border-radius:10px;overflow:hidden;min-height:110px}
.her .art svg,.her .art img{width:100%;height:100%;display:block;object-fit:cover}
.her h3{font-family:var(--display);font-weight:600;font-size:1.08rem;margin-bottom:.3rem}
.her h3 a{color:inherit;text-decoration:none}
.her p{font-size:.88rem;color:var(--stone);margin-bottom:.5rem}
.her .est{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--lake)}

/* ===================================================================
   11. Footer — the simple flex footer is the sitewide default (identical
   across stay-detail/events/trails prototypes); the homepage overrides it
   with the wide 4-column footer from naini-kumaon-prototype.html
   =================================================================== */
footer{background:var(--ink);color:#9FB5AD;padding:2.2rem 0;font-size:.85rem}
footer .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
footer a{color:#9FB5AD;text-decoration:none}
footer a:hover{color:var(--marigold)}
.fineprint{font-family:var(--mono);font-size:.74rem}

body.th-home footer{padding:3rem 0 2rem;font-size:.9rem}
body.th-home footer .wrap{display:block}
body.th-home .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;margin-bottom:2rem}
@media(max-width:840px){body.th-home .cols{grid-template-columns:1fr 1fr}}
body.th-home footer h4{color:#fff;font-family:var(--display);font-weight:600;font-size:.95rem;margin-bottom:.7rem}
body.th-home footer ul{list-style:none}
body.th-home footer li{margin-bottom:.45rem}
body.th-home .fineprint{border-top:1px solid #ffffff18;padding-top:1.2rem;font-size:.78rem}
.th-footer-social{display:flex;gap:.6rem;margin-top:.9rem}
.th-footer-social a{color:#9FB5AD;display:flex}
.th-footer-social a:hover{color:var(--marigold)}

/* ===================================================================
   12. Stay detail page (naini-kumaon-stay-detail.html)
   =================================================================== */
.crumb{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--stone);padding:1.4rem 0 .9rem}
.crumb a{color:var(--stone);text-decoration:none}
.crumb a:hover{color:var(--lake)}

.title-row{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
h1{font-family:var(--display);font-weight:700;font-size:clamp(1.7rem,4vw,2.5rem);line-height:1.08}
.meta{display:flex;gap:1.1rem;flex-wrap:wrap;margin-top:.45rem;font-size:.92rem;color:var(--stone)}
.meta .rate{font-family:var(--mono);font-size:.85rem;color:var(--pine)}
.tagchip{font-size:.72rem;font-weight:600;padding:.22rem .7rem;border-radius:20px;background:#D8ECF1;color:#0E5568;align-self:center}

.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:180px 180px;gap:.7rem;border-radius:18px;overflow:hidden;margin-bottom:2.2rem}
.gallery figure{margin:0;position:relative}
.gallery figure:first-child{grid-row:1/3}
.gallery svg,.gallery img{width:100%;height:100%;display:block;object-fit:cover}
.gallery .more{position:absolute;bottom:12px;right:12px;background:#ffffffe0;border:none;font:inherit;font-size:.82rem;font-weight:600;color:var(--pine);padding:.4rem .9rem;border-radius:20px;cursor:pointer}
@media(max-width:700px){.gallery{grid-template-columns:1fr 1fr;grid-template-rows:200px 120px}.gallery figure:first-child{grid-column:1/3;grid-row:1}}

.layout{display:grid;grid-template-columns:1.6fr 1fr;gap:2.6rem;align-items:start;padding-bottom:3.5rem}
@media(max-width:900px){.layout{grid-template-columns:1fr}}

.layout h2,.th-single-column h2{font-family:var(--display);font-weight:600;font-size:1.35rem;margin-bottom:.8rem}
.block{border-bottom:1px solid var(--line);padding:1.6rem 0}
.block:first-child{padding-top:0}
.host{display:flex;gap:1rem;align-items:center}
.avatar{width:52px;height:52px;border-radius:50%;background:var(--pine);color:var(--marigold);display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:1.3rem;flex:none}
.host p{font-size:.88rem;color:var(--stone)}
.host b{display:block;color:var(--ink);font-size:1rem}

.hl{display:grid;gap:1rem}
.hl div{display:flex;gap:.9rem;align-items:start}
.hl svg{flex:none;color:var(--lake);margin-top:.15rem}
.hl b{display:block;font-size:.95rem}
.hl span{font-size:.85rem;color:var(--stone)}

.desc p{color:#33443D;margin-bottom:.9rem;max-width:62ch}

.amenities ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
@media(max-width:520px){.amenities ul{grid-template-columns:1fr}}
.amenities li{display:flex;gap:.6rem;align-items:center;font-size:.92rem}
.amenities li svg{color:var(--lake);flex:none}

.review{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.2rem;margin-bottom:.8rem}
.review .who{display:flex;justify-content:space-between;font-size:.82rem;color:var(--stone);margin-bottom:.4rem}
.review .who b{color:var(--ink)}
.review p{font-size:.92rem}
.review .stars{font-family:var(--mono);color:var(--marigold);font-size:.8rem}

.book{position:sticky;top:84px;background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 34px #16352C14;padding:1.5rem}
.book .rateline{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1.1rem}
.book .rateline b{font-family:var(--display);font-size:1.5rem;font-weight:700}
.book .rateline b span{font-family:var(--body);font-size:.9rem;font-weight:400;color:var(--stone)}
.book .rateline .rr{font-family:var(--mono);font-size:.78rem;color:var(--pine)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:.6rem}
.fields .full{grid-column:1/3}
.field label{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);display:block;margin-bottom:.25rem}
.field input,.field select{width:100%;font:inherit;font-size:.92rem;border:1px solid var(--line);border-radius:10px;padding:.6rem .65rem;background:var(--mist);color:var(--ink)}
.reserve{width:100%;background:var(--marigold);border:none;color:#2A1E04;font:inherit;font-weight:700;font-size:1rem;padding:.85rem;border-radius:12px;cursor:pointer;margin:.6rem 0 .9rem}
.reserve:hover{filter:brightness(1.05)}
.reserve:disabled{opacity:.6;cursor:not-allowed}
.book .note{text-align:center;font-size:.8rem;color:var(--stone);margin-bottom:1rem}
.costs{display:grid;gap:.45rem;font-size:.92rem;border-top:1px dashed var(--line);padding-top:1rem}
.costs div{display:flex;justify-content:space-between}
.costs .muted{color:var(--stone)}
.costs .total{border-top:1px solid var(--line);padding-top:.6rem;margin-top:.3rem;font-weight:700}
.ok-msg{display:none;background:#DFF3E7;color:#14603A;border-radius:10px;padding:.8rem .9rem;font-size:.88rem;margin-top:.9rem}
.ok-msg.show{display:block}
.ok-msg.error{background:#F9DEDA;color:#8C2F22}

/* ===================================================================
   13. Page-head banner — trails/events archive gradient band, reused
   for every screen that had no bespoke prototype (blog, pages, search,
   generic CPT archives, 404)
   =================================================================== */
.page-head{background:linear-gradient(180deg,var(--pine),#1D4A50);color:#fff;padding:2.6rem 0 2.4rem}
.page-head .crumb{color:#9FCBBE;padding:0 0 .8rem}
.page-head .crumb a{color:#9FCBBE}
.page-head .crumb a:hover{color:var(--marigold)}
.page-head h1{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,4.5vw,3rem);line-height:1.05}
.page-head p{margin-top:.7rem;color:#DCEAE5;max-width:56ch}

/* ===================================================================
   14. New, undesigned screens — blog, page content, search, 404,
   built from the same tokens/components rather than inventing a
   different visual language
   =================================================================== */
.th-blog-layout{display:grid;grid-template-columns:2.2fr 1fr;gap:2.6rem;align-items:start;padding:2rem 0}
@media(max-width:900px){.th-blog-layout{grid-template-columns:1fr}}
.th-sidebar .widget{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;margin-bottom:1.2rem}
.th-sidebar .widget-title{font-family:var(--display);font-weight:600;font-size:1rem;margin-bottom:.6rem}
.th-page-content{max-width:72ch;padding:1rem 0 2rem}
.th-page-content p{margin-bottom:1rem;color:#33443D}
.th-page-content h2,.th-page-content h3{font-family:var(--display);margin:1.4rem 0 .6rem}
.th-single-thumb{border-radius:var(--radius);overflow:hidden;margin:1rem 0}
.th-single-thumb img{width:100%;display:block}
.th-post-tags{font-size:.85rem;color:var(--stone);margin-bottom:1rem}
.th-share-links{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:1.5rem 0}
.th-related{padding:2rem 0}
.th-reviews{border:none}
.th-single-column{max-width:72ch;margin:0 auto;padding-bottom:3rem}
.th-404{text-align:center;padding:5rem 0;max-width:56ch;margin:0 auto}
.th-404 .cta-row{justify-content:center;margin:1.6rem 0}
.th-404-search form{max-width:420px;margin:0 auto}

/* WordPress default search form + comment form, tokenized to match */
.search-form{display:flex;gap:.5rem;flex-wrap:wrap}
.search-form label{flex:1}
.search-field{width:100%;padding:.7rem .9rem;border:1px solid var(--line);border-radius:10px;font:inherit}
.search-submit{background:var(--pine);color:#fff;border:none;padding:.7rem 1.3rem;border-radius:10px;font:inherit;font-weight:600;cursor:pointer}
.comment-respond{margin-top:1.5rem}
.comment-respond textarea,.comment-respond input[type=text],.comment-respond input[type=email],.comment-respond input[type=url]{width:100%;font:inherit;border:1px solid var(--line);border-radius:10px;padding:.6rem .7rem;margin-bottom:.7rem;background:var(--mist)}
.comment-respond .comment-form-comment label,.comment-respond p label{display:block;font-size:.85rem;margin-bottom:.3rem;color:var(--stone)}

footer.widget,.th-widget{background:transparent}

/* ===================================================================
   15. Utility
   =================================================================== */
.description{color:var(--stone)}