/* ══════════════════════════════════════════════════════════════════
   GUÍAS DE VIAJE — hoja propia, ligera
   Páginas editoriales de lectura larga: crema de marca, medida de
   65-70 caracteres, tipografía del sitio. No cargan styles.css para
   no arrastrar el peso del home; el header y el footer son propios y
   compactos. Los enlaces fluyen HACIA las páginas de tour, nunca al
   revés: así el sello de Ecuador queda intacto.
   ══════════════════════════════════════════════════════════════════ */
:root{
  --crema:#F2EBDD; --crema-2:#EAE1CF; --blanco:#FBF7EE;
  --olivo:#1F2818; --olivo-2:#3F4825; --olivo-3:#5C6938;
  --tinta-2:#4A5340; --tinta-3:#767C68;
  --dorado:#D9A441; --dorado-t:#B8861F; --naranja:#D17F1E;
  --linea:#DED4BE;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--crema); color:var(--olivo);
  font-family:'Hanken Grotesk',system-ui,sans-serif;
  font-size:17px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
}
img{max-width:100%}
a{color:var(--dorado-t)}

/* ── Cabecera ── */
.g-header{
  background:var(--olivo);
  padding:14px 20px;
}
.g-header-inner{
  max-width:1040px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.g-logo img{width:54px; height:54px; display:block}
.g-nav{display:flex; gap:6px 22px; flex-wrap:wrap}
.g-nav a{
  color:rgba(242,235,221,.88); text-decoration:none;
  font-family:'Oswald',sans-serif; font-size:12.5px;
  letter-spacing:.14em; text-transform:uppercase; font-weight:500;
  padding:8px 2px;
}
.g-nav a:hover{color:var(--dorado)}
.g-nav a[aria-current]{color:var(--dorado)}

/* ── Cuerpo del artículo ── */
.g-main{max-width:720px; margin:0 auto; padding:40px 22px 72px}
.g-miga{
  font-family:'Oswald',sans-serif; font-size:11.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--tinta-3); margin-bottom:22px;
}
.g-miga a{color:var(--tinta-3); text-decoration:none}
.g-miga a:hover{color:var(--dorado-t)}
.g-kicker{
  font-family:'Oswald',sans-serif; font-size:12px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--dorado-t); font-weight:600;
}
h1{
  font-family:Anton,'Arial Narrow',sans-serif; font-weight:400;
  font-size:clamp(34px,6.4vw,52px); line-height:1.04;
  text-transform:uppercase; letter-spacing:.005em;
  margin:10px 0 14px; padding-top:.06em; overflow:visible;
}
.g-fecha{
  font-family:'Oswald',sans-serif; font-size:12.5px; letter-spacing:.08em;
  color:var(--tinta-3); text-transform:uppercase;
  border-bottom:1px solid var(--linea); padding-bottom:22px; margin-bottom:26px;
}
.g-intro{font-size:19px; line-height:1.65; color:var(--tinta-2)}
h2{
  font-family:'Fraunces',Georgia,serif; font-weight:600;
  font-size:26px; line-height:1.25; margin:40px 0 12px;
}
h3{
  font-family:'Fraunces',Georgia,serif; font-weight:600;
  font-size:20px; margin:28px 0 8px;
}
p{margin:0 0 16px; max-width:68ch}
ul,ol{margin:0 0 18px; padding-left:22px}
li{margin-bottom:8px}
strong{font-weight:700}

/* ── Piezas ── */
.g-dato{
  background:var(--blanco); border:1px solid var(--linea);
  border-left:4px solid var(--dorado);
  border-radius:3px; padding:16px 18px; margin:22px 0;
  font-size:15.5px;
}
.g-alerta{
  background:rgba(209,127,30,.08); border:1px solid rgba(209,127,30,.35);
  border-left:4px solid var(--naranja);
  border-radius:3px; padding:16px 18px; margin:22px 0;
  font-size:15.5px;
}
.g-alerta strong{color:#8a5312}
.g-fuentes{
  font-size:13.5px; color:var(--tinta-3);
  border-top:1px dashed var(--linea); margin-top:34px; padding-top:14px;
}
.g-fuentes a{color:var(--tinta-3)}
.g-tabla-wrap{overflow-x:auto; margin:22px 0; border:1px solid var(--linea); border-radius:3px}
table{border-collapse:collapse; width:100%; background:var(--blanco); font-size:15px; min-width:480px}
th,td{padding:11px 14px; text-align:left; border-bottom:1px solid var(--linea); vertical-align:top}
thead th{
  font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--tinta-3); background:var(--crema-2);
}
tbody tr:last-child td{border-bottom:none}

/* ── CTA hacia el tour ── */
.g-cta{
  background:var(--olivo); color:var(--crema);
  border-radius:18px; padding:26px 24px; margin:40px 0 8px;
}
.g-cta h2{color:#fff; margin:0 0 8px; font-size:23px}
.g-cta p{color:rgba(242,235,221,.82); font-size:15.5px; margin-bottom:16px}
.g-cta-btns{display:flex; gap:12px; flex-wrap:wrap}
.g-cta .btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 22px; border-radius:999px; text-decoration:none;
  font-family:'Oswald',sans-serif; font-size:13px; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase;
  transition:transform .16s cubic-bezier(.23,1,.32,1);
}
.g-cta .btn:active{transform:scale(.97)}
.g-cta .btn-oro{
  background:linear-gradient(160deg,#E7B85F,#D9A441 45%,#D17F1E);
  color:var(--olivo);
  box-shadow:0 10px 24px -6px rgba(209,127,30,.5);
}
.g-cta .btn-linea{border:1px solid rgba(242,235,221,.4); color:var(--crema)}

/* ── Relacionados ── */
.g-rel{margin-top:36px}
.g-rel h2{font-size:20px; margin-bottom:14px}
.g-rel ul{list-style:none; padding:0; margin:0; display:grid; gap:10px}
.g-rel a{
  display:block; background:var(--blanco); border:1px solid var(--linea);
  border-radius:12px; padding:14px 16px; text-decoration:none;
  color:var(--olivo); font-weight:600; font-size:15.5px;
  transition:transform .16s cubic-bezier(.23,1,.32,1);
}
.g-rel a:active{transform:scale(.985)}
.g-rel a span{display:block; font-weight:400; font-size:13.5px; color:var(--tinta-3); margin-top:2px}

/* ── Portada de la sección ── */
.g-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:26px}
@media(max-width:700px){.g-grid{grid-template-columns:1fr}}
.g-card{
  background:var(--blanco); border:1px solid var(--linea); border-radius:16px;
  padding:20px; text-decoration:none; color:var(--olivo); display:block;
  transition:transform .16s cubic-bezier(.23,1,.32,1), box-shadow .2s ease;
}
.g-card:hover{box-shadow:0 10px 26px -12px rgba(31,40,24,.25)}
.g-card:active{transform:scale(.985)}
.g-card .tema{
  font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--dorado-t); font-weight:600;
}
.g-card h2{font-size:19px; margin:6px 0 6px; line-height:1.3}
.g-card p{font-size:14.5px; color:var(--tinta-2); margin:0}

/* ── Pie ── */
.g-footer{
  background:var(--olivo); color:rgba(242,235,221,.75);
  padding:34px 22px; margin-top:30px; font-size:14px;
}
.g-footer-inner{max-width:1040px; margin:0 auto; display:flex; flex-wrap:wrap; gap:18px 40px; justify-content:space-between; align-items:center}
.g-footer a{color:var(--dorado); text-decoration:none}
.g-footer nav{display:flex; gap:18px; flex-wrap:wrap}

/* ── WhatsApp flotante (mismo de todo el sitio) ── */
.wa-float{
  position:fixed; right:20px; bottom:20px; z-index:40;
  width:56px; height:56px; border-radius:50%;
  background:#25D366; display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
.wa-float svg{width:30px; height:30px; fill:#fff}
@media print{.wa-float,.g-cta{display:none}}