/* ks-diseno: sistema 2026 (generado por scripts/diseno-build.py desde el boceto home-apple) */
:root{--navy:#001D57;--navy2:#0a2a73;--celeste:#CBF2FE;--celeste2:#E6F3FA;--naranja:#EE5A24;--naranja2:#FFE3D2;--lima:#D3D717;--lima2:#F5FFCA;--text:#666B68;--border:#DFE4E1;--radius:12px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:"Rethink Sans",Poppins,system-ui,sans-serif;font-size:17px;line-height:1.55;color:var(--text);background:#fff;overflow-x:hidden}
h1,h2,h3,.btn,.eyebrow,.stat b{font-family:Poppins,system-ui,sans-serif}
h1,h2,h3{margin:0;line-height:1.1;font-weight:700;color:var(--navy)}
a{color:var(--navy)}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:11px 22px;border-radius:var(--radius);font-weight:600;font-size:16px;line-height:1.2;text-decoration:none;border:2px solid var(--navy);background:var(--navy);color:#fff;cursor:pointer;text-align:center}
.btn.light{background:#fff;border-color:#fff;color:var(--navy)}
.btn.cel{background:#fff;border-color:#fff;color:var(--navy)}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}
.btn.ghost:hover{background:rgba(255,255,255,.12)}
@media(max-width:899px){}
.conf{background:#FFE98A;color:#5b4300;padding:0 4px;border-radius:3px}
.d-only{display:none}.cta.d-only{display:none}

/* header fijo */
.hd{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:24px;height:64px;padding:0 18px;background:#fff;border-bottom:1px solid var(--border)}
.hd .logo{flex:none}.hd .logo img{height:40px;display:block;filter:invert(1) brightness(.2) sepia(1) hue-rotate(190deg) saturate(6)}
.hd nav{display:none;flex:1;justify-content:center;gap:28px;font-family:Poppins,sans-serif;font-size:15px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
.hd nav a{color:rgba(0,29,87,.82);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}.hd nav a:hover{color:var(--navy);border-bottom-color:var(--navy)}.sel{position:relative;display:flex;border:1.5px solid var(--navy);border-radius:999px;padding:3px;background:#fff;font:600 13px/1 Poppins,sans-serif;white-space:nowrap;flex:none}
.sel .thumb{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:999px;background:var(--navy);transition:transform .32s cubic-bezier(.4,0,.2,1)}
.sel.doc .thumb{transform:translateX(100%)}
.sel a{position:relative;z-index:1;flex:1 1 0;text-align:center;padding:9px 14px;color:var(--navy);text-decoration:none;transition:color .25s}.sel:not(.doc) #sel-pac,.sel.doc #sel-doc{color:#fff}
.intra{display:none;margin-left:10px;border:1.5px solid var(--navy);background:#fff;color:var(--navy);font:600 13px/1 Poppins,sans-serif;padding:10px 14px;border-radius:999px;text-decoration:none;transition:background .2s,color .2s}
.intra:hover{background:var(--navy);color:#fff}
@media(max-width:899px){.hd{padding:0 14px;gap:8px;justify-content:space-between}.hd .logo img{height:32px}.sel{font-size:12px}.sel a{padding:9px 11px}}
@media(min-width:900px){.hd{height:80px;padding:0 36px;gap:32px}.hd>div{flex:none}.hd nav{display:flex}.hd .logo img{height:48px}.sel{font-size:14px}.sel a{padding:11px 18px}.intra{display:inline-block;font-size:14px;padding:12px 16px}.d-only{display:inline}.cta.d-only{display:flex}}

/* ===== escena de producto sobre azul marino ===== */
.stage{position:relative;height:calc(8 * 85vh);background:var(--navy);color:#fff}
.stage-in{position:sticky;top:64px;height:calc(100vh - 64px);height:calc(100svh - 64px);overflow:hidden;background:var(--navy)}
@media(min-width:900px){.stage-in{top:80px;height:calc(100vh - 80px)}}
.pic{position:absolute;inset:0;background:var(--navy);perspective:1200px}
.pic>img,.pic>picture>img,.pic>.giro{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--fx,50%) var(--fy,30%);opacity:0;will-change:opacity,transform}
.giro img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:inherit;opacity:0}
.giro img:first-child{opacity:1}
/* el negro de las fotos de estudio pasa a azul marino: "lighten" sube cada píxel al menos al navy, sin apagar los brillos del alineador */
.pic::before{content:"";position:absolute;inset:0;background:var(--navy);mix-blend-mode:lighten;pointer-events:none;z-index:1}
.pic::after{content:"";position:absolute;inset:0;z-index:50;background:linear-gradient(180deg,rgba(0,29,87,.5) 0%,rgba(0,29,87,0) 28%,rgba(0,29,87,0) 45%,rgba(0,29,87,.55) 68%,rgba(0,29,87,.96) 100%);pointer-events:none}
.pic img.foto{z-index:1}
.pic>picture{position:absolute;inset:0}
.pic img.kvfoto{filter:saturate(.9)}
.pic img.mapa{object-fit:contain;background:#001D57}
@media(max-width:899px){.pic img.mapa{object-fit:cover;object-position:68% 35%}}/* las fotos generales (laboratorio, kit) quedan por encima de la capa azul */
.pic img.foto.on{z-index:1}
.chap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:0 24px 36px;opacity:0;text-align:center;pointer-events:none;will-change:opacity,transform}
.chap.on{pointer-events:auto}
.eyebrow{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75);margin:0 0 10px}
.chap h1,.chap h2{color:#fff;font-size:34px;letter-spacing:-.01em;max-width:15ch}
.chap h1{font-size:32px}
@media(max-width:899px){.chap h1,.chap h2{font-size:30px;max-width:14ch}.chap p{font-size:15px;line-height:1.45}.chap{padding:0 20px 28px}.scroll-hint{display:none}.pic::after{background:linear-gradient(180deg,rgba(0,29,87,.45) 0%,rgba(0,29,87,0) 22%,rgba(0,29,87,0) 38%,rgba(0,29,87,.72) 58%,rgba(0,29,87,.97) 100%)}}
.chap p{margin:12px 0 0;max-width:46ch;color:rgba(255,255,255,.85);font-size:16px}
.cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.link{display:inline-block;margin-top:14px;font:600 15px Poppins,sans-serif;color:#fff;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;opacity:.92}.link:hover{opacity:1}.link:hover{text-decoration:underline}
.hl{background:#fff;color:var(--navy);padding:.04em .22em;box-decoration-break:clone;-webkit-box-decoration-break:clone;line-height:1.25}
.hl.inv{background:var(--navy);color:#fff}
.chap p .hl{font-weight:700}
.btn.big{min-height:56px;padding:14px 28px;font-size:17px;font-weight:700}
.chap h2 sup{font-size:.35em;vertical-align:top;top:.35em;position:relative;font-weight:600}
.stats{display:flex;gap:26px;margin-top:16px;flex-wrap:wrap}
.stat b{display:block;font-size:34px;line-height:1;color:#fff}.stat span{font-size:13px;color:rgba(255,255,255,.75)}
.kv{display:inline-block;margin-top:14px;border-radius:12px;overflow:hidden;border:2px solid rgba(255,255,255,.85);box-shadow:0 12px 30px rgba(0,0,0,.45);max-width:300px}
.kv img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;object-position:62% 35%}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.chips span{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);color:#fff;font:600 12px/1 Poppins,sans-serif;padding:8px 12px;border-radius:999px}
.dots{position:absolute;right:14px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px;z-index:3}
.dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35);transition:all .3s}.dots i.on{background:#fff;height:22px;border-radius:3px}
.scroll-hint{position:absolute;left:50%;bottom:10px;z-index:3;transform:translateX(-50%);font:600 11px/1 Poppins,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);transition:opacity .4s}
.scroll-hint.off{opacity:0}
@media(min-width:900px){
  .chap{left:0;right:auto;bottom:auto;top:50%;padding:0 0 0 7vw;max-width:46vw;text-align:left}
  .chap h1{font-size:68px}.chap h2{font-size:56px}.chap p{font-size:20px;max-width:44ch;margin-left:0}
  .cta,.stats{justify-content:flex-start}
  .stat b{font-size:48px}.stat span{font-size:14px}
  .pic::after{background:linear-gradient(90deg,rgba(0,29,87,.94) 0%,rgba(0,29,87,.86) 30%,rgba(0,29,87,.55) 52%,rgba(0,29,87,0) 74%)}
  .pic>img,.pic>picture>img,.pic>.giro{object-position:var(--dx,70%) var(--dy,50%)}
  .kv{max-width:360px}
  .dots{right:28px}
}
@media(max-width:899px){.m-hide{display:none!important}.chap{padding:0 20px 32px;max-width:560px;margin:0 auto}.chap h1,.chap h2{max-width:none;font-size:32px}.chap h1{font-size:34px}.chap p{margin:10px auto 0;font-size:16px;max-width:36ch}.cta{justify-content:center;gap:10px;margin-top:16px}.cta .btn{flex:1 1 240px;max-width:320px;min-height:50px;padding:12px 18px;font-size:16px}.stats{justify-content:center;gap:28px;margin-top:14px}.stat b{font-size:34px}.eyebrow{font-size:11px}}
@media(min-width:600px) and (max-width:899px){.chap h1{font-size:44px}.chap h2{font-size:40px}.chap p{font-size:18px}}
@media(prefers-reduced-motion:reduce){
  .stage{height:auto}.stage-in{position:static;height:auto;overflow:visible}
  .pic{position:relative;height:60vh}.pic img{opacity:0}.pic img:first-child{opacity:1;transform:none}
  .chap{position:static;opacity:1!important;transform:none!important;padding:32px 20px;pointer-events:auto;max-width:none}
  .dots,.scroll-hint{display:none}
}

/* ===== después de la escena ===== */
.sec{padding:64px 0}
.sec h2{font-size:32px;margin-bottom:8px}
.sub{margin:0 0 26px;max-width:60ch;font-size:18px}
.cards3{display:grid;gap:18px}
.pcard{border-radius:24px;overflow:hidden;display:grid;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease;box-shadow:0 2px 10px rgba(0,29,87,.06)}
.pcard:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,29,87,.16)}
.pcard img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 40%;display:block}
.pcard div{padding:20px 22px 24px}
.kids{background:var(--naranja2)}.teens{background:var(--lima2)}.adults{background:var(--celeste)}
.tag{display:inline-block;font:700 15px/1 Poppins,sans-serif;padding:9px 16px;border-radius:999px;margin-bottom:14px}
.kids .tag{background:var(--naranja);color:#fff}.teens .tag{background:var(--lima);color:var(--navy)}.adults .tag{background:var(--navy);color:#fff}
.pcard h3{font-size:26px;line-height:1.15;margin-bottom:8px}.pcard p{margin:0 0 12px;font-size:16px;color:#3b4350}
.more{font:600 15px Poppins,sans-serif;color:var(--navy)}
.buscar{background:var(--navy);color:#fff;padding:80px 0;background-image:radial-gradient(60% 80% at 85% 20%,rgba(203,242,254,.18),transparent 70%)}
.buscar h2{color:#fff;font-size:34px}.buscar .sub{color:rgba(255,255,255,.8)}
.sform{display:flex;gap:10px;flex-wrap:wrap;max-width:820px;background:#fff;padding:10px;border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.sform input{flex:1 1 220px;min-width:0;height:60px;padding:0 16px;border:0;border-radius:10px;font:17px "Rethink Sans",sans-serif;color:var(--navy);outline:none}
.sform button{flex:0 0 auto;height:60px;padding:0 34px;border:0;border-radius:12px;background:var(--navy);color:#fff;font:700 17px Poppins,sans-serif;cursor:pointer}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.chip{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);color:#fff;font:600 14px Poppins,sans-serif;padding:9px 14px;border-radius:999px;text-decoration:none}
.chip:hover{background:#fff;color:var(--navy)}
.ubi{margin-top:14px;font-size:15px;color:rgba(255,255,255,.75)}
.faq .grid{display:grid;gap:10px}
.faq details{border:1px solid var(--border);border-radius:14px;padding:0 20px;background:#fff}
.faq summary{font:600 17px Poppins,sans-serif;color:var(--navy);padding:16px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::after{content:"+";font-size:22px;line-height:1;color:var(--navy)}.faq details[open] summary::after{content:"–"}
.faq p{margin:0 0 16px}
.ft{background:#F6F7F7;border-top:1px solid var(--border);padding:40px 0 100px;font-size:15px}
.ft-in{display:grid;gap:24px}.ft a{text-decoration:none}.ft nav{display:grid;gap:8px}.ft p{margin:0 0 10px}
.copy{font-size:13px;margin-top:18px;color:#8A908D}
.region{margin-top:32px;padding-top:24px;border-top:1px solid var(--border)}
.region-t{font:700 15px Poppins,sans-serif;color:var(--navy);margin:0 0 12px}
.paises{display:flex;flex-wrap:wrap;gap:8px}
.pais{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1.5px solid var(--border);border-radius:999px;background:#fff;color:var(--navy);font:600 14px Poppins,sans-serif;text-decoration:none;transition:border-color .2s,box-shadow .2s}
.pais img{width:20px;height:15px;border-radius:2px;object-fit:cover}
a.pais:hover{border-color:var(--navy);box-shadow:0 4px 14px rgba(0,29,87,.12)}
.pais.on{background:var(--navy);border-color:var(--navy);color:#fff}
@media(min-width:900px) and (max-width:1279px){.hd nav{display:none}}

@media(min-width:900px){.sec{padding:88px 0}.sec h2{font-size:42px}.cards3{grid-template-columns:repeat(3,1fr);gap:24px}.buscar h2{font-size:46px}.faq .grid{grid-template-columns:1fr 1fr;align-items:start}.ft-in{grid-template-columns:1.4fr 1fr 1fr}.ft{padding-bottom:56px}}
/* ajustes para WordPress: logo SVG inline, agrupador derecho del header, contenido principal */
.hd .logo svg{height:32px;width:auto;display:block}
.hd-der{display:flex;align-items:center}
main#contenido{display:block}
@media(min-width:900px){.hd .logo svg{height:46px}}
