/* Atalaya Balear · «Para profesionales» (diseño v4, 25/10/2026). Solo se carga en esta página (src/lib/profesionales.mjs).
   Mismas piezas que el resto: banda verde, papel, fondo, piedra y verde suave sin repetir dos seguidas; hilos en vez de sombras;
   movimiento con la curva común (--ease) y todo quieto con «reducir movimiento». */

/* Primer pliegue: banda verde con el titular y el buscador de la ficha (y el vídeo a la derecha, si existe) */
.pf-hero{background:var(--banda);color:#FDFEFD;padding:56px 0 52px}
.pf-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:56px 72px;align-items:center}
/* Sin vídeo: las tres garantías como cifras grandes, separadas por hilos */
.pf-cifras{list-style:none;margin:0;padding:0;display:grid;border-top:2px solid rgba(253,254,253,.5)}
.pf-cifras li{display:grid;gap:2px;padding:16px 0 18px;border-bottom:1px solid rgba(253,254,253,.22)}
.pf-cifra{font-size:clamp(2.2rem,3.6vw,3rem);line-height:1;font-weight:800;letter-spacing:-.02em;color:#FDFEFD;font-variant-numeric:tabular-nums}
.pf-cifra-et{color:#CFE5DC;font-size:1rem}
.js .pf-cifras li{animation:subir .8s var(--ease) both;animation-delay:calc(var(--i) * 110ms + 500ms)}
.js .pf-sub{animation:subir .8s var(--ease) .4s both} .js .pf-buscar{animation:subir .8s var(--ease) .5s both} .js .pf-ya,.js .pf-hero .garantias{animation:subir .8s var(--ease) .6s both}
.pf-hero.con-video .pf-hero-in{grid-template-columns:minmax(0,1fr) minmax(0,.92fr)}
.pf-hero-txt{max-width:720px}
.pf-hero h1{font-size:clamp(2.1rem,3.6vw,3.05rem);line-height:1.07;font-weight:800;letter-spacing:-.025em;max-width:20ch;color:#FDFEFD}
.js .pf-hero h1 .w{display:inline-block;animation:subir .8s var(--ease) both;animation-delay:calc(var(--i) * 70ms + 80ms)}
.pf-sub{font-size:1.1875rem;line-height:1.5;color:#CFE5DC;max-width:56ch;margin:18px 0 28px}
.pf-buscar{background:var(--papel);color:var(--tinta);border-radius:var(--r-grande);padding:8px;max-width:680px;box-shadow:0 18px 40px -24px rgba(5,30,24,.55)}
.pf-buscar label{display:block;padding:8px 12px 0;font-size:.8125rem;font-weight:700;color:var(--tinta-2)}
.pf-buscar-fila{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.pf-buscar input{min-width:0;width:100%;min-height:52px;border:0;border-radius:6px;background:transparent;color:var(--tinta);font:600 1.125rem/1.3 var(--letra);padding:6px 12px 10px}
.pf-buscar input::placeholder{color:var(--tinta-3);font-weight:400}
.pf-buscar input:focus{outline:none} .pf-buscar input:focus-visible{outline:3px solid var(--foco);outline-offset:0}
.pf-buscar .boton{min-height:56px;padding:0 24px;font-size:1.0625rem}
.pf-sug{list-style:none;margin:8px 4px 4px;padding:8px 0 0;border-top:1px solid var(--hilo);display:grid;gap:2px}
.pf-sug li{animation:subir .28s var(--ease) both}
.pf-sug a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;padding:8px 12px;border-radius:6px;color:var(--tinta);text-decoration:none}
.pf-sug a:hover,.pf-sug a:focus-visible{background:var(--marca-suave)}
.pf-sug-txt{display:flex;flex-direction:column;gap:1px;min-width:0} .pf-sug-txt b{font-weight:800} .pf-sug-txt span{font-size:.875rem;color:var(--tinta-2)}
.pf-sug-acc{flex:none;font-size:.875rem;font-weight:700;color:var(--marca);transition:transform .2s var(--ease)}
.pf-sug-acc::after{content:" →"} .pf-sug a:hover .pf-sug-acc{transform:translateX(3px)}
.pf-sug-vacio{padding:8px 12px;color:var(--tinta-2);font-size:.9375rem} .pf-sug-vacio a{font-weight:700;display:inline}
.pf-sug-mas a{justify-content:flex-start;font-size:.9375rem;font-weight:700;color:var(--marca);min-height:44px}
.pf-ya{margin:16px 0 0;color:#CFE5DC;font-size:.9375rem} .pf-ya a{color:#FDFEFD;font-weight:700}
.pf-hero .garantias{margin-top:32px}

/* Vídeo de motion graphics (16:9). Sin los ficheros de src/assets/video/ no existe este bloque */
.pf-video{position:relative;margin:0;container-type:inline-size}
.pf-video video{cursor:pointer;display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-grande);background:#0A4A3B}
.js .pf-video video{animation:descubrir .9s var(--ease) .25s both}
.pf-video figcaption{margin-top:10px;font-size:.8125rem;line-height:1.45;color:#CFE5DC} .pf-video figcaption b{color:#FDFEFD;font-weight:700}
.pf-video-boton{position:absolute;top:calc(56.25cqw - 56px);right:12px;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:rgba(20,32,28,.72);color:#FDFEFD;cursor:pointer;transition:background-color .15s,transform .1s}
.pf-video-boton:hover{background:rgba(20,32,28,.9)} .pf-video-boton:active{transform:scale(.94)}
.pf-video-boton[data-estado=sigue] .pf-ico-sigue,.pf-video-boton[data-estado=parado] .pf-ico-pausa{display:none}

/* Cómo funciona: tres pasos en fila; la línea que los une se traza al verla */
.pf-pasos{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;position:relative}
.pf-pasos::before{content:"";position:absolute;left:20px;right:calc((100% - 64px) / 3 - 20px);top:19px;height:2px;background:var(--marca);transform-origin:left center}
.pf-pasos li{position:relative;grid-template-columns:1fr;gap:14px;align-content:start}
.pf-pasos li::before{position:relative;z-index:1;transition:background-color .4s var(--ease),color .4s var(--ease)}
.pf-pasos h3{margin-top:0}
.js .pf-pasos::before{transform:scaleX(0);transition:transform 1.1s var(--ease) .2s}
.js .pf-pasos.visto::before{transform:none}
.js .pf-pasos.visto li::before{background:var(--marca);color:var(--sobre-marca)}
.js .pf-pasos.visto li:nth-child(2)::before{transition-delay:.55s} .js .pf-pasos.visto li:nth-child(3)::before{transition-delay:1s}
html:not(.js) .pf-pasos li::before{background:var(--marca);color:var(--sobre-marca)}

/* Lo que ve el público: la ficha real a un lado y sus partes explicadas al otro */
.pf-publico{background:var(--papel)}
.pf-publico-in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:48px;align-items:start}
.pf-ejemplo{position:sticky;top:24px;background:var(--fondo)}
.pf-ejemplo .resultado:hover{transform:none}
.pf-partes{list-style:none;margin:0;padding:0;display:grid;gap:24px}
.pf-partes li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px}
.pf-parte-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--marca-suave);color:var(--marca)}
.pf-partes h3{font-size:1.125rem;font-weight:800;margin-top:9px} .pf-partes p{margin:4px 0 0;color:var(--tinta-2)}
.pf-partes .pf-fuente-ej{display:inline-flex;margin-top:10px;padding:8px 12px;border:1px dashed var(--tinta-3);border-radius:var(--r);background:var(--fondo);color:var(--tinta-2)}

/* Tres estados: gris (registro), verde (verificada) y verde suave (sello), con el sello que se estampa al verlo */
.pf-niveles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.4fr);gap:16px;align-items:stretch}
.pf-nivel{background:var(--papel);border:1px solid var(--hilo);border-top:3px solid var(--tinta-3);border-radius:var(--r-grande);padding:22px 24px}
.pf-nivel:nth-child(2){border-top-color:var(--marca)}
.pf-nivel-sello{background:var(--marca-suave);border-color:transparent;border-top-color:var(--marca)}
.pf-nivel-marca{margin:0 0 12px} .pf-nivel>p{margin:0;color:var(--tinta-2)} .pf-nivel>.pf-nivel-marca{margin-bottom:12px;color:inherit} .pf-nivel>.pf-nota{margin-top:16px}
.pf-criterios{grid-template-columns:repeat(2,minmax(0,1fr));margin:14px 0 0;font-size:.9375rem}
.js .pf-nivel-sello.visto .sello-pill .ico{animation:sello .55s var(--ease) .35s both}
.pf-nota{margin:14px 0 0;font-size:.9375rem;color:var(--tinta-2)}
.pf-regla{display:flex;justify-content:space-between;align-items:baseline;gap:12px 32px;flex-wrap:wrap;margin-top:28px;padding-top:18px;border-top:2px solid var(--tinta)}
.pf-regla p{margin:0;max-width:82ch;color:var(--tinta-2)} .pf-regla strong{color:var(--tinta)}
.pf-regla .pf-regla-enl{flex:none;font-weight:700}

/* Ayuda de pago de Teix: aparte, sobre piedra y sin botones de compra */
.pf-ayuda-in{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:56px;align-items:start}
.pf-paquetes{list-style:none;margin:0;padding:0;border-top:2px solid var(--tinta)}
.pf-paquetes li{display:grid;grid-template-columns:minmax(0,1fr) 13rem;gap:8px 24px;padding:16px 0;border-bottom:1px solid var(--piedra-hilo)}
.pf-paquetes h3{font-size:1.0625rem;font-weight:800} .pf-paquetes li p{margin:4px 0 0;font-size:.9375rem;color:var(--tinta-2)}
.pf-paquetes .pf-precio{margin:0;font-weight:700;color:var(--tinta);text-align:right}

/* Preguntas frecuentes: todas abiertas, en dos columnas alineadas con la rejilla */
.pf-faq{background:var(--papel)}
.pf-preguntas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;border-top:2px solid var(--tinta)}
.pf-pregunta{padding:20px 0 22px;border-bottom:1px solid var(--hilo)}
.pf-pregunta h3{font-size:1.125rem;font-weight:800} .pf-pregunta p{margin:6px 0 0;color:var(--tinta-2);max-width:62ch}

