
@font-face{font-family:"Anton";font-display:swap;src:url(assets/fonts/anton-400.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:400;font-display:swap;src:url(assets/fonts/poppins-400.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:600;font-display:swap;src:url(assets/fonts/poppins-600.woff2) format("woff2")}
:root{--az:#0064A0;--mn:#32F6BE;--go:#626C76;--gp:#7A8692;--bl:#FFFFFF}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Poppins,system-ui,sans-serif;font-size:1.125rem;line-height:1.55;color:var(--go);background:var(--bl)}
img{max-width:100%;height:auto;display:block}
picture{display:block}
p{margin:0 0 1rem}
.skip{position:absolute;left:1rem;top:-100px;z-index:10;background:var(--az);color:var(--bl);padding:14px 28px;border-radius:40px;font-weight:600}
.skip:focus{top:1rem}
:focus-visible{outline:3px solid var(--az);outline-offset:3px;border-radius:4px}
.b :focus-visible,.ft :focus-visible{outline-color:var(--mn)}
main:focus{outline:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.narrow{max-width:920px}
.grid{background-color:var(--bl);background-image:linear-gradient(rgba(122,134,146,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(122,134,146,.18) 1px,transparent 1px);background-size:40px 40px}
.top{padding:20px 20px 4px;display:flex;justify-content:center}
.logo-camp{width:min(300px,78vw)}
.sec{padding:48px 0 56px} .hero + .sec{padding-top:72px}
.w,.w2{color:var(--go)} .w2{border-top:2px solid #E3E8EC}
.b{background:var(--az);color:var(--bl)}
.hd{font-family:Anton,Impact,sans-serif;font-weight:900;color:var(--az);line-height:1.12;letter-spacing:-.01em;margin:0 0 1.25rem;font-size:clamp(2.5rem,9vw,4.5rem)}
h1.hd{font-size:clamp(2.9rem,12vw,5.75rem)}
.b .hd{color:var(--bl)}
.hl{position:relative;display:inline-block;white-space:nowrap;margin:calc(48px + .15em) calc(50px + .45em) calc(48px + .15em) calc(50px + .3em);vertical-align:baseline}
.hw{position:relative;z-index:1;color:var(--az)} .b .hw{color:var(--mn)}
.oval{position:absolute;z-index:0;left:-50px;right:-50px;top:-34px;bottom:-34px;width:calc(100% + 100px);height:calc(100% + 68px);overflow:visible;pointer-events:none}
.pill{display:inline-block;font-weight:600;padding:14px 28px;border-radius:40px;border:3px solid var(--az);color:var(--az);line-height:1.3;background:var(--bl)}
.b .pill{background:var(--mn);border-color:var(--mn);color:var(--az)}
.pill-hero{margin-bottom:1.25rem}
.lead{font-size:1.25rem}
.hero-in{display:grid;gap:8px}
.hero-foto{width:min(320px,80%);margin:0 auto -56px}
.hero-foto img,.hacer-foto img{width:100%}
ul[role=list],ol[role=list]{list-style:none;margin:0;padding:0}
.cards{display:grid;gap:16px}
.card{background:var(--bl);border:2px solid var(--gp);border-radius:24px;padding:22px 24px;color:var(--az)}
.card h3{font-family:Anton,sans-serif;font-weight:900;font-size:2rem;line-height:1.1;margin:10px 0 6px}
.card p{margin:0;color:var(--go)}
.ic{width:52px;height:52px;color:var(--az)}
.pills{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 28px!important}
.key{display:flex;gap:18px;align-items:flex-start;background:var(--az);color:var(--bl);border-radius:24px;padding:22px 26px;font-weight:600;margin:0}
.key-out{background:transparent;border:3px solid var(--bl)}
.ic-key{flex:none;width:44px;height:44px;color:var(--mn)}
.signals{display:grid;gap:12px;margin-bottom:24px!important}
.signals li{display:flex;gap:14px;align-items:center}
.signals span{flex:1;background:var(--bl);color:var(--az);border-radius:28px;padding:12px 24px;line-height:1.4}
.arr{flex:none;width:40px;height:40px;color:currentColor}
.steps{display:grid;gap:12px;margin-bottom:20px!important}
.steps li{display:flex;gap:16px;align-items:center;padding:14px 20px 14px 14px}
.num{flex:none;width:48px;height:48px;border-radius:50%;background:var(--az);color:var(--bl);font-weight:600;display:flex;align-items:center;justify-content:center}
.b .card{border-color:transparent}
.hacer-foto{width:min(300px,75%);margin:24px auto 0}
a{color:var(--az);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.b a{color:var(--bl)}
.ext{font-weight:400}
.rutas{width:100%;border-collapse:collapse;margin-top:12px}
.rutas caption{text-align:left;font-weight:600;color:var(--az);margin-bottom:8px}
.rutas th,.rutas td{text-align:left;vertical-align:top;padding:14px 16px;border-top:2px solid var(--gp)}
.rutas thead th{background:var(--az);color:var(--bl);border:0}
.rutas tbody th{color:var(--az);font-weight:600}
.mas-link{display:flex;gap:14px;align-items:flex-start;color:var(--az)}
.mas-link .arr{margin-top:2px}
.aviso{font-size:.9375rem;font-style:italic;margin:16px 0 0}
.ft{background:var(--az);color:var(--bl);padding:40px 0 32px;border-top:4px solid var(--mn)}
.ft-date{font-weight:600}
.ft-logos{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:24px}
.ald{width:min(170px,40vw)}
/* Kit CRC: logo mínimo 271 × 120 px. 282px de ancho = arte del logo de 273 × 121 px */
.crc{display:block;flex:none;width:282px;margin-left:auto}
.crc img{width:100%}
@media (max-width:519px){.ft-logos{flex-wrap:wrap;row-gap:28px}}
@media (max-width:359px){.wrap{padding:0 16px}.hd{font-size:2.25rem}}
@media (max-width:719px){
  .rutas thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .rutas caption{display:block;width:100%}
  .rutas,.rutas tbody,.rutas tr,.rutas th,.rutas td{display:block;width:100%}
  .rutas tr{border:2px solid var(--gp);border-radius:20px;margin-bottom:12px;background:var(--bl);overflow:hidden}
  .rutas th,.rutas td{border:0}
  .rutas tbody th{padding-bottom:4px}
  .rutas td::before{content:"Ruta oficial: ";display:block;font-size:1rem;font-weight:600;color:var(--go)}
}
@media (min-width:720px){
  body{font-size:1.1875rem}
  .wrap{padding:0 40px}
  .sec{padding:72px 0 80px}
  .cards{grid-template-columns:1fr 1fr;gap:20px}
  .hero-in{grid-template-columns:1.15fr .85fr;align-items:end}
  .hero-foto{width:100%;max-width:420px;margin:0 0 -80px auto}
  .hacer-in{display:grid;grid-template-columns:1.4fr .6fr;gap:40px;align-items:end}
  .hacer-foto{width:100%;margin:0}
  .rutas thead th:first-child{border-radius:16px 0 0 0} .rutas thead th:last-child{border-radius:0 16px 0 0}
  .rutas tbody th{width:42%}
}
@media (min-width:1100px){.cards{grid-template-columns:repeat(4,1fr)}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
