/* hozugawariverboatride.com — "Old Money" design system (design.md).
   Hunter green ink, gold leaf accent, embossed cream surfaces.
   Cormorant Garamond display / EB Garamond body / Inter labels.
   Flat by design: no gradients, near-square corners, ONE accent action
   per screen. The gold is load-bearing — never pair it with a second accent. */

:root{
  --ink:#1F3A2C;        /* primary: headlines & core text */
  --sage:#7B8271;       /* secondary: borders, meta, captions */
  --coral:#B89155;      /* tertiary: the single interaction accent */
  --coral-ink:#8A6A38;  /* readable orange (same hue) for link/body text */
  --coral-dk:#A17C42;   /* button hover */
  --neutral:#F0EADB;    /* page foundation */
  --surface:#F8F1DF;    /* card / panel surface */
  --white:#FFFFFF;
  --line:#DDD3BD;
  --gold-soft:rgba(184,145,85,.16);   /* gold at hairline strength */
  --ink-soft:rgba(31,58,44,.08);
  --font-display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --font-body:"EB Garamond",Georgia,"Times New Roman",serif;
  --font-ui:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --r-sm:0px;
  --r-md:2px;
  --r-lg:4px;
  --shadow:0 1px 0 rgba(31,58,44,.06), 0 8px 24px -18px rgba(31,58,44,.55);
  --maxw:1120px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:18px;line-height:1.6;color:var(--ink);background:var(--white);
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
img{max-width:100%;height:auto;display:block}
a{color:var(--coral-ink);text-decoration:none}
a:hover{text-decoration:underline}

h1,h2,h3,.logo,.display{font-family:var(--font-display);font-weight:600;letter-spacing:-.012em;line-height:1.1}
h1{font-size:2.3rem;margin:.1em 0 .5em;font-weight:800;letter-spacing:-.04em}
h2{font-size:1.7rem;margin:2.2em 0 .6em}
h3{font-size:1.2rem;margin:1.6em 0 .4em}
h4{font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sage);margin:0 0 .6em}
p{margin:0 0 1.05em}
@media(max-width:640px){h1{font-size:1.85rem}h2{font-size:1.4rem}}

.label{font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--coral-ink);margin:0 0 .5em}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;background:var(--coral);color:#fff;font-family:var(--font-ui);font-weight:600;
  font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;
  padding:12px 20px;border-radius:var(--r-md);border:2px solid var(--coral);
  transition:background .15s,border-color .15s;text-align:center;
}
.btn:hover{background:var(--coral-dk);border-color:var(--coral-dk);text-decoration:none;color:#fff}
.btn-ghost{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}

/* ---------- header ---------- */
.site-head{position:sticky;top:0;z-index:40;background:var(--white);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;gap:18px;height:66px}
.logo{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:1.1rem;font-weight:700;letter-spacing:-.02em}
.logo:hover{text-decoration:none}
.logo .mark{width:30px;height:30px;flex:0 0 auto}
.nav{margin-left:auto;display:flex;align-items:center;gap:24px}
.nav a{color:var(--ink);font-family:var(--font-ui);font-weight:600;font-size:.92rem;letter-spacing:.01em}
.nav a:hover{color:var(--coral-ink);text-decoration:none}
.nav a.btn{color:#fff}
.nav a.btn:hover{color:#fff}
.nav-toggle{display:none;margin-left:auto;background:none;border:0;font-size:1.5rem;color:var(--ink);cursor:pointer}
@media(max-width:860px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;gap:0;
        background:var(--white);border-bottom:1px solid var(--line);padding:8px 22px 16px}
  .nav.open{display:flex}
  .nav a{padding:11px 0;border-bottom:1px solid var(--line);width:100%}
  .nav a.btn{margin-top:10px;text-align:center}
}

/* ---------- breadcrumb ---------- */
.crumb{font-family:var(--font-ui);font-weight:600;font-size:.74rem;color:var(--sage);padding:14px 22px 0;text-transform:uppercase;letter-spacing:.05em}
.crumb a{color:var(--sage)}

/* ---------- hero (flat solid overlay, not a gradient) ---------- */
.hero{position:relative;background:var(--ink) center/cover no-repeat;background-image:url('/images/hero.jpg');color:#fff;border-bottom:4px solid var(--coral)}
.hero{background-image:-webkit-image-set(url('/images/hero.webp') type('image/webp'),url('/images/hero.jpg') type('image/jpeg'));background-image:image-set(url('/images/hero.webp') type('image/webp'),url('/images/hero.jpg') type('image/jpeg'))}
.hero::before{content:"";position:absolute;inset:0;background:rgba(21,24,24,.44)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;background:linear-gradient(180deg,rgba(21,24,24,0),rgba(21,24,24,.72))}
.hero .wrap{position:relative;z-index:1;padding:163px 22px 145px;min-height:550px;display:flex;flex-direction:column;justify-content:center}
.hero-copy{max-width:52%}
.hero .label{color:#FFC9B0;opacity:.98}
.hero h1{font-size:3.2rem;margin:0 0 .35em;color:#fff;font-weight:800;letter-spacing:-.045em}
.hero .lede{font-size:1.18rem;color:#ECEDEA;margin-bottom:1.5em;line-height:1.5}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:1.6em}
.hero .btn-ghost{color:#fff;border-color:#fff}
.hero .btn-ghost:hover{background:#fff;color:var(--ink)}
.hero-trust{font-size:.95rem;color:#D9DBD7;margin:0}
.hero-trust b{color:#fff}
@media(max-width:900px){.hero-copy{max-width:100%}}
@media(max-width:640px){.hero h1{font-size:2.1rem}.hero .wrap{padding:64px 22px 56px;min-height:0}}

/* ---------- tour-data facts strip (under hero) ---------- */
.facts-strip{background:var(--surface);border-bottom:1px solid var(--line)}
.facts-strip .wrap{display:flex;flex-wrap:wrap;padding:0}
.facts-item{flex:1 1 0;min-width:150px;padding:16px 22px;border-right:1px solid var(--line)}
.facts-item:last-child{border-right:0}
.facts-val{font-family:var(--font-ui);font-weight:800;font-size:1.18rem;line-height:1.05;color:var(--ink);letter-spacing:-.02em}
.facts-val .star{color:var(--coral)}
.facts-label{font-family:var(--font-ui);font-size:.7rem;font-weight:600;color:var(--sage);text-transform:uppercase;letter-spacing:.06em;margin-top:.45em}
@media(max-width:780px){.facts-item{flex:1 1 50%;min-width:0;border-bottom:1px solid var(--line)}.facts-item:nth-child(2n){border-right:0}}
@media(max-width:420px){.facts-item{flex:1 1 100%;border-right:0}}

/* ---------- on-page jump bar (sticky anchor menu, homepage) ---------- */
.section-nav{position:sticky;top:66px;z-index:30;background:var(--ink);border-bottom:1px solid var(--ink)}
.section-nav .wrap{display:flex;gap:0;padding:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.section-nav .wrap::-webkit-scrollbar{display:none}
.section-nav a{flex:0 0 auto;display:inline-block;padding:13px 18px;color:#fff;
  font-family:var(--font-ui);font-weight:600;font-size:.82rem;letter-spacing:.02em;white-space:nowrap;border-right:1px solid rgba(255,255,255,.12)}
.section-nav a:hover{background:var(--coral);color:#fff;text-decoration:none}
@media(max-width:780px){.section-nav{top:0}.section-nav a{padding:12px 15px;font-size:.8rem}}

/* ---------- explore link cluster (keyword interlinks, above footer) ---------- */
.explore{margin:2.4em 0 0;padding:26px 0 0;border-top:2px solid var(--ink)}
.explore h2{margin:0 0 .7em}
.explore-links{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 26px}
.explore-links a{display:block;font-family:var(--font-ui);font-size:.92rem;font-weight:500;
  color:var(--ink);padding:6px 0 6px 16px;border-left:3px solid var(--coral);line-height:1.35}
.explore-links a:hover{color:var(--coral-ink);border-left-color:var(--coral-ink)}
@media(max-width:780px){.explore-links{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.explore-links{grid-template-columns:1fr}}

/* ---------- main / prose ---------- */
.section-pad{padding-top:40px;padding-bottom:64px}
.prose{max-width:760px;margin:0 auto}
.prose.wide{max-width:960px}
.prose ul,.prose ol{margin:0 0 1.15em;padding-left:1.2em}
.prose li{margin:.32em 0}
ul.check{list-style:none;padding-left:0}
ul.check li{position:relative;padding-left:1.7em;margin:.5em 0}
ul.check li::before{content:"\2192";position:absolute;left:0;top:0;color:var(--coral-ink);font-weight:700}

/* page-hero banner inside articles */
.page-hero{margin:0 0 1.6em;border-radius:var(--r-lg);overflow:hidden}
.page-hero img{width:100%;max-height:380px;object-fit:cover}

/* ---------- answer box ---------- */
.answer-box{background:var(--neutral);border-left:5px solid var(--coral);padding:20px 24px;margin:0 0 1.8em;border-radius:0 var(--r-md) var(--r-md) 0}
.answer-box p{margin:0}
.answer-box strong{color:var(--ink)}
.answer-box a{text-decoration:underline;text-underline-offset:2px}

/* ---------- key takeaways (homecontent.TAKEAWAYS) ---------- */
.ia-takeaways{background:var(--ink);border-radius:16px;padding:26px 30px;margin:34px 0;color:rgba(255,255,255,.92)}
.ia-takeaways h2{color:#fff;margin:0 0 14px;font-size:1.25rem}
.ia-takeaways ul{list-style:none;margin:0;padding:0}
.ia-takeaways li{position:relative;padding:7px 0 7px 30px;line-height:1.55;border-bottom:1px solid rgba(255,255,255,.14)}
.ia-takeaways li:last-child{border-bottom:0}
.ia-takeaways li::before{content:"\2713";position:absolute;left:2px;top:7px;color:var(--accent,var(--coral));font-weight:700}
.ia-takeaways b,.ia-takeaways strong{color:#fff}
.ia-takeaways a{color:var(--accent,var(--coral));filter:brightness(1.35);text-decoration-color:rgba(255,255,255,.35)}
.ia-takeaways a:hover{color:#fff;filter:none}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:.96rem}
th,td{text-align:left;padding:11px 13px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--ink);color:#fff;font-family:var(--font-ui);font-weight:600;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}

/* ---------- tip / keyfacts / proscons ---------- */
.tip{background:var(--neutral);border:2px solid var(--coral);border-radius:var(--r-md);padding:16px 20px;margin:1.5em 0}
.tip-label{display:inline-block;font-family:var(--font-ui);font-weight:600;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--coral-ink);margin-bottom:.3em}
.tip p{margin:0}

.keyfacts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;margin:1.6em 0}
.keyfacts div{background:var(--surface);padding:14px 16px}
.kf-label{display:block;font-family:var(--font-ui);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sage);font-weight:600;margin-bottom:3px}
.keyfacts b{font-size:1.02rem}
@media(max-width:640px){.keyfacts{grid-template-columns:repeat(2,1fr)}}

.proscons{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:1.6em 0}
.pc{border:2px solid var(--line);border-radius:var(--r-md);padding:18px 20px;background:var(--surface)}
.pc ul{list-style:none;margin:0;padding:0}
.pc li{position:relative;padding-left:1.6em;margin:.5em 0}
.pros{border-color:var(--coral)}
.pros li::before{content:"\2713";position:absolute;left:0;color:var(--coral-ink);font-weight:700}
.cons li::before{content:"!";position:absolute;left:.25em;color:var(--sage);font-weight:700}
@media(max-width:640px){.proscons{grid-template-columns:1fr}}

.inclist{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:1.6em 0}
.inclist>div{border:2px solid var(--line);border-radius:var(--r-md);padding:18px 20px;background:var(--surface)}
.inclist h4{margin:0 0 .5em;font-family:var(--font-ui);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.inclist ul{list-style:none;margin:0;padding:0}
.inclist li{position:relative;padding-left:1.6em;margin:.5em 0}
.inclist .inc{border-color:var(--coral)}
.inclist .inc h4{color:var(--coral-ink)}
.inclist .inc li::before{content:"\2713";position:absolute;left:0;color:var(--coral-ink);font-weight:700}
.inclist .exc h4{color:var(--sage)}
.inclist .exc li::before{content:"\00d7";position:absolute;left:.15em;color:var(--sage);font-weight:700}
@media(max-width:640px){.inclist{grid-template-columns:1fr}}

/* ---------- scorecard (review pages) ---------- */
.scorecard{display:grid;grid-template-columns:200px 1fr;gap:0;border:2px solid var(--ink);border-radius:var(--r-md);overflow:hidden;margin:0 0 1.8em}
.sc-score{background:var(--ink);color:#fff;padding:22px;display:flex;flex-direction:column;justify-content:center;text-align:center}
.sc-big{font-family:var(--font-ui);font-weight:800;font-size:3rem;line-height:1;letter-spacing:-.03em}
.sc-stars{color:var(--coral);letter-spacing:2px;margin:.2em 0}
.sc-rev{font-size:.8rem;color:#D9DBD7}
.sc-price{margin-top:.5em;font-weight:700;color:#fff}
.sc-specs{padding:8px 22px;background:var(--surface)}
.sc-row{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.sc-row:last-child{border-bottom:0}
.sc-row span{color:var(--sage)}
.sc-row b{text-align:right}
@media(max-width:560px){.scorecard{grid-template-columns:1fr}}

/* ---------- review hub cards ---------- */
.rev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:1.5em 0 .4em}
@media(max-width:600px){.rev-grid{grid-template-columns:1fr}}
.rev-card{display:flex;flex-direction:column;border:2px solid var(--line);border-radius:var(--r-lg);padding:0;overflow:hidden;background:var(--surface);color:var(--ink);transition:border-color .15s}
.rev-card:hover{border-color:var(--coral);text-decoration:none}
.rev-thumb{margin:0;aspect-ratio:16/9;overflow:hidden;background:var(--ink)}
.rev-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.rev-card:hover .rev-thumb img{transform:scale(1.04)}
.rev-body{display:flex;flex-direction:column;flex:1;padding:16px 20px 18px}
.rev-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:.6em}
.rev-score{font-family:var(--font-ui);font-weight:800;font-size:1.3rem;line-height:1;color:var(--ink)}
.rev-stars{color:var(--coral);letter-spacing:1px;font-size:.9rem}
.rev-count{font-family:var(--font-ui);font-weight:500;font-size:.72rem;color:var(--sage)}
.rev-card h3{font-weight:700;font-size:1.05rem;line-height:1.3;margin:0 0 .4em}
.rev-card p{font-size:.92rem;color:var(--sage);margin:0 0 1em}
.rev-price{font-weight:700;font-size:.9rem;margin-top:auto}
.rev-more{display:block;color:var(--coral-ink);font-family:var(--font-ui);font-weight:600;font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;margin-top:.5em}

/* ---------- tour cards ---------- */
.tours-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:20px;margin:1.5em 0 .4em}
.tours-grid.cols-4{grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:860px){.tours-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1024px){.tours-grid.cols-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tours-grid,.tours-grid.cols-4{grid-template-columns:1fr}}
.tour{border:2px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--surface);display:flex;flex-direction:column;transition:border-color .15s}
.tour:hover{border-color:var(--coral)}
/* whole card is an <a> (see helpers._card) — kill link styling, keep hover feedback */
a.tour{color:inherit;text-decoration:none}
a.tour:hover .btn{filter:brightness(1.08)}
.thumb{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--neutral)}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.badge{position:absolute;top:10px;left:10px;background:var(--coral);color:#fff;font-family:var(--font-ui);font-weight:600;font-size:.64rem;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:var(--r-sm)}
.tour-body{padding:16px 16px 18px;display:flex;flex-direction:column;flex:1}
.tour-body h3{font-size:1.02rem;margin:0 0 .45em;line-height:1.25;font-weight:700}
.rate{font-size:.85rem;color:var(--sage);margin-bottom:.5em}
.star{color:var(--coral)}
.price{font-weight:700;margin-bottom:.8em}
.price span{font-weight:400;color:var(--sage);font-size:.85rem}
.tour-body .btn{margin-top:auto}
/* decorative desert filler tile (rounds out incomplete card rows on desktop) */
.tour-filler{position:relative;border:2px dashed #e0c4ad;background:var(--neutral);align-items:center;justify-content:center;min-height:180px}
.tour-filler:hover{border-color:#e0c4ad}
.tour-filler .filler-art{position:absolute;inset:0;width:100%;height:100%;opacity:.6}
.tour-filler .filler-label{position:relative;font-family:var(--font-ui);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:.64rem;color:var(--sage);background:rgba(244,245,242,.78);padding:5px 11px;border-radius:var(--r-sm)}
@media(max-width:860px){.tour-filler{display:none}}

/* ---------- book-card (docked chip availability) ---------- */
.book-card{position:relative;border:2px solid var(--ink);border-radius:var(--r-md);padding:26px 18px 14px;margin:1.6em 0;background:var(--surface)}
.book-chip{position:absolute;top:-13px;left:18px;background:var(--coral);color:#fff;font-family:var(--font-ui);font-weight:600;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:var(--r-sm)}
.gyg-frame{min-height:220px}

/* ---------- comparison table ---------- */
.cmp-wrap{overflow-x:auto;margin:1.8em 0}
/* Break the comparison table out of the 760px prose column so it has more room
   to breathe. Prose has ~158px of slack each side inside .wrap, so -110px is safe. */
@media(min-width:1080px){.cmp-wrap{margin-left:-110px;margin-right:-110px}}
table.cmp{border-collapse:separate;border-spacing:0;min-width:640px;width:100%;font-size:1.02rem}
table.cmp th,table.cmp td{border:0;border-bottom:1px solid var(--line);padding:16px 20px;background:var(--surface)}
table.cmp thead th{background:var(--neutral);color:var(--ink);vertical-align:bottom;text-transform:none;letter-spacing:-.01em;font-family:var(--font-ui);font-weight:700}
table.cmp .rowlabel{font-family:var(--font-ui);font-weight:600;color:var(--sage);font-size:.82rem;text-transform:uppercase;letter-spacing:.04em}
table.cmp .feat{background:var(--neutral);border-left:2px solid var(--coral);border-right:2px solid var(--coral)}
table.cmp thead .feat{border-top:2px solid var(--coral)}
table.cmp tr.cmp-book .feat{border-bottom:2px solid var(--coral)}
.cmp-badge{display:inline-block;background:var(--coral);color:#fff;font-family:var(--font-ui);font-weight:600;font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border-radius:var(--r-sm);margin-bottom:6px}
.feat-title{display:block;font-family:var(--font-ui);font-weight:800;font-size:1.12rem;letter-spacing:-.02em}
.col-alt{color:var(--ink)}
table.cmp .btn{width:100%;padding:11px 10px;font-size:.76rem}

/* ---------- gallery ---------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:1.8em 0}
.gallery figure{margin:0;position:relative;border-radius:var(--r-md);overflow:hidden}
.gallery img{width:100%;aspect-ratio:3/4;object-fit:cover}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;background:rgba(21,24,24,.82);color:#fff;font-family:var(--font-ui);font-weight:600;font-size:.72rem;padding:14px 12px 9px;text-transform:uppercase;letter-spacing:.04em}
@media(max-width:760px){.gallery{grid-template-columns:repeat(2,1fr)}}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:1.5em 0;counter-reset:s}
.step{border-top:3px solid var(--coral);padding:14px 4px 0;counter-increment:s}
.step::before{content:counter(s);font-family:var(--font-ui);font-weight:800;font-size:1.5rem;color:var(--coral-ink);display:block;margin-bottom:.1em}
.step h3{margin:0 0 .25em;font-size:1.05rem}
.step p{font-size:.9rem;color:var(--sage);margin:0}
@media(max-width:760px){.steps{grid-template-columns:repeat(2,1fr)}}

/* ---------- reviews band ---------- */
.reviews-band{background:var(--neutral);border-radius:var(--r-lg);padding:24px;margin:1.8em 0}
.reviews-head{display:flex;align-items:center;gap:18px}
.reviews-head .big{font-family:var(--font-ui);font-weight:800;font-size:3rem;color:var(--ink);line-height:1;letter-spacing:-.03em}
.reviews-head .stars{color:var(--coral);font-size:1.1rem;letter-spacing:2px}

/* ---------- honest guide ---------- */
.honest-guide{background:var(--neutral);border-radius:var(--r-lg);padding:32px 30px;margin:2.4em 0}
.honest-guide h2{margin-top:0}
.honest-guide .lead{font-size:1.1rem;color:var(--ink)}
.honest-guide h3{margin-top:1.5em}
.guide-fig{margin:1.5em 0}
.guide-fig img{width:100%;max-height:340px;object-fit:cover;border-radius:var(--r-md)}
.guide-fig figcaption{font-size:.84rem;color:var(--sage);margin-top:.5em;font-style:italic}

/* ---------- FAQ ---------- */
.faq{margin:1em 0}
.faq details{border-bottom:1px solid var(--line);padding:4px 0}
.faq summary{cursor:pointer;font-weight:600;padding:14px 30px 14px 0;position:relative;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:12px;color:var(--coral-ink);font-weight:700;font-size:1.3rem}
.faq details[open] summary::after{content:"\2212"}
.faq-body{padding:0 0 12px}
.faq-body p{margin:0}
.faq-contact{margin:1.1em 0 .2em;font-weight:600;color:var(--ink)}
.faq-contact a{color:var(--coral-ink)}

/* ---------- disclosure ---------- */
.disclosure{font-size:.84rem;color:var(--sage);background:var(--neutral);border-radius:var(--r-md);padding:13px 16px;margin:1em 0 1.6em}
.disclosure a{color:var(--coral-ink)}

/* related strip */
.related{border-top:2px solid var(--ink);margin-top:2.4em;padding-top:1.2em}

/* sitemap */
.sitemap-list{list-style:none;padding-left:0}
.sitemap-list li{margin:.4em 0;padding-left:1.2em;position:relative}
.sitemap-list li::before{content:"\2192";position:absolute;left:0;color:var(--coral-ink)}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:#C9CCC7;margin-top:40px;border-top:4px solid var(--coral)}
.site-foot .wrap{padding:48px 22px 30px}
.foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.4fr;gap:32px}
.site-foot .brand .logo{color:#fff;margin-bottom:.6em}
.site-foot .brand p{font-size:.9rem;max-width:34em}
.site-foot h4{color:#fff;margin-bottom:.8em}
.site-foot ul{list-style:none;margin:0;padding:0}
.site-foot li{margin:.4em 0}
.site-foot a{color:#C9CCC7;font-size:.92rem}
.site-foot a:hover{color:#fff}
.foot-guides{margin-top:30px;border-top:1px solid #2c2f2f;padding-top:20px}
.foot-guides ul{display:flex;flex-wrap:wrap;gap:8px 26px}
.foot-answers{margin-top:26px;border-top:1px solid #2c2f2f;padding-top:20px;display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 18px}
.foot-answers .label{font-family:var(--font-ui);font-weight:600;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:#8d918c}
.foot-answers nav{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot-answers a{color:#C9CCC7;font-size:.86rem}
.foot-answers a:hover{color:#fff}
.foot-facts{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:22px;border-top:1px solid #2c2f2f;padding-top:22px}
.foot-facts .kf-label,.foot-facts .label{display:block;font-family:var(--font-ui);font-weight:600;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:#8d918c;margin-bottom:3px}
.foot-facts b{color:#fff;font-size:.92rem}
.foot-searches{margin-top:22px;border-top:1px solid #2c2f2f;padding-top:20px}
.foot-searches h4{font-family:var(--font-ui);font-weight:600;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:#8d918c;margin:0 0 12px}
.foot-searches ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.foot-searches li{margin:0}
.foot-searches a{display:inline-block;padding:5px 11px;border:1px solid #2c2f2f;border-radius:999px;font-size:.78rem;color:#9fa39d;line-height:1.3;transition:color .15s,border-color .15s,background .15s}
.foot-searches a:hover{color:#fff;border-color:var(--coral);background:rgba(255,255,255,.05)}
.foot-bottom{margin-top:28px;border-top:1px solid #2c2f2f;padding-top:18px;font-family:var(--font-ui);font-size:.74rem;color:#8d918c}
.foot-bottom a{color:#C9CCC7}
@media(max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr}.foot-facts{grid-template-columns:repeat(2,1fr)}}

/* ---------- homepage: "what's included" two-column ---------- */
.includes{margin:2.2em 0;background:var(--surface);border:2px solid var(--line);border-radius:var(--r-lg);padding:26px 26px 22px}
.includes h2{margin:0 0 .25em}
.includes-lead{color:var(--sage);margin:0 0 1.2em;font-size:1rem}
.includes-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.includes-col h3{font-family:var(--font-ui);font-weight:700;font-size:1.12rem;color:var(--ink);margin:0 0 .55em;padding-bottom:.4em;border-bottom:2px solid var(--coral);display:inline-block}
.includes-col ul.check{margin:0}
.includes-col .muted{color:var(--sage);font-style:italic}
@media(max-width:680px){.includes{padding:20px}.includes-grid{grid-template-columns:1fr;gap:18px}}

/* ---------- homepage: route / "what you see, in order" (AEO) ---------- */
.route{margin:2.4em 0}
.route h2{margin:0 0 .25em}
.route-lead{color:var(--sage);margin:0 0 1.1em;font-size:1rem}
.route-stops{list-style:none;margin:1.4em 0;padding:0;counter-reset:stop}
.route-stops li{counter-increment:stop;position:relative;padding:0 0 1.1em 3.2em;margin:0}
.route-stops li:before{content:counter(stop);position:absolute;left:0;top:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background:var(--coral);color:#fff;font-family:var(--font-ui);font-size:.85rem;font-weight:600;border-radius:var(--r-sm)}
.route-stops li:not(:last-child):after{content:"";position:absolute;left:.95rem;top:2rem;bottom:.2em;width:2px;background:var(--line)}
.route-stops li strong{color:var(--ink)}

/* ---------- homepage: wide photo gallery (breaks out of prose) ---------- */
.photo-wide{position:relative;left:50%;transform:translateX(-50%);width:min(1180px,94vw);margin:2.6em 0}
.photo-wide-head{text-align:center;max-width:44em;margin:0 auto 1.2em}
.photo-wide-head h2{margin:.15em 0 .3em}
.photo-wide-sub{color:var(--sage);margin:0}
.photo-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.photo-strip .shot{margin:0;border-radius:var(--r-md);overflow:hidden;background:var(--neutral)}
.photo-strip .shot img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .4s ease}
.photo-strip .shot:hover img{transform:scale(1.06)}
@media(max-width:760px){.photo-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.photo-strip{grid-template-columns:1fr}}

/* ---------- homepage: guest testimonials (breaks out of prose) ---------- */
.testimonials{position:relative;left:50%;transform:translateX(-50%);width:min(1180px,94vw);margin:2.8em 0 2.2em}
.testimonials h2{text-align:center;margin:0 0 .25em}
.t-lead{text-align:center;color:var(--sage);margin:0 0 1.4em}
.t-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.t-card{margin:0;background:var(--white);border:2px solid var(--line);border-radius:var(--r-lg);padding:20px 20px 16px;display:flex;flex-direction:column}
.t-stars{display:none}
.t-card blockquote{margin:0 0 1em;font-size:.96rem;line-height:1.55;color:var(--ink)}
.t-card figcaption{margin-top:auto;border-top:1px solid var(--line);padding-top:.7em}
.t-name{display:block;font-family:var(--font-ui);font-weight:700;font-size:.86rem;color:var(--ink)}
.t-tour{display:block;font-family:var(--font-ui);font-size:.74rem;color:var(--sage);margin-top:2px}
.t-foot{text-align:center;color:var(--sage);font-size:.9rem;margin:1.4em 0 0}
@media(max-width:860px){.t-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.t-grid{grid-template-columns:1fr}}
/* ===== CTR features (opt-in; render only when the site defines them) =====
   _ladder / _town_chips / _book_bar in build_home.py + fee/perday in helpers.
   First shipped on yellowstonetourpackages.com. Recolor per site theme. */
/* entry-fee badge on card thumbs (tour dict: "fee_inc" / "fee_badge") */
.fee-badge{position:absolute;left:10px;bottom:10px;background:#2E5D3A;color:#fff;
  font-size:.72rem;font-weight:700;letter-spacing:.02em;padding:4px 9px;border-radius:4px}
/* price-per-day subtext (tour dict: "perday") */
.perday{font-size:.8rem;color:var(--sage);margin:-4px 0 10px}
/* duration/decision ladder band (homecontent: LADDER) */
.ladder-band{background:var(--ink);color:var(--neutral);padding:34px 0 40px}
.ladder-band h2{color:var(--neutral);font-size:1.45rem;margin:0 0 18px}
.ladder{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ladder-col{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.22);
  border-radius:10px;padding:20px 18px;display:flex;flex-direction:column}
.ladder-col.feat{background:var(--surface);color:var(--ink);border-color:var(--surface)}
.ladder-col.feat p{color:var(--ink)}
.ladder-days{font-weight:700;font-size:1.05rem;letter-spacing:.03em;text-transform:uppercase}
.ladder-price{color:var(--coral);font-weight:700;font-size:1.3rem;margin:4px 0 8px}
.ladder-col.feat .ladder-price{color:var(--coral-ink)}
.ladder-col p{font-size:.9rem;line-height:1.5;margin:0 0 16px;color:rgba(255,255,255,.85);flex:1}
.ladder-col .btn{align-self:flex-start}
.ladder-col .btn.ghost{background:transparent;border:1.5px solid rgba(255,255,255,.5);color:var(--neutral)}
.ladder-col .btn.ghost:hover{border-color:var(--coral);color:var(--coral)}
@media(max-width:760px){.ladder{grid-template-columns:1fr}}
/* departure-town chips (auto when 2+ tours carry "town") */
.town-chips{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:6px 0 18px}
.chips-label{font-size:.85rem;color:var(--sage);font-weight:600}
.town-chips .chip{background:var(--neutral);border:1px solid var(--line);border-radius:999px;
  padding:6px 14px;font:inherit;font-size:.85rem;cursor:pointer;color:var(--ink)}
.town-chips .chip.on{background:var(--ink);color:var(--neutral);border-color:var(--ink)}
.town-chips .chip:hover{border-color:var(--coral)}
/* sticky mobile book-bar (homecontent: BOOK_BAR) */
.book-bar{display:none}
@media(max-width:760px){
  .book-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:var(--ink);color:var(--neutral);align-items:center;justify-content:space-between;
    gap:10px;padding:10px 14px;box-shadow:0 -3px 12px rgba(0,0,0,.25)}
  .book-bar span{font-size:.85rem;font-weight:600}
  .book-bar .btn{padding:9px 16px;font-size:.85rem}
  body{padding-bottom:58px}
}

/* ==================================================================== */
/* Conversion + EEAT layer (piloted on okavangodeltasafaritours.com)    */

/* cancel-note under availability widgets (conversion layer) */
.cancel-note{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:.82rem;color:var(--sage)}

/* anchored-price band (opt-in via homecontent PRICE_ANCHOR) */
.price-anchor{margin:34px 0;padding:26px 26px 28px;background:var(--surface);
  border:1px solid var(--line);border-radius:14px}
.price-anchor h2{margin:0 0 18px;font-size:1.25rem}
.pa-row{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:stretch}
.pa-col{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:10px}
.pa-was{background:var(--neutral);border:1px dashed var(--line)}
.pa-now{background:var(--ink);color:#fff;border:1px solid var(--ink)}
.pa-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;opacity:.75;font-weight:700}
.pa-price{font-size:2rem;font-weight:800;line-height:1.1}
.pa-was .pa-price{color:var(--sage)}
.pa-now .pa-price{color:#fff}
.pa-note{font-size:.85rem;line-height:1.45;opacity:.85}
.pa-vs{align-self:center;font-weight:800;color:var(--sage);font-size:.9rem;
  text-transform:uppercase;letter-spacing:.08em}
.pa-now .btn{margin-top:12px;align-self:flex-start;background:var(--accent);border-color:var(--accent)}
@media(max-width:720px){.pa-row{grid-template-columns:1fr}.pa-vs{justify-self:center;padding:2px 0}}

/* real-photo trust strip (opt-in via homecontent REAL_STRIP; Wikimedia Commons, credited) */
.real-strip{margin:38px 0}
.real-strip>h2{text-align:center}
.real-strip>p{color:var(--sage);margin-top:4px;text-align:center;max-width:820px;margin-left:auto;margin-right:auto}
.real-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.real-grid figure{margin:0}
.real-grid img{width:100%;aspect-ratio:3/2;height:auto;object-fit:cover;border-radius:10px;display:block}
.real-grid figcaption{font-size:.76rem;color:var(--sage);margin-top:6px;line-height:1.4}
.real-grid figcaption a{color:inherit;text-decoration:underline;text-underline-offset:2px}
@media(max-width:720px){.real-grid{grid-template-columns:1fr}}
/* breakout: same width as the testimonials band */
.real-strip.breakout{position:relative;left:50%;transform:translateX(-50%);width:min(1180px,94vw)}
.real-zoom{display:block;cursor:zoom-in}
.real-zoom img{transition:transform .18s ease}
.real-zoom:hover img{transform:scale(1.015)}
/* lightbox overlay for full-size photos */
.lightbox{position:fixed;inset:0;z-index:80;background:rgba(20,26,18,.92);
  display:flex;align-items:center;justify-content:center;cursor:zoom-out;padding:24px}
.lightbox[hidden]{display:none}
.lightbox figure{margin:0;max-width:min(1500px,96vw);text-align:center}
.lightbox img{max-width:100%;max-height:84vh;border-radius:8px;display:block;margin:0 auto}
.lightbox figcaption{color:#e8e5da;font-size:.82rem;margin-top:10px;line-height:1.4}
.lightbox figcaption a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* author card (EEAT, about page — driven by cfg.AUTHOR) */
.author-card{display:flex;gap:18px;align-items:center;margin:18px 0 24px;padding:16px;
  background:var(--surface);border:1px solid var(--line);border-radius:12px}
.author-card img{width:96px;height:96px;border-radius:50%;object-fit:cover;flex-shrink:0}
.author-card div{display:flex;flex-direction:column;gap:3px}
.author-card b{font-size:1.05rem}
.author-card span{font-size:.85rem;color:var(--sage)}

/* ==================================================================== */
/* OLD MONEY LAYER — design.md compliance + high-CTR / UX enhancements   */
/* Everything below is deliberate: quiet-luxury surfaces, one gold        */
/* action per screen, and the conversion details that move click-through. */
/* ==================================================================== */

/* ---- 1. Typography: serif display, Inter for anything that acts like a control */
h1{font-size:2.9rem;font-weight:600;letter-spacing:-.015em;margin:.05em 0 .45em}
h2{font-size:2.1rem;font-weight:600;margin:1.9em 0 .5em}
h3{font-size:1.4rem;font-weight:600;margin:1.5em 0 .35em}
h4{font-family:var(--font-ui);font-weight:600;font-size:.7rem;letter-spacing:.18em}
.label,.crumb,.badge,.book-chip,.cmp-badge,.fee-badge,.chips-label,
.town-chips .chip,.facts-label,.kf-label,.tip-label,.t-name,.t-tour,
.rev-count,.rev-more,.foot-bottom,.nav a,.btn{font-family:var(--font-ui)}
p{font-size:1.1rem;line-height:1.7}
.prose li{font-size:1.08rem;line-height:1.65}
@media(max-width:640px){h1{font-size:2.1rem}h2{font-size:1.65rem}h3{font-size:1.25rem}p{font-size:1.05rem}}

/* Old-style figures read as "money" in a serif system — but tabular where aligned */
.facts-val,.pa-price,.sc-big,.ladder-price,.price,.reviews-head .big,.rev-score{
  font-family:var(--font-display);font-feature-settings:"tnum" 1;letter-spacing:-.01em}
.facts-val,.sc-big,.reviews-head .big,.rev-score{font-weight:700}

/* ---- 2. Flat by design: kill the hero gradient, use a flat scrim ---- */
.hero{border-bottom:3px solid var(--coral)}
.hero::before{background:rgba(31,58,44,.52)}
.hero::after{display:none}
.hero h1{font-family:var(--font-display);font-weight:600;font-size:3.6rem;letter-spacing:-.015em;
  text-shadow:0 1px 24px rgba(20,32,25,.45)}
.hero .lede{font-family:var(--font-body);font-size:1.22rem;line-height:1.55;color:#F3EEE1;max-width:30em}
.hero .label{color:var(--coral);letter-spacing:.22em;font-size:.68rem}
.hero-trust{color:#DED8C7}
.hero-trust b{color:var(--coral)}
@media(max-width:900px){.hero-copy{max-width:100%}.hero h1{font-size:2.4rem}}
@media(max-width:640px){.hero .wrap{padding:96px 22px 84px;min-height:0}.hero h1{font-size:2rem}
  .hero .lede{font-size:1.08rem}}

/* ---- 3. Buttons: one gold action, generous tap target, felt feedback ---- */
.btn{font-family:var(--font-ui);font-weight:600;font-size:.78rem;letter-spacing:.14em;
  padding:15px 26px;border-radius:var(--r-md);border:1px solid var(--coral);
  min-height:48px;line-height:1.25;
  transition:background .16s ease,border-color .16s ease,transform .12s ease,box-shadow .16s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px -10px rgba(31,58,44,.7)}
.btn:active{transform:translateY(0);box-shadow:none}
.btn-ghost{border:1px solid var(--ink);background:transparent}
.hero-cta .btn{padding:17px 34px;font-size:.8rem}
/* the single most important control on any page gets the gold */
.tour-body .btn,.book-card .btn{display:block;width:100%}
@media(prefers-reduced-motion:reduce){.btn,.btn:hover{transform:none;transition:none}}

/* ---- 4. Focus visibility (a11y + keyboard CTR) ---- */
a:focus-visible,button:focus-visible,summary:focus-visible,.tour:focus-visible{
  outline:2px solid var(--coral);outline-offset:3px;border-radius:var(--r-md)}

/* ---- 5. Surfaces: embossed cream, hairline gold, square corners ---- */
.tour,.pc,.inclist>div,.includes,.book-card,.price-anchor,.t-card,.rev-card,
.keyfacts,.tip,.scorecard{border-radius:var(--r-lg);box-shadow:var(--shadow)}
.tour,.rev-card,.t-card{border:1px solid var(--line);background:var(--surface)}
.tour:hover,.rev-card:hover{border-color:var(--coral);box-shadow:0 10px 30px -20px rgba(31,58,44,.8)}
.tour{transition:border-color .16s ease,box-shadow .2s ease,transform .16s ease}
.tour:hover{transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.tour:hover{transform:none}}
.includes,.honest-guide,.reviews-band{border-radius:var(--r-lg)}
.answer-box{background:var(--surface);border-left:3px solid var(--coral);
  border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  border-radius:0 var(--r-lg) var(--r-lg) 0;padding:24px 28px}
.answer-box p{font-size:1.14rem;line-height:1.65}

/* ---- 6. Header: quiet, sticky, gold underline on the live section ---- */
.site-head{background:var(--neutral);border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 var(--gold-soft)}
.site-head .wrap{height:72px}
.nav a{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:500;
  padding:6px 0;border-bottom:1px solid transparent}
.nav a:not(.btn):hover{border-bottom-color:var(--coral);color:var(--ink)}
.nav a.btn{text-transform:uppercase;padding:12px 22px;min-height:0}
.logo{font-family:var(--font-display);font-size:1.32rem;font-weight:600;letter-spacing:-.005em}
@media(max-width:900px){.nav{top:72px;background:var(--neutral);border-bottom:1px solid var(--line)}
  .nav a{padding:14px 22px;border-bottom:1px solid var(--line)}}

/* ---- 7. Facts strip: the credibility row, tightened ---- */
.facts-strip{background:var(--neutral);border-top:1px solid var(--line)}
.facts-item{padding:20px 22px;border-right:1px solid var(--line)}
.facts-val{font-size:1.35rem}
.facts-label{font-family:var(--font-ui);font-size:.63rem;letter-spacing:.16em}
@media(max-width:640px){.facts-item{flex:1 1 50%;min-width:0;border-bottom:1px solid var(--line)}}

/* ---- 8. Takeaways: the block AI overviews quote. High contrast, gold ticks ---- */
.ia-takeaways{background:var(--ink);border-radius:var(--r-lg);padding:30px 34px;
  border-left:3px solid var(--coral)}
.ia-takeaways h2{font-family:var(--font-display);font-size:1.5rem;font-weight:600}
.ia-takeaways li{font-size:1.02rem}
.ia-takeaways li::before{color:var(--coral)}
.ia-takeaways a{color:var(--coral);filter:none;text-decoration:underline;
  text-underline-offset:3px;text-decoration-color:var(--gold-soft)}
.ia-takeaways a:hover{color:#fff;text-decoration-color:#fff}

/* ---- 9. Decision ladder: the highest-CTR band on the page ---- */
.ladder-band{background:var(--ink);padding:44px 0 50px;border-top:1px solid var(--coral);
  border-bottom:1px solid var(--coral)}
.ladder-band h2{font-family:var(--font-display);font-size:1.9rem;font-weight:600;
  margin:0 0 22px;color:var(--neutral)}
.ladder-col{border-radius:var(--r-lg);padding:24px 22px;background:rgba(248,241,223,.055);
  border:1px solid rgba(184,145,85,.32)}
.ladder-col.feat{background:var(--surface);border-color:var(--coral);
  box-shadow:0 0 0 1px var(--coral) inset}
.ladder-days{font-family:var(--font-ui);font-size:.72rem;letter-spacing:.18em;font-weight:600;
  color:var(--coral)}
.ladder-col.feat .ladder-days{color:var(--accent-ink,var(--coral-ink))}
.ladder-price{font-family:var(--font-display);font-size:2.1rem;font-weight:700;margin:6px 0 10px}
.ladder-col p{font-family:var(--font-body);font-size:1rem;color:rgba(240,234,219,.86)}

/* ---- 10. Price anchor: crossed-out charter vs the day price ---- */
.price-anchor{background:var(--neutral);border:1px solid var(--line);border-left:3px solid var(--coral)}
.price-anchor h2{font-family:var(--font-display);font-size:1.6rem;margin:0 0 20px}
.pa-price{font-size:2.3rem;font-weight:700}
.pa-label{font-family:var(--font-ui);font-size:.68rem;letter-spacing:.16em}
.pa-was{background:transparent;border:1px dashed var(--line)}
.pa-now{background:var(--ink);border-color:var(--ink)}
.pa-now .btn{background:var(--coral);border-color:var(--coral);width:auto}
.pa-vs{font-family:var(--font-ui);font-size:.7rem;letter-spacing:.18em;color:var(--coral)}

/* ---- 11. Cards: badge, fee pill, whole-card target ---- */
.badge{background:var(--ink);color:var(--neutral);font-size:.6rem;letter-spacing:.14em;
  padding:6px 11px;border-radius:var(--r-sm);border:1px solid rgba(184,145,85,.5)}
.fee-badge{background:var(--coral);color:#fff;font-family:var(--font-ui);font-size:.62rem;
  font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:5px 10px;border-radius:var(--r-sm)}
.tour-body h3{font-family:var(--font-display);font-size:1.28rem;font-weight:600;line-height:1.2}
.price{font-size:1.35rem}
.price span{font-family:var(--font-ui);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}
.rate{font-family:var(--font-ui);font-size:.78rem;letter-spacing:.02em}
.tour-filler{border:1px dashed var(--line)}

/* ---- 12. Filter chips: pill affordance, clear on-state ---- */
.town-chips{margin:10px 0 22px}
.town-chips .chip{border-radius:999px;padding:9px 18px;font-size:.74rem;letter-spacing:.1em;
  text-transform:uppercase;font-weight:500;min-height:40px;transition:all .15s ease}
.town-chips .chip.on{background:var(--ink);border-color:var(--ink);color:var(--neutral)}
.chips-label{font-family:var(--font-ui);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase}

/* ---- 13. Sticky mobile book-bar: the single biggest mobile CTR lever ---- */
@media(max-width:760px){
  .book-bar{background:var(--ink);border-top:1px solid var(--coral);padding:11px 16px;
    box-shadow:0 -4px 20px -8px rgba(20,32,25,.6)}
  .book-bar span{font-family:var(--font-ui);font-size:.78rem;letter-spacing:.04em;color:var(--neutral)}
  .book-bar .btn{padding:12px 20px;font-size:.72rem;min-height:44px;white-space:nowrap}
  body{padding-bottom:66px}
}

/* ---- 14. Booking widget card: docked chip, gold hairline ---- */
.book-card{border:1px solid var(--coral);background:var(--surface);padding:30px 22px 18px}
.book-chip{background:var(--coral);color:#fff;font-size:.64rem;letter-spacing:.16em;
  padding:6px 14px;border-radius:var(--r-sm);top:-14px}
.cancel-note{font-family:var(--font-ui);font-size:.76rem;letter-spacing:.02em;border-top:1px solid var(--line)}

/* ---- 15. Tables: wide breakout, zebra, readable on mobile ---- */
table{border-collapse:collapse;width:100%;margin:1.8em 0;font-size:1.02rem}
th,td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
thead th{font-family:var(--font-ui);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--sage);border-bottom:1px solid var(--ink);font-weight:600}
tbody tr:nth-child(even){background:var(--surface)}
.cmp{font-size:1.02rem}
.cmp .feat{background:var(--surface);border-left:1px solid var(--coral);border-right:1px solid var(--coral)}
.cmp-badge{background:var(--coral);font-size:.6rem;letter-spacing:.14em;border-radius:var(--r-sm)}
.feat-title{font-family:var(--font-display);font-weight:600;font-size:1.2rem}
.rowlabel{font-family:var(--font-ui);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--sage);font-weight:600}
@media(min-width:1080px){.cmp-wrap{margin-left:-110px;margin-right:-110px}}
@media(max-width:760px){table{font-size:.95rem}th,td{padding:11px 12px}}

/* ---- 16. Route / steps: numbered gold seals ---- */
.route-stops li:before{background:transparent;border:1px solid var(--coral);color:var(--coral-ink);
  font-family:var(--font-ui);font-size:.8rem;border-radius:50%}
.route-stops li{font-size:1.06rem;line-height:1.6}
.step{border-top:1px solid var(--coral)}
.step::before{font-family:var(--font-display);font-size:2.1rem;font-weight:700;color:var(--coral)}
.step h3{font-family:var(--font-display);font-size:1.2rem}

/* ---- 17. Gallery + testimonials ---- */
.gallery figcaption{background:rgba(31,58,44,.86);font-family:var(--font-ui);font-size:.66rem;
  letter-spacing:.12em}
.photo-strip .shot{border-radius:var(--r-lg)}
.t-card{border:1px solid var(--line);background:var(--surface);border-radius:var(--r-lg)}
.t-card blockquote{font-family:var(--font-body);font-size:1.06rem;line-height:1.6}
.t-stars{color:var(--coral)}
.t-name{font-family:var(--font-ui);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.t-tour{font-family:var(--font-ui);font-size:.72rem;letter-spacing:.04em}

/* ---- 18. FAQ: bigger tap rows, gold markers ---- */
.faq summary{font-family:var(--font-body);font-size:1.1rem;font-weight:600;padding:18px 34px 18px 0;
  min-height:52px}
.faq summary:hover{color:var(--coral-ink)}
.faq summary::after{color:var(--coral);font-family:var(--font-ui);top:16px}
.faq details{border-bottom:1px solid var(--line)}
.faq details[open]{background:var(--surface);padding-left:16px;padding-right:16px;
  margin-left:-16px;margin-right:-16px;border-radius:var(--r-lg)}
.faq-body p{font-size:1.05rem;line-height:1.65}

/* ---- 19. Scorecard / review hub ---- */
.scorecard{border:1px solid var(--ink)}
.sc-big{font-size:3.4rem}
.sc-stars{color:var(--coral)}
.sc-row{font-family:var(--font-body);font-size:1rem}
.rev-card h3{font-family:var(--font-display);font-size:1.24rem;font-weight:600}
.rev-more{font-family:var(--font-ui);letter-spacing:.14em;font-size:.68rem}

/* ---- 20. Explore cluster + footer pills ---- */
.explore{border-top:1px solid var(--coral)}
.explore-links a{font-family:var(--font-body);font-size:1rem;border-left:1px solid var(--line);
  padding:5px 0 5px 14px}
.explore-links a:hover{border-left-color:var(--coral)}
.site-foot{background:var(--ink);border-top:3px solid var(--coral);color:#CFC9B8}
.site-foot a{color:#CFC9B8}
.foot-searches a{border:1px solid rgba(184,145,85,.28);border-radius:999px;padding:6px 13px;
  font-family:var(--font-ui);font-size:.72rem;letter-spacing:.03em;color:#B9B3A3}
.foot-searches a:hover{border-color:var(--coral);color:#fff;background:rgba(184,145,85,.12)}
.foot-answers .label,.foot-searches h4,.foot-facts .label,.foot-facts .kf-label{
  font-family:var(--font-ui);letter-spacing:.18em;color:var(--coral)}
.site-foot h4{font-family:var(--font-ui);color:var(--coral);letter-spacing:.18em}
.site-foot .brand .logo{font-family:var(--font-display)}
.foot-guides,.foot-answers,.foot-facts,.foot-searches,.foot-bottom{border-top-color:rgba(184,145,85,.22)}
.foot-bottom{font-family:var(--font-ui);font-size:.72rem;letter-spacing:.02em}

/* ---- 21. Author card + real-photo strip ---- */
.author-card{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--coral);
  border-radius:var(--r-lg)}
.author-card b{font-family:var(--font-display);font-size:1.2rem;font-weight:600}
.author-card span{font-family:var(--font-ui);font-size:.8rem}
.real-grid img{border-radius:var(--r-lg)}
.real-grid figcaption{font-family:var(--font-ui);font-size:.7rem;letter-spacing:.02em}

/* ---- 22. Misc polish ---- */
.tip{border:1px solid var(--coral);border-left:3px solid var(--coral);background:var(--neutral)}
.tip-label{font-family:var(--font-ui);letter-spacing:.18em;font-size:.66rem}
.keyfacts{border:1px solid var(--line);background:var(--line)}
.keyfacts b{font-family:var(--font-display);font-size:1.2rem;font-weight:600}
.kf-label{font-family:var(--font-ui);letter-spacing:.16em}
.honest-guide{background:var(--neutral);border:1px solid var(--line);padding:38px 36px}
.honest-guide h2{font-family:var(--font-display);font-size:2.1rem}
.guide-fig img{border-radius:var(--r-lg)}
.guide-fig figcaption{font-family:var(--font-body);font-style:italic}
.disclosure{background:var(--neutral);border:1px solid var(--line);border-radius:var(--r-lg);
  font-family:var(--font-ui);font-size:.78rem;letter-spacing:.01em}
.crumb{font-family:var(--font-ui);letter-spacing:.14em;font-size:.66rem;padding:18px 22px 0}
.page-hero{border-radius:var(--r-lg);border:1px solid var(--line)}
.section-pad{padding-top:52px;padding-bottom:76px}
::selection{background:var(--coral);color:#fff}
hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}

/* ---- 23. Print ---- */
@media print{
  .site-head,.site-foot,.book-bar,.ladder-band,.gyg-frame,.book-card,.town-chips{display:none}
  body{font-size:12pt;color:#000;background:#fff}
  a[href^="/"]::after{content:" (hozugawariverboatride.com" attr(href) ")";font-size:9pt;color:#555}
}

/* ---- 24. Japanese edition: latin letter-spacing hurts CJK ---- */
html[lang="ja"] .label,html[lang="ja"] .facts-label,html[lang="ja"] .kf-label,
html[lang="ja"] .nav a,html[lang="ja"] .btn,html[lang="ja"] .crumb,
html[lang="ja"] .badge,html[lang="ja"] .book-chip,html[lang="ja"] .cmp-badge,
html[lang="ja"] .fee-badge,html[lang="ja"] .chips-label,html[lang="ja"] .town-chips .chip,
html[lang="ja"] .tip-label,html[lang="ja"] .rowlabel,html[lang="ja"] thead th,
html[lang="ja"] .site-foot h4,html[lang="ja"] .foot-searches h4,
html[lang="ja"] .t-name,html[lang="ja"] .rev-more,html[lang="ja"] h4{letter-spacing:.04em}
html[lang="ja"] body{font-family:var(--font-body),"Hiragino Sans","Hiragino Kaku Gothic ProN",
  "Yu Gothic","Noto Sans JP",Meiryo,sans-serif;line-height:1.85}
html[lang="ja"] h1,html[lang="ja"] h2,html[lang="ja"] h3,html[lang="ja"] .logo,
html[lang="ja"] .display{font-family:var(--font-display),"Hiragino Mincho ProN","Yu Mincho",
  "Noto Serif JP",serif;letter-spacing:0;line-height:1.35}
html[lang="ja"] .hero h1{font-size:2.9rem;line-height:1.32}
html[lang="ja"] p{line-height:1.85}
html[lang="ja"] .faq summary{font-weight:700}
@media(max-width:640px){html[lang="ja"] .hero h1{font-size:1.75rem}}

/* ---- 25. Language switcher (EN <-> 日本語) ---------------------------------
   Sits in the header next to the nav and links to the SAME page in the other
   language, so the reader keeps their place. Always visible, including on
   mobile where the main nav collapses behind the hamburger. */
.lang-switch{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-ui);font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);background:transparent;
  border:1px solid var(--coral);border-radius:var(--r-md);
  padding:9px 14px;margin-left:20px;min-height:40px;white-space:nowrap;
  transition:background .16s ease,color .16s ease;
}
.lang-switch:hover{background:var(--coral);color:#fff;text-decoration:none}
.lang-switch:focus-visible{outline:2px solid var(--coral);outline-offset:3px}
/* Japanese label is CJK: drop the latin letter-spacing and lift the size a touch */
html[lang="ja"] .lang-switch,
.lang-switch[lang="ja"]{letter-spacing:.06em;font-size:.76rem}
@media(max-width:900px){
  .lang-switch{order:2;margin-left:12px;padding:8px 12px}
  .site-head .nav-toggle{order:3;margin-left:12px}
}
@media(max-width:420px){
  .lang-switch{margin-left:8px;padding:7px 10px;font-size:.64rem}
}
/* Narrow phones: the brand is long, so shrink it and the switcher together
   rather than letting the logo wrap onto three lines. */
@media(max-width:560px){
  .site-head .wrap{height:auto;min-height:64px;padding-top:8px;padding-bottom:8px}
  .site-head .logo{font-size:1.02rem;line-height:1.15}
  .site-head .logo .mark{width:26px;height:26px}
  .lang-switch{margin-left:8px;padding:7px 10px;font-size:.62rem;min-height:36px}
  .site-head .nav-toggle{font-size:1.35rem}
  .nav{top:auto}
}