@font-face{font-family:"Outfit fb";src:local("Arial"),local("Helvetica"),local("Liberation Sans"),local("Arimo"),local("Albany AMT");font-weight:400;size-adjust:98.67%}
@font-face{font-family:"Outfit fb";src:local("Arial"),local("Helvetica"),local("Liberation Sans"),local("Arimo"),local("Albany AMT");font-weight:600;size-adjust:100.64%}
@font-face{font-family:"Outfit fb";src:local("Arial"),local("Helvetica"),local("Liberation Sans"),local("Arimo"),local("Albany AMT");font-weight:700;size-adjust:102.30%}
@font-face{font-family:"Outfit fb";src:local("Arial"),local("Helvetica"),local("Liberation Sans"),local("Arimo"),local("Albany AMT");font-weight:800;size-adjust:103.62%}
/* "Running Kilometer" design system.
   Outfit for everything, near-black ink + single track-orange accent.
   Flat by design: no decorative gradients, one accent action per screen. */

:root{
  --ink:#1A1512;        /* primary: headlines & core text */
  --sage:#7A6E62;       /* secondary: borders, meta, captions */
  --coral:#9E3B2E;      /* tertiary: the single interaction accent */
  --coral-ink:#7E2C21;  /* readable orange (same hue) for link/body text */
  --coral-dk:#8C3327;   /* button hover */
  --neutral:#F6F2EC;    /* page foundation */
  --surface:#FFFFFF;    /* card / panel surface */
  --white:#FFFFFF;
  --line:#E6DED2;
  /* down chevron, masked so it inherits currentColor in every state */
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --r-sm:8px;
  --r-md:14px;
  --r-lg:24px;
  --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:"Outfit","Outfit fb",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  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:"Outfit","Outfit fb",sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1.08}
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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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}
/* Desktop header: brand left, links centred on the PAGE, Book right.
   build_site/build_home wrap the text links in <span class="nav-links"> so the
   header can centre them independently of the brand's width. Without a rule
   for that wrapper the five links collapse to whitespace-width spacing (4px)
   while the 24px flex gap lands only between the wrapper and the pill.
   Below 861px .nav becomes the dropdown panel, so the wrapper must stop being
   a box or the links stay inline inside it instead of stacking. */
@media(min-width:861px){
  .site-head .wrap{display:grid;grid-template-columns:1fr auto 1fr;gap:18px}
  .site-head .nav{display:contents}
  .nav-links{display:flex;align-items:center;gap:24px;justify-self:center}
  .site-head .nav a.btn{justify-self:end}
}
.nav a{color:var(--ink);font-family:"Outfit","Outfit fb",sans-serif;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}
/* Price ladder: one row per tier, cheapest first. Bulletless, with an accent
   rule down the left so the tiers read as steps rather than an unordered list. */
.tiers{list-style:none;margin:0 0 1.15em;padding:0}
.tiers li{position:relative;margin:0;padding:13px 0 13px 18px;border-left:3px solid var(--coral)}
.tiers li+li{border-top:1px solid var(--line)}
.tiers strong{display:block;margin-bottom:3px;font-family:"Outfit","Outfit fb",sans-serif;letter-spacing:-.01em}
/* helpers.notice() -- a flagged callout for the things a reader needs before
   they book: reserve rules, age minimums, the days surf shuts the caves. */
.age-note{display:flex;gap:14px;align-items:flex-start;margin:34px 0 0;padding:16px 18px;
  border-top:2px solid var(--line);color:var(--sage);font-size:.83rem;line-height:1.5}
.age-note b{display:inline-block;flex:0 0 auto;background:var(--ink);color:#fff;border-radius:999px;
  padding:3px 11px;font-size:.78rem;letter-spacing:.02em}
.age-note span{display:block}
.age-note a{color:var(--coral-ink)}
@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-links{display:contents}
  .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:"Outfit","Outfit fb",sans-serif;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))}