.pf-fin-acc{display:flex;flex-wrap:wrap;gap:12px;margin:0}

@media (max-width:980px){
  .pf-hero-in,.pf-hero.con-video .pf-hero-in,.pf-publico-in,.pf-ayuda-in{grid-template-columns:1fr}
  .pf-cifras{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px} .pf-cifras li{border-bottom:0}
  .pf-hero-in{gap:32px} .pf-ejemplo{position:static}
  .pf-niveles{grid-template-columns:1fr 1fr} .pf-nivel-sello{grid-column:1/-1}
  .pf-ayuda-in{gap:28px}
}
@media (max-width:760px){
  .pf-hero{padding:32px 0 32px} .pf-sub{font-size:1.0625rem;margin:14px 0 22px}
  .pf-buscar-fila{grid-template-columns:1fr;gap:4px} .pf-buscar input{min-height:46px;padding:4px 12px 6px} .pf-buscar .boton{min-height:52px}
  .pf-pasos{grid-template-columns:1fr;gap:22px}
  .pf-pasos::before{display:none}
  .pf-pasos li:not(:last-child)::after{content:"";position:absolute;left:19px;top:40px;bottom:-22px;width:2px;background:var(--marca);transform-origin:center top}
  .js .pf-pasos li::after{transform:scaleY(0);transition:transform .5s var(--ease)}
  .js .pf-pasos.visto li::after{transform:none} .js .pf-pasos.visto li:nth-child(2)::after{transition-delay:.45s}
  .pf-pasos li{grid-template-columns:40px 1fr;gap:16px} .pf-pasos h3{margin-top:8px}
  .pf-niveles{grid-template-columns:1fr} .pf-criterios{grid-template-columns:1fr}
  .pf-paquetes li{grid-template-columns:1fr} .pf-paquetes .pf-precio{text-align:left}
  .pf-preguntas{grid-template-columns:1fr}
  .pf-cifras{grid-template-columns:1fr} .pf-cifras li{grid-template-columns:6.2rem 1fr;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid rgba(253,254,253,.22)} .pf-cifra{font-size:1.75rem}
  .pf-fin-acc .boton{flex:1 1 auto}
}
@media (prefers-reduced-motion:reduce){
  .js .pf-hero h1 .w,.js .pf-video video,.js .pf-cifras li,.js .pf-sub,.js .pf-buscar,.js .pf-ya,.pf-sug li,.js .pf-nivel-sello.visto .sello-pill .ico{animation:none!important}
  .js .pf-pasos::before,.js .pf-pasos li::after{transform:none}
}

