/* Nexium site integration; shared charcoal and gold identity. */
:root{--text-muted:#aaa49a;--gold-deep:#c9a961}
html{scroll-padding-top:110px}
body{font-weight:400}
button,a,summary{-webkit-tap-highlight-color:transparent}
button{font-family:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--gold-bright);outline-offset:5px}
[hidden]{display:none!important}
.skip-link{position:fixed;top:10px;left:20px;transform:translateY(-160%);z-index:400;padding:12px 20px;background:var(--gold);color:#0a0a0a}
.skip-link:focus{transform:none}
.site-header{position:sticky;top:0;z-index:100;background:rgba(10,10,10,.96);border-bottom:1px solid var(--line-strong);backdrop-filter:blur(20px)}
.site-nav{position:static;max-width:1400px;margin:auto;min-height:88px;padding:12px 40px;border:0;background:none;gap:28px;backdrop-filter:none}
.site-brand{display:flex;align-items:center;gap:14px;flex-shrink:0}
.brand-mark{width:64px;height:64px;object-fit:contain}
.brand-name{width:auto;height:14px;object-fit:contain}
.site-menu{display:flex;align-items:center;gap:24px}
.site-menu a,.solutions summary{color:var(--text-secondary);font-size:.68rem;letter-spacing:.12em;text-decoration:none;text-transform:uppercase;cursor:pointer}
.site-menu a:hover,.solutions summary:hover,.site-menu [aria-current]{color:var(--gold-bright)}
.site-menu .nav-cta{color:var(--gold);padding:10px 16px;white-space:nowrap}
.site-menu .nav-cta:hover{color:var(--bg-deep)}
.solutions{position:relative}
.solutions-menu{position:absolute;top:calc(100% + 20px);left:-20px;width:265px;padding:12px;background:#111;border:1px solid var(--line-strong);box-shadow:0 16px 40px #0008}
.solutions-menu a{display:block;padding:12px}
.menu-toggle{display:none;background:transparent;border:1px solid var(--line-strong);color:var(--gold);min-height:44px;padding:8px 14px;cursor:pointer}
header.hero{padding:76px 0 62px;background:linear-gradient(90deg,rgba(10,10,10,.87),rgba(10,10,10,.48),rgba(10,10,10,.87)),url('/assets/diagnostico-pld/fondo-3.webp') center 64%/cover;border-bottom:1px solid var(--line-soft)}
.hero .wrap{position:relative}
.hero h1{font-size:clamp(2rem,4.1vw,3.3rem);font-weight:500;letter-spacing:-.035em;line-height:1.16}
.hero p.lede{color:#ded8cd;max-width:650px}
.hero .meta{color:#c5beb0;line-height:1.9}
#flow{padding:44px 0 64px;scroll-margin-top:16px}
.selector-title{text-align:center;font-size:1.5rem;font-weight:500;margin-bottom:10px}
.selector-intro{text-align:center;font-size:.9rem;color:var(--text-secondary);margin-bottom:28px}
.fam{border-radius:6px;overflow:hidden;margin-bottom:16px}
.fam-h{width:100%;border:0;color:var(--text-primary);font:inherit;flex-direction:row;justify-content:flex-start;text-align:left;gap:22px;padding:24px 58px 24px 28px;background:linear-gradient(90deg,rgba(10,10,10,.92),rgba(10,10,10,.76)),url('/assets/diagnostico-pld/fondo-1.webp') center 60%/cover}
.fam:nth-child(even) .fam-h{background-image:linear-gradient(90deg,rgba(10,10,10,.92),rgba(10,10,10,.76)),url('/assets/diagnostico-pld/fondo-2.webp')}
.fam-h:hover{background-color:#25211a}
/* Iconos lineales con borde dorado de 2 px y fondo transparente. */
.fam-h img{width:56px;height:56px;flex:0 0 56px;box-sizing:border-box;object-fit:contain;opacity:1;border:2px solid var(--gold);border-radius:0;background:transparent;box-shadow:none}
.fam-h .tt{flex:1;font-size:1.15rem;font-weight:500;line-height:1.4}
.fam-h .cnt{flex-shrink:0;font-size:.65rem;color:var(--gold)}
.fam-body,.fam.open .fam-body{max-height:none;overflow:visible}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:22px}
.actcard{width:100%;border-radius:4px;padding:24px;text-align:left;align-items:flex-start}
.activity-title{display:block;font-size:1.05rem;margin-bottom:8px;font-weight:500}
.activity-description{font-size:.85rem;color:var(--text-secondary);line-height:1.6}
.actcard .frac{font-size:.65rem}
.quiz-mode .hero{display:none}
.quiz-mode .selector-title,.quiz-mode .selector-intro{display:none}
.quizhead{flex-wrap:wrap}
.qcard{border-radius:6px}
.qtext{font-weight:500}
.qhint{color:var(--text-secondary)}
.opt{font:inherit;line-height:1.6;width:100%;border-radius:3px;min-height:48px}
.opt .box{margin-top:5px}
.progress,.progress .bar{height:3px}
.btn{min-height:48px}
dialog#result{display:none;width:100%;max-width:none;height:100%;max-height:none;margin:0;border:0;color:var(--text-primary);padding:0;background:linear-gradient(#0a0a0aeb,#0a0a0af7),url('/assets/diagnostico-pld/fondo-4.webp') center/cover}
dialog#result[open]{display:block}
dialog::backdrop{background:#0a0a0a}
.closeX{background:#111;color:var(--gold);width:44px;height:44px}
.result-inner{padding-top:80px}
.verdict,.cta,.fineprint .card{border-radius:6px}
.verdict p.vbody,.blk li,.note,.fineprint p{text-align:left}
.fineprint h3{font-weight:500}
.fineprint .eyebrow{display:block;margin-bottom:18px}
.footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 24px;margin-top:16px}
.footer-links a,.note a{color:var(--gold);text-underline-offset:4px}
/* Bordes trazados de las tarjetas de Servicios del sitio. */
:is(.actcard,.fam-h,.qcard){position:relative;overflow:hidden;transition:background-color .4s cubic-bezier(.16,1,.3,1),border-color .4s,box-shadow .4s,transform .4s cubic-bezier(.16,1,.3,1)}
:is(.actcard,.fam-h,.qcard)::before,
:is(.actcard,.fam-h,.qcard)::after{content:"";position:absolute;width:0;height:0;box-sizing:border-box;border:1px solid transparent;z-index:10;pointer-events:none}
:is(.actcard,.fam-h,.qcard)::before{top:0;left:0;transition:height .15s ease-out,width .15s ease-out .15s,border-color 0s ease-out .3s}
:is(.actcard,.fam-h,.qcard)::after{bottom:0;right:0;transition:height .15s ease-out,width .15s ease-out .15s,border-color 0s ease-out .3s}
.activity-title,.fam-h .tt{transition:color .3s ease}
.fam-h img{transition:transform .5s cubic-bezier(.16,1,.3,1)}
/* Destello y halo dorado de los bloques Diferencia y Portal del inicio. */
:is(.fineprint .card,.verdict,.blk,.note,.cta){position:relative;isolation:isolate;overflow:hidden;transition:background-color .4s cubic-bezier(.16,1,.3,1),border-color .4s,box-shadow .4s,transform .4s cubic-bezier(.16,1,.3,1)}
:is(.fineprint .card,.verdict,.blk,.note,.cta)::before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(201,169,97,.2),transparent);transform:skewX(-20deg);transition:left .6s ease;z-index:-1;pointer-events:none}
/* El foco de teclado recibe el mismo borde que el puntero. */
:is(.actcard,.fam-h):focus-visible::before,.qcard:focus-within::before{width:100%;height:100%;border-top-color:var(--gold);border-right-color:var(--gold);transition:width .15s ease-out,height .15s ease-out .15s}
:is(.actcard,.fam-h):focus-visible::after,.qcard:focus-within::after{width:100%;height:100%;border-bottom-color:var(--gold);border-left-color:var(--gold);transition:border-color 0s ease-out .3s,width .15s ease-out .3s,height .15s ease-out .45s}
@media(hover:hover) and (pointer:fine){
 :is(.actcard,.fam-h,.qcard):hover::before{width:100%;height:100%;border-top-color:var(--gold);border-right-color:var(--gold);transition:width .15s ease-out,height .15s ease-out .15s}
 :is(.actcard,.fam-h,.qcard):hover::after{width:100%;height:100%;border-bottom-color:var(--gold);border-left-color:var(--gold);transition:border-color 0s ease-out .3s,width .15s ease-out .3s,height .15s ease-out .45s}
 .actcard:hover{background:#000;transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.5)}
 .actcard:hover .activity-title,.fam-h:hover .tt{color:var(--gold-bright)}
 .fam-h:hover img{transform:scale(1.05)}
 :is(.fineprint .card,.verdict,.blk,.note,.cta):hover{background-color:rgba(201,169,97,.05);border-color:rgba(201,169,97,.4);box-shadow:0 0 30px rgba(201,169,97,.15),inset 0 0 10px rgba(201,169,97,.05)}
 :is(.fineprint .card,.cta):hover{transform:scale(1.025)}
 :is(.fineprint .card,.verdict,.blk,.note,.cta):hover::before{left:150%}
}
@media(max-width:1100px){
 .site-nav{padding:12px 24px;min-height:80px;flex-wrap:wrap;gap:0}
 .brand-mark{width:52px;height:52px}.brand-name{height:12px}
 .menu-toggle{display:block}.site-menu{display:none;width:100%;padding:20px 0 10px;max-height:calc(100dvh - 85px);overflow:auto;align-items:stretch;gap:8px}
 .site-menu.is-open{display:flex;flex-direction:column}
 .site-menu>a,.solutions summary{padding:12px 8px;display:block;font-size:.76rem}
 .solutions-menu{position:static;width:100%;margin-top:10px;box-shadow:none}
 .site-menu .nav-cta{text-align:center;padding:12px}
}
@media(max-width:680px){
 .wrap{padding:0 20px}.site-nav{padding:10px 20px}.site-brand{gap:9px}.brand-mark{width:44px;height:44px}.brand-name{height:11px}
 header.hero{padding:48px 0 40px}.hero .eyebrow{font-size:.61rem;letter-spacing:.18em}.hero p.lede{font-size:.94rem}.hero .meta{font-size:.64rem;letter-spacing:.1em}
 .hero h1 br{display:none}#flow{padding:30px 0 40px}
 .fam-h{gap:14px;padding:20px 38px 20px 16px;flex-wrap:wrap}.fam-h img{width:48px;height:48px;flex-basis:48px}.fam-h .tt{font-size:1rem;min-width:130px}.fam-h .cnt{width:100%;padding-left:62px;margin-top:-8px}.fam-h .chev{right:15px}
 .grid{grid-template-columns:1fr;padding:14px}.actcard{padding:20px}
 .qcard{padding:24px 18px}.quizhead .actname{width:100%}.navrow .btn{padding:14px 16px;letter-spacing:.08em;font-size:.65rem}
 .result-inner{padding:80px 16px 40px}.closeX{top:16px;right:16px}.verdict{padding:28px 18px}.blk{padding:18px 16px}.cal li{flex-direction:column;gap:4px}
 .cta{padding:28px 18px}.book{width:100%;padding:16px 18px}.fineprint{padding:36px 0}.fineprint .card{padding:22px 20px}.sanction .amt{font-size:1.3rem}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}
 .actcard:hover,.fam-h:hover img,:is(.fineprint .card,.cta):hover{transform:none}
 :is(.fineprint .card,.verdict,.blk,.note,.cta)::before{display:none}
}
