/* Servicio Activo · páginas de contenido (secciones, guías, legales). Carga después de estilos.css. */

.pagina{background:var(--paper)}
.saltar{position:absolute;left:-999px;top:0;z-index:60;background:var(--signal);color:var(--ink);padding:.6rem 1rem;font-weight:600}
.saltar:focus{left:1rem;top:1rem}

.head--noche{background:var(--night);color:var(--on-night);box-shadow:0 1px 0 rgba(243,240,232,.12)}
.doc__banda{position:relative;overflow:hidden;background:var(--night);color:var(--on-night);padding-top:calc(var(--head-h) + env(safe-area-inset-top,0px));
  background-image:repeating-radial-gradient(circle at 78% 30%,rgba(184,162,126,.10) 0 1px,transparent 1px 34px)}
.doc__banda::after{content:"";position:absolute;inset:auto 0 0 0;height:6px;background:var(--signal)}
.doc__head{position:relative;display:grid;gap:1.1rem;padding-block:clamp(3.5rem,12vh,7.5rem) clamp(2.5rem,7vh,4.5rem)}
.doc__head h1{font-size:clamp(2.4rem,1.1rem + 4.6vw,5.4rem);text-transform:uppercase;max-width:22ch;line-height:.94}
@media (prefers-reduced-motion:no-preference){
  .doc__head > *{animation:subir .8s cubic-bezier(.2,.7,.2,1) both}
  .doc__head > :nth-child(2){animation-delay:.08s}.doc__head > :nth-child(3){animation-delay:.16s}.doc__head > :nth-child(4){animation-delay:.24s}
  @keyframes subir{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
}
.pagina--legal .doc__head h1,.pagina--pagina .doc__head h1{max-width:none}
.doc__etiqueta{color:var(--coyote)}
.doc__fecha{color:var(--on-night-2)}
.migas{font:400 .8rem/1.4 var(--mono);color:var(--on-night-2)}
.migas a{color:inherit;text-underline-offset:.25em}
.migas span[aria-current]{color:var(--on-night)}
.migas .sep{margin:0 .45em;opacity:.6}

.doc__cuerpo{display:grid;gap:3.5rem;padding-block:2.5rem clamp(4rem,10vh,6rem)}
.prosa{max-width:none;font-size:clamp(1.0625rem,1rem + .2vw,1.1875rem);line-height:1.65}
.prosa > * + *{margin-top:1.1em}
.prosa h2{font-size:clamp(1.7rem,1.2rem + 1.6vw,2.4rem);text-transform:uppercase;margin-top:2.2em;line-height:1}
.prosa h3{font:700 1.25rem/1.25 var(--text);font-stretch:90%;margin-top:1.8em}
.prosa a{color:var(--signal-ink);text-underline-offset:.18em}
.prosa ul,.prosa ol{padding-left:1.3em}
.prosa li + li{margin-top:.45em}
.prosa li::marker{color:var(--signal-ink)}
.prosa strong{font-weight:700}
.prosa code{font:400 .88em/1 var(--mono);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-s);padding:.1em .35em}
.prosa table{width:100%;border-collapse:collapse;font-size:.92rem;display:block;overflow-x:auto}
.prosa th,.prosa td{text-align:left;vertical-align:top;padding:.6rem .7rem;border-bottom:1px solid var(--line)}
.prosa th{font:500 .72rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);background:var(--surface)}
.prosa blockquote{margin:0;border-left:3px solid var(--signal);padding:.2rem 0 .2rem 1rem;color:var(--ink-2)}

/* Próximas piezas de una sección */
.proximas{display:grid;gap:1.2rem}
.proximas h2{font-size:clamp(1.7rem,1.2rem + 1.6vw,2.4rem);text-transform:uppercase}
.proximas > p{color:var(--ink-2);max-width:60ch}
.proximas ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:1rem}
.proximas li{background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--signal);border-radius:var(--r-m);padding:1.25rem 1.25rem 1.4rem;display:grid;gap:.8rem;align-content:start;min-height:170px;transition:border-color .2s,transform .2s}
.proximas li:hover{border-color:var(--ink);transform:translateY(-3px)}
.proximas li h3{font:800 1.55rem/1.02 var(--display);font-stretch:72%;text-transform:uppercase}
.proximas li p{margin:0;color:var(--ink-2);font-size:.95rem;line-height:1.5}

