/* =====================================================================
   LET'S TRAVEL STUDIO — Catálogo de circuitos
   Depende de brand.css (tokens + tipografías + botones).
   TODAS las clases van prefijadas con circ- para no chocar con site.css
   (que reserva .hero, .inner, .body, .badge, .cta, .img, .row, .link, etc.).
   ===================================================================== */

:root{
  --circ-ultimos:#8C3B2E;
  --circ-ultimos-fill:#F5E1DC;
  --circ-nav-line:rgba(255,255,255,.18);
}

/* ══════════ HERO (listado y ficha) ══════════ */
.circ-hero{
  position:relative;background:var(--navy);color:var(--cream);
  padding:80px 24px 60px;overflow:hidden;min-height:0;
}
.circ-hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 20% 30%,rgba(184,148,94,.22),transparent 55%),
             radial-gradient(circle at 80% 70%,rgba(184,148,94,.12),transparent 45%);
  pointer-events:none;
}
.circ-hero .circ-inner{position:relative;max-width:1120px;margin:0 auto}
.circ-hero .circ-eyebrow{
  font:700 10px/1 Lato,sans-serif;letter-spacing:4px;text-transform:uppercase;
  color:var(--gold-light);margin-bottom:14px;
}
.circ-hero h1{color:var(--cream);font-size:clamp(32px,4.4vw,52px);line-height:1.1;letter-spacing:-.3px;margin:0}
.circ-hero h1 em{color:var(--gold-light);font-style:italic;font-weight:500}
.circ-hero .circ-sub{
  margin-top:18px;max-width:640px;font-size:16px;line-height:1.65;
  color:rgba(245,242,236,.85);font-weight:300;
}
.circ-hero .circ-meta{
  margin-top:24px;display:flex;flex-wrap:wrap;gap:16px;
  font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-light);
}
.circ-hero .circ-meta span+span{padding-left:16px;border-left:1px solid var(--circ-nav-line)}
.circ-hero .circ-crumb{
  font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-light);margin-bottom:22px;
}
.circ-hero .circ-crumb a{color:var(--gold-light);text-decoration:none;opacity:.85}
.circ-hero .circ-crumb a:hover{opacity:1;color:#fff}
.circ-hero .circ-crumb .circ-sep{opacity:.4;margin:0 8px}

/* ══════════ CONTENEDOR ══════════ */
.circ-wrap{max-width:1120px;margin:0 auto;padding:56px 24px}
.circ-wrap.circ-narrow{max-width:920px}

/* ══════════ GRID DE TARJETAS ══════════ */
.circ-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;
}
@media (max-width:960px){.circ-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.circ-grid{grid-template-columns:1fr;gap:24px}}

