/* home.css — específico de index.html · requiere base.css */
.hero{background:var(--primary);color:#fff;position:relative}
.hero .wrap{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center;padding-top:56px;padding-bottom:104px}
.hero .kicker{display:flex;gap:10px;align-items:center;font-size:15px;opacity:.9;margin-bottom:16px}
.hero .kicker::before{content:"";width:28px;height:2px;background:var(--cta)}
.hero h1{font-size:50px;max-width:15ch;margin-bottom:18px;color:#fff}
.hero h1 .n{color:#FFA552;font-style:italic;font-variation-settings:"SOFT" 100;font-weight:700}
.hero p{font-size:18px;opacity:.92;max-width:56ch;margin-bottom:26px}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero .ctas .btn-out{border-color:rgba(255,255,255,.6);color:#fff}
.hero .collage{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:200px 200px;gap:10px}
.hero .collage .photo{border-radius:14px}.hero .collage .photo:first-child{grid-row:1/3}
.hero .collage .rt{position:absolute;top:12px;left:12px;bottom:auto;background:#fff;color:var(--text);border-radius:999px;padding:5px 10px;font-size:13px;font-weight:700;opacity:1;display:inline-flex;gap:6px}
.facts{margin-top:-52px;position:relative;z-index:2}
.facts .grid{display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border-radius:16px;box-shadow:var(--shadow-h);border:1px solid var(--border);overflow:hidden}
.facts .cell{padding:18px 22px;border-left:1px solid var(--border)}.facts .cell:first-child{border-left:0}
.facts small{display:block;color:var(--muted);font-size:13px}.facts b{font-weight:700;font-size:16px}
.sechead{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px;gap:16px}
.sechead a{color:var(--primary);font-weight:700;font-size:15px;white-space:nowrap}
.alt-chart{border:1px solid var(--border);border-radius:14px;padding:20px 24px;background:#fff}
.alt-chart svg{width:100%;height:auto;display:block}
.altwrap{display:grid;grid-template-columns:4fr 8fr;gap:40px;align-items:center}
.altwrap .kp{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.altwrap .kp div{background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px}
.altwrap .kp b{font-family:var(--display);font-size:26px;color:var(--primary);display:block;line-height:1}
.altwrap .kp small{color:var(--muted);font-size:13px;line-height:1.25;display:block;margin-top:4px}
.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card.dark{background:var(--primary-dark);color:#fff;border-color:transparent}
.card.dark p{opacity:.9;font-size:15px;margin:8px 0 14px}
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.why>div{display:flex;gap:12px;align-items:flex-start}
/* el texto debe poder romper: sin esto una palabra larga ensancha la columna */
.why>div>div{min-width:0}
.why .ico{width:40px;height:40px;flex:0 0 40px;border-radius:10px;font-size:16px}
.why b{display:block}.why p{font-size:14px;color:var(--muted)}
.places{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.pl{border-radius:12px;overflow:hidden;position:relative;aspect-ratio:3/4}
.pl .photo{position:absolute;inset:0}
.pl .t{position:absolute;left:12px;bottom:12px;color:#fff;z-index:1;text-shadow:0 1px 4px rgba(0,0,0,.4)}
.pl .t b{display:block;font-size:16px}.pl .t small{font-size:12px;opacity:.9}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:s}
.steps div{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px}
.steps div::before{counter-increment:s;content:counter(s);display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--cta);color:#fff;font-weight:700;font-family:var(--display);margin-bottom:10px}
.steps b{display:block}.steps p{font-size:14.5px;color:var(--muted)}
.pre{background:var(--primary-dark);color:#fff;padding:56px 0}
.pre .wrap{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:center}
.pre h2{color:#fff;font-size:32px;margin-bottom:8px}.pre p{opacity:.85}
.pre .ctas{display:flex;gap:12px;margin-top:20px}
.pricegrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pricegrid div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:14px 18px;display:flex;justify-content:space-between;align-items:center}
.pricegrid b{font-weight:600}.pricegrid small{display:block;opacity:.7;font-size:13px;font-weight:400}
.pricegrid .pr{font-family:var(--display);font-size:24px;color:#FFA552;font-weight:700}
@media (max-width:760px){.hero .wrap{grid-template-columns:1fr;padding-top:36px;padding-bottom:84px;gap:24px}.hero h1{font-size:32px}.hero p{font-size:16px}.hero .collage{grid-template-rows:110px 110px;order:1;margin-top:4px}.facts .grid{display:flex;overflow-x:auto;border-radius:14px}.facts .cell{flex:none;min-width:160px;padding:14px 16px}.altwrap,.cols3,.steps,.pre .wrap{grid-template-columns:1fr}.why,.places{grid-template-columns:1fr 1fr}.pre .ctas{flex-direction:column}.pre h2{font-size:26px}.alt-chart{padding:12px;overflow-x:auto}.alt-chart svg{min-width:600px}}
/* Last Minute en el hero (fondo azul): variante clara del banner .lm de tour.css */
.hero .lm{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin:0 0 22px;padding:12px 16px;border:1px solid rgba(255,255,255,.35);border-radius:12px;background:rgba(255,255,255,.08);font-size:15px}
.hero .lm b{color:#fff}
.hero .lm .cd{font-family:var(--display);font-weight:700;color:#FFA552;font-size:22px;font-variant-numeric:tabular-nums;white-space:nowrap}
.hero .lm.closed .cd{font-size:15px;white-space:normal;color:#FFC9B3}
.scores{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.scores>div{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px}
.scores .src{font-size:13px;color:var(--muted);margin-top:8px}
.cmp .card b.hd{display:block;font-family:var(--display);font-size:22px;color:var(--primary-dark);margin-bottom:6px}
.cmp .card .meta{font-size:14px;color:var(--muted);margin-bottom:10px}
@media (max-width:760px){.scores{grid-template-columns:1fr}}
/* Móvil: la gráfica (svg min-width 600) estiraba la rejilla .altwrap y la tabla de precios desbordaba 12 px */
@media (max-width:760px){.altwrap>div{min-width:0}.t{font-size:13px}.t th,.t td{padding:9px 7px}}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:760px){.pricegrid{grid-template-columns:1fr}.pricegrid div{min-width:0}}
@media (max-width:760px){.sechead{flex-direction:column;align-items:flex-start;gap:6px}.sticky .p b[data-lm-countdown]{font-size:17px}}
.upd+.steps,.steps+.upd{margin-top:14px}
.cmp .card b.hd{line-height:1.15}.steps b{line-height:1.3}

/* Norma de resolución: escritorio bajo y pantallas grandes (el héroe vive en home.css) */
@media (min-width:901px) and (max-height:820px){
  .hero .wrap{padding-top:28px;padding-bottom:72px}
  .hero h1{font-size:40px;margin-bottom:12px}
  .hero p{font-size:16px;margin-bottom:16px}
  .hero .lm{margin-bottom:14px;padding:10px 14px}
  .hero .lm .cd{font-size:19px}
}
@media (min-width:1600px) and (min-height:900px){
  .hero .wrap{padding-top:88px;padding-bottom:140px;align-items:center}
  .hero .collage{grid-template-rows:230px 230px}
  .hero h1{font-size:54px}
}

/* Pestañas Express / Clásico de la gráfica de altitud */
.tabs2{display:flex;gap:8px;margin-bottom:12px}
.tabs2 button{border:1.5px solid var(--border);background:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-size:14px;font-weight:700;color:var(--text);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.tabs2 button:hover{border-color:var(--cta);background:var(--cream)}
.tabs2 button.on{background:var(--primary);color:#fff;border-color:var(--primary)}
/* alemán: las palabras compuestas no caben en dos columnas en móvil estrecho */
@media (max-width:460px){.why{grid-template-columns:1fr}}