/* Material: el objeto recortado asoma por encima de la tarjeta */
.proximas--obj ol{row-gap:4.5rem;padding-top:3.5rem;counter-reset:obj}
.proximas--obj li{position:relative;align-content:end;min-height:260px;padding-top:7.5rem;counter-increment:obj;isolation:isolate;overflow:visible}
.proximas--obj li::before{content:"";position:absolute;inset:0 0 auto;height:9rem;z-index:-1;border-radius:var(--r-m) var(--r-m) 0 0;background:radial-gradient(60% 80% at 70% 0%,rgba(255,91,20,.16),transparent 70%)}
.proximas--obj li:not(.obj)::after{content:counter(obj,decimal-leading-zero);position:absolute;top:1.1rem;right:1.25rem;font:500 .8rem/1 var(--mono);color:var(--signal-ink)}
.obj__img{position:absolute;top:-3.4rem;right:.6rem;width:auto;height:10.5rem;max-width:72%;object-fit:contain;object-position:right bottom;transform:rotate(-5deg);transform-origin:70% 90%;filter:drop-shadow(0 18px 14px rgba(23,25,28,.38)) drop-shadow(0 3px 3px rgba(23,25,28,.25));transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.proximas--obj li:hover .obj__img{transform:translateY(-8px) rotate(-1deg) scale(1.05)}
@media (prefers-reduced-motion:reduce){.obj__img,.proximas--obj li:hover .obj__img{transition:none;transform:none}}

/* Menú en móvil (también en la portada) */
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;padding:0 .9rem;border:1.5px solid currentColor;border-radius:var(--r-s);font:500 .8rem/1 var(--mono);text-transform:uppercase;letter-spacing:.08em}
.menu summary::-webkit-details-marker{display:none}
.menu__panel{position:absolute;right:0;top:calc(100% + .5rem);min-width:15rem;background:var(--night);color:var(--on-night);border-radius:var(--r-m);padding:.5rem;display:grid;box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.menu__panel a{display:block;padding:.8rem .9rem;text-decoration:none;font:500 .85rem/1.2 var(--mono);text-transform:uppercase;letter-spacing:.06em;border-radius:var(--r-s)}
.menu__panel a:hover{background:var(--night-2)}
@media (max-width:860px){.menu{display:block}}

/* Formulario de contacto (mismo esquema que el de lapera.marketing, con la marca de Servicio Activo) */
.prosa .form{display:grid;gap:1.4rem;margin:2rem 0 1rem;padding:clamp(1.4rem,4vw,2.6rem);background:var(--surface);border:1px solid var(--line);border-top:5px solid var(--signal);border-radius:var(--r-m);box-shadow:0 20px 50px -30px rgba(23,25,28,.35);max-width:44rem}
.prosa .form > *{margin:0}
.prosa .form__fila{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem}
@media (max-width:640px){.prosa .form__fila{grid-template-columns:1fr}}
.prosa .campo{display:grid;gap:.55rem}
.prosa .campo label{font:700 .98rem/1.2 var(--text);font-stretch:95%;color:var(--ink)}
.prosa .campo label small{font-weight:500;color:var(--ink-2)}
.prosa .campo input,.prosa .campo select,.prosa .campo textarea{display:block;width:100%;min-height:56px;padding:.9rem 1.05rem;font:400 1.02rem/1.4 var(--text);color:var(--ink);background:#fff;border:1.5px solid #CFC9BA;border-radius:var(--r-m);-webkit-appearance:none;appearance:none;transition:border-color .15s,box-shadow .15s}
.prosa .campo select{padding-right:2.6rem;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 1.3rem) 50%,calc(100% - .95rem) 50%;background-size:.35rem .35rem;background-repeat:no-repeat}
.prosa .campo textarea{min-height:10rem;resize:vertical}
.prosa .campo ::placeholder{color:#8B8F94;font-family:var(--text)}
.prosa .campo input:focus,.prosa .campo select:focus,.prosa .campo textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px rgba(255,91,20,.25)}
.prosa .check{display:flex;gap:.75rem;align-items:flex-start;font-size:.98rem;line-height:1.45;cursor:pointer}
.prosa .check input{width:1.25rem;height:1.25rem;margin:.12rem 0 0;accent-color:var(--signal-ink);flex-shrink:0}
.prosa .form__legal{font-size:.8rem;line-height:1.55;color:var(--ink-2);border-top:1px solid var(--line);padding-top:1rem}
.prosa .form__error{background:#FBE9E7;color:#8A1C0F;border-left:4px solid #B42318;padding:.8rem 1rem;border-radius:var(--r-s)}
.prosa .form .btn{justify-self:start;cursor:pointer;min-height:54px;padding:0 1.6rem;font-size:1.02rem;border:0}
@media (max-width:640px){.prosa .form .btn{justify-self:stretch;justify-content:center}}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* Preguntas frecuentes al final de cada página, en desplegables (mismo estilo que la portada) */
.faq--pagina{margin-top:clamp(3rem,8vh,5rem);border-top:1px solid var(--line)}
.faq__r{padding:0 0 1.2rem;color:var(--ink-2);max-width:none}
.faq__r > * + *{margin-top:.8em}
.faq__r a{color:var(--signal-ink)}

/* Cabecera de sección: objetos recortados flotando a la derecha */
.banda__obj{position:absolute;right:max(var(--gutter),calc((100vw - var(--max))/2 + var(--gutter)));top:calc(var(--head-h) + 1rem);bottom:1.5rem;width:min(38vw,500px);pointer-events:none}
.banda__img{position:absolute;width:auto;object-fit:contain;filter:drop-shadow(0 26px 22px rgba(0,0,0,.55)) drop-shadow(0 4px 6px rgba(0,0,0,.4))}
.banda__obj::before{content:"";position:absolute;inset:10% 5% 5% 10%;background:radial-gradient(closest-side,rgba(255,91,20,.28),transparent 75%);filter:blur(10px)}
.banda__img{height:auto;max-height:86%}
.banda__obj--1 .banda__img{width:78%;right:6%;bottom:6%;transform:rotate(-6deg)}
.banda__obj--2 .banda__img:nth-child(1){width:64%;left:0;bottom:14%;transform:rotate(-8deg)}
.banda__obj--2 .banda__img:nth-child(2){width:44%;right:0;bottom:2%;transform:rotate(7deg)}
.banda__obj--3 .banda__img:nth-child(1){width:60%;left:0;bottom:4%;transform:rotate(-9deg)}
.banda__obj--3 .banda__img:nth-child(2){width:40%;right:10%;top:0;transform:rotate(4deg)}
.banda__obj--3 .banda__img:nth-child(3){width:44%;right:0;bottom:0;transform:rotate(12deg)}
@media (prefers-reduced-motion:no-preference){.banda__img{animation:flotar 7s ease-in-out infinite alternate}.banda__img:nth-child(2){animation-delay:-2.5s}.banda__img:nth-child(3){animation-delay:-5s}}
@keyframes flotar{to{translate:0 -10px}}
.doc__banda:has(.banda__obj) .doc__head{z-index:1}
.doc__banda:has(.banda__obj) .doc__head h1{max-width:min(20ch,54vw);font-size:clamp(2.2rem,1rem + 4vw,4.6rem)}
@media (max-width:860px){
  .banda__obj{position:relative;right:auto;top:auto;bottom:auto;width:min(100% - 2*var(--gutter),420px);height:200px;margin:-1rem auto 1.5rem}
  .doc__banda:has(.banda__obj) .doc__head h1{max-width:22ch}
}

/* Cabecera cinematográfica: vídeo de la sección, oscurecido y con degradado para leer el título */
.banda__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;filter:contrast(1.05)}
.doc__banda:has(.banda__video)::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,25,28,.92) 0%,rgba(23,25,28,.7) 45%,rgba(23,25,28,.25) 100%),linear-gradient(0deg,rgba(23,25,28,.7),transparent 40%)}
.doc__banda:has(.banda__video) .doc__head,.doc__banda:has(.banda__video) .banda__obj{z-index:1}
.doc__banda:has(.banda__video){min-height:min(78vh,720px);display:flex;flex-direction:column;justify-content:flex-end}
.sin-video > .banda__video{animation:deriva 16s ease-in-out infinite alternate}
@media (max-width:860px){.doc__banda:has(.banda__video){min-height:0}.doc__banda:has(.banda__video)::before{background:linear-gradient(0deg,rgba(23,25,28,.92) 10%,rgba(23,25,28,.55))}}

/* Tarjetas que llevan a una guía publicada: toda la tarjeta es clicable */
.proximas li.con-enlace{position:relative;cursor:pointer}
.proxima__a{color:inherit;text-decoration:none}
.proxima__a::after{content:"";position:absolute;inset:0;z-index:1}
.proxima__ir{font:500 .78rem/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--signal-ink);border-top:1px solid var(--line);padding-top:.8rem}
.proximas li.con-enlace:hover{border-color:var(--ink)}
.proxima__a:focus-visible{outline:none}
.proximas li.con-enlace:has(.proxima__a:focus-visible){outline:3px solid var(--signal);outline-offset:3px}
/* Tablas de comparativa */
.prosa table{display:table;font-size:.95rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m)}
.prosa td:first-child{white-space:nowrap}
@media (max-width:860px){.prosa table{display:block;overflow-x:auto}.prosa td,.prosa th{min-width:9rem}}