/* Página de servicios. Se apoya en la paleta y navegación compartidas. */
.oferta { overflow-wrap:break-word }
.oferta :is(a, summary):focus-visible { outline:2px solid var(--acc); outline-offset:5px }
.oferta :is(h1,h2,h3) { text-wrap:balance; letter-spacing:-.04em }
.oferta h2 { font-size:clamp(1.8rem,3vw,3.1rem); line-height:1.13; font-weight:600 }
.oferta h3 { font-size:clamp(1.25rem,1.65vw,1.75rem); line-height:1.25; font-weight:600 }
.oferta p { color:var(--tx-mid); line-height:1.7 }
.oferta-hero {
 padding:calc(var(--isla) + 68px) 0 64px;
 background:radial-gradient(ellipse at 85% 45%,rgb(77 163 255 / .08),transparent 55%);
 border-bottom:1px solid var(--line);
}
.oferta-hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:center; gap:clamp(40px,6vw,110px) }
.oferta-presentacion { max-width:840px }
.oferta-presentacion .label { display:flex; align-items:center; gap:12px; color:var(--tx-mid) }
.oferta-punto { width:7px; height:7px; background:var(--acc); border-radius:50%; box-shadow:0 0 16px rgb(77 163 255 / .4) }
.oferta h1 { margin:25px 0; font-size:clamp(2.75rem,4.8vw,5.9rem); line-height:1.07; font-weight:600; max-width:15ch }
.oferta h1 em { color:var(--acc); font-style:normal }
.oferta-intro { font-size:clamp(1rem,1.15vw,1.2rem); max-width:55ch }
.oferta-acciones { display:flex; flex-wrap:wrap; align-items:center; gap:20px 28px; margin:30px 0 }
.oferta .btn { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:48px; padding:13px 19px; text-align:center }
.oferta .btn span { font-size:20px; line-height:1 }
.oferta-enlace { display:inline-flex; align-items:center; justify-content:space-between; gap:14px; min-height:44px; color:var(--tx); text-decoration:none; font-size:.9rem }
.oferta-enlace:hover { color:var(--acc) }
.oferta-perfil { border-top:1px solid var(--line); padding-top:22px; font-size:.8rem; letter-spacing:.025em }
.oferta-mapa {
 position:relative; padding:clamp(24px,3vw,46px); border:1px solid var(--line); border-radius:18px;
 background:linear-gradient(140deg,rgb(29 42 59 / .94),var(--bg)); box-shadow:0 25px 75px rgb(0 0 0 / .15);
}
.oferta-mapa::before { content:''; height:2px; position:absolute; top:-1px; left:32px; right:32px; background:linear-gradient(90deg,transparent,var(--acc),transparent) }
.oferta-mapa-cab { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; color:var(--tx-mid) }
.oferta-mapa-cab span:last-child { color:var(--acc) }
.oferta-mapa h2 { font-size:clamp(1.4rem,2.1vw,2rem); max-width:21ch; margin:26px 0 }
.oferta-capas { display:grid; gap:12px; position:relative }
.oferta-capas::before { content:''; width:1px; background:var(--acc); opacity:.3; position:absolute; left:35px; top:0; bottom:0 }
.oferta-capa {
 position:relative; display:grid; grid-template-columns:36px minmax(0,1fr) auto; align-items:center; gap:16px;
 padding:18px; border:1px solid #314052; border-radius:10px; color:var(--tx); background:#1c2939; text-decoration:none;
 transition:border-color .2s, transform .2s;
}
.oferta-capa:nth-child(2) { margin-left:14px; background:#1a2635 }
.oferta-capa:nth-child(3) { margin-left:28px; background:#182331 }
.oferta-capa:nth-child(4) { margin-left:42px; background:#16212e }
.oferta-capa:hover { border-color:var(--acc); transform:translateX(-4px) }
.oferta-capa svg { width:27px; height:27px; fill:none; stroke:var(--acc); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round }
.oferta-capa b { display:block; font-size:.93rem; font-weight:500; line-height:1.4 }
.oferta-capa small { display:block; color:var(--tx-mid); font-size:.65rem; letter-spacing:.05em; margin-top:4px }
.oferta-capa-n { font-size:.67rem; color:var(--tx-mid); font-variant-numeric:tabular-nums }
.oferta-mapa-pie { display:flex; justify-content:space-between; margin-top:24px; font-size:.74rem; color:var(--tx-mid) }
.oferta-seccion-cab { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:38px }
.oferta-seccion-cab h2 { margin-top:14px; max-width:22ch }
.oferta-seccion-cab > p { max-width:42ch; font-size:1rem }
.oferta-catalogo { padding-top:70px; padding-bottom:80px; scroll-margin-top:calc(var(--isla) + 22px) }
.oferta-explorador { display:grid; grid-template-columns:245px minmax(0,1fr); gap:clamp(24px,4vw,70px); align-items:start }
.oferta-indice { position:sticky; top:calc(var(--isla) + 22px); display:flex; flex-direction:column; max-height:calc(100dvh - var(--isla) - 44px); overflow:auto; scrollbar-width:thin; padding:4px 6px }
.oferta-indice > .label { font-size:.67rem; margin:0 10px 14px; color:var(--tx-mid) }
.oferta-indice a { display:flex; align-items:center; gap:12px; color:var(--tx-mid); text-decoration:none; font-size:.79rem; line-height:1.35; min-height:44px; padding:10px; border-radius:6px; transition:background .15s,color .15s }
.oferta-indice a span:first-child { font-size:.65rem; opacity:.7; font-variant-numeric:tabular-nums }
.oferta-indice a span:last-child { margin-left:auto; color:var(--acc); opacity:0 }
.oferta-indice a:hover,.oferta-indice a[aria-current] { color:var(--tx); background:var(--bg-card) }
.oferta-indice a[aria-current] span:last-child { opacity:1 }
/* Todas las filas comparten el alto de la tarjeta con más contenido,
   también al abrir un detalle o cambiar de idioma. */
.oferta-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr; gap:18px; align-items:stretch }
.oferta-card {
 display:flex; flex-direction:column;
 min-width:0; padding:clamp(24px,2.1vw,38px); background:linear-gradient(145deg,var(--bg-alt),#141d28);
 border:1px solid var(--line); border-radius:12px; scroll-margin-top:calc(var(--isla) + 22px);
 transition:border-color .2s;
}
.oferta-card:hover { border-color:#445771 }
.oferta-card:target { border-color:var(--acc) }
.oferta-card-et { display:flex; justify-content:space-between; align-items:center; gap:12px; color:var(--acc); font-size:.75rem; margin-bottom:24px }
.oferta-card-et span:last-child { color:var(--tx-mid); font-size:.7rem; font-variant-numeric:tabular-nums }
.oferta-card h3 { max-width:26ch; min-height:2.5em; margin-bottom:16px }
.oferta-card > p { font-size:.92rem; min-height:5.1em }
.oferta-tecnologias { list-style:none; display:flex; flex-wrap:wrap; gap:6px; margin:22px 0; min-height:50px; align-content:start }
.oferta-tecnologias li { font-size:.67rem; padding:4px 8px; border:1px solid var(--line); border-radius:4px; color:#b9c6d7; line-height:1.45 }
.oferta-card details { margin-top:auto; border-top:1px solid var(--line) }
.oferta-card summary { cursor:pointer; list-style:none; min-height:50px; padding-top:16px; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:.78rem; color:var(--tx-mid) }
.oferta-card summary::-webkit-details-marker { display:none }
.oferta-card summary span { color:var(--acc); font-size:23px; transition:transform .2s }
.oferta-card details[open] summary span { transform:rotate(45deg) }
.oferta-card summary:hover,.oferta-card details[open] summary { color:var(--tx) }
.oferta-alcance { list-style:none; padding-top:15px; display:grid; gap:13px }
.oferta-alcance li { position:relative; padding-left:16px; font-size:.88rem; line-height:1.6; color:var(--tx-mid) }
.oferta-alcance li::before { content:''; position:absolute; top:.7em; left:0; width:4px; height:4px; border-radius:50%; background:var(--acc) }
.oferta-card details .oferta-enlace { margin-top:15px; font-size:.8rem; color:var(--acc) }
.oferta-stack { background:var(--bg-alt); border-block:1px solid var(--line); padding:64px 0 }
.oferta-stack-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px }
.oferta-stack-grid > div { border-top:1px solid #394757; padding-top:24px; position:relative }
.oferta-stack-n { font-size:.7rem; color:var(--acc) }
.oferta-stack-grid h3 { font-size:1.14rem; margin:14px 0 20px }
.oferta-stack-grid ul { display:flex; flex-wrap:wrap; list-style:none; gap:10px 20px; color:var(--tx-mid); font-size:.88rem; max-width:40ch }
.oferta-proceso { padding-top:75px; padding-bottom:75px }
.oferta-pasos { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:30px; list-style:none; counter-reset:none }
.oferta-pasos li { border-top:1px solid var(--line); padding-top:20px }
.oferta-pasos li > span { display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center; border:1px solid #385375; border-radius:50%; color:var(--acc); font-size:.72rem }
.oferta-pasos h3 { font-size:1.15rem; margin:20px 0 12px }
.oferta-pasos p { font-size:.9rem; max-width:33ch }
.oferta-colaborar { padding-top:65px; padding-bottom:65px; border-top:1px solid var(--line); scroll-margin-top:calc(var(--isla) + 22px) }
.oferta-contactos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px }
.oferta-contacto { padding:clamp(24px,3vw,48px); background:var(--bg-alt); border:1px solid var(--line); border-radius:14px; display:flex; align-items:flex-start; flex-direction:column }
.oferta-contacto-proyecto { background:radial-gradient(ellipse at right top,rgb(77 163 255 / .13),transparent 75%),var(--bg-alt); border-color:#355476 }
.oferta-contacto .label { color:var(--acc) }
.oferta-contacto h3 { margin:22px 0 18px; font-size:clamp(1.5rem,2.4vw,2.4rem); max-width:24ch }
.oferta-contacto p { margin-bottom:28px; max-width:54ch; font-size:1rem }
.oferta-contacto .btn { margin-top:auto }
.oferta-contacto > .oferta-enlace { margin-top:12px; font-size:.8rem }
.oferta-correo { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; max-width:none; margin-top:35px; font-size:.85rem }
.oferta-correo a { color:var(--tx); text-decoration:none; overflow-wrap:anywhere; display:flex; gap:12px; align-items:center; min-height:44px }
.oferta-correo a:hover { color:var(--acc) }
@media (min-width:1700px) {
 .oferta-hero { padding-top:calc(var(--isla) + 95px); padding-bottom:85px }
 .oferta-cards { gap:24px }
 .oferta-explorador { grid-template-columns:280px minmax(0,1fr) }
 .oferta-card > p { max-width:49ch; min-height:3.4em }
 .oferta-card h3 { min-height:0 }
 .oferta-tecnologias { min-height:26px }
}
@media (max-width:1100px) {
 .oferta-hero-grid { gap:30px }
 .oferta-explorador { grid-template-columns:205px minmax(0,1fr); gap:24px }
 .oferta-card { padding:22px }
 .oferta-cards { gap:12px }
 .oferta-card h3 { font-size:1.35rem }
 .oferta-card > p { min-height:0 }
 .oferta-capa { gap:10px; padding:14px; grid-template-columns:26px minmax(0,1fr) }
 .oferta-capa-n { display:none }
 .oferta-capa:nth-child(n) { margin-left:0 }
}
@media (max-width:900px) {
 .oferta-hero-grid { grid-template-columns:1fr 1fr }
 .oferta h1 { font-size:clamp(2.7rem,5.5vw,4rem) }
 .oferta-mapa { padding:22px }
 .oferta-explorador { grid-template-columns:minmax(0,1fr) }
 .oferta-indice { position:static; flex-direction:row; flex-wrap:wrap; overflow:visible; max-height:none; gap:6px; padding:0 }
 .oferta-indice > .label,.oferta-indice a span { display:none }
 .oferta-indice a { border:1px solid var(--line); padding:9px 12px; font-size:.76rem }
 .oferta-seccion-cab { flex-direction:column; align-items:flex-start; gap:18px }
 .oferta-seccion-cab > p { max-width:60ch }
 .oferta-pasos { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media (max-width:600px) {
 .oferta-hero { padding-top:calc(var(--isla) + 36px); padding-bottom:38px }
 .oferta-hero-grid { grid-template-columns:minmax(0,1fr); gap:32px }
 .oferta h1 { font-size:clamp(2.5rem,10vw,3.7rem); max-width:16ch; margin:22px 0 }
 .oferta-intro { font-size:1rem }
 .oferta-acciones { align-items:flex-start; flex-direction:column; gap:8px; margin:24px 0 }
 .oferta-perfil { font-size:.72rem }
 .oferta-mapa { padding:22px }
 .oferta-mapa h2 { max-width:23ch; font-size:1.5rem; margin:20px 0 }
 .oferta-capa { padding:14px; grid-template-columns:26px minmax(0,1fr) auto }
 .oferta-capa-n { display:block }
 .oferta-capa b { font-size:.86rem }
 .oferta-capas { gap:10px }
 .oferta-capa:nth-child(2) { margin-left:6px }
 .oferta-capa:nth-child(3) { margin-left:12px }
 .oferta-capa:nth-child(4) { margin-left:18px }
 .oferta-catalogo,.oferta-proceso,.oferta-colaborar { padding-top:42px; padding-bottom:42px }
 .oferta-seccion-cab { margin-bottom:26px }
 .oferta h2 { font-size:1.8rem }
 .oferta-cards,.oferta-stack-grid,.oferta-contactos { grid-template-columns:minmax(0,1fr) }
 .oferta-card { padding:24px }
 .oferta-card h3 { min-height:0; max-width:26ch; font-size:1.55rem }
 .oferta-card > p { min-height:0; font-size:.94rem }
 .oferta-card-et { margin-bottom:20px }
 .oferta-tecnologias { min-height:0; margin:20px 0 }
 .oferta-card summary { font-size:.81rem }
 .oferta-stack { padding:42px 0 }
 .oferta-stack-grid { gap:28px }
 .oferta-pasos { gap:24px 20px }
 .oferta-pasos p { font-size:.86rem }
 .oferta-contacto p { font-size:.95rem }
 .oferta-contacto .btn { font-size:.88rem; gap:12px; width:100% }
 .oferta-correo { font-size:.78rem }
}
@media (prefers-reduced-motion:reduce) {
 .oferta :is(a,summary span) { transition:none }
 .oferta-capa:hover { transform:none }
}