/* Vídeo dentro de «Cómo funciona» (25/10/2026): grande a la izquierda y los tres pasos en columna a la derecha; en el móvil, el vídeo encima */
.pf-como-in{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:40px 56px;align-items:center}
.pf-como-in .pf-video video{border:1px solid var(--hilo);background:#F4F7F5}
.pf-como-in .pf-video figcaption{color:var(--tinta-suave,#4A5A54)} .pf-como-in .pf-video figcaption b{color:var(--tinta)}
.pf-como-in .pf-pasos{grid-template-columns:1fr;gap:26px}
.pf-como-in .pf-pasos::before{display:none}
.pf-como-in .pf-pasos li{grid-template-columns:40px 1fr;gap:16px} .pf-como-in .pf-pasos h3{margin-top:8px}
.pf-como-in .pf-pasos li:not(:last-child)::after{content:"";position:absolute;left:19px;top:40px;bottom:-26px;width:2px;background:var(--marca);transform-origin:center top}
.js .pf-como-in .pf-pasos li::after{transform:scaleY(0);transition:transform .5s var(--ease)}
.js .pf-como-in .pf-pasos.visto li::after{transform:none} .js .pf-como-in .pf-pasos.visto li:nth-child(2)::after{transition-delay:.45s}
@media (max-width:980px){.pf-como-in{grid-template-columns:1fr;gap:32px}}
@media (prefers-reduced-motion:reduce){.js .pf-como-in .pf-pasos li::after{transform:none}}