@font-face{font-family:Sch;src:url(/fonts/schibsted-grotesk-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Sch;src:url(/fonts/schibsted-grotesk-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Sch;src:url(/fonts/schibsted-grotesk-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}

:root{
  --fondo:#eef2f0;--blanco:#fff;--tinta:#0e1a17;--suave:#475651;--gris:#5f6e68;--linea:#d5ddd9;
  --esm:#0b6e4f;--esm-claro:#3ccf96;--esm2:#d7efe5;
  --coral:#ff5b3a;--coral-t:#c23a1e;--coral2:#ffe3dc;
  --noche:#0f1d19;--noche2:#1a2d27;--noche3:#2d4a40;--niebla:#a9bdb5;--clara:#e9f1ee;
  --ancho:1240px;--gutter:clamp(16px,4vw,56px);--radio:24px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--fondo);color:var(--tinta);font:400 17px/1.55 Sch,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
::selection{background:var(--esm);color:#fff}
img{max-width:100%;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0;letter-spacing:-.025em;line-height:1.05}
h2{font-weight:800;font-size:clamp(2rem,3.6vw,3rem)}
h3{font-weight:800;font-size:20px;letter-spacing:-.01em;line-height:1.2}
p{margin:0}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--tinta);color:#fff;padding:8px 14px;border-radius:8px;z-index:100}
.skip:focus{left:8px}
.envase{max-width:var(--ancho);margin:0 auto;padding:0 var(--gutter)}
.intro{color:var(--suave);font-size:19px;max-width:52ch;margin-top:14px}

/* navegación */
.barra{position:sticky;top:0;z-index:50;background:rgba(238,242,240,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .3s}
.barra.sombra{border-bottom-color:var(--linea)}
.barra-in{display:flex;justify-content:space-between;align-items:center;gap:16px;max-width:1400px;margin:0 auto;padding:14px var(--gutter)}
.marca{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;letter-spacing:-.01em;text-decoration:none;white-space:nowrap}
.marca i{flex:none;width:28px;height:28px;border-radius:8px;background:var(--esm);position:relative}
.marca i::before,.marca i::after{content:"";position:absolute;width:13px;height:3px;border-radius:2px;left:7.5px}
.marca i::before{top:9px;background:#fff;transform:translateX(-2px)}
.marca i::after{top:16px;background:var(--coral);transform:translateX(2px)}
.menu{display:flex;align-items:center;gap:26px;font-weight:600;font-size:15px}
.menu a{text-decoration:none}
.menu a:not(.btn):hover{color:var(--esm)}
.idiomas{display:flex;gap:2px;font-size:13px;letter-spacing:.05em}
.idiomas a{padding:4px 6px;border-radius:6px;color:var(--gris)}
.idiomas a[aria-current]{color:var(--tinta);background:var(--blanco)}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--tinta);color:#fff;font-weight:600;font-size:15px;padding:10px 18px;border-radius:99px;text-decoration:none;border:0;cursor:pointer;transition:background .2s,transform .2s}
.btn:hover{background:var(--esm)}
.btn.grande{font-size:17px;padding:14px 24px}
.btn.claro{background:var(--blanco);color:var(--tinta)}
.btn.claro:hover{background:var(--esm2)}

/* portada */
.portada{max-width:var(--ancho);margin:0 auto;padding:clamp(20px,3.4vw,44px) var(--gutter) 0;display:grid;grid-template-columns:1.25fr 1fr;gap:24px 48px;align-items:end}
h1{font-weight:800;font-size:clamp(2.4rem,4.6vw,4.1rem);line-height:1;letter-spacing:-.035em}
h1 .ida{color:var(--esm)}h1 .vuelta{color:var(--coral)}
.bajada{color:var(--suave);font-size:18px;max-width:44ch}
.acciones{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin-top:20px}
.acciones .correo{font-weight:600;font-size:15px;text-decoration-color:var(--linea);text-underline-offset:4px}
.acciones .correo:hover{text-decoration-color:var(--esm)}

/* simulador */
.escena{max-width:var(--ancho);margin:clamp(24px,3vw,40px) auto 0;padding:0 var(--gutter)}
.mesa{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) clamp(80px,9vw,130px) minmax(0,1fr);background:var(--blanco);border-radius:var(--radio);box-shadow:0 30px 60px -40px rgba(14,26,23,.45)}
.panel{padding:24px;min-width:0}
.sistema{overflow:hidden}
.ptit{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
.ptit h2{font-size:14px;letter-spacing:.06em;text-transform:uppercase;line-height:1.3}
.ptit span{font-size:13px;color:var(--gris)}
.tabla{width:100%;border-collapse:collapse;font-size:15px}
.tabla th{font-weight:600;color:var(--gris);text-align:left;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:0 8px 8px;border-bottom:1px solid var(--linea)}
.tabla td{padding:10px 8px;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabla tbody tr:last-child td{border-bottom:0}
.tabla td:first-child,.tabla td:nth-child(2){white-space:nowrap}
.tabla td small{display:block;color:var(--gris);font-size:13px;margin-left:18px}
.tabla td:last-child{text-align:right}
.fila{cursor:grab;user-select:none;-webkit-user-select:none;transition:background .3s,opacity .3s}
.fila:hover{background:#f5f8f7}
.fila.viaje{opacity:.5}
.fila.hecha{cursor:default}
.asa{display:inline-block;width:10px;height:15px;margin-right:8px;vertical-align:-2px;background:radial-gradient(circle,var(--gris) 1.3px,transparent 1.6px) 0 0/5px 5px;opacity:.55}
.det{display:inline-block;transition:background 1.6s}
.det.cambio{background:var(--esm2);border-radius:6px;padding:1px 6px;margin-left:-6px;font-weight:600}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:4px 10px;border-radius:99px;background:#eef1f0;color:var(--suave);white-space:nowrap}
.chip.vivo{background:var(--coral2);color:#a8301a}
.chip.vivo::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--coral);animation:lat 1s infinite}
.chip.ok{background:var(--esm);color:#fff}
.chip.cam{background:var(--esm2);color:#07563d}
.chip.no{background:#e3e7e5;color:#4a5651}
.chip.pop{animation:pop .5s cubic-bezier(.2,1.6,.4,1)}
@keyframes pop{from{transform:scale(.6)}}
@keyframes lat{50%{opacity:.25}}
.enviar{border:1.5px solid var(--linea);background:var(--blanco);border-radius:99px;padding:5px 12px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:border-color .2s,background .2s}
.enviar:hover{border-color:var(--esm);background:var(--esm2)}
.enviar:disabled{opacity:.4;cursor:default;background:none;border-color:var(--linea)}
.cont{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:14px;padding-top:12px;border-top:1px dashed var(--linea);font-size:14px;color:var(--suave)}
.cont b{color:var(--tinta);font-variant-numeric:tabular-nums}
.carril{position:relative}
.carril svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lbl{position:absolute;left:50%;transform:translateX(-50%);font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.lbl.ida{top:30%;color:var(--esm)}.lbl.vuelta{top:66%;color:var(--coral-t)}
.agente{background:var(--noche);color:var(--clara);border-radius:0 var(--radio) var(--radio) 0;display:flex;flex-direction:column;height:480px}
.agente.blanco{outline:3px dashed var(--esm-claro);outline-offset:-10px}
.ag-cab{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.orbe{flex:none;width:46px;height:46px;border-radius:50%;background:var(--noche2);display:grid;place-items:center;position:relative}
.orbe svg{width:22px;height:22px}
.orbe.llamando::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--coral);animation:anillo 1.2s infinite}
@keyframes anillo{from{transform:scale(.9);opacity:1}to{transform:scale(1.35);opacity:0}}
.ag-cab b{display:block;font-size:16px}.ag-cab span{font-size:13px;color:var(--niebla)}
.reloj{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:600;color:var(--niebla)}
#onda{width:100%;height:60px;display:block;margin-bottom:10px;--onda-a:#3ccf96;--onda-c:#ff8a70;--onda-off:#2c463d}
#p-ida{stroke:var(--esm)}#p-vuelta{stroke:var(--coral)}
.trans{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;-webkit-mask-image:linear-gradient(transparent,#000 28%);mask-image:linear-gradient(transparent,#000 28%)}
.bur{max-width:86%;padding:8px 12px;border-radius:14px;font-size:14px;line-height:1.4;animation:sube .35s cubic-bezier(.2,.9,.3,1)}
.bur.a{background:var(--noche2);border-bottom-left-radius:4px}
.bur.c{background:var(--noche3);margin-left:auto;border-bottom-right-radius:4px}
.bur.s{background:none;color:var(--niebla);font-size:12.5px;padding:2px 0;text-align:center;max-width:none}
@keyframes sube{from{opacity:0;transform:translateY(10px)}}
.vacio{color:var(--niebla);font-size:14px;text-align:center;margin:auto 0}
.cliente{margin-top:12px;padding-top:12px;border-top:1px solid #23392f}
.cliente p{margin:0 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--niebla);font-weight:600}
.seg{display:grid;grid-template-columns:repeat(3,1fr);background:var(--noche2);border-radius:12px;padding:4px;gap:4px}
.seg button{border:0;background:none;color:#cfe0d9;padding:8px 6px;border-radius:9px;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s,color .2s}
.seg button[aria-pressed="true"]{background:var(--clara);color:var(--noche)}
.paq{position:absolute;left:0;top:0;z-index:20;pointer-events:none;background:var(--blanco);border:1.5px solid var(--esm);border-radius:12px;padding:8px 12px;font-size:12.5px;color:var(--suave);box-shadow:0 14px 26px -12px rgba(14,26,23,.5);white-space:nowrap;will-change:transform}
.paq b{display:block;font-size:13px;color:var(--tinta)}
.paq.vuelta{border-color:var(--coral)}
.nota{text-align:center;color:var(--gris);font-size:14px;margin-top:14px}

/* secciones */
.seccion{padding:clamp(72px,9vw,128px) 0 0}
.cab-sec{display:grid;grid-template-columns:1fr 1fr;gap:16px 48px;align-items:end;margin-bottom:clamp(32px,4vw,52px)}
.cab-sec .intro{margin:0}

/* usos */
.usos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.uso{background:var(--blanco);border-radius:20px;padding:26px 24px 24px;display:flex;flex-direction:column;gap:10px}
.uso p{color:var(--suave);font-size:16px}
.uso .dice{margin-top:auto;padding-top:10px}
.uso q{display:block;quotes:none;background:var(--fondo);border-radius:14px 14px 14px 4px;padding:10px 14px;font-size:15px;color:var(--tinta)}
.uso .tag{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--esm)}
.uso .tag.entrante{color:var(--coral-t)}
.uso.propio{background:transparent;border:1.5px dashed #b9c6c0}
.uso.propio q{background:var(--blanco)}

/* incluido */
.incluye{margin-top:20px;background:var(--noche);color:var(--clara);border-radius:var(--radio);padding:clamp(28px,4vw,48px);display:grid;grid-template-columns:.8fr 1.2fr;gap:24px 48px}
.incluye h3{font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.02em}
.incluye p{color:var(--niebla);margin-top:12px}
.incluye ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.incluye li{padding:14px 0;border-top:1px solid #23392f;color:var(--niebla);font-size:15.5px}
.incluye li b{display:block;color:var(--clara);font-size:16.5px;margin-bottom:2px}

/* cómo funciona */
.ruta{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0;position:relative}
.ruta li{position:relative;padding:44px 28px 0 0}
.ruta li::before{content:"";position:absolute;top:13px;left:0;right:0;height:3px;border-radius:2px}
.ruta li:nth-child(1)::before{background:var(--esm)}
.ruta li:nth-child(2)::before{background:var(--noche)}
.ruta li:nth-child(3)::before{background:var(--coral)}
.ruta li::after{content:"";position:absolute;top:6px;left:0;width:17px;height:17px;border-radius:50%;background:var(--fondo);border:3px solid var(--tinta)}
.ruta .paso{font-size:13px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--gris);display:block;margin-bottom:8px}
.ruta h3{font-size:24px;margin-bottom:10px}
.ruta p{color:var(--suave)}
.ruta dl{margin:18px 0 0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14.5px;background:var(--blanco);border-radius:14px;padding:14px 16px;max-width:320px}
.ruta dt{color:var(--gris)}.ruta dd{margin:0;font-weight:600}
.aviso{color:var(--gris);font-size:14px;margin-top:22px}

.servicio{margin-top:clamp(48px,6vw,80px);display:grid;grid-template-columns:1fr 1.2fr;gap:28px 56px;align-items:start}
.servicio h3{font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.02em;margin-bottom:14px}
.servicio p{color:var(--suave);margin-bottom:12px;max-width:50ch}
.etapas{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.etapas li{display:grid;grid-template-columns:120px 1fr;gap:4px 20px;background:var(--blanco);border-radius:16px;padding:18px 20px}
.etapas .cuando{font-size:13px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--esm);grid-row:span 2;padding-top:2px}
.etapas li:last-child .cuando{color:var(--coral-t)}
.etapas b{font-size:18px}.etapas span:last-child{color:var(--suave);font-size:15.5px}

/* tarifa */
.tarifa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.concepto{background:var(--blanco);border-radius:20px;padding:26px 24px}
.concepto .cuanto{display:block;font-size:13px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--esm);margin-bottom:12px}
.concepto:last-child .cuanto{color:var(--coral-t)}
.concepto h3{font-size:24px;margin-bottom:10px}
.concepto p{color:var(--suave)}
.permanencia{margin-top:22px;font-weight:600;font-size:18px}

/* equipo */
.foto-equipo{margin:0;border-radius:var(--radio);overflow:hidden;aspect-ratio:21/9;background:var(--linea)}
.foto-equipo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.personas{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.personas li{background:var(--blanco);border-radius:20px;padding:20px}
.personas img{width:72px;height:72px;border-radius:50%;object-fit:cover;margin-bottom:14px}
.personas b{display:block;font-size:18px;letter-spacing:-.01em}
.personas span{display:block;font-size:14px;color:var(--esm);font-weight:600;margin:2px 0 8px}
.personas p{color:var(--suave);font-size:15px}
.grupo{margin-top:18px;color:var(--suave)}
.grupo a{font-weight:600}

/* contacto */
.contacto{margin-top:clamp(72px,9vw,128px);background:var(--noche);color:var(--clara);padding:clamp(56px,8vw,104px) 0}
.contacto-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 64px;align-items:start}
.contacto h2 span{color:var(--esm-claro)}
.contacto .intro{color:var(--niebla)}
.directo{margin-top:28px;color:var(--niebla)}
.directo a{display:inline-block;margin-top:4px;color:var(--clara);font-weight:600;font-size:clamp(1.1rem,2vw,1.4rem);text-underline-offset:5px;text-decoration-color:var(--esm-claro)}
.form{background:var(--blanco);color:var(--tinta);border-radius:var(--radio);padding:clamp(22px,3vw,32px);display:grid;gap:6px}
.form label{font-weight:600;font-size:14.5px;margin-top:10px}
.form label:first-of-type{margin-top:0}
.form input,.form select,.form textarea{width:100%;border:1.5px solid var(--linea);border-radius:12px;padding:11px 14px;background:var(--blanco);font-size:16px}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--esm);box-shadow:0 0 0 3px var(--esm2)}
.form textarea{resize:vertical;min-height:96px}
.form textarea::placeholder{color:#6f7d78}
.form .btn{margin-top:16px;justify-content:center;font-size:16px;padding:13px 20px}
.error{color:var(--coral-t);font-weight:600;font-size:14.5px}
.form-nota{font-size:13.5px;color:var(--gris);margin-top:6px}

/* pie */
.pie{background:var(--noche);color:var(--niebla);border-top:1px solid #23392f;padding:36px 0 44px;font-size:14.5px}
.pie-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pie-grid div{display:flex;flex-direction:column;gap:2px}
.pie b{color:var(--clara)}
.pie a{color:var(--clara);text-decoration-color:#3c5a4f;text-underline-offset:3px}

@media (max-width:1060px){
  .menu .ancla{display:none}
  .usos{grid-template-columns:1fr 1fr}
  .personas{grid-template-columns:1fr 1fr}
}
@media (max-width:980px){
  .portada,.cab-sec,.incluye,.servicio,.contacto-grid{grid-template-columns:1fr}
  .mesa{grid-template-columns:1fr;grid-template-rows:auto 84px auto}
  .agente{border-radius:0 0 var(--radio) var(--radio);height:460px}
  .lbl.ida{top:50%;left:22%;transform:translate(-50%,-50%)}.lbl.vuelta{top:50%;left:78%;transform:translate(-50%,-50%)}
  .ruta{grid-template-columns:1fr;gap:28px}
  .ruta li{padding:0 0 0 40px}
  .ruta li::before{top:0;bottom:-28px;left:7px;right:auto;width:3px;height:auto}
  .ruta li:last-child::before{bottom:0}
  .ruta li::after{top:0}
  .tarifa-grid{grid-template-columns:1fr}
  .foto-equipo{aspect-ratio:3/2}
}
@media (max-width:640px){
  body{font-size:16px}
  .usos,.personas,.incluye ul,.pie-grid{grid-template-columns:1fr}
  .marca{font-size:15px}
  .menu{gap:12px}
  .menu .btn{padding:8px 14px;font-size:14px}
  .panel{padding:18px 14px}
  .tabla td{padding:10px 4px}.tabla th{padding:0 4px 8px}
  .tabla td small{display:none}
  .tabla td:first-child,.tabla td:nth-child(2){white-space:normal}
  .tabla td:nth-child(2){font-size:14px}
  .enviar .t{display:none}
  .chip{font-size:12px;padding:4px 8px}
  .etapas li{grid-template-columns:1fr}
  .etapas .cuando{grid-row:auto}
}
@media (max-width:440px){
  .marca .eas{display:none}
  .idiomas a{padding:4px 4px}
  .barra-in{gap:8px}
  .menu{gap:8px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
