/* Insider — versión clara "Marfil" (ronda 2). Se activa con el botón ☀︎/☾ del encabezado:
   html[data-theme="light"]. Tonos arena/crema (no blanco puro) con el amarillo Insider. */
html[data-theme="light"]{
  --ink:#efe9dc; --ink-2:#e8e1d2; --ink-3:#f8f4eb; --graphite:#e2dacb;
  --line:rgba(40,32,18,.12); --line-2:rgba(40,32,18,.22);
  --white:#17150f; --text:#2d2a23; --muted:#6b665a; --muted-2:#8b8577;
  --gold-txt:#9c7408;
  color-scheme:light;
}
html[data-theme="light"] body::after{opacity:.035;mix-blend-mode:multiply}
html[data-theme="light"] ::selection{color:#111}
/* acentos dorados legibles sobre fondo claro */
html[data-theme="light"] .eyebrow,html[data-theme="light"] em.g,html[data-theme="light"] .gold,
html[data-theme="light"] .spine-label b,html[data-theme="light"] .ftr h4,html[data-theme="light"] .link-arrow{color:var(--gold-txt)}
html[data-theme="light"] .band .eyebrow{color:#111}
/* textos que eran blancos fijos */
html[data-theme="light"] :is(.nav a:hover,.nav a.on,.burger,.mnav a,.hero-tag b,.hero-stats b,.quote .who b,.socials a span,.tl-year,
  .manifesto blockquote,.prose .intro,.prose blockquote,.prose .sig,.art-cta b,.lvl b,.plan .price b,.hero-brand,.dir-count b,.empty b,.near){color:var(--white)}
html[data-theme="light"] :is(.lead,.dir-title p,.ins .loc,.nav a,.dir-count select,.seg button){color:#4a463d}
html[data-theme="light"] .lead{color:#4a463d}
/* logo y firmas: el PNG es oscuro (en la versión oscura se invierte) */
html[data-theme="light"] :is(.logo img,.sign img,.choose-media .stamp img){filter:none}
/* encabezado, menú móvil y pie */
html[data-theme="light"] .hdr.scrolled{background:rgba(239,233,220,.86)}
html[data-theme="light"] .mnav{background:rgba(239,233,220,.97)}
html[data-theme="light"] .ftr{background:#e4dccb}
html[data-theme="light"] .ftr-big{-webkit-text-stroke:1px rgba(40,32,18,.16)}
html[data-theme="light"] .spine i{background:rgba(40,32,18,.16)}
html[data-theme="light"] .spine i.on{background:var(--gold)}
/* portadas con foto: velo claro a la izquierda para el texto, foto visible a la derecha */
html[data-theme="light"] .hero::before{background:
  radial-gradient(600px circle at var(--mx,70%) var(--my,40%),rgba(238,190,44,.22),transparent 60%),
  linear-gradient(90deg,rgba(239,233,220,.97) 0%,rgba(239,233,220,.8) 45%,rgba(239,233,220,.25) 100%),
  linear-gradient(0deg,var(--ink) 0%,transparent 35%)}
html[data-theme="light"] .hero-bg img{filter:grayscale(1) contrast(1.05) brightness(1.05) sepia(.15)}
html[data-theme="light"] .phead::before{background:linear-gradient(0deg,var(--ink),rgba(239,233,220,.6) 60%,rgba(239,233,220,.85))}
html[data-theme="light"] .phead .bg img{filter:grayscale(1) brightness(1.1) sepia(.2)}
html[data-theme="light"] .hero-tag{background:rgba(248,244,235,.88)}
html[data-theme="light"] .hero-fig img,html[data-theme="light"] .lvl img{filter:drop-shadow(0 26px 40px rgba(60,45,20,.28))}
/* las secciones de llamado con foto (cta) se mantienen oscuras: el texto va sobre la imagen */
html[data-theme="light"] .cta{--white:#fff;--text:#e9e7e1;color:#e9e7e1}
html[data-theme="light"] .cta .lead{color:#d8d6cf}
html[data-theme="light"] .cta .eyebrow{color:var(--gold)}
/* superficies */
html[data-theme="light"] .pillar{background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.2))}
html[data-theme="light"] .btn-ghost{background:rgba(255,255,255,.35)}
html[data-theme="light"] .btn-ghost:hover{color:var(--gold-txt);border-color:var(--gold-txt)}
html[data-theme="light"] .field input,html[data-theme="light"] .field textarea{background:rgba(255,255,255,.5)}
html[data-theme="light"] .chip{background:rgba(248,244,235,.85);color:var(--text)}
html[data-theme="light"] .chip b{color:var(--muted)}
/* mapas: teselas claras y cálidas (en la versión oscura se invierten) */
html[data-theme="light"] .leaflet-container .leaflet-tile-pane{filter:grayscale(.75) sepia(.18) brightness(1.02) contrast(.95)}
html[data-theme="light"] .world-map,html[data-theme="light"] .world-map .leaflet-container,html[data-theme="light"] .dir-map{background:#e6dfd0}
html[data-theme="light"] .leaflet-control-attribution{background:rgba(248,244,235,.8)!important;color:#6b665a!important}
html[data-theme="light"] :is(.map-legend,.map-hint,.seg){background:rgba(248,244,235,.9);color:var(--text)}
html[data-theme="light"] .dir-count{background:rgba(239,233,220,.94)}
html[data-theme="light"] .ins:hover,html[data-theme="light"] .ins.hl{background:rgba(255,255,255,.45)}
html[data-theme="light"] .ins .ph{background:#d9d1c0}
html[data-theme="light"] .tag{color:#4a463d}
html[data-theme="light"] .tag.g{color:var(--gold-txt);border-color:rgba(156,116,8,.45)}
html[data-theme="light"] .prof{background:var(--ink-3)}
/* botón de tema */
.theme-tg{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);background:transparent;color:var(--white);display:inline-grid;place-items:center;transition:border-color .3s,color .3s}
.theme-tg:hover{border-color:var(--gold);color:var(--gold)}
.theme-tg svg{width:20px;height:20px;grid-area:1/1}
.theme-tg .sun{display:none}
html[data-theme="light"] .theme-tg .sun{display:block}
html[data-theme="light"] .theme-tg .moon{display:none}
html[data-theme="light"] .theme-tg:hover{color:var(--gold-txt);border-color:var(--gold-txt)}
@media (max-width:520px){.theme-tg{width:40px;height:40px}}
html[data-theme="light"] .hero-brand span{color:#5d584d}
html[data-theme="light"] .pill{color:var(--gold-txt);border-color:rgba(156,116,8,.4);background:rgba(255,255,255,.45)}

/* textos grises fijos de la versión oscura → tonos legibles sobre marfil (generado) */
html[data-theme="light"] .lead{color:#4a463d}
html[data-theme="light"] .nav a{color:#4a463d}
html[data-theme="light"] .hero-copy .h-xl .thin{color:#4a463d}
html[data-theme="light"] .marquee-track span{color:#4a463d}
html[data-theme="light"] .pillar p{color:#4a463d}
html[data-theme="light"] .checks li{color:#4a463d}
html[data-theme="light"] .quote blockquote{color:#4a463d}
html[data-theme="light"] .chip{color:#4a463d}
html[data-theme="light"] .world .reco{color:#4a463d}
html[data-theme="light"] .ftr li a{color:#4a463d}
html[data-theme="light"] .tl-body p{color:#4a463d}
html[data-theme="light"] .prose{color:#4a463d}
html[data-theme="light"] .art-cta span{color:#4a463d}
html[data-theme="light"] .plan li{color:#4a463d}
html[data-theme="light"] .hero-brand span{color:#4a463d}
html[data-theme="light"] .dir-title p{color:#4a463d}
html[data-theme="light"] .dir-count select{color:#4a463d}
html[data-theme="light"] .ins .loc{color:#4a463d}
html[data-theme="light"] .tag{color:#4a463d}
html[data-theme="light"] .map-legend{color:#4a463d}
html[data-theme="light"] .map-hint{color:#4a463d}
html[data-theme="light"] .seg button{color:#4a463d}
html[data-theme="light"] .prof .sub{color:#4a463d}
html[data-theme="light"] .prof-info dd{color:#17150f}
/* acentos dorados de texto (generado) */
html[data-theme="light"] .eyebrow{color:var(--gold-txt)}
html[data-theme="light"] .gold{color:var(--gold-txt)}
html[data-theme="light"] em.g{color:var(--gold-txt)}
html[data-theme="light"] .link-arrow{color:var(--gold-txt)}
html[data-theme="light"] .spine-label b{color:var(--gold-txt)}
html[data-theme="light"] .hero-tag span{color:var(--gold-txt)}
html[data-theme="light"] .pillar .ico{color:var(--gold-txt)}
html[data-theme="light"] .choose-media .stamp span{color:var(--gold-txt)}
html[data-theme="light"] .quote .stars{color:var(--gold-txt)}
html[data-theme="light"] .quote blockquote::before{color:var(--gold-txt)}
html[data-theme="light"] .chip b{color:var(--gold-txt)}
html[data-theme="light"] .card-news time{color:var(--gold-txt)}
html[data-theme="light"] .socials svg{color:var(--gold-txt)}
html[data-theme="light"] .form-ok{color:var(--gold-txt)}
html[data-theme="light"] .ftr h4{color:var(--gold-txt)}
html[data-theme="light"] .manifesto blockquote .q{color:var(--gold-txt)}
html[data-theme="light"] .pill{color:var(--gold-txt)}
html[data-theme="light"] .art-side time{color:var(--gold-txt)}
html[data-theme="light"] .prose a{color:var(--gold-txt)}
html[data-theme="light"] .plan li svg{color:var(--gold-txt)}
html[data-theme="light"] .plan .price .frz{color:var(--gold-txt)}
html[data-theme="light"] .near svg{color:var(--gold-txt)}
html[data-theme="light"] .dir-msg{color:var(--gold-txt)}
html[data-theme="light"] .ins .loc svg{color:var(--gold-txt)}
html[data-theme="light"] .tag.g{color:var(--gold-txt)}
html[data-theme="light"] .prof-info dd a{color:var(--gold-txt)}
html[data-theme="light"] .prof h4{color:var(--gold-txt)}
html[data-theme="light"] .near-list em{color:var(--gold-txt)}