.circ-card{
  background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;
  display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease;
  color:var(--text);text-decoration:none;
}
.circ-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.circ-card .circ-foto{
  aspect-ratio:4/3;background-size:cover;background-position:center;position:relative;
}
.circ-card .circ-sello{
  position:absolute;top:14px;left:14px;
  font-size:10px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;
  padding:5px 10px;border-radius:2px;
}
.circ-card .circ-sello.circ-ultimos{background:var(--circ-ultimos);color:#fff}
.circ-card .circ-body{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.circ-card h3{font-family:'Playfair Display',serif;font-weight:500;font-size:22px;color:var(--navy);margin:0 0 6px;line-height:1.25}
.circ-card .circ-paises{
  font-size:11px;letter-spacing:1.8px;text-transform:uppercase;color:var(--muted);margin-bottom:14px;
}
.circ-card .circ-dias{color:var(--muted);font-size:13px;margin-bottom:12px}
.circ-card .circ-precio{margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}
.circ-card .circ-precio .circ-desde{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.circ-card .circ-precio .circ-usd{font-family:'Playfair Display',serif;font-size:26px;color:var(--navy);line-height:1.1;font-weight:500}
.circ-card .circ-precio .circ-eur{font-size:12px;color:var(--muted);margin-top:2px}
.circ-card .circ-ver{
  margin-top:16px;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dark);font-weight:700;
}
.circ-card .circ-ver::after{content:" →"}

/* ══════════ FICHA · LAYOUT ══════════ */
.circ-ficha{
  display:grid;grid-template-columns:1fr 340px;gap:48px;
  max-width:1120px;margin:0 auto;padding:56px 24px 80px;
}
@media (max-width:900px){.circ-ficha{grid-template-columns:1fr;gap:32px;padding:36px 20px 60px}}

.circ-ficha .circ-main{min-width:0}
.circ-ficha section{margin-bottom:48px}
.circ-ficha section:last-child{margin-bottom:0}
.circ-ficha h2{
  font-family:'Playfair Display',serif;font-weight:500;
  font-size:26px;color:var(--navy);margin:0 0 18px;
  padding-bottom:12px;border-bottom:1px solid var(--line);
}
.circ-ficha .circ-desc p{margin:0 0 16px;font-size:15px;line-height:1.7;color:var(--text)}
.circ-ficha .circ-desc p:last-child{margin-bottom:0}

/* ══════════ GALERÍA HERO ══════════ */
.circ-gal{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:26px}
.circ-gal .circ-g{aspect-ratio:1/1;background-size:cover;background-position:center;border-radius:3px;overflow:hidden;min-height:120px}
.circ-gal .circ-g.circ-big{grid-column:span 2;grid-row:span 2;aspect-ratio:auto;min-height:260px}
@media (max-width:640px){.circ-gal{grid-template-columns:repeat(2,1fr)}.circ-gal .circ-g.circ-big{grid-column:span 2;min-height:200px}}

/* ══════════ SELECTOR DE ORIGEN + CALENDARIO ══════════ */
.circ-origen{display:flex;gap:0;border:1px solid var(--line);border-radius:3px;overflow:hidden;margin-bottom:20px;max-width:340px}
.circ-origen button{
  flex:1;background:#fff;border:none;padding:14px 18px;cursor:pointer;
  font-family:'Lato',sans-serif;font-size:12px;font-weight:700;letter-spacing:2px;
  text-transform:uppercase;color:var(--muted);transition:all .15s ease;
}
.circ-origen button.circ-on{background:var(--navy);color:var(--cream)}

.circ-cal{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
@media (max-width:640px){.circ-cal{grid-template-columns:1fr}}

.circ-mes{background:#fff;border:1px solid var(--line);border-radius:3px;padding:18px 16px 16px}
.circ-mes h4{
  font-family:'Lato',sans-serif;font-weight:700;
  font-size:11px;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);text-align:center;margin:0 0 12px;
}
.circ-mes .circ-dow-row{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.circ-mes .circ-days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.circ-mes .circ-dow{
  font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  color:var(--muted);text-align:center;padding:4px 0 6px;
}
.circ-mes .circ-cel{
  aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  border-radius:3px;font-size:11px;color:var(--muted);position:relative;box-sizing:border-box;
}
.circ-mes .circ-cel.circ-disp{background:var(--cream-soft);color:var(--navy);cursor:pointer;border:1px solid transparent}
.circ-mes .circ-cel.circ-disp:hover{border-color:var(--gold)}
.circ-mes .circ-cel.circ-disp.circ-min{border-bottom:2px solid var(--gold-dark)}
.circ-mes .circ-cel.circ-disp.circ-ult{border:1px solid var(--circ-ultimos)}
.circ-mes .circ-cel.circ-disp.circ-on{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.circ-mes .circ-cel .circ-num{font-weight:700;font-size:12px;line-height:1}
.circ-mes .circ-cel .circ-pr{font-size:9px;letter-spacing:.3px;margin-top:1px;opacity:.85}
.circ-mes .circ-cel.circ-disp.circ-on .circ-pr{opacity:1}

.circ-leyenda{
  margin-top:20px;font-size:11.5px;color:var(--muted);line-height:1.6;
}
.circ-leyenda .circ-tag{display:inline-flex;align-items:center;gap:6px;margin-right:16px}
.circ-leyenda .circ-tag::before{content:"";width:10px;height:10px;border-radius:2px;background:var(--cream-soft);border:1px solid var(--gold-dark)}
.circ-leyenda .circ-tag.circ-tag-rojo::before{border-color:var(--circ-ultimos)}

/* ══════════ ITINERARIO ══════════ */
.circ-iti{border:1px solid var(--line);border-radius:3px;overflow:hidden}
.circ-iti .circ-dia{border-bottom:1px solid var(--line)}
.circ-iti .circ-dia:last-child{border-bottom:0}
.circ-iti .circ-dia summary{
  padding:16px 18px;cursor:pointer;list-style:none;
  display:flex;align-items:center;gap:14px;background:#fff;
}
.circ-iti .circ-dia summary::-webkit-details-marker{display:none}
.circ-iti .circ-dia summary::after{content:"+";margin-left:auto;color:var(--gold-dark);font-size:22px;font-weight:300}
.circ-iti .circ-dia[open] summary{background:var(--cream-soft)}
.circ-iti .circ-dia[open] summary::after{content:"−"}
.circ-iti .circ-dia .circ-daynum{
  font-family:'Playfair Display',serif;font-weight:500;
  font-size:12px;color:var(--gold-dark);letter-spacing:2px;text-transform:uppercase;
}
.circ-iti .circ-dia .circ-daytitle{font-family:'Playfair Display',serif;font-weight:500;font-size:16px;color:var(--navy)}
.circ-iti .circ-dia .circ-daycity{font-size:11px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase}
.circ-iti .circ-dia .circ-daybody{padding:8px 18px 20px;font-size:14px;line-height:1.65;color:var(--text)}
.circ-iti .circ-dia .circ-daybody p{margin:0 0 8px}
.circ-iti .circ-dia .circ-daybody p:last-child{margin-bottom:0}
.circ-iti .circ-dia .circ-daycom{
  margin-top:10px;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);
}

/* ══════════ HOTELES ══════════ */
.circ-hoteles{display:grid;gap:20px}
.circ-hoteles article.circ-hotel{
  display:grid;grid-template-columns:200px 1fr;gap:22px;
  border:1px solid var(--line);border-radius:3px;background:#fff;overflow:hidden;
}
@media (max-width:600px){.circ-hoteles article.circ-hotel{grid-template-columns:1fr}}
.circ-hotel .circ-hfoto{aspect-ratio:4/3;background-size:cover;background-position:center}
@media (max-width:600px){.circ-hotel .circ-hfoto{aspect-ratio:16/9}}
.circ-hotel .circ-hbody{padding:18px 20px 20px}
.circ-hotel .circ-hname{font-family:'Playfair Display',serif;font-weight:500;font-size:19px;color:var(--navy);line-height:1.3}
.circ-hotel .circ-hname .circ-osim{font-family:'Lato',sans-serif;font-style:italic;font-weight:400;color:var(--muted);font-size:14px}
.circ-hotel .circ-hstars{color:var(--gold-dark);font-size:14px;letter-spacing:1px;margin:4px 0 8px}
.circ-hotel .circ-hmeta{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.circ-hotel .circ-hdir{font-size:12.5px;color:var(--muted);margin-top:6px}
.circ-hotel .circ-hval{font-size:12px;color:var(--muted);margin-top:6px}
.circ-hotel .circ-halts{
  margin-top:10px;padding-top:10px;border-top:1px dashed var(--line);
  font-size:12.5px;color:var(--muted);line-height:1.55;
}
.circ-hoteles-nota{
  margin-top:18px;padding:14px 16px;background:var(--cream-soft);border-left:3px solid var(--gold);
  font-size:12.5px;color:var(--muted);line-height:1.6;
}

/* ══════════ INCLUYE / NO INCLUYE ══════════ */
.circ-inc{display:grid;grid-template-columns:1fr 1fr;gap:32px}
@media (max-width:640px){.circ-inc{grid-template-columns:1fr;gap:24px}}
.circ-inc h3{font-family:'Playfair Display',serif;font-weight:500;font-size:18px;color:var(--navy);margin:0 0 12px}
.circ-inc ul{list-style:none;padding:0;margin:0}
.circ-inc li{padding:6px 0 6px 22px;font-size:14px;line-height:1.5;position:relative;color:var(--text)}
.circ-inc .circ-inc-si li::before{
  content:"";position:absolute;left:0;top:12px;width:12px;height:6px;
  border-left:2px solid var(--gold-dark);border-bottom:2px solid var(--gold-dark);
  transform:rotate(-45deg);
}
.circ-inc .circ-inc-no li{color:var(--muted)}
.circ-inc .circ-inc-no li::before{
  content:"";position:absolute;left:2px;top:14px;width:10px;height:1px;background:var(--muted);
}

/* ══════════ NOTAS ══════════ */
.circ-notas{
  padding:20px 22px;background:var(--cream-soft);border-left:3px solid var(--gold);border-radius:0 3px 3px 0;
  font-size:14px;line-height:1.65;color:var(--text);white-space:pre-wrap;
}

/* ══════════ PANEL LATERAL ══════════ */
.circ-panel{
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:22px 22px 20px;
  position:sticky;top:24px;align-self:start;
}
@media (max-width:900px){.circ-panel{position:static}}
.circ-panel .circ-plbl{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.circ-panel .circ-pusd{font-family:'Playfair Display',serif;font-weight:500;font-size:32px;color:var(--navy);line-height:1}
.circ-panel .circ-peur{font-size:13px;color:var(--muted);margin-top:4px}
.circ-panel .circ-fsel{
  margin:16px 0 0;padding:12px 14px;background:var(--cream-soft);border-radius:3px;
  font-size:13px;color:var(--navy);line-height:1.5;
}
.circ-panel .circ-fsel .circ-flabel{font-size:11px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-bottom:3px}
.circ-panel .circ-wabtn{width:100%;margin-top:18px}
.circ-panel .circ-pnota{margin-top:12px;font-size:11.5px;color:var(--muted);line-height:1.55}

/* ══════════ FOOTER DE MONEDA ══════════ */
.circ-fx{
  margin-top:60px;padding:20px 24px;background:var(--cream-soft);border-top:1px solid var(--line);
  text-align:center;font-size:12px;color:var(--muted);line-height:1.6;
}

/* ══════════ CALL-TO-ACTION al pie de las cards de categoría en /the-world ══════════ */
.circ-cat-more{
  margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
  font:700 11px/1 Lato,sans-serif;letter-spacing:2px;text-transform:uppercase;
  color:var(--gold-dark);transition:color .15s ease;
}
a.cat-card:hover .circ-cat-more{color:var(--navy);text-decoration:underline;text-underline-offset:3px}

/* ══════════ FRANJA DE TEMPORADA en /the-world ══════════ */
.circ-temp{
  display:grid;grid-template-columns:280px 1fr auto;gap:24px;align-items:center;
  background:var(--navy);color:var(--cream);padding:22px 26px;border-radius:6px;
  margin-bottom:24px;text-decoration:none;transition:transform .2s ease;
}
.circ-temp:hover{transform:translateY(-2px)}
@media (max-width:720px){.circ-temp{grid-template-columns:1fr;text-align:center;padding:22px}}
.circ-temp .circ-tempfoto{
  aspect-ratio:5/3;background-size:cover;background-position:center;border-radius:3px;min-height:150px;
}
.circ-temp .circ-temptxt .circ-tempbadge{
  font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-light);
  margin-bottom:8px;display:block;
}
.circ-temp .circ-temptxt h3{color:var(--cream);font-size:22px;line-height:1.2;margin:0 0 6px;font-family:'Playfair Display',serif;font-weight:500}
.circ-temp .circ-temptxt p{font-size:14px;color:rgba(245,242,236,.8);line-height:1.55;margin:0}
.circ-temp .circ-tempcta{
  align-self:center;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-light);
  font-weight:700;white-space:nowrap;
}
.circ-temp .circ-tempcta::after{content:" →"}
.circ-temp-wrap{margin-bottom:28px}