/* min-height 740, non 550: sopra i 640px il pavimento del motore non bastava.
   A 900px l'h1 inglese va a capo una riga in piu' senza il webfont (735 contro
   707) e la pagina si sposta di 28px. 740 copre 768 e 900 in entrambe le
   lingue; da 1000 in su il contenuto e' gia' 791 e il pavimento non si vede. */
.hero .wrap{position:relative;z-index:1;padding:163px 22px 145px;min-height:740px;display:flex;flex-direction:column;justify-content:center}
/* Above the --maxw cap this is exactly the old 52%, so the desktop hero is
   unchanged. Below the cap the column used to shrink with the viewport, and
   around 1000-1100px it got narrow enough that the h1 and the two CTA buttons
   sat on a wrap boundary: they took one more line in the visitor's fallback
   font than in the webfont, so everything below them jumped when the swap
   landed. Measured at 0.19-0.25 CLS on capillarealdegranada.com, in a band
   nobody screenshots. Holding a 620px floor takes them off that boundary.
   clamp keeps it continuous -- a media query would have snapped the column
   200px wider the moment the window crossed the breakpoint. */
.hero-copy{max-width:clamp(52%,620px,100%)}
.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;align-items:stretch;gap:18px;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 secondary action ("Read the guide").
   build_home._hero() renders this as .btn-link deliberately: a second OUTLINED
   button the same size as the primary splits the click between two
   equally-weighted choices and neither reads as THE action. So this is a text
   link -- but a designed one, because with no rule at all it inherits body link
   styling and lands on a dark photo with no affordance whatsoever.
   The target is an anchor further DOWN this same page, so the glyph is a down
   chevron rather than the usual right arrow: it promises a scroll, not a
   navigation. Drawn with mask-image + currentColor so one asset serves every
   state, at stroke-width 3 in a 24 viewBox (~2px at this size) to match the
   600 text weight beside it. */
.hero-cta .btn-link{
  display:inline-flex;align-items:center;justify-content:center;
  /* Left padding matches the primary pill's TEXT inset (20px padding + 2px
     border), so when .hero-cta wraps on a phone the two labels line up in a
     column instead of sitting 2px apart. Right padding is then 2px less,
     because the trailing glyph needs less optical room than a letter does. */
  padding:12px 20px 12px 22px;
  min-height:44px;                 /* touch target, and matches the primary pill */
  color:#fff;font-family:"Outfit","Outfit fb",sans-serif;font-weight:600;font-size:.95rem;
  background:none;border:0;border-radius:var(--r-md);box-shadow:none;
  text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px;
  text-decoration-color:rgba(255,255,255,.45);
  transition:text-decoration-color .15s ease-out,color .15s ease-out,scale .15s ease-out;
}
.hero-cta .btn-link::after{
  content:"";width:1.05em;height:1.05em;margin-left:8px;flex:0 0 auto;
  background-color:currentColor;text-decoration:none;
  -webkit-mask:var(--chev) center/contain no-repeat;
  mask:var(--chev) center/contain no-repeat;
  transition:translate .15s ease-out;
}
.hero-cta .btn-link:hover{color:#fff;text-decoration-color:#fff}
.hero-cta .btn-link:hover::after{translate:0 2px}
.hero-cta .btn-link:active{scale:.96}
.hero-cta .btn-link:focus-visible{
  outline:2px solid #fff;outline-offset:3px;text-decoration-color:#fff}
@media(prefers-reduced-motion:reduce){
  .hero-cta .btn-link,.hero-cta .btn-link::after{transition:none}
  .hero-cta .btn-link:hover::after{translate:none}
  .hero-cta .btn-link:active{scale:1}
}
.hero-trust{font-size:.95rem;color:#D9DBD7;margin:0}
.hero-trust b{color:#fff}
@media(max-width:900px){.hero-copy{max-width:100%}}
/* Font-swap CLS on phones. Above 640px .hero .wrap has min-height:740px, which
   absorbs the h1 changing line count when the webfont lands. Below it the floor
   is 0, so an extra fallback line pushes the whole page down -- measured at 36px
   on a 390px viewport. text-wrap:balance makes both renderings settle on the
   same line count by optimising for even line lengths instead of greedy fill,
   and the small floor catches what balance does not. */
.hero h1{text-wrap:balance}
/* The second half of the font-swap CLS fix. size-adjust matches the fallback's
   TOTAL advance width to Outfit's, but it cannot control where individual words
   break, so a long h1 can still wrap to a different LINE COUNT in the two fonts
   -- measured here at 4 lines fallback against 5 lines webfont on a 390px
   viewport. Above 640px .hero .wrap already carries min-height:740px and
   swallows it. Below that the floor was 0, so the difference moved the whole
   page. These two floors are measured from the taller of the two renderings in
   each sub-band; content taller than the floor still grows normally. */
@media(max-width:640px){.hero h1{font-size:2.1rem}.hero .wrap{padding:64px 22px 56px;min-height:580px}}
@media(max-width:440px){.hero .wrap{min-height:675px}}
@media(max-width:340px){.hero .wrap{min-height:764px}}
/* Pavimenti per le pagine inglesi. L'inglese va a capo diversamente
   dall'italiano, quindi i valori NON si copiano dalla radice: rimisurati dopo
   l'accorciamento dell'h1 (15/09/2026), contenuto massimo 775px sotto i 340,
   711 fino a 440, 580 fino a 640, contro 764 / 675 / 580 dell'italiano. Scoped
   su html[lang="en"] e ripetuti su tutte e tre le fasce: dichiararne solo una
   annulla le altre due, che e' come si trasforma uno scostamento in due. */
@media(max-width:640px){html[lang="en"] .hero .wrap{min-height:580px}}
@media(max-width:440px){html[lang="en"] .hero .wrap{min-height:711px}}
@media(max-width:340px){html[lang="en"] .hero .wrap{min-height:775px}}

/* ---------- 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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;font-weight:700}
table.cmp .rowlabel{font-family:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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}
/* address + transport, grouped with the key-facts strip above it — no top
   border, so the two read as one "where is it" block rather than two bands. */
.foot-find{margin-top:16px;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px}
.foot-find .label{font-family:"Outfit","Outfit fb",sans-serif;font-weight:600;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:#8d918c}
.foot-find nav{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot-find a{color:#C9CCC7;font-size:.86rem}
.foot-find a:hover{color:#fff}
.foot-searches{margin-top:22px;border-top:1px solid #2c2f2f;padding-top:20px}
.foot-searches h4{font-family:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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:"Outfit","Outfit fb",sans-serif;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{color:var(--coral);letter-spacing:2px;font-size:.92rem;margin-bottom:.5em}
.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:"Outfit","Outfit fb",sans-serif;font-weight:700;font-size:.86rem;color:var(--ink)}
.t-tour{display:block;font-family:"Outfit","Outfit fb",sans-serif;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.
   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}
/* The band's lead paragraph. build_home emits it; without a rule it inherits
   the body colour and lands at full-strength neutral on the dark band,
   competing with the h2 above it instead of sitting under it. */
.ladder-lead{color:rgba(255,255,255,.78);font-size:.95rem;margin:0 0 18px;max-width:60ch;text-wrap:pretty}
.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 / siteconfig: PAGE_BOOK_BAR).
   Price-anchored (.bb-copy/.bb-price/.bb-txt) and revealed by BAR_JS only
   after 420px of scroll (.bb-wait hides it until then). */
.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);
    transition:transform .25s ease,opacity .25s ease}
  .book-bar.bb-wait{transform:translateY(110%);opacity:0}
  .book-bar span{font-size:.85rem;font-weight:600}
  .book-bar .btn{padding:9px 16px;font-size:.85rem}
  /* Clearance for the fixed book-bar goes on the FOOTER, not on <body>.
     body{padding-bottom} paints 58px of page background *below* the dark
     footer, which on a dark-footer theme reads as a white strip at the very
     bottom of every mobile page. Putting the same space inside .site-foot
     keeps the footer colour running to the edge of the document. Gated on
     the bar actually existing so pages that opt out (no_cta) don't get a
     58px hole. */
  .book-bar ~ .site-foot{padding-bottom:76px}
}
.book-bar .bb-price{font-size:1.05rem;font-weight:800;letter-spacing:.01em}
.book-bar .bb-txt{font-size:.72rem;font-weight:500;opacity:.85;display:block}
.book-bar .bb-copy{display:flex;flex-direction:column;line-height:1.25;min-width:0}
/* info-page conversion layer (build_site._cta_layer + helpers.availability) */
.cta-early{background:var(--neutral);border:2px solid var(--coral);border-radius:var(--r-md);
  padding:16px 20px;margin:1.6em 0;display:flex;flex-wrap:wrap;align-items:center;
  gap:12px 18px;justify-content:space-between}
.cta-early p{margin:0;flex:1 1 300px}
.cta-early .cta-label{display:block;font-weight:600;font-size:.7rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--coral);margin-bottom:.25em}
.cta-early .btn{white-space:nowrap;flex:0 0 auto}
.book-card{scroll-margin-top:84px}

/* ==================================================================== */
/* Engagement layer (2026-08-23, from colomares)                        */

/* live opening-status strip (homecontent: LIVE_STRIP) — hidden until its
   inline script computes today's status and sets display:block */
.live-strip{display:none;background:var(--neutral);border-bottom:1px solid rgba(0,0,0,.08)}
.live-strip .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;padding:9px 20px;font-size:.85rem}
.ls-dot{width:9px;height:9px;border-radius:50%;flex:none;background:#8a8a8a}
.live-strip.is-open .ls-dot{background:#2e9e44;box-shadow:0 0 0 3px rgba(46,158,68,.18);animation:lspulse 2s infinite}
.live-strip.is-closed .ls-dot{background:#c0392b}
@keyframes lspulse{50%{box-shadow:0 0 0 6px rgba(46,158,68,.06)}}
.ls-status{font-weight:700}
.ls-hours,.ls-crowd{color:rgba(0,0,0,.6)}
.ls-left,.ls-right{display:flex;align-items:center;gap:8px}
.ls-right{margin-left:auto}
@media(max-width:600px){.ls-right{margin-left:17px}}

/* itinerary time badges (ROUTE stops as 3-tuples) */
.stop-time{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:999px;
  background:rgba(0,0,0,.07);font-size:.72rem;font-weight:700;letter-spacing:.02em;
  vertical-align:2px;white-space:nowrap}

/* pull-quote (helpers.pullquote) */
.pullquote{margin:38px auto;padding:0 8px;max-width:560px;text-align:center;border:0}
.pullquote p{font-family:inherit;font-size:1.45rem;line-height:1.35;font-weight:700;
  font-style:italic;color:var(--ink);margin:0}
.pullquote::before{content:"\201D";display:block;font-size:3rem;line-height:.6;color:var(--coral);margin-bottom:10px}

/* "good to know" glance grid (homecontent: GLANCE — replaces ia-takeaways) */
.glance{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:34px 0}
.prose>.glance:first-child{margin-top:0}
@media(max-width:640px){.glance{grid-template-columns:1fr}}
.glance-item{display:flex;gap:13px;align-items:flex-start;background:var(--neutral);
  border:1px solid rgba(0,0,0,.06);border-radius:14px;padding:15px 17px;
  text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease}
.glance-item:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.09)}
.g-ico{flex:none;display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:#fff;color:var(--coral);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.g-txt{font-size:.86rem;line-height:1.45;color:rgba(0,0,0,.65)}
.g-txt b{display:block;color:var(--ink);font-size:.95rem;margin-bottom:2px}

/* ==================================================================== */
/* Conversion + EEAT layer                                              */

/* 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)}

/* ------------------------------------------------------------------ */
/* Attractions map (2026-08-23, build_map.py)                          */
/* ------------------------------------------------------------------ */
#amap-map{height:520px;border-radius:14px;border:1px solid var(--line);
  margin:18px 0 26px;z-index:0}
@media(max-width:760px){#amap-map{height:420px}}
.amap-chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0}
.amap-chip{--chip:var(--ink);display:inline-flex;align-items:center;gap:7px;
  padding:7px 13px;border-radius:999px;border:1.5px solid var(--line);
  background:var(--surface);font:inherit;font-size:.86rem;font-weight:600;
  color:var(--ink);cursor:pointer}
.amap-chip::before{content:"";width:10px;height:10px;border-radius:50%;
  background:var(--chip)}
.amap-chip[data-g="all"]::before{display:none}
.amap-chip.is-on{border-color:var(--chip);background:color-mix(in srgb,var(--chip) 8%,var(--surface))}
.amap-n{font-size:.74rem;font-weight:700;opacity:.55}
.amap-pin{display:block;width:24px;height:24px;border-radius:50%;
  background:var(--chip,#A63A1B);border:3px solid #fff;
  box-shadow:0 1px 5px rgba(0,0,0,.45)}
.leaflet-popup-content{font-family:inherit;margin:12px 14px}
.leaflet-popup-content b{display:block;font-size:.95rem;margin-bottom:3px}
.amap-pdesc{display:block;font-size:.82rem;color:var(--sage,#6E6459);margin:2px 0}
.amap-pprice{display:block;font-size:.86rem;font-weight:700;margin:4px 0 2px}
.amap-pbtn{display:inline-block;margin-top:6px;padding:7px 13px;
  border-radius:8px;background:var(--accent,var(--coral,#A63A1B));color:#fff!important;
  font-weight:600;font-size:.84rem;text-decoration:none}
.amap-group{margin-top:8px}
ul.amap-list{list-style:none;padding:0;margin:10px 0 0}
ul.amap-list li{display:flex;align-items:flex-start;gap:12px;
  padding:13px 2px;border-bottom:1px solid var(--line)}
ul.amap-list li>div{flex:1;min-width:0}
.amap-dotmark{width:11px;height:11px;border-radius:50%;background:var(--chip);
  flex-shrink:0;margin-top:6px}
ul.amap-list b{font-weight:650}
.amap-meta{display:block;font-size:.83rem;font-weight:600;margin-top:1px}
.amap-desc{display:block;font-size:.87rem;color:var(--sage);margin-top:2px}
.amap-locate{flex-shrink:0;font:inherit;font-size:.78rem;font-weight:600;
  padding:6px 11px;border-radius:8px;border:1.5px solid var(--line);
  background:none;color:var(--ink);cursor:pointer;white-space:nowrap}
.amap-locate:hover{border-color:var(--accent);color:var(--accent)}

/* --- Start-here chooser (2026-08-24, replaces homepage answer-box) --- */
.starter{border:1px solid var(--line,#E3DCCF);border-radius:var(--r-md,14px);
  padding:18px 18px 14px;margin:0 0 1.7em;background:var(--surface,#fff)}
.starter-kick{margin:0 0 12px;font-size:.95rem}
.starter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.starter-opt{display:flex;flex-direction:column;gap:3px;padding:12px 14px;
  border:1.5px solid var(--line,#E3DCCF);border-radius:10px;text-decoration:none;
  color:var(--ink,#222);background:var(--surface,#fff);transition:border-color .15s}
.starter-opt:hover{border-color:var(--accent,var(--coral,#A63A1B))}
.starter-opt.is-top{border-color:var(--accent,var(--coral,#A63A1B));
  background:color-mix(in srgb,var(--accent,var(--coral,#A63A1B)) 5%,var(--surface,#fff))}
.starter-opt b{font-size:.98rem;line-height:1.25}
.s-tag{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--accent,var(--coral,#A63A1B))}
.s-note{font-size:.82rem;color:var(--sage,#6E6459)}
.starter-foot{margin:10px 0 0;font-size:.85rem;color:var(--sage,#6E6459)}
.starter-foot a{text-decoration:underline;color:inherit}
@media(max-width:760px){.starter-grid{grid-template-columns:1fr}}

/* Lightbox prev/next controls (2026-08-24) */
.lightbox-close{position:absolute;top:14px;right:20px;background:none;border:0;color:#fff;font-size:2.4rem;line-height:1;cursor:pointer;padding:4px 10px;z-index:2}
.lightbox-close:hover{color:var(--accent,var(--coral,#A63A1B))}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;font-size:3.2rem;line-height:1;cursor:pointer;padding:8px 18px;opacity:.8;z-index:2}
.lightbox-nav:hover{opacity:1;color:var(--accent,var(--coral,#A63A1B))}
.lightbox-nav[hidden]{display:none}
.lightbox-prev{left:8px}
.lightbox-next{right:8px}
@media(max-width:760px){.lightbox-nav{font-size:2.4rem;padding:6px 10px}}

/* Insider's Guide (70/30 + sticky) v20260824d */
.iguide{background:var(--neutral);border-radius:var(--r-lg);padding:40px 34px;margin:2.4em 0}
@media(min-width:1080px){.iguide{margin-left:-110px;margin-right:-110px}}
@media(min-width:1200px){.iguide{margin-left:-150px;margin-right:-150px}}
.iguide-label{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent,var(--coral,#A63A1B));margin:0 0 6px}
.iguide-title{margin:0 0 26px}
.iguide-grid{display:grid;grid-template-columns:7fr 3fr;gap:48px;align-items:start}
.iguide-lead{font-size:1.12rem;font-style:italic;color:var(--ink);margin-top:0}
.iguide-art h3{margin:1.6em 0 .5em;scroll-margin-top:84px}
.iguide-art h3:first-of-type{margin-top:1.2em}
.iguide-fig{margin:1.6em 0;border-radius:var(--r-md);overflow:hidden;aspect-ratio:16/7}
.iguide-fig img{width:100%;height:100%;object-fit:cover}
.iguide-fig--tall{aspect-ratio:auto;min-height:340px;margin:1.6em 0 0}
.iguide-duo{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch}
.iguide-duo .iguide-art h3,.iguide-duo h3{margin-top:1.6em}
.iguide-side{position:sticky;top:84px;display:grid;gap:14px}
.iguide-book{background:#fff;border-radius:var(--r-md);border-top:4px solid var(--accent,var(--coral,#A63A1B));padding:16px 18px}
.iguide-book-eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sage,#777);margin:0 0 4px}
.iguide-book-title{font-family:var(--serif,inherit);font-size:1.1rem;font-weight:700;margin:0 0 3px}
.iguide-book-rating{font-size:.82rem;margin:0 0 8px}
.iguide-book-rating span{color:var(--accent,var(--coral,#A63A1B))}
.iguide-book-list{list-style:none;margin:0 0 12px;padding:0}
.iguide-book-list li{font-size:.8rem;line-height:1.4;margin:0 0 5px;padding-left:16px;position:relative}
.iguide-book-list li::before{content:"\2713";position:absolute;left:0;color:var(--accent,var(--coral,#A63A1B))}
.iguide-book .btn{display:block;text-align:center}
@media(max-width:900px){.iguide{padding:30px 22px}.iguide-grid{grid-template-columns:1fr;gap:30px}.iguide-side{position:static}.iguide-duo{grid-template-columns:1fr;gap:0}.iguide-fig--tall{aspect-ratio:3/4;min-height:0}}

/* ---- Selettore di lingua ----
   Lo switcher viene inserito PRIMA di .nav-toggle, cio&egrave; fra il logo e il menu.

   L'INTESTAZIONE DI QUESTO SITO &Egrave; UNA GRIGLIA. style.css imposta
   .site-head .wrap{display:grid;grid-template-columns:1fr auto 1fr} sopra gli
   861px con .site-head .nav{display:contents}: i figli del nav finiscono nella
   cella centrale e in quella destra, e i link restano centrati sulla PAGINA.
   Uno switcher &egrave; un QUARTO elemento in una griglia a tre colonne: va a capo e
   raddoppia l'altezza dell'intestazione. Due elementi non possono condividere
   una cella senza un contenitore, e il traduttore non ha un contenitore in cui
   inserirne uno.

   Quindi le pagine con lo switcher tornano all'intestazione flex del resto del
   portfolio: logo a sinistra, poi link, switcher e pulsante Prenota insieme a
   destra. Il menu centrato era una rifinitura; uno switcher che funziona &egrave; il
   requisito. .nav-links tiene un gap flex esplicito perch&eacute; senza la griglia
   &egrave; uno span inline e i 24px collasserebbero alla larghezza dello spazio (4px),
   che &egrave; esattamente il difetto per cui la griglia era stata aggiunta.

   Lo switcher sta anche sulle pagine italiane, quindi vale anche per la radice.

   BREAKPOINT. style.css passa all'hamburger a 860px. Lo switcher aggiunge una
   settantina di pixel alla riga e questa intestazione ha gi&agrave; cinque voci, il
   pulsante Prenota e il marchio "Museo Archeologico Napoli", quindi la fascia
   appena sopra gli 860 smette di starci. L'hamburger si sposta a 940px per
   tutte le pagine, e la query dello switcher compatto si sposta con lui cos&igrave;
   non possono mai discordare. Il numero &egrave; stato fissato con uno sweep sul DOM
   reale dopo il run, non con uno screenshot. */
@media(min-width:941px){
  .site-head .wrap{display:flex;align-items:center;gap:18px;grid-template-columns:none}
  .site-head .nav{display:flex;align-items:center;gap:24px;margin-left:0}
  .site-head .nav-links{display:flex;align-items:center;gap:24px;justify-self:auto}
  .site-head .nav a.btn{justify-self:auto}
}
.lang-dd{position:relative;margin-left:auto;margin-right:10px;flex-shrink:0}
.lang-dd summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:5px;font-family:"Outfit","Outfit fb",sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.04em;color:var(--ink);padding:5px 10px;border:1px solid var(--line);border-radius:6px;background:var(--surface)}
.lang-dd summary::-webkit-details-marker{display:none}
.lang-dd summary::after{content:"\25BE";font-size:.6rem;color:var(--sage)}
.lang-dd[open] summary{background:var(--neutral)}
.lang-dd .lang-menu{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.10);padding:6px;display:flex;flex-direction:column;min-width:130px;z-index:60}
.lang-menu a{padding:7px 10px;border-radius:6px;font-size:.78rem;font-weight:600;color:var(--ink);text-decoration:none;white-space:nowrap}
.lang-menu a:hover{background:var(--neutral)}
.lang-menu a.active{color:var(--coral-ink);background:var(--neutral)}
@media(max-width:940px){
  .lang-dd{margin-right:6px}
  .lang-dd summary{padding:4px 8px;font-size:.68rem}
  .site-head .wrap{display:flex;align-items:center;grid-template-columns:none}
  .site-head .nav-toggle{display:block;margin-left:0}
  .site-head .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}
  .site-head .nav.open{display:flex}
  .site-head .nav-links{display:contents}
  .site-head .nav a{padding:11px 0;border-bottom:1px solid var(--line);width:100%}
  .site-head .nav a.btn{margin-top:10px;text-align:center}
}

/* ---- Pavimenti dell'hero per le pagine tradotte ----
   ATTENZIONE AL SELETTORE. Nel resto del portfolio questi blocchi usano
   html:not([lang="en"]) perch&eacute; l&igrave; la radice &egrave; inglese. Qui la radice &egrave;
   ITALIANA: lo stesso selettore colpirebbe le pagine italiane e lascerebbe
   scoperte quelle inglesi, cio&egrave; esattamente al contrario. Si usa
   html[lang="en"], che nomina la lingua tradotta invece di negare la radice e
   non pu&ograve; invertirsi per sbaglio.
   I valori vanno RIMISURATI sull'inglese: lo sweep sull'italiano ha dato
   624/756/880, ma l'inglese va a capo diversamente. */
html[lang="en"] .kf-label,html[lang="en"] .facts-val,
html[lang="en"] .badge,html[lang="en"] .tour h3,
html[lang="en"] .bb-txt,html[lang="en"] .glance b,
html[lang="en"] .ladder-days,html[lang="en"] .trust-row li{overflow-wrap:anywhere}
html[lang="en"] .cmp-area{white-space:normal}