/* ============================================================
   GUÍAS RELACIONADAS · "Sigue explorando las guías"
   Carrusel de tarjetas al pie de cada guía del Centro de Conocimiento.
   Autónomo: las guías antiguas no cargan brand.css (solo guias-brand.css),
   así que aquí van los valores de marca explícitos.
   Titulares en Anton con letter-spacing 0, como en todo el sitio.
   ============================================================ */
.gr{background:#F5F0E8;color:#0A0A0A;padding:88px clamp(20px,4vw,56px) 96px;}
.gr *,.gr *::before,.gr *::after{box-sizing:border-box;}
.gr-in{max-width:1300px;margin:0 auto;}

/* Cabecera: titular a la izquierda, flechas y "Ver todas" a la derecha */
.gr-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin:0 0 34px;}
.gr-title{font-family:'Anton',Impact,sans-serif;font-weight:400;font-style:normal;font-size:clamp(33px,3.6vw,60px);line-height:1.07;letter-spacing:0;text-transform:none;color:#08142E;margin:0;}
.gr-actions{display:flex;align-items:center;gap:10px;}
.gr-arrow{display:none;place-items:center;width:52px;height:52px;padding:0;margin:0;border-radius:50%;border:1.5px solid rgba(8,20,46,.22);background:transparent;color:#08142E;cursor:pointer;transition:background .2s,color .2s,border-color .2s,opacity .2s;}
.gr-js .gr-arrow{display:grid;}
.gr-arrow svg{width:20px;height:20px;display:block;}
.gr-arrow:hover:not(:disabled){background:#08142E;border-color:#08142E;color:#F7C531;}
.gr-arrow:disabled{opacity:.3;cursor:default;}
.gr-all{margin-left:6px;font-family:'Bebas Neue',Impact,sans-serif;font-size:19px;letter-spacing:2px;text-transform:uppercase;line-height:1;color:#08142E;text-decoration:none;border:1.5px solid rgba(8,20,46,.28);border-radius:100px;padding:15px 24px 14px;white-space:nowrap;transition:background .2s,color .2s,border-color .2s;}
.gr-all:hover{background:#08142E;border-color:#08142E;color:#fff;}
.gr-arrow:focus-visible,.gr-all:focus-visible,.gr-card:focus-visible{outline:3px solid #F7C531;outline-offset:3px;}

/* Fila desplazable: se asoma la siguiente tarjeta para invitar a deslizar */
.gr-rail{list-style:none;display:grid;grid-auto-flow:column;grid-auto-columns:23%;gap:22px;margin:-12px -20px -56px;padding:12px 20px 56px;scroll-padding-inline:20px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.gr-rail::-webkit-scrollbar{display:none;}
.gr-rail>li{display:flex;margin:0;padding:0;scroll-snap-align:start;}
.gr-rail>li::before,.gr-rail>li::marker{content:none;}

/* Tarjeta: mismo lenguaje que las del hub */
.gr-card{display:flex;flex-direction:column;width:100%;background:#fff;border:1px solid rgba(8,20,46,.1);border-radius:20px;overflow:hidden;color:inherit;text-decoration:none;box-shadow:0 24px 54px -38px rgba(8,20,46,.5);transition:transform .28s,box-shadow .28s;}
.gr-card:hover{transform:translateY(-5px);box-shadow:0 40px 80px -44px rgba(8,20,46,.6);}
.gr-img{aspect-ratio:16/10;overflow:hidden;background:#0D1F45;}
.gr-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.gr-card:hover .gr-img img{transform:scale(1.05);}
.gr-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px;}
.gr-tag{font-family:'Bebas Neue',Impact,sans-serif;font-size:14px;letter-spacing:2px;text-transform:uppercase;color:#0D2B6E;}
.gr-t{font-family:'Anton',Impact,sans-serif;font-weight:400;font-style:normal;font-size:22px;line-height:1.12;letter-spacing:0;text-transform:none;color:#08142E;margin:8px 0 18px;}
.gr-go{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:14px;border-top:1px solid rgba(8,20,46,.1);font-family:'Bebas Neue',Impact,sans-serif;font-size:16px;letter-spacing:2px;text-transform:uppercase;color:#08142E;}
.gr-go::after{content:"→";font-family:'Inter',Arial,sans-serif;font-size:17px;letter-spacing:0;transition:transform .2s;}
.gr-card:hover .gr-go::after{transform:translateX(4px);}

@media(max-width:1080px){.gr-rail{grid-auto-columns:31%;}}
@media(max-width:760px){
  .gr{padding:64px 20px 72px;}
  .gr-head{flex-direction:column;align-items:flex-start;margin-bottom:26px;}
  .gr-js .gr-arrow{display:none;}
  .gr-all{margin-left:0;}
  .gr-rail{grid-auto-columns:46%;gap:16px;}
}
@media(max-width:560px){.gr-rail{grid-auto-columns:80%;}.gr-t{font-size:21px;}}
@media(prefers-reduced-motion:reduce){.gr-rail{scroll-behavior:auto;}.gr-card,.gr-img img,.gr-go::after{transition:none;}}