:root {
  --background:#f2efe9; --surface:#fbfaf7; --surface-strong:#fff; --ink:#171512;
  --muted:#746f67; --line:#d8d2c8; --accent:#b7965d; --dark:#171512;
  --shadow:0 20px 55px rgba(18,15,11,.11); --shadow-soft:0 10px 28px rgba(18,15,11,.07);
  --safe-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;min-width:280px;color:var(--ink);background:var(--background);font-family:Inter,sans-serif}
body.dialog-open{overflow:hidden} button,input,select{font:inherit} button{-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
.site-header{min-height:64px;padding:0 18px;position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;color:#fff;background:rgba(23,21,18,.96);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px)}
.brand{color:inherit;text-decoration:none;font-family:"Playfair Display",serif;font-size:1.45rem;letter-spacing:.17em}
.edition{display:none;color:rgba(255,255,255,.56);font-size:.64rem;letter-spacing:.14em}
.hero{padding:0 16px;color:#fff;background:radial-gradient(circle at 75% 15%,#44382a 0%,#231f1a 38%,#151310 78%)}
.hero-inner{width:min(1160px,100%);margin:auto;padding:62px 0 54px}
.eyebrow,.section-kicker,.toolbar-label,.detail-label,.detail-eyebrow{margin:0;color:var(--accent);font-size:.64rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
h1{max-width:760px;margin:16px 0 0;font-family:"Playfair Display",serif;font-size:clamp(2.55rem,12vw,5.7rem);font-weight:500;line-height:.98;letter-spacing:-.045em}
.intro{max-width:620px;margin:22px 0 0;color:rgba(255,255,255,.65);font-size:.93rem;line-height:1.7}
.entry-paths{margin-top:30px;display:grid;gap:10px}
.entry-card{min-height:108px;padding:18px;display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto;gap:4px 12px;align-items:center;text-align:left;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.17);border-radius:12px;background:rgba(255,255,255,.06)}
.entry-card--primary{border-color:rgba(215,187,132,.45);background:rgba(183,150,93,.15)}
.entry-icon{width:42px;height:42px;grid-row:1/3;display:grid;place-items:center;border:1px solid rgba(255,255,255,.25);border-radius:50%;font-size:1.15rem}
.entry-card strong{font-family:"Playfair Display",serif;font-size:1.1rem;font-weight:500}
.entry-card small{color:rgba(255,255,255,.58);font-size:.72rem;line-height:1.45}
.search-box{width:100%;height:58px;margin-top:22px;padding:0 12px 0 17px;display:flex;align-items:center;gap:11px;color:var(--ink);background:#fff;border-radius:10px;box-shadow:0 15px 42px rgba(0,0,0,.22)}
.search-icon{font-size:1.35rem;color:var(--muted)} .search-box input{width:100%;min-width:0;border:0;outline:0;color:var(--ink);background:transparent;font-size:16px}
.search-box button{width:42px;height:42px;flex:0 0 auto;opacity:0;pointer-events:none;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:1.35rem}
.search-box button.visible{opacity:1;pointer-events:auto}.summary{margin-top:18px;color:rgba(255,255,255,.55);font-size:.78rem;letter-spacing:.08em}.summary strong{margin-right:4px;color:#fff}
.discovery{padding:0 12px;background:#e9e2d7;border-bottom:1px solid rgba(23,21,18,.08)}
.discovery-inner{width:min(1240px,100%);margin:auto;padding:42px 0 34px}
.discovery-heading h2,.section-heading h2{margin:9px 0 0;font-family:"Playfair Display",serif;font-size:clamp(1.85rem,9vw,3.4rem);font-weight:500;letter-spacing:-.035em}
.discovery-heading>p,.section-heading>p{margin:13px 0 0;color:var(--muted);font-size:.83rem;line-height:1.6}
.discovery-heading strong{color:var(--ink);font-weight:600}.discovery-groups{margin-top:27px;display:grid;gap:22px}
.discovery-label{margin:0 0 9px;color:#675d50;font-size:.63rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.discovery-rail{margin:0 -12px;padding:0 12px 4px;display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}.discovery-rail::-webkit-scrollbar{display:none}
.discovery-chip{min-height:46px;padding:10px 14px;flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;scroll-snap-align:start;border:1px solid rgba(23,21,18,.13);border-radius:999px;background:rgba(255,255,255,.62);color:#4b443b;font-size:.78rem;white-space:nowrap;box-shadow:0 5px 14px rgba(18,15,11,.04)}
.discovery-chip span,.profile-chip span{min-width:22px;font-family:system-ui,"Apple Color Emoji","Segoe UI Emoji",sans-serif;font-size:1.05rem;line-height:1;text-align:center}
.discovery-chip.is-active{color:#fff;background:var(--dark);border-color:var(--dark);box-shadow:0 8px 20px rgba(23,21,18,.18)}
.gender-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.gender-card{min-width:0;min-height:112px;padding:16px 8px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:1px solid rgba(23,21,18,.13);border-radius:13px;background:rgba(255,255,255,.68);color:var(--ink);box-shadow:0 7px 20px rgba(18,15,11,.055)}
.gender-card .gender-icon{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(183,150,93,.42);border-radius:50%;color:var(--accent);font-family:system-ui,sans-serif;font-size:1.1rem}
.gender-card strong{font-family:"Playfair Display",serif;font-size:.93rem;font-weight:500}.gender-card small{color:var(--muted);font-size:.56rem}
.gender-card.is-active{color:#fff;background:var(--dark);border-color:var(--dark);transform:translateY(-2px)}.gender-card.is-active small{color:rgba(255,255,255,.66)}
.catalog-shell{width:min(1240px,100%);margin:auto;padding:58px 12px 82px}.section-heading{margin-bottom:34px}
.toolbar{margin-bottom:18px;padding:16px 0;display:grid;grid-template-columns:1fr auto;gap:14px;align-items:end;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.filter-field{min-width:0;display:grid;gap:8px} select{width:100%;min-height:44px;padding:8px 32px 8px 0;border:0;border-bottom:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink)}
.text-button{min-height:44px;padding:8px 0;border:0;background:transparent;color:var(--muted);font-size:.78rem}
.active-filters{margin:0 0 20px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.filter-chip{min-height:40px;padding:8px 12px;display:inline-flex;align-items:center;gap:9px;flex:0 0 auto;border:1px solid rgba(183,150,93,.35);border-radius:999px;background:#e8e0d2;color:#51483d;font-size:.75rem}
.catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.perfume-card{min-width:0;overflow:hidden;background:var(--surface-strong);border:1px solid rgba(23,21,18,.07);border-radius:11px;box-shadow:var(--shadow-soft)}
.card-open,.name-button,.designer-link,.details-link{padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}.card-open,.name-button{width:100%;display:block}
.image-stage{aspect-ratio:4/5;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 30%,#fff 0%,#f4f0e8 44%,#e7e0d5 100%);border-bottom:1px solid rgba(23,21,18,.06)}
.perfume-image{width:100%;height:100%;display:block;object-fit:contain;padding:9%;opacity:1}.perfume-image.is-loading{opacity:0}.image-fallback,.detail-fallback{position:absolute;inset:0;display:grid;place-items:center}
.monogram{width:76px;height:98px;position:relative;display:grid;place-items:center;border:1px solid rgba(23,21,18,.16);border-radius:21px 21px 11px 11px;color:rgba(23,21,18,.42);font-family:"Playfair Display",serif;font-size:1.65rem}
.card-copy{padding:15px 12px 16px}.designer{min-height:28px;margin:0 0 5px;color:var(--accent);font-size:.57rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase}.perfume-name{margin:0;min-height:2.55em;font-family:"Playfair Display",serif;font-size:1rem;font-weight:500;line-height:1.26}
.product-code{margin:12px 0 0;color:var(--muted);font-size:.61rem;font-weight:500;letter-spacing:.09em}.card-meta{margin-top:8px;color:var(--muted);font-size:.66rem;line-height:1.4}.details-link{min-height:44px;margin-top:8px;display:inline-flex;align-items:center;font-size:.64rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase}
.empty-state,.load-error{padding:80px 20px;text-align:center;color:var(--muted)}.empty-title{margin:0 0 9px;color:var(--ink);font-family:"Playfair Display",serif;font-size:1.7rem}
footer{padding:30px 18px calc(30px + var(--safe-bottom));display:flex;flex-direction:column;gap:9px;color:rgba(255,255,255,.56);background:var(--dark);font-size:.65rem;letter-spacing:.14em}
.perfume-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0 0 var(--safe-bottom);overflow:auto;color:var(--ink);background:var(--surface-strong);border:0}.perfume-dialog::backdrop,.advisor-dialog::backdrop{background:rgba(13,11,9,.78);backdrop-filter:blur(6px)}
.dialog-close{width:44px;height:44px;position:fixed;top:max(12px,env(safe-area-inset-top));right:12px;z-index:5;border:1px solid rgba(23,21,18,.12);border-radius:50%;background:rgba(255,255,255,.92);color:var(--ink);font-size:1.35rem;box-shadow:0 6px 20px rgba(0,0,0,.12)}
.detail-layout{min-height:100%}.detail-media{height:min(52dvh,470px);min-height:330px;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 32%,#fff 0%,#f2eee6 48%,#dfd5c7 100%)}.detail-image{width:100%;height:100%;object-fit:contain;padding:10%}.detail-copy{padding:32px 20px 44px}
.detail-designer{min-height:44px;margin-top:11px;padding:0;border:0;border-bottom:1px solid var(--accent);background:transparent;color:var(--accent);font-size:.72rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase}
.detail-copy h2{margin:7px 0 0;font-family:"Playfair Display",serif;font-size:clamp(2.5rem,13vw,4.8rem);font-weight:500;line-height:.98;letter-spacing:-.045em}.detail-code{margin:17px 0 0;color:var(--muted);font-size:.68rem;letter-spacing:.11em}.detail-description{margin:24px 0 0;color:var(--muted);font-size:.92rem;line-height:1.75}
.detail-section,.related-section{margin-top:27px;padding-top:22px;border-top:1px solid var(--line)}.profile-chips{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px}.profile-chip{min-height:44px;padding:8px 12px;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:#504a42;font-size:.72rem}
.family-link{min-height:44px;margin-top:6px;padding:0;border:0;background:transparent;color:var(--ink);font-family:"Playfair Display",serif;font-size:1.3rem}.notes-grid{margin-top:15px;display:grid;gap:12px}.notes-grid>div{padding:14px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}.notes-grid span{color:var(--accent);font-size:.61rem;font-weight:600;text-transform:uppercase}.notes-grid p{margin:7px 0 0;font-size:.86rem;line-height:1.55}
.pending-data{margin-top:26px;padding:16px;display:grid;gap:6px;border:1px dashed rgba(183,150,93,.5);border-radius:10px;background:#f6f1e8}.pending-data span,.related-reason,.use-hint{color:var(--muted);font-size:.72rem;line-height:1.5}
.related-heading{display:flex;align-items:end;justify-content:space-between;gap:14px}.related-heading button{min-height:44px;padding:0;border:0;background:transparent;color:var(--muted);font-size:.7rem}.related-grid{margin-top:14px;display:grid;gap:9px}.related-card{min-height:76px;padding:14px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink)}.related-card span{font-family:"Playfair Display",serif}

/* v1.3.5 · Asesor Inteligente Experimental */
.advisor-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--surface-strong);color:var(--ink)}
.advisor-shell{min-height:100%;padding:calc(42px + env(safe-area-inset-top)) 18px calc(28px + var(--safe-bottom));display:flex;flex-direction:column}
.advisor-close{position:fixed}.advisor-head{padding-right:42px}.advisor-head h2{margin:10px 0 0;font-family:"Playfair Display",serif;font-size:clamp(2.2rem,11vw,4rem);font-weight:500;line-height:1;letter-spacing:-.04em}.advisor-head>p:not(.detail-eyebrow):not(.advisor-progress-text){margin:16px 0 0;color:var(--muted);font-size:.86rem;line-height:1.65}
.advisor-progress{height:4px;margin-top:26px;overflow:hidden;border-radius:999px;background:#e6dfd4}.advisor-progress span{display:block;width:25%;height:100%;background:var(--accent);transition:width .25s ease}.advisor-progress-text{margin:9px 0 0;color:var(--muted);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase}
.advisor-steps{flex:1}.advisor-step{display:none;padding:32px 0 22px}.advisor-step.is-active{display:block}.advisor-question{margin:0 0 18px;font-family:"Playfair Display",serif;font-size:1.55rem;line-height:1.2}
.advisor-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.advisor-options--profiles{grid-template-columns:repeat(2,minmax(0,1fr))}
.advisor-option{min-height:82px;padding:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)}.advisor-option span{font-size:1.35rem}.advisor-option strong{font-family:"Playfair Display",serif;font-size:.98rem;font-weight:500}.advisor-option.is-selected{color:#fff;background:var(--dark);border-color:var(--dark);box-shadow:0 10px 26px rgba(23,21,18,.18)}
.advisor-actions{position:sticky;bottom:0;margin:auto -18px calc(-28px - var(--safe-bottom));padding:12px 18px calc(14px + var(--safe-bottom));display:grid;grid-template-columns:auto auto 1fr;gap:8px;background:rgba(255,255,255,.95);border-top:1px solid var(--line);backdrop-filter:blur(12px)}
.advisor-primary,.advisor-secondary{min-height:48px;padding:10px 15px;border-radius:9px}.advisor-primary{border:1px solid var(--dark);background:var(--dark);color:#fff}.advisor-secondary{border:1px solid var(--line);background:var(--surface);color:var(--muted)}.advisor-secondary:disabled{opacity:.38}
.advisor-results{flex:1;padding:30px 0}.advisor-results-heading h3{margin:8px 0 0;font-family:"Playfair Display",serif;font-size:2rem;font-weight:500}.advisor-results-heading>p:last-child{color:var(--muted);font-size:.78rem;line-height:1.55}.advisor-recommendations{display:grid;gap:12px;margin-top:22px}
.advisor-result-card{padding:16px;border:1px solid var(--line);border-radius:13px;background:var(--surface);box-shadow:var(--shadow-soft)}.advisor-result-top{display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:start}.advisor-rank{font-size:1.3rem}.advisor-result-top p{margin:0;color:var(--accent);font-size:.58rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}.advisor-result-top h4{margin:4px 0 0;font-family:"Playfair Display",serif;font-size:1.25rem;font-weight:500}.advisor-result-top small{display:block;margin-top:6px;color:var(--muted);font-size:.6rem;letter-spacing:.07em}.advisor-score{font-size:1.25rem}
.advisor-why{margin-top:14px;padding-top:13px;border-top:1px solid var(--line)}.advisor-why>span{color:var(--accent);font-size:.61rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase}.advisor-why ul{margin:9px 0 0;padding:0;display:grid;gap:5px;list-style:none;color:var(--muted);font-size:.74rem}.advisor-why li::before{content:"✓";margin-right:7px;color:var(--accent)}.advisor-result-card>button{min-height:44px;margin-top:10px;padding:0;border:0;background:transparent;color:var(--ink);font-size:.68rem;font-weight:600;text-transform:uppercase}
.advisor-no-match{margin-top:24px;padding:20px;border:1px dashed rgba(183,150,93,.55);border-radius:12px;background:#f6f1e8}.advisor-no-match strong{font-family:"Playfair Display",serif;font-size:1.18rem}.advisor-no-match p{margin:9px 0 0;color:var(--muted);font-size:.8rem;line-height:1.6}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

@media(min-width:600px){
  .hero{padding:0 28px}.hero-inner{padding:84px 0 72px}.entry-paths{max-width:760px;grid-template-columns:repeat(2,minmax(0,1fr))}.search-box{max-width:650px;height:62px}
  .discovery{padding:0 28px}.discovery-inner{padding:54px 0 46px}.discovery-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 34px}.discovery-rail{margin:0;padding:0;flex-wrap:wrap;overflow:visible}.discovery-group--featured{grid-column:1/-1}.gender-grid{max-width:680px}
  .catalog-shell{padding:72px 28px 100px}.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.notes-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .advisor-options,.advisor-options--profiles{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(min-width:820px){
  .site-header{min-height:72px;padding:0 4vw}.edition{display:block}.section-heading,.discovery-heading{display:flex;justify-content:space-between;gap:32px;align-items:end}.section-heading>p,.discovery-heading>p{max-width:420px;margin:0}
  .toolbar{grid-template-columns:minmax(220px,320px) minmax(220px,320px) auto}.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}footer{padding:34px 5vw;flex-direction:row;justify-content:space-between}
  .perfume-dialog{width:min(1120px,calc(100vw - 32px));height:auto;max-height:min(880px,calc(100vh - 32px));margin:auto;border:1px solid rgba(183,150,93,.28);border-radius:16px}.detail-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:680px}.detail-media{height:auto;min-height:680px}.detail-copy{padding:72px 54px 50px}
  .advisor-dialog{width:min(820px,calc(100vw - 40px));height:auto;max-height:calc(100vh - 40px);margin:auto;border-radius:16px;box-shadow:0 35px 100px rgba(0,0,0,.34)}.advisor-shell{min-height:min(760px,calc(100vh - 40px));padding:44px 46px 0}.advisor-actions{margin:auto -46px 0;padding:14px 46px 18px}.advisor-options--profiles{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
#catalogo{scroll-margin-top:76px}
@media(max-width:380px){.advisor-options,.advisor-options--profiles{grid-template-columns:1fr}.entry-card{grid-template-columns:38px 1fr}.advisor-shell{padding-left:14px;padding-right:14px}.advisor-actions{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px}}

/* =========================================================
   SPRINT 1 · PRIMERA IMPRESIÓN — HOME PREMIUM
   ========================================================= */
:root{
  --prive-black:#07090d;
  --prive-navy:#0a1019;
  --prive-navy-soft:#111a27;
  --prive-gold:#bda678;
  --prive-gold-light:#d8c79f;
  --prive-ivory:#f3efe6;
}
body{background:#eeeae2}
.site-header{
  min-height:76px;padding:0 clamp(18px,4vw,56px);position:absolute;inset:0 0 auto;z-index:30;
  background:linear-gradient(to bottom,rgba(4,6,9,.76),transparent);border:0;backdrop-filter:none
}
.site-header .brand{font-size:1.1rem;letter-spacing:.28em;font-weight:500}
.header-catalog-link{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.7);text-decoration:none;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;transition:color .3s ease}
.header-catalog-link:hover{color:#fff}
.hero{min-height:100svh;padding:0 clamp(18px,4vw,56px);position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(135deg,var(--prive-black) 0%,var(--prive-navy) 48%,#05070a 100%)}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,6,9,.94) 0%,rgba(4,6,9,.72) 46%,rgba(4,6,9,.18) 100%)}
.hero-atmosphere{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-orb{position:absolute;border-radius:50%;filter:blur(3px);opacity:.7}
.hero-orb--one{width:min(70vw,900px);aspect-ratio:1;right:-20%;top:-30%;background:radial-gradient(circle at 38% 42%,rgba(69,88,112,.5),rgba(10,16,25,0) 67%)}
.hero-orb--two{width:min(45vw,620px);aspect-ratio:1;right:4%;bottom:-35%;background:radial-gradient(circle,rgba(189,166,120,.18),transparent 68%)}
.hero-glass{width:clamp(220px,32vw,510px);height:clamp(360px,70vh,760px);position:absolute;right:clamp(-90px,4vw,90px);top:50%;transform:translateY(-48%) rotate(13deg);border:1px solid rgba(255,255,255,.16);border-radius:48% 52% 42% 58%/58% 38% 62% 42%;background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.015) 42%,rgba(189,166,120,.06));box-shadow:inset 0 0 80px rgba(255,255,255,.04),0 0 120px rgba(25,44,67,.25);backdrop-filter:blur(12px)}
.hero-glass::before{content:"";position:absolute;inset:12%;border:1px solid rgba(216,199,159,.16);border-radius:inherit;filter:blur(.2px)}
.hero-flare{width:1px;height:70%;position:absolute;right:27%;top:12%;background:linear-gradient(transparent,rgba(216,199,159,.72),transparent);box-shadow:0 0 22px rgba(216,199,159,.32);transform:rotate(13deg)}
.hero-inner{width:min(1220px,100%);min-height:100svh;margin:auto;padding:130px 0 70px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.hero-brand-block{position:relative;z-index:2}
.hero-overline{margin:0 0 14px;color:var(--prive-gold);font-size:.62rem;font-weight:600;letter-spacing:.32em}
.hero-logo{max-width:none;margin:0;font-family:"Playfair Display",serif;font-size:clamp(4.5rem,15vw,10.5rem);font-weight:500;line-height:.78;letter-spacing:.02em}
.hero-slogan{margin:24px 0 0;color:rgba(255,255,255,.72);font-family:"Playfair Display",serif;font-size:clamp(1rem,2vw,1.35rem);font-style:italic;letter-spacing:.015em}
.hero-message{margin:34px 0 0;padding-left:18px;border-left:1px solid rgba(189,166,120,.65)}
.hero-message p{max-width:430px;margin:0;color:rgba(255,255,255,.52);font-size:.78rem;line-height:1.65;letter-spacing:.06em;text-transform:uppercase}
.search-area{width:min(720px,100%);margin-top:38px}
.search-box{height:72px;margin:0;padding:0 16px 0 22px;gap:15px;border:1px solid rgba(255,255,255,.16);border-radius:2px;background:rgba(245,242,235,.97);box-shadow:0 24px 70px rgba(0,0,0,.38);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.search-box:focus-within{transform:translateY(-2px);border-color:rgba(216,199,159,.72);box-shadow:0 30px 90px rgba(0,0,0,.5),0 0 0 1px rgba(189,166,120,.12)}
.search-svg{width:22px;height:22px;flex:0 0 auto;fill:none;stroke:#555963;stroke-width:1.5;stroke-linecap:round}
.search-box input{font-size:clamp(1rem,2vw,1.12rem);letter-spacing:.01em}.search-box input::placeholder{color:#777a80;transition:opacity .3s ease}
.category-filters{margin-top:18px;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}.category-filters::-webkit-scrollbar{display:none}
.category-filter{min-height:40px;padding:7px 15px;position:relative;flex:0 0 auto;border:0;background:transparent;color:rgba(255,255,255,.48);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:color .25s ease}
.category-filter::after{content:"";height:1px;position:absolute;left:15px;right:15px;bottom:3px;background:var(--prive-gold);transform:scaleX(0);transition:transform .25s ease}
.category-filter:hover,.category-filter.is-active{color:#fff}.category-filter.is-active::after{transform:scaleX(1)}
.summary{margin:10px 0 0 15px;color:rgba(255,255,255,.36);font-size:.66rem}.summary strong{color:var(--prive-gold-light)}
.entry-paths{width:min(720px,100%);margin-top:20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.entry-card{min-height:92px;padding:18px;display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:1fr;gap:15px;align-items:center;border:1px solid rgba(255,255,255,.12);border-radius:2px;background:rgba(255,255,255,.035);transition:background .3s ease,border-color .3s ease,transform .3s ease}
.entry-card--primary{border-color:rgba(189,166,120,.34);background:rgba(189,166,120,.08)}
.entry-card:hover{transform:translateY(-3px);border-color:rgba(216,199,159,.46);background:rgba(255,255,255,.075)}
.entry-index{align-self:start;color:var(--prive-gold);font-size:.55rem;letter-spacing:.1em}.entry-copy{display:grid;gap:6px}.entry-card strong{font-family:Inter,sans-serif;font-size:.8rem;font-weight:500;letter-spacing:.04em}.entry-card small{color:rgba(255,255,255,.43);font-size:.66rem;line-height:1.45}.entry-arrow{color:rgba(255,255,255,.64);font-size:1rem}
.reveal{opacity:0;transform:translateY(16px);animation:priveReveal .85s cubic-bezier(.2,.75,.2,1) forwards}.reveal--one{animation-delay:.08s}.reveal--two{animation-delay:.2s}.reveal--three{animation-delay:.34s}.reveal--four{animation-delay:.46s}
@keyframes priveReveal{to{opacity:1;transform:translateY(0)}}
.catalog-shell{padding-top:84px}.section-heading h2{font-size:clamp(2.3rem,7vw,4.3rem)}
.site-footer{padding:46px clamp(18px,4vw,56px) calc(40px + var(--safe-bottom));display:grid;grid-template-columns:1fr auto;align-items:end;gap:24px;background:var(--prive-black)}
.site-footer div{display:grid;gap:10px}.site-footer strong{color:#fff;font-family:"Playfair Display",serif;font-size:1.4rem;letter-spacing:.2em}.site-footer div span{color:var(--prive-gold);font-family:"Playfair Display",serif;font-size:.85rem;font-style:italic;letter-spacing:normal}.site-footer p{max-width:360px;margin:0;color:rgba(255,255,255,.4);font-size:.66rem;line-height:1.6;letter-spacing:.06em}.site-footer small{grid-column:1/-1;color:rgba(255,255,255,.25)}
.perfume-card{transition:transform .35s ease,box-shadow .35s ease}.perfume-card:hover{transform:translateY(-5px);box-shadow:0 20px 46px rgba(18,15,11,.12)}
@media (max-width:700px){
  .site-header{min-height:64px}.header-catalog-link{font-size:.58rem}
  .hero::after{background:linear-gradient(to bottom,rgba(4,6,9,.72),rgba(4,6,9,.96) 72%)}
  .hero-inner{padding:112px 0 50px;justify-content:flex-end}
  .hero-glass{right:-115px;top:38%;height:52vh}.hero-flare{right:25%;height:47%;top:15%}
  .hero-logo{font-size:clamp(4.25rem,25vw,7rem)}
  .hero-slogan{margin-top:19px}.hero-message{margin-top:28px}
  .search-area{margin-top:30px}.search-box{height:64px;padding-left:18px}
  .entry-paths{grid-template-columns:1fr}.entry-card{min-height:76px;padding:14px 16px}
  .site-footer{grid-template-columns:1fr}.site-footer p{max-width:none}
}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;animation:none}.entry-card,.search-box,.perfume-card{transition:none}}


/* =========================================================
   SPRINT 1.1 — REFINAMIENTO DE PRIMERA IMPRESIÓN
   ========================================================= */
.site-header{display:none!important}
.hero::after{
  background:linear-gradient(90deg,rgba(4,6,9,.78) 0%,rgba(4,6,9,.50) 45%,rgba(4,6,9,.06) 100%);
  transition:background .55s ease
}
.hero-atmosphere{opacity:1;transition:opacity .55s ease,transform .9s cubic-bezier(.2,.75,.2,1)}
.hero-orb--one{opacity:1;background:radial-gradient(circle at 38% 42%,rgba(91,119,153,.68),rgba(10,16,25,0) 68%)}
.hero-orb--two{opacity:1;background:radial-gradient(circle,rgba(216,190,137,.30),transparent 69%)}
.hero-glass{
  border-color:rgba(255,255,255,.29);
  background:linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,255,255,.035) 42%,rgba(216,199,159,.13));
  box-shadow:inset 0 0 95px rgba(255,255,255,.08),0 0 145px rgba(48,76,108,.42)
}
.hero-glass::before{border-color:rgba(235,220,187,.28)}
.hero-flare{background:linear-gradient(transparent,rgba(235,218,176,.92),transparent);box-shadow:0 0 32px rgba(216,199,159,.50)}
.hero-slogan{color:rgba(255,255,255,.82)}
.hero-message p{color:rgba(255,255,255,.68)}
.reveal{animation-duration:1.05s}
.reveal--one{animation-delay:.20s}
.reveal--two{animation-delay:.82s}
.reveal--three{animation-delay:1.34s}
.reveal--four{animation-delay:1.88s}
body.search-active .hero::after{background:linear-gradient(90deg,rgba(4,6,9,.90),rgba(4,6,9,.78) 58%,rgba(4,6,9,.48))}
body.search-active .hero-atmosphere{opacity:.58;transform:scale(1.015)}
body.search-active .hero-brand-block,
body.search-active .hero-message,
body.search-active .entry-paths{opacity:.62;transition:opacity .45s ease}
@media (max-width:700px){
  .hero::after{background:linear-gradient(to bottom,rgba(4,6,9,.42),rgba(4,6,9,.78) 57%,rgba(4,6,9,.94) 100%)}
  .hero-glass{opacity:.94}
  body.search-active .hero::after{background:linear-gradient(to bottom,rgba(4,6,9,.68),rgba(4,6,9,.91) 68%,rgba(4,6,9,.98))}
}

/* =========================================================
   SPRINT 2 · LA BOUTIQUE — CATÁLOGO PREMIUM
   ========================================================= */
.catalog-shell{
  width:min(1360px,100%);
  padding:106px clamp(14px,3vw,46px) 122px;
}
.section-heading{
  margin-bottom:44px;
  padding-bottom:30px;
  border-bottom:1px solid rgba(23,21,18,.13);
}
.section-heading h2{
  max-width:760px;
  font-size:clamp(2.65rem,6.8vw,5rem);
  line-height:.98;
}
.section-heading>p{max-width:470px;font-size:.79rem;line-height:1.75}
.toolbar{
  margin-bottom:34px;
  padding:20px 0 24px;
  border-top:0;
  border-bottom:1px solid rgba(23,21,18,.12);
}
.catalog-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 10px;
}
.perfume-card{
  min-width:0;
  overflow:hidden;
  position:relative;
  background:#f7f4ee;
  border:1px solid rgba(23,21,18,.09);
  border-radius:2px;
  box-shadow:none;
  opacity:0;
  transform:translateY(22px);
  animation:boutiqueCardIn .72s cubic-bezier(.2,.7,.2,1) forwards;
  animation-delay:calc(min(var(--card-index), 18) * 42ms);
  transition:transform .48s cubic-bezier(.2,.7,.2,1),box-shadow .48s ease,border-color .35s ease,background .35s ease;
}
@keyframes boutiqueCardIn{to{opacity:1;transform:translateY(0)}}
.perfume-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border:1px solid transparent;
  transition:border-color .35s ease;
}
.perfume-card:hover{
  transform:translateY(-8px);
  background:#fbfaf7;
  border-color:rgba(183,150,93,.30);
  box-shadow:0 28px 70px rgba(24,20,15,.13);
}
.perfume-card:hover::after{border-color:rgba(189,166,120,.17)}
.card-open{position:relative;overflow:hidden}
.image-stage{
  aspect-ratio:4/5.45;
  position:relative;
  background:
    linear-gradient(145deg,rgba(255,255,255,.88),rgba(246,241,232,.62)),
    radial-gradient(circle at 50% 35%,#fff 0%,#eee7dc 58%,#ded4c5 100%);
  border-bottom:1px solid rgba(23,21,18,.075);
}
.image-stage::before{
  content:"";
  width:62%;
  height:16%;
  position:absolute;
  left:19%;
  bottom:5%;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(22,18,13,.13),transparent 68%);
  filter:blur(8px);
  opacity:.62;
  transition:opacity .4s ease,transform .5s ease;
}
.card-number{
  position:absolute;
  top:16px;
  left:16px;
  z-index:2;
  color:rgba(23,21,18,.34);
  font-size:.52rem;
  letter-spacing:.18em;
}
.card-view{
  position:absolute;
  right:15px;
  bottom:14px;
  z-index:3;
  color:rgba(23,21,18,.62);
  font-size:.55rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .35s ease,transform .35s ease;
}
.perfume-image{
  padding:12% 11% 9%;
  transform:scale(.96);
  transform-origin:center 58%;
  filter:drop-shadow(0 18px 18px rgba(27,22,16,.10));
  transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .55s ease;
}
.perfume-card:hover .perfume-image{transform:scale(1.035) translateY(-4px);filter:drop-shadow(0 25px 22px rgba(27,22,16,.17))}
.perfume-card:hover .image-stage::before{opacity:.9;transform:scale(1.08)}
.perfume-card:hover .card-view{opacity:1;transform:translateY(0)}
.card-copy{
  min-height:190px;
  padding:22px 18px 18px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.designer{
  min-height:auto;
  margin:0 0 9px;
  color:#9a7a45;
  font-size:.54rem;
  font-weight:650;
  letter-spacing:.16em;
}
.designer-link{transition:color .25s ease}.designer-link:hover{color:#5e4724}
.perfume-name{
  min-height:2.4em;
  font-size:clamp(1.05rem,2.5vw,1.35rem);
  line-height:1.18;
  letter-spacing:-.025em;
}
.product-code{
  margin:13px 0 0;
  color:rgba(23,21,18,.45);
  font-size:.52rem;
  letter-spacing:.15em;
}
.card-meta{
  margin:11px 0 0;
  color:#746c61;
  font-size:.64rem;
  line-height:1.55;
}
.card-footer{
  width:100%;
  margin-top:auto;
  padding-top:17px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-top:1px solid rgba(23,21,18,.09);
}
.card-prompt{
  color:rgba(23,21,18,.55);
  font-size:.55rem;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.details-link{
  width:34px;
  height:34px;
  min-height:34px;
  margin:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(23,21,18,.18);
  border-radius:50%;
  font-size:.9rem;
  transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;
}
.details-link:hover{color:#fff;background:var(--prive-black);border-color:var(--prive-black);transform:translateX(2px)}
.empty-state{padding:80px 20px;text-align:center}

@media(min-width:600px){
  .catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 16px}
  .card-copy{min-height:205px;padding:24px 20px 20px}
}
@media(min-width:980px){
  .catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 22px}
  .image-stage{aspect-ratio:4/5.25}
  .card-copy{min-height:210px;padding:26px 22px 21px}
}
@media(min-width:1280px){
  .catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:42px 28px}
}
@media(max-width:480px){
  .catalog-shell{padding-left:10px;padding-right:10px}
  .section-heading{padding-left:6px;padding-right:6px}
  .card-copy{min-height:176px;padding:17px 12px 14px}
  .perfume-name{font-size:.96rem}
  .designer{font-size:.49rem;letter-spacing:.12em}
  .product-code{font-size:.48rem}
  .card-meta{font-size:.58rem}
  .card-prompt{display:none}
  .card-footer{justify-content:flex-end;padding-top:12px}
  .details-link{width:31px;height:31px;min-height:31px}
  .card-number{top:11px;left:11px}
  .card-view{display:none}
}
@media(prefers-reduced-motion:reduce){
  .perfume-card{opacity:1;transform:none;animation:none}
}


/* =========================================================
   SPRINT 2.1 · CATÁLOGO VITRINA + FICHA PROTAGONISTA
   Corrección visible sobre la base aprobada del Home.
   ========================================================= */
.catalog-shell{width:min(1380px,100%);padding-top:104px;background:transparent}
.section-heading{align-items:end}
.section-kicker{color:#8f7142}
.section-heading h2{max-width:820px;letter-spacing:-.045em}

.perfume-card{
  isolation:isolate;
  overflow:visible;
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(246,242,234,.96));
  border:1px solid rgba(77,62,42,.12);
  box-shadow:0 14px 38px rgba(31,25,18,.07),inset 0 1px 0 rgba(255,255,255,.92);
}
.perfume-card::before{
  content:"";
  position:absolute;
  inset:7px;
  z-index:0;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.66);
  box-shadow:inset 0 0 34px rgba(255,255,255,.28);
}
.perfume-card:hover{transform:translateY(-7px);box-shadow:0 30px 70px rgba(29,23,16,.15),0 4px 12px rgba(29,23,16,.05)}
.card-open,.card-copy{position:relative;z-index:1}
.image-stage{
  aspect-ratio:4/5.15;
  overflow:hidden;
  background:
    linear-gradient(110deg,rgba(255,255,255,.78) 0 9%,transparent 19% 79%,rgba(255,255,255,.52) 90% 100%),
    radial-gradient(ellipse at 50% 18%,rgba(255,255,255,1),rgba(251,248,242,.92) 43%,rgba(224,215,201,.86) 100%);
}
.image-stage::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.24),transparent 25% 72%,rgba(255,255,255,.2));
  border-bottom:1px solid rgba(93,72,40,.09);
}
.image-stage::before{
  width:58%;height:12%;left:21%;bottom:5%;
  background:radial-gradient(ellipse,rgba(25,19,13,.23),rgba(25,19,13,.08) 40%,transparent 72%);
  filter:blur(7px);opacity:.76;
}
.perfume-image{
  padding:8% 8% 6%;
  transform:scale(1.015);
  filter:drop-shadow(0 22px 18px rgba(31,24,17,.16));
}
.perfume-card:hover .perfume-image{transform:scale(1.065) translateY(-5px);filter:drop-shadow(0 29px 24px rgba(31,24,17,.23))}
.card-number{color:rgba(31,24,17,.3)}
.card-copy{background:linear-gradient(180deg,rgba(250,248,244,.92),rgba(246,242,234,.98))}
.card-footer{border-top-color:rgba(74,57,35,.1)}

/* Ficha: botella completa, gran formato y transición guiada por scroll */
.perfume-dialog{--detail-progress:0;scroll-behavior:smooth;background:#f5f1e9}
.detail-layout{position:relative;background:#f5f1e9}
.detail-media{
  isolation:isolate;
  height:min(68dvh,670px);
  min-height:480px;
  overflow:hidden;
  background:
    linear-gradient(115deg,rgba(255,255,255,.74),transparent 28% 74%,rgba(255,255,255,.42)),
    radial-gradient(circle at 50% 28%,#fff 0%,#f3eee5 48%,#d8cdbc 100%);
}
.detail-media::before{
  content:"";position:absolute;left:22%;right:22%;bottom:7%;height:9%;z-index:-1;
  border-radius:50%;background:radial-gradient(ellipse,rgba(26,20,14,.25),transparent 70%);filter:blur(12px);
}
.detail-media-frame{position:absolute;inset:22px;z-index:-1;border:1px solid rgba(255,255,255,.65);box-shadow:inset 0 0 70px rgba(255,255,255,.25)}
.detail-image{
  width:100%;height:100%;padding:clamp(28px,6vh,72px) clamp(22px,7vw,86px);
  object-fit:contain;object-position:center;
  transform:translateY(calc(var(--detail-progress) * -18px)) scale(calc(1 - var(--detail-progress) * .14));
  filter:drop-shadow(0 32px 27px rgba(28,21,14,.2));
  transition:filter .35s ease;will-change:transform;
}
.detail-scroll-cue{position:absolute;left:50%;bottom:18px;display:flex;align-items:center;gap:9px;margin:0;color:rgba(23,21,18,.48);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;transform:translateX(-50%);opacity:calc(1 - var(--detail-progress) * 2);white-space:nowrap}
.detail-scroll-cue span{width:1px;height:24px;background:linear-gradient(var(--accent),transparent);animation:scrollCue 1.8s ease-in-out infinite}
@keyframes scrollCue{0%,100%{transform:scaleY(.45);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}
.detail-copy{position:relative;background:#fbfaf7;padding:42px 22px 60px}
.detail-copy::before{content:"";position:absolute;left:22px;right:22px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(183,150,93,.45),transparent)}
.detail-designer{color:#92713d}
.detail-copy h2{font-size:clamp(2.3rem,9vw,4.6rem);line-height:.98;letter-spacing:-.045em}
.detail-description{max-width:60ch;font-size:.91rem;line-height:1.85}
.detail-section{padding-top:28px;margin-top:28px}
.dialog-close{backdrop-filter:blur(12px)}

@media(min-width:900px){
  .perfume-dialog{width:min(1220px,calc(100vw - 28px));max-height:calc(100dvh - 28px);border-radius:3px}
  .detail-layout{grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);min-height:780px}
  .detail-media{position:sticky;top:0;height:calc(100dvh - 28px);min-height:720px;align-self:start}
  .detail-copy{min-height:1050px;padding:clamp(82px,8vw,116px) clamp(44px,5vw,76px) 80px}
  .detail-copy::before{left:clamp(44px,5vw,76px);right:clamp(44px,5vw,76px)}
  .detail-scroll-cue{bottom:28px}
}
@media(max-width:520px){
  .catalog-grid{gap:14px 9px}
  .perfume-card{box-shadow:0 10px 26px rgba(31,25,18,.07)}
  .image-stage{aspect-ratio:4/5.05}
  .perfume-image{padding:7% 6% 5%}
  .detail-media{height:62dvh;min-height:430px}
  .detail-media-frame{inset:12px}
  .detail-image{padding:42px 18px 54px}
  .detail-copy{padding:36px 20px 54px}
}
@media(prefers-reduced-motion:reduce){
  .detail-image{transform:none!important}.detail-scroll-cue span{animation:none}
}

/* =========================================================
   PRIVÉ · SPRINT 3 — EXPERIENCIA DEL PERFUME
   Atmósfera neutra premium, sin depender todavía de notas.
   ========================================================= */
.perfume-dialog{
  --detail-progress:0;
  --detail-ease:cubic-bezier(.22,.74,.18,1);
  color:#1c1915;
  background:#0f0e0c;
  overscroll-behavior:contain;
}
.perfume-dialog::backdrop{background:rgba(7,6,5,.86);backdrop-filter:blur(14px) saturate(.85)}
.detail-layout{background:#11100e}
.detail-media{
  isolation:isolate;
  min-height:100dvh;
  background:
    linear-gradient(135deg,rgba(255,255,255,.09),transparent 28% 72%,rgba(255,255,255,.04)),
    radial-gradient(circle at 50% 31%,rgba(244,226,190,.19),transparent 34%),
    radial-gradient(circle at 50% 75%,rgba(195,154,89,.10),transparent 42%),
    linear-gradient(160deg,#1a1814 0%,#0f0e0c 56%,#090806 100%);
}
.detail-atmosphere{position:absolute;inset:-18%;z-index:-3;pointer-events:none;background:radial-gradient(circle at 50% 40%,rgba(230,202,151,.17),transparent 32%),radial-gradient(circle at 20% 16%,rgba(255,255,255,.08),transparent 23%);filter:blur(18px);transform:translateY(calc(var(--detail-progress) * -26px)) scale(calc(1 + var(--detail-progress) * .06));opacity:calc(1 - var(--detail-progress) * .3)}
.detail-media::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 88%)}
.detail-media::before{left:16%;right:16%;bottom:9%;height:8%;z-index:0;background:radial-gradient(ellipse,rgba(0,0,0,.68),rgba(0,0,0,.18) 43%,transparent 72%);filter:blur(18px);transform:scale(calc(1 - var(--detail-progress) * .12));opacity:calc(1 - var(--detail-progress) * .18)}
.detail-media-frame{inset:18px;z-index:1;border:1px solid rgba(224,199,151,.18);box-shadow:inset 0 0 90px rgba(255,255,255,.025),0 0 0 1px rgba(0,0,0,.24);pointer-events:none}
.detail-brand-mark{position:absolute;left:50%;top:9%;z-index:0;color:rgba(235,213,170,.045);font-family:"Playfair Display",serif;font-size:clamp(5rem,18vw,13rem);letter-spacing:.08em;line-height:1;transform:translateX(-50%) translateY(calc(var(--detail-progress) * -36px));white-space:nowrap;user-select:none}
.detail-bottle-stage{position:absolute;inset:5.5rem 2rem 5.5rem;display:grid;place-items:center;z-index:2;transform:translateY(calc(var(--detail-progress) * -16px)) scale(calc(1 - var(--detail-progress) * .12));transform-origin:center 42%;will-change:transform}
.detail-image{position:relative;z-index:2;width:100%;height:100%;padding:0;object-fit:contain;object-position:center;transform:none;filter:drop-shadow(0 48px 38px rgba(0,0,0,.56)) drop-shadow(0 12px 10px rgba(0,0,0,.35));transition:filter .5s var(--detail-ease),opacity .35s ease}
.detail-fallback{z-index:1;color:#d9c49b;background:transparent}
.detail-reflection{position:absolute;left:23%;right:23%;bottom:-4%;height:24%;z-index:1;opacity:calc(.34 - var(--detail-progress) * .22);background:linear-gradient(to bottom,rgba(255,255,255,.13),transparent 68%);filter:blur(10px);transform:perspective(220px) rotateX(72deg);mask-image:linear-gradient(to bottom,black,transparent)}
.detail-stage-identity{position:absolute;left:clamp(24px,5vw,64px);right:clamp(24px,5vw,64px);bottom:96px;z-index:4;display:grid;justify-items:center;gap:8px;text-align:center;pointer-events:none;opacity:calc(1 - var(--detail-progress) * 1.35);transform:translateY(calc(var(--detail-progress) * 12px));text-shadow:0 2px 20px rgba(0,0,0,.72)}
.detail-stage-identity strong{max-width:28ch;color:#f5ead8;font-family:"Playfair Display",serif;font-size:clamp(1.2rem,3vw,2.15rem);font-weight:500;line-height:1.05;letter-spacing:.015em;text-wrap:balance}
.detail-stage-identity span{color:rgba(222,194,143,.88);font-size:.62rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.detail-stage-caption{position:absolute;left:38px;right:38px;bottom:34px;z-index:3;display:flex;justify-content:space-between;color:rgba(235,220,191,.5);font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;opacity:calc(1 - var(--detail-progress) * 1.8)}
.detail-scroll-cue{z-index:4;bottom:64px;color:rgba(235,220,191,.56)}
.detail-scroll-cue span{background:linear-gradient(#c6a66b,transparent)}
.detail-copy{position:relative;min-height:1100px;padding:0 18px 64px;background:linear-gradient(180deg,#efe9df 0%,#f7f4ee 18%,#fbfaf7 100%)}
.detail-copy::before{display:none}
.detail-intro{min-height:52dvh;display:flex;flex-direction:column;justify-content:flex-end;padding:80px 10px 42px;opacity:calc(.25 + var(--detail-progress) * .75);transform:translateY(calc((1 - var(--detail-progress)) * 28px));transition:opacity .15s linear}
.detail-intro-kicker{margin:0;color:#9a7843;font-size:.6rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase}
.detail-intro-text{max-width:17ch;margin:16px 0 0;font-family:"Playfair Display",serif;font-size:clamp(2rem,8vw,4.7rem);font-weight:500;line-height:1.03;letter-spacing:-.04em;color:#201d18}
.detail-glass-panel{position:relative;padding:34px 22px 44px;border:1px solid rgba(255,255,255,.72);background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(255,255,255,.48));box-shadow:0 30px 80px rgba(50,39,24,.12),inset 0 1px rgba(255,255,255,.84);backdrop-filter:blur(22px);transform:translateY(calc((1 - var(--detail-progress)) * 18px));opacity:calc(.25 + var(--detail-progress) * .75)}
.detail-glass-panel::before{content:"";position:absolute;top:0;left:22px;width:72px;height:1px;background:#b8965b}
.detail-eyebrow{color:#997641}
.detail-designer{margin-top:14px;color:#8b6a37}
.detail-copy h2{max-width:10ch;margin-top:12px;font-size:clamp(3rem,11vw,6.5rem);line-height:.9;letter-spacing:-.055em;text-wrap:balance}
.detail-code{margin-top:22px}
.detail-description{margin-top:30px;color:#5f584f;font-size:1rem;line-height:1.9}
.pending-data{border-color:rgba(153,118,65,.2);background:rgba(255,255,255,.44)}
.related-section{margin:56px 4px 0;padding:34px 4px 0;border-top:1px solid rgba(101,82,54,.15)}
.dialog-close{top:max(18px,env(safe-area-inset-top));right:18px;z-index:20;width:46px;height:46px;color:#eee3cf;background:rgba(19,17,14,.54);border:1px solid rgba(229,208,167,.22);box-shadow:0 10px 30px rgba(0,0,0,.24)}
.dialog-close:hover{background:rgba(19,17,14,.78);border-color:rgba(229,208,167,.38)}

@media(min-width:900px){
  .perfume-dialog{width:min(1380px,calc(100vw - 24px));height:calc(100dvh - 24px);max-height:none;border-radius:8px;border:1px solid rgba(211,183,129,.18)}
  .detail-layout{grid-template-columns:minmax(0,1.18fr) minmax(430px,.82fr);min-height:1500px}
  .detail-media{position:sticky;top:0;height:calc(100dvh - 24px);min-height:700px}
  .detail-bottle-stage{inset:6.5rem clamp(3rem,7vw,8rem) 5.5rem}
  .detail-copy{min-height:1500px;padding:0 clamp(32px,4.2vw,70px) 90px}
  .detail-intro{min-height:72dvh;padding:110px 10px 64px}
  .detail-intro-text{font-size:clamp(2.7rem,4.8vw,5.6rem)}
  .detail-glass-panel{padding:clamp(45px,5vw,74px);border-radius:2px}
  .detail-glass-panel::before{left:clamp(45px,5vw,74px);width:92px}
  .detail-stage-identity{bottom:104px}
  .detail-stage-caption{left:52px;right:52px}
}
@media(max-width:899px){
  .detail-media{height:78dvh;min-height:560px}
  .detail-copy{margin-top:-1px}
  .detail-intro{min-height:42dvh}
}
@media(max-width:520px){
  .detail-media{height:74dvh;min-height:520px}
  .detail-media-frame{inset:10px}
  .detail-bottle-stage{inset:5.4rem 1.2rem 5.5rem}
  .detail-brand-mark{top:12%;font-size:22vw}
  .detail-stage-identity{left:20px;right:20px;bottom:88px;gap:6px}
  .detail-stage-identity strong{font-size:clamp(1.08rem,5.8vw,1.55rem)}
  .detail-stage-identity span{font-size:.54rem}
  .detail-stage-caption{left:22px;right:22px;bottom:22px;font-size:.46rem}
  .detail-scroll-cue{bottom:50px}
  .detail-copy{padding:0 12px 46px}
  .detail-intro{padding:56px 8px 32px}
  .detail-intro-text{font-size:clamp(2rem,11vw,3.1rem)}
  .detail-glass-panel{padding:32px 18px 38px}
  .detail-copy h2{font-size:clamp(2.65rem,14vw,4.2rem)}
}
@media(prefers-reduced-motion:reduce){
  .detail-bottle-stage,.detail-atmosphere,.detail-brand-mark,.detail-stage-identity,.detail-intro,.detail-glass-panel{transform:none!important}
}


/* Sprint 3.2 — Identidad siempre legible y guía de scroll */
.detail-stage-identity{
  top:clamp(34px,5.5vh,64px)!important;
  bottom:auto!important;
  min-height:74px;
  align-content:start;
  padding:0 clamp(54px,8vw,96px);
  gap:7px;
  opacity:calc(1 - var(--detail-progress) * 1.55)!important;
  transform:translateY(calc(var(--detail-progress) * -12px))!important;
  text-shadow:0 2px 18px rgba(0,0,0,.85),0 0 34px rgba(0,0,0,.62);
}
.detail-stage-identity strong{
  max-width:30ch;
  color:#fff8ea;
  font-size:clamp(1.25rem,2.7vw,2.05rem);
  line-height:1.02;
}
.detail-stage-identity span{
  color:#e4c992;
  font-size:.64rem;
  letter-spacing:.18em;
}
.detail-brand-mark{
  top:50%!important;
  z-index:1!important;
  color:rgba(235,213,170,.055)!important;
  font-size:clamp(7rem,20vw,15rem)!important;
  transform:translate(-50%,-50%) translateY(calc(var(--detail-progress) * -20px))!important;
}
.detail-bottle-stage{
  inset:clamp(8.4rem,18vh,11.5rem) 2rem clamp(6.5rem,11vh,8rem)!important;
  z-index:2;
}
.detail-stage-caption{
  left:auto!important;
  right:clamp(24px,4vw,52px)!important;
  bottom:clamp(22px,3.2vh,34px)!important;
  width:auto;
  justify-content:flex-end!important;
  color:rgba(235,220,191,.62)!important;
}
.detail-scroll-cue{
  left:50%!important;
  bottom:clamp(28px,4.5vh,48px)!important;
  z-index:5!important;
  display:grid!important;
  justify-items:center;
  gap:8px!important;
  color:rgba(245,232,207,.78)!important;
  opacity:calc(1 - var(--detail-progress) * 2.4)!important;
  transform:translateX(-50%)!important;
  transition:opacity .35s ease,transform .5s cubic-bezier(.22,.74,.18,1)!important;
  text-shadow:0 2px 12px rgba(0,0,0,.72);
}
.detail-scroll-cue__label{width:auto!important;height:auto!important;background:none!important;animation:none!important;font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
.detail-scroll-cue__arrows{display:grid;gap:2px;width:18px!important;height:19px!important;background:none!important;animation:none!important}
.detail-scroll-cue__arrows i{display:block;width:10px;height:10px;border-right:1px solid rgba(214,181,120,.9);border-bottom:1px solid rgba(214,181,120,.9);transform:rotate(45deg);margin:-3px auto 0;opacity:.55}
.detail-cue-nudge .detail-scroll-cue{animation:detailCueNudge 1.8s cubic-bezier(.22,.74,.18,1) 2}
.detail-cue-nudge .detail-scroll-cue__arrows i{animation:detailArrowPulse 1.2s ease-in-out infinite}
.detail-cue-nudge .detail-scroll-cue__arrows i:nth-child(2){animation-delay:.14s}
.detail-cue-dismissed .detail-scroll-cue{opacity:0!important;pointer-events:none;transform:translate(-50%,10px)!important}
@keyframes detailCueNudge{0%,100%{transform:translate(-50%,0)}45%{transform:translate(-50%,8px)}}
@keyframes detailArrowPulse{0%,100%{opacity:.25;transform:translateY(0) rotate(45deg)}50%{opacity:1;transform:translateY(4px) rotate(45deg)}}

@media(min-width:900px){
  .detail-stage-identity{top:clamp(42px,6vh,72px)!important}
  .detail-bottle-stage{inset:clamp(9rem,19vh,12rem) clamp(3rem,7vw,8rem) clamp(6.8rem,12vh,8.5rem)!important}
}
@media(max-width:899px){
  .detail-stage-identity{top:34px!important;padding:0 52px;min-height:68px}
  .detail-bottle-stage{inset:8.2rem 1.25rem 6.8rem!important}
  .detail-brand-mark{font-size:25vw!important}
  .detail-stage-caption{right:22px!important;bottom:18px!important}
  .detail-scroll-cue{bottom:42px!important}
}
@media(max-width:520px){
  .detail-stage-identity{top:30px!important;left:12px!important;right:12px!important;padding:0 46px;min-height:64px}
  .detail-stage-identity strong{font-size:clamp(1.05rem,5.5vw,1.45rem)}
  .detail-stage-identity span{font-size:.52rem}
  .detail-bottle-stage{inset:7.7rem .9rem 6.4rem!important}
  .detail-stage-caption{font-size:.45rem!important}
  .detail-scroll-cue{bottom:38px!important}
}
@media(prefers-reduced-motion:reduce){
  .detail-cue-nudge .detail-scroll-cue,.detail-cue-nudge .detail-scroll-cue__arrows i{animation:none!important}
}

/* =========================================================
   Sprint 3.3 — Corrección de composición y carga estable
   ========================================================= */
.perfume-dialog{
  --identity-zone-top:clamp(72px,10vh,108px);
  --identity-zone-bottom:clamp(136px,18vh,184px);
  --stage-floor:clamp(82px,10vh,112px);
}

/* El nombre baja y queda conectado visualmente con la botella,
   conservando la zona segura del botón de cierre. */
.detail-stage-identity{
  top:var(--identity-zone-top)!important;
  left:clamp(28px,5vw,68px)!important;
  right:clamp(72px,8vw,112px)!important;
  min-height:58px!important;
  padding:0!important;
  align-content:end!important;
  gap:6px!important;
}
.detail-stage-identity strong{
  max-width:min(32ch,100%)!important;
  font-size:clamp(1.38rem,2.9vw,2.25rem)!important;
  line-height:1.01!important;
}
.detail-stage-identity span{
  font-size:.68rem!important;
  letter-spacing:.19em!important;
}

/* Zona rígida de la botella: nunca invade el texto ni se pierde por abajo. */
.detail-bottle-stage{
  top:var(--identity-zone-bottom)!important;
  right:clamp(26px,5vw,76px)!important;
  bottom:var(--stage-floor)!important;
  left:clamp(26px,5vw,76px)!important;
  align-items:end!important;
}
.detail-image{
  max-width:100%!important;
  max-height:100%!important;
  object-position:center bottom!important;
  transform:scale(1.035)!important;
  transform-origin:center bottom!important;
}
.detail-image.is-loading{opacity:0!important}

/* El halo ahora pertenece al producto y acompaña su silueta. */
.detail-atmosphere{
  inset:auto!important;
  left:50%!important;
  top:56%!important;
  width:min(68%,620px)!important;
  aspect-ratio:1/1.12;
  border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(234,205,151,.23) 0%,rgba(191,143,77,.11) 38%,transparent 72%)!important;
  filter:blur(24px)!important;
  opacity:calc(.88 - var(--detail-progress) * .45)!important;
  transform:translate(-50%,-50%) scale(calc(1 + var(--detail-progress) * .05))!important;
}
.detail-brand-mark{color:rgba(235,213,170,.045)!important}

/* Botón de cierre alineado con el lenguaje rectilíneo de la interfaz. */
.dialog-close{
  width:42px!important;
  height:42px!important;
  border-radius:5px!important;
  font-size:1.18rem!important;
  line-height:1!important;
  transition:background .25s ease,border-color .25s ease,transform .25s ease!important;
}
.dialog-close:hover{transform:translateY(-1px)}

@media(min-width:900px){
  .perfume-dialog{
    --identity-zone-top:clamp(88px,12vh,126px);
    --identity-zone-bottom:clamp(166px,22vh,218px);
    --stage-floor:clamp(88px,11vh,122px);
  }
}
@media(max-width:899px){
  .perfume-dialog{
    --identity-zone-top:68px;
    --identity-zone-bottom:136px;
    --stage-floor:92px;
  }
  .detail-stage-identity{
    left:22px!important;
    right:68px!important;
  }
  .detail-stage-identity strong{font-size:clamp(1.2rem,5.4vw,1.7rem)!important}
  .detail-stage-identity span{font-size:.58rem!important}
  .detail-bottle-stage{left:18px!important;right:18px!important}
}
@media(max-width:520px){
  .perfume-dialog{
    --identity-zone-top:62px;
    --identity-zone-bottom:128px;
    --stage-floor:86px;
  }
  .detail-stage-identity{
    left:16px!important;
    right:62px!important;
    min-height:54px!important;
  }
  .detail-stage-identity strong{font-size:clamp(1.12rem,5.6vw,1.5rem)!important}
  .detail-stage-identity span{font-size:.54rem!important}
  .dialog-close{top:max(14px,env(safe-area-inset-top))!important;right:14px!important;width:38px!important;height:38px!important}
}
@media(prefers-reduced-motion:reduce){
  .detail-image{transform:scale(1.035)!important}
}

/* =========================================================
   Sprint 3.4 — Motor de composición universal
   Un único bloque centrado: nombre + clave + botella.
   ========================================================= */
.perfume-dialog{
  --detail-accent:#d7b675;
  --detail-ink:#fff8ea;
  --detail-muted:#e5cb98;
  --detail-bg-1:#1a1814;
  --detail-bg-2:#0f0e0c;
  --detail-bg-3:#090806;
  --detail-halo:rgba(234,205,151,.25);
}
.perfume-dialog.detail-gender-dama{
  --detail-accent:#b88d83;
  --detail-ink:#342823;
  --detail-muted:#745b52;
  --detail-bg-1:#f2e7e1;
  --detail-bg-2:#dcc9c1;
  --detail-bg-3:#bda59c;
  --detail-halo:rgba(255,249,240,.78);
}
.perfume-dialog.detail-gender-unisex{
  --detail-accent:#c3b89f;
  --detail-ink:#f6f1e7;
  --detail-muted:#d8ceb9;
  --detail-bg-1:#302f2b;
  --detail-bg-2:#1b1b19;
  --detail-bg-3:#10100f;
  --detail-halo:rgba(226,219,199,.25);
}
.detail-media{
  display:block!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.08),transparent 28% 72%,rgba(255,255,255,.035)),
    linear-gradient(160deg,var(--detail-bg-1) 0%,var(--detail-bg-2) 58%,var(--detail-bg-3) 100%)!important;
}
.detail-media::before{bottom:7%!important;left:23%!important;right:23%!important}
.detail-product-composition{
  position:absolute;
  inset:clamp(58px,7vh,82px) clamp(28px,5vw,76px) clamp(88px,11vh,118px);
  z-index:3;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  align-content:center;
  justify-items:center;
  gap:clamp(8px,1.5vh,16px);
  min-width:0;
  transform:translateY(calc(var(--detail-progress) * -15px)) scale(calc(1 - var(--detail-progress) * .11));
  transform-origin:center 48%;
}
.detail-stage-identity{
  position:relative!important;
  inset:auto!important;
  width:min(100%,760px)!important;
  min-height:0!important;
  padding:0 clamp(48px,7vw,88px)!important;
  display:grid!important;
  align-content:center!important;
  justify-items:center!important;
  gap:6px!important;
  text-align:center!important;
  transform:none!important;
  opacity:calc(1 - var(--detail-progress) * 1.55)!important;
  text-shadow:0 2px 18px rgba(0,0,0,.55);
}
.detail-stage-identity strong{
  width:100%;
  max-width:100%!important;
  color:var(--detail-ink)!important;
  font-size:clamp(1.25rem,2.65vw,2.12rem)!important;
  line-height:1.04!important;
  letter-spacing:.012em!important;
  overflow-wrap:anywhere;
  text-wrap:balance;
}
.detail-stage-identity span{
  color:var(--detail-muted)!important;
  font-size:clamp(.56rem,.7vw,.68rem)!important;
  letter-spacing:.18em!important;
}
.detail-gender-dama .detail-stage-identity{text-shadow:0 1px 12px rgba(255,255,255,.42)}
.detail-bottle-stage{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:100%!important;
  min-height:0;
  overflow:hidden;
  display:block!important;
  z-index:2;
  transform:none!important;
}
.detail-image{
  position:absolute!important;
  z-index:3!important;
  max-width:none!important;
  max-height:none!important;
  width:auto;
  height:auto;
  padding:0!important;
  object-fit:fill!important;
  object-position:initial!important;
  transform:none!important;
  transform-origin:center!important;
}
.detail-atmosphere{
  position:absolute!important;
  inset:auto!important;
  left:50%!important;
  top:50%!important;
  width:min(72%,620px)!important;
  height:min(78%,680px)!important;
  aspect-ratio:auto!important;
  z-index:1!important;
  border-radius:50%;
  background:radial-gradient(ellipse at center,var(--detail-halo) 0%,color-mix(in srgb,var(--detail-halo) 42%,transparent) 38%,transparent 72%)!important;
  filter:blur(25px)!important;
  opacity:calc(.9 - var(--detail-progress) * .45)!important;
  transform:translate(-50%,-50%)!important;
}
.detail-brand-mark{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  z-index:2!important;
  color:color-mix(in srgb,var(--detail-accent) 15%,transparent)!important;
  font-size:clamp(7rem,20vw,15rem)!important;
  transform:translate(-50%,-50%)!important;
  pointer-events:none;
}
.detail-reflection{z-index:2!important}
.detail-stage-caption{z-index:5!important}
.detail-scroll-cue{z-index:6!important}
.dialog-close{z-index:30!important}
.detail-gender-dama .detail-media-frame{border-color:rgba(91,63,55,.18)!important;box-shadow:inset 0 0 90px rgba(255,255,255,.12),0 0 0 1px rgba(76,48,42,.1)!important}
.detail-gender-dama .dialog-close{color:#43332d!important;background:rgba(255,250,245,.62)!important;border-color:rgba(73,48,41,.2)!important}
.detail-gender-dama .detail-stage-caption,.detail-gender-dama .detail-scroll-cue{color:rgba(62,44,39,.62)!important}
.detail-gender-dama .detail-scroll-cue__arrows i{border-color:rgba(93,62,54,.75)!important}

@media(min-width:900px){
  .detail-product-composition{inset:clamp(66px,8vh,96px) clamp(42px,6vw,92px) clamp(94px,12vh,132px)}
}
@media(max-width:899px){
  .detail-product-composition{inset:58px 18px 88px;gap:8px}
  .detail-stage-identity{padding:0 48px!important}
}
@media(max-width:520px){
  .detail-product-composition{inset:54px 12px 80px;gap:6px}
  .detail-stage-identity{padding:0 42px!important}
  .detail-stage-identity strong{font-size:clamp(1.08rem,5.4vw,1.48rem)!important}
  .detail-stage-identity span{font-size:.53rem!important}
}
@media(prefers-reduced-motion:reduce){
  .detail-product-composition{transform:none!important}
}

/* =========================================================
   Sprint 3.5 — Atmósferas PRIVÉ por categoría
   Misma composición, tres identidades visuales refinadas.
   ========================================================= */
.perfume-dialog{
  --detail-accent:#b9c6dc;
  --detail-ink:#f7f9ff;
  --detail-muted:#aebbd0;
  --detail-bg-1:#101a2d;
  --detail-bg-2:#080f1c;
  --detail-bg-3:#03070d;
  --detail-halo:rgba(91,137,205,.34);
  --detail-glow-secondary:rgba(42,78,132,.18);
  --detail-frame:rgba(157,181,220,.23);
  --detail-grid:rgba(173,194,228,.032);
  --detail-mark:rgba(157,184,225,.075);
  --detail-close-bg:rgba(4,10,19,.54);
  --detail-close-border:rgba(165,187,220,.26);
  --detail-close-ink:#e8eef9;
}
.perfume-dialog.detail-gender-caballero{
  --detail-accent:#b9c6dc;
  --detail-ink:#f7f9ff;
  --detail-muted:#aebbd0;
  --detail-bg-1:#101a2d;
  --detail-bg-2:#080f1c;
  --detail-bg-3:#03070d;
  --detail-halo:rgba(91,137,205,.34);
  --detail-glow-secondary:rgba(42,78,132,.18);
  --detail-frame:rgba(157,181,220,.23);
  --detail-grid:rgba(173,194,228,.032);
  --detail-mark:rgba(157,184,225,.075);
  --detail-close-bg:rgba(4,10,19,.54);
  --detail-close-border:rgba(165,187,220,.26);
  --detail-close-ink:#e8eef9;
}
.perfume-dialog.detail-gender-dama{
  --detail-accent:#d8b98a;
  --detail-ink:#fff8ed;
  --detail-muted:#d9c3ad;
  --detail-bg-1:#55423f;
  --detail-bg-2:#332827;
  --detail-bg-3:#1d1718;
  --detail-halo:rgba(236,194,154,.34);
  --detail-glow-secondary:rgba(183,129,119,.18);
  --detail-frame:rgba(242,211,178,.23);
  --detail-grid:rgba(255,232,210,.03);
  --detail-mark:rgba(239,207,169,.07);
  --detail-close-bg:rgba(39,28,29,.52);
  --detail-close-border:rgba(232,204,176,.26);
  --detail-close-ink:#fff4e7;
}
.perfume-dialog.detail-gender-unisex{
  --detail-accent:#c8c6be;
  --detail-ink:#f6f5f0;
  --detail-muted:#c5c1b7;
  --detail-bg-1:#343638;
  --detail-bg-2:#1d1f21;
  --detail-bg-3:#0d0f10;
  --detail-halo:rgba(206,211,214,.25);
  --detail-glow-secondary:rgba(158,164,163,.13);
  --detail-frame:rgba(221,222,217,.18);
  --detail-grid:rgba(225,226,222,.027);
  --detail-mark:rgba(220,220,214,.06);
  --detail-close-bg:rgba(15,17,18,.54);
  --detail-close-border:rgba(210,211,206,.21);
  --detail-close-ink:#f1f1ed;
}
.detail-media{
  isolation:isolate;
  transition:background .72s var(--detail-ease),color .52s ease;
  background:
    radial-gradient(circle at 19% 14%,var(--detail-glow-secondary),transparent 30%),
    radial-gradient(circle at 83% 76%,color-mix(in srgb,var(--detail-accent) 8%,transparent),transparent 32%),
    linear-gradient(135deg,rgba(255,255,255,.045),transparent 28% 72%,rgba(255,255,255,.018)),
    linear-gradient(160deg,var(--detail-bg-1) 0%,var(--detail-bg-2) 58%,var(--detail-bg-3) 100%)!important;
}
.detail-media::after{
  background:
    linear-gradient(90deg,var(--detail-grid) 1px,transparent 1px),
    linear-gradient(var(--detail-grid) 1px,transparent 1px)!important;
  background-size:42px 42px!important;
  opacity:.8;
  animation:detailAtmosphereDrift 18s ease-in-out infinite alternate;
}
.detail-media-frame{
  border-color:var(--detail-frame)!important;
  box-shadow:inset 0 0 92px rgba(255,255,255,.025),0 0 0 1px rgba(0,0,0,.25)!important;
  transition:border-color .5s ease,box-shadow .5s ease;
}
.detail-atmosphere{
  background:
    radial-gradient(ellipse at center,var(--detail-halo) 0%,color-mix(in srgb,var(--detail-halo) 45%,transparent) 38%,transparent 72%)!important;
  filter:blur(28px)!important;
  animation:detailHaloBreath 7s ease-in-out infinite;
}
.detail-brand-mark{
  color:var(--detail-mark)!important;
  text-shadow:0 0 42px color-mix(in srgb,var(--detail-accent) 10%,transparent);
  transition:color .55s ease;
}
.detail-stage-identity{
  text-shadow:0 2px 20px rgba(0,0,0,.48)!important;
}
.detail-stage-identity strong{color:var(--detail-ink)!important}
.detail-stage-identity span{color:var(--detail-muted)!important}
.detail-stage-caption,.detail-scroll-cue{color:color-mix(in srgb,var(--detail-muted) 72%,transparent)!important}
.detail-scroll-cue__arrows i{border-color:color-mix(in srgb,var(--detail-accent) 82%,transparent)!important}
.dialog-close{
  color:var(--detail-close-ink)!important;
  background:var(--detail-close-bg)!important;
  border-color:var(--detail-close-border)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.045);
  backdrop-filter:blur(12px);
  transition:background .28s ease,border-color .28s ease,color .28s ease,transform .28s ease;
}
.dialog-close:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--detail-close-bg) 78%,white 6%)!important}
.detail-gender-dama .detail-stage-identity{text-shadow:0 2px 18px rgba(20,10,10,.42)!important}
.detail-gender-dama .detail-media-frame{border-color:var(--detail-frame)!important;box-shadow:inset 0 0 92px rgba(255,236,218,.035),0 0 0 1px rgba(0,0,0,.2)!important}
.detail-gender-dama .dialog-close{color:var(--detail-close-ink)!important;background:var(--detail-close-bg)!important;border-color:var(--detail-close-border)!important}

@keyframes detailHaloBreath{
  0%,100%{opacity:.77;filter:blur(28px)}
  50%{opacity:.96;filter:blur(33px)}
}
@keyframes detailAtmosphereDrift{
  from{transform:translate3d(-5px,-3px,0);opacity:.62}
  to{transform:translate3d(5px,4px,0);opacity:.88}
}
@media(prefers-reduced-motion:reduce){
  .detail-atmosphere,.detail-media::after{animation:none!important}
}

/* =========================================================
   SPRINT 3.7 — CRECIMIENTO REAL DE LA BÚSQUEDA
   ========================================================= */
.search-area{
  width:min(760px,100%);
  margin-inline:auto;
}
.search-box{
  box-sizing:border-box;
  width:min(430px,100%);
  min-height:54px;
  margin-inline:auto;
  padding:0 14px 0 19px;
  display:flex;
  align-items:center;
  gap:11px;
  border:1px solid transparent;
  border-radius:18px;
  outline:none;
  background:rgba(247,245,240,.96);
  box-shadow:0 16px 48px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.72);
  transition:
    width .42s cubic-bezier(.2,.78,.2,1),
    min-height .36s cubic-bezier(.2,.78,.2,1),
    padding .36s cubic-bezier(.2,.78,.2,1),
    gap .36s cubic-bezier(.2,.78,.2,1),
    border-radius .36s ease,
    box-shadow .34s ease,
    background .34s ease;
  will-change:width,min-height,padding;
}
.search-box:focus-within,
body.search-has-query .search-box{
  width:min(720px,100%);
  min-height:66px;
  padding:0 18px 0 23px;
  gap:14px;
  border-color:transparent;
  border-radius:20px;
  background:rgba(250,248,244,.99);
  box-shadow:0 28px 84px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.86);
}
.search-box:focus,
.search-box:focus-visible,
.search-box:focus-within{outline:none}
.search-box input{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  appearance:none;
  -webkit-appearance:none;
  color:var(--ink);
  background:transparent;
  font-size:16px;
  line-height:1.25;
  letter-spacing:0;
  transition:font-size .34s ease,letter-spacing .34s ease;
}
.search-box input:focus,
.search-box input:focus-visible{outline:none;box-shadow:none}
.search-box input::-webkit-search-decoration,
.search-box input::-webkit-search-cancel-button,
.search-box input::-webkit-search-results-button,
.search-box input::-webkit-search-results-decoration{display:none}
.search-box:focus-within input,
body.search-has-query .search-box input{
  font-size:18px;
  letter-spacing:.01em;
}
.search-svg{
  width:20px;
  height:20px;
  flex:0 0 auto;
  transition:width .34s ease,height .34s ease,stroke .34s ease;
}
.search-box:focus-within .search-svg,
body.search-has-query .search-svg{
  width:23px;
  height:23px;
  stroke:#4e5360;
}
.search-box button{
  width:42px;
  height:42px;
  flex:0 0 auto;
  border-radius:12px;
  outline:none;
  transition:opacity .25s ease,background .25s ease,color .25s ease;
}
.search-box button:focus,
.search-box button:focus-visible{outline:none;box-shadow:none}
.search-box button.visible:hover{
  color:#272a31;
  background:rgba(23,21,18,.065);
}
@media(max-width:700px){
  .search-area{width:100%}
  .search-box{
    width:min(92%,430px);
    min-height:56px;
  }
  .search-box:focus-within,
  body.search-has-query .search-box{
    width:100%;
    min-height:64px;
    padding-inline:18px;
    border-radius:16px;
  }
  .search-box input{font-size:16px}
  .search-box:focus-within input,
  body.search-has-query .search-box input{font-size:17px}
}
@media(prefers-reduced-motion:reduce){
  .search-box,.search-box input,.search-svg{transition:none!important}
}

/* =========================================================
   SPRINT 3.8 — ESTABILIDAD DE RUTAS, BÚSQUEDA Y FILTROS
   ========================================================= */
.search-submit{
  opacity:1!important;
  pointer-events:auto!important;
  display:grid!important;
  place-items:center;
  color:#464b55!important;
  background:rgba(23,21,18,.055)!important;
  border:1px solid rgba(23,21,18,.08)!important;
}
.search-submit svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round}
.search-submit:hover{background:rgba(23,21,18,.1)!important;color:#171512!important}
.search-clear{order:3}
.search-clear:not(.visible){display:none}

.toolbar{
  grid-template-columns:minmax(220px,320px) minmax(220px,320px) 1fr!important;
  position:relative;
  align-items:end!important;
}
#resetFilters{
  justify-self:end;
  align-self:center;
  min-height:38px;
  padding:8px 14px!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(23,21,18,.16)!important;
  border-radius:10px;
  background:rgba(255,255,255,.52)!important;
  color:#4f4941!important;
  font-size:.68rem!important;
  font-weight:600;
  letter-spacing:.055em;
  cursor:pointer;
  transition:background .25s ease,border-color .25s ease,transform .25s ease,color .25s ease;
}
#resetFilters:hover{background:#fff!important;border-color:rgba(183,150,93,.5)!important;color:#171512!important;transform:translateY(-1px)}

.detail-switching .detail-image{opacity:0!important}
.detail-switching .detail-fallback{opacity:1}

@media(max-width:760px){
  .toolbar{grid-template-columns:1fr!important}
  #resetFilters{justify-self:end;margin-top:2px}
}


/* Sprint 3.9 — Apertura canónica y reinicio instantáneo de ficha */
.perfume-dialog.detail-resetting-scroll{
  scroll-behavior:auto!important;
}
.perfume-dialog.detail-resetting-scroll .detail-product-composition{
  transition:none!important;
}


/* =========================================================
   SPRINT 4.0 — HOME CENTRADO Y NUEVA IDENTIDAD DAMA
   ========================================================= */

/* Home: una sola composición centrada, con mejor uso vertical. */
.hero::after{
  background:linear-gradient(180deg,rgba(4,6,9,.28) 0%,rgba(4,6,9,.58) 48%,rgba(4,6,9,.88) 100%)!important;
}
.hero-inner{
  width:min(980px,100%)!important;
  min-height:100svh;
  padding:clamp(54px,8vh,86px) 0 clamp(46px,7vh,72px)!important;
  justify-content:center!important;
  align-items:center!important;
  text-align:center;
}
.hero-brand-block,
.hero-message,
.search-area,
.entry-paths{
  margin-inline:auto!important;
}
.hero-brand-block{width:100%}
.hero-overline{
  margin-bottom:clamp(10px,1.5vh,15px)!important;
  text-align:center;
}
.hero-logo{
  margin-inline:auto!important;
  font-size:clamp(4.35rem,14vw,9.4rem)!important;
  line-height:.82!important;
}
.hero-slogan{
  margin-top:clamp(17px,2.5vh,24px)!important;
  text-align:center;
}
.hero-message{
  margin-top:clamp(22px,3.4vh,32px)!important;
  padding:0!important;
  border-left:0!important;
}
.hero-message::before{
  content:"";
  display:block;
  width:44px;
  height:1px;
  margin:0 auto 15px;
  background:linear-gradient(90deg,transparent,var(--prive-gold),transparent);
}
.hero-message p{
  max-width:520px!important;
  margin-inline:auto!important;
  text-align:center;
}
.search-area{
  margin-top:clamp(27px,4vh,38px)!important;
}
.category-filters{
  justify-content:center;
  margin-inline:auto;
}
.summary{
  margin:10px 0 0!important;
  text-align:center;
}
.entry-paths{
  width:min(760px,100%)!important;
  margin-top:20px!important;
}
.entry-arrow--advisor{
  color:var(--prive-gold-light)!important;
  font-size:1.18rem!important;
  text-shadow:0 0 16px rgba(216,199,159,.44);
}

/* Atmósfera equilibrada alrededor del eje central. */
.hero-orb--one{
  width:min(78vw,920px)!important;
  right:50%!important;
  top:-42%!important;
  transform:translateX(50%);
  background:radial-gradient(circle at 50% 48%,rgba(78,103,135,.54),rgba(10,16,25,0) 69%)!important;
}
.hero-orb--two{
  width:min(60vw,680px)!important;
  right:50%!important;
  bottom:-47%!important;
  transform:translateX(50%);
  background:radial-gradient(circle,rgba(189,166,120,.2),transparent 70%)!important;
}
.hero-glass{
  right:50%!important;
  top:47%!important;
  width:clamp(260px,38vw,520px)!important;
  height:clamp(330px,62vh,660px)!important;
  opacity:.54;
  transform:translate(50%,-50%) rotate(9deg)!important;
}
.hero-flare{
  right:50%!important;
  top:15%!important;
  height:62%!important;
  opacity:.6;
  transform:translateX(50%) rotate(9deg)!important;
}

/* Dama: vino/borgoña profundo, elegante y luminoso. */
.perfume-dialog.detail-gender-dama{
  --detail-accent:#d8a4ad;
  --detail-ink:#fff7f8;
  --detail-muted:#d7b3ba;
  --detail-bg-1:#5a1729;
  --detail-bg-2:#2d0d18;
  --detail-bg-3:#10070b;
  --detail-halo:rgba(190,62,91,.38);
  --detail-glow-secondary:rgba(129,27,53,.25);
  --detail-frame:rgba(226,145,162,.27);
  --detail-grid:rgba(255,203,213,.035);
  --detail-mark:rgba(222,132,151,.085);
  --detail-close-bg:rgba(31,7,15,.58);
  --detail-close-border:rgba(226,145,162,.3);
  --detail-close-ink:#fff1f4;
}
.detail-gender-dama .detail-media{
  background:
    radial-gradient(circle at 18% 14%,rgba(156,39,68,.28),transparent 31%),
    radial-gradient(circle at 82% 78%,rgba(226,134,154,.1),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.045),transparent 28% 72%,rgba(255,255,255,.015)),
    linear-gradient(158deg,#64192f 0%,#32101d 55%,#10070b 100%)!important;
}
.detail-gender-dama .detail-stage-identity{
  text-shadow:0 2px 20px rgba(15,2,7,.62)!important;
}
.detail-gender-dama .detail-media-frame{
  border-color:var(--detail-frame)!important;
  box-shadow:inset 0 0 96px rgba(235,154,172,.035),0 0 0 1px rgba(0,0,0,.24)!important;
}

@media(max-width:700px){
  .hero-inner{
    min-height:100svh;
    padding:clamp(42px,7vh,66px) 0 clamp(38px,6vh,56px)!important;
    justify-content:center!important;
  }
  .hero-logo{font-size:clamp(4rem,23vw,6.7rem)!important}
  .hero-message{margin-top:22px!important}
  .hero-message p{font-size:.7rem!important;line-height:1.55!important}
  .category-filters{
    justify-content:flex-start;
    width:max-content;
    max-width:100%;
    padding-inline:4px;
  }
  .entry-paths{width:min(520px,100%)!important}
  .hero-glass{width:72vw!important;height:48vh!important;top:38%!important;opacity:.42}
  .hero-flare{top:12%!important;height:45%!important;opacity:.42}
}

@media(max-height:720px) and (min-width:701px){
  .hero-inner{padding:44px 0 38px!important}
  .hero-logo{font-size:clamp(4rem,12vw,7.3rem)!important}
  .hero-slogan{margin-top:16px!important}
  .hero-message{margin-top:20px!important}
  .search-area{margin-top:24px!important}
}

/* =========================================================
   SPRINT 4.1 — LEGIBILIDAD EN FICHAS DAMA
   Refuerza los indicadores inferiores sin alterar la paleta.
   ========================================================= */
.detail-gender-dama .detail-stage-caption{
  color:rgba(255,236,240,.88)!important;
  text-shadow:
    0 2px 14px rgba(13,1,5,.8),
    0 0 16px rgba(211,105,129,.2);
}
.detail-gender-dama .detail-scroll-cue{
  color:rgba(255,244,246,.94)!important;
  text-shadow:
    0 2px 14px rgba(13,1,5,.84),
    0 0 18px rgba(211,105,129,.24);
}
.detail-gender-dama .detail-scroll-cue__label{
  opacity:1!important;
}
.detail-gender-dama .detail-scroll-cue__arrows{
  filter:drop-shadow(0 2px 7px rgba(13,1,5,.72));
}
.detail-gender-dama .detail-scroll-cue__arrows i{
  border-color:rgba(246,178,192,.96)!important;
  opacity:.86;
}

/* Sprint 4.5 — guardia de memoria móvil para Safari y Android */
.catalog-load-sentinel{display:none!important}
@media (hover:none) and (pointer:coarse){
  /* content-visibility provoca repintados y recargas inestables en algunas versiones de WebKit. */
  .perfume-card{
    content-visibility:visible!important;
    contain:layout paint style;
    transform:translateZ(0);
    backface-visibility:hidden;
  }
  .perfume-image{
    will-change:auto!important;
  }
}


/* Sprint 4.6 — catálogo virtual estable para Safari y Android */
.catalog-virtual-spacer{grid-column:1/-1;width:100%;pointer-events:none;visibility:hidden}
@media (hover:none) and (pointer:coarse){
  .perfume-card{contain:layout paint style;transform:none;backface-visibility:visible}
  .perfume-card:hover{transform:none}
}

/* =========================================================
   SPRINT 4.9 — BÚSQUEDA RÁPIDA CONTEXTUAL EN LA COLECCIÓN
   ========================================================= */
.catalog-search-dock{
  position:fixed;
  z-index:80;
  top:calc(max(12px,env(safe-area-inset-top)) + var(--catalog-search-viewport-offset,0px));
  left:50%;
  width:min(430px,calc(100% - 28px));
  transform:translate(-50%,-18px) scale(.96);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease,transform .3s cubic-bezier(.2,.78,.2,1),visibility 0s linear .3s;
}
.catalog-search-dock.is-visible{
  transform:translate(-50%,0) scale(1);
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}
.catalog-search-dock__box{
  width:min(292px,100%);
  min-height:46px;
  margin-inline:auto;
  padding:0 10px 0 15px;
  display:flex;
  align-items:center;
  gap:9px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.24);
  border-radius:18px;
  color:#f4f0e8;
  background:
    linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.055) 42%,rgba(8,10,14,.24)),
    rgba(18,20,25,.42);
  box-shadow:
    0 12px 36px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(255,255,255,.055);
  -webkit-backdrop-filter:blur(24px) saturate(155%);
  backdrop-filter:blur(24px) saturate(155%);
  transition:width .32s cubic-bezier(.2,.78,.2,1),background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.catalog-search-dock__box:focus-within{
  width:100%;
  background:
    linear-gradient(135deg,rgba(255,255,255,.19),rgba(255,255,255,.07) 42%,rgba(8,10,14,.31)),
    rgba(15,17,22,.5);
  border-color:rgba(232,219,184,.46);
  box-shadow:0 16px 46px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.34);
}
.catalog-search-dock__icon{
  width:17px;
  height:17px;
  flex:0 0 auto;
  fill:none;
  stroke:rgba(242,238,229,.76);
  stroke-width:1.65;
  stroke-linecap:round;
}
.catalog-search-dock input{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  appearance:none;
  -webkit-appearance:none;
  color:#fff;
  background:transparent;
  font-size:16px;
  line-height:1.2;
}
.catalog-search-dock input::placeholder{color:rgba(248,245,238,.78)}
.catalog-search-dock input::-webkit-search-decoration,
.catalog-search-dock input::-webkit-search-cancel-button,
.catalog-search-dock input::-webkit-search-results-button,
.catalog-search-dock input::-webkit-search-results-decoration{display:none}
.catalog-search-dock__clear{
  width:30px;
  height:30px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:0;
  border-radius:9px;
  color:rgba(255,255,255,.76);
  background:rgba(255,255,255,.08);
  font-size:1.15rem;
  line-height:1;
}
.catalog-search-dock__clear:hover{color:#fff;background:rgba(255,255,255,.14)}
.catalog-search-dock__clear[hidden]{display:none}
body.dialog-open .catalog-search-dock{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
@media(max-width:700px){
  .catalog-search-dock{
    top:calc(max(9px,env(safe-area-inset-top)) + var(--catalog-search-viewport-offset,0px));
    width:calc(100% - 22px);
  }
  .catalog-search-dock__box{width:min(276px,100%);min-height:45px;border-radius:17px}
  .catalog-search-dock__box:focus-within{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .catalog-search-dock,.catalog-search-dock__box{transition:none!important}
}


/* =========================================================
   SPRINT · ASESOR INTELIGENTE PRIVÉ 2.0
   ========================================================= */
.entry-paths{grid-template-columns:1fr!important}
.entry-card--coming{
  position:relative;
  overflow:hidden;
  cursor:default;
  border-color:rgba(255,255,255,.12)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;
}
.entry-card--coming::after{
  content:"";
  position:absolute;
  width:150px;height:150px;
  right:-70px;top:-85px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(189,166,120,.18),transparent 68%);
  pointer-events:none;
}
.entry-coming-badge{
  grid-column:2;
  width:max-content;
  margin-top:7px;
  padding:5px 9px;
  border:1px solid rgba(216,199,159,.28);
  border-radius:999px;
  color:rgba(216,199,159,.9);
  background:rgba(189,166,120,.07);
  font-size:.53rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.advisor-dialog{
  --advisor-bg:#f3f0ea;
  --advisor-ink:#171512;
  --advisor-muted:#6f6a63;
  --advisor-line:rgba(23,21,18,.12);
  --advisor-glow:rgba(189,166,120,.18);
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 78% 14%,var(--advisor-glow),transparent 38%),
    linear-gradient(145deg,var(--advisor-bg),#fbfaf7 68%);
  color:var(--advisor-ink);
  transition:background .55s ease,color .45s ease;
}
.advisor-dialog[data-advisor-theme="category-caballero"]{
  --advisor-bg:#09111d;--advisor-ink:#f8f7f3;--advisor-muted:rgba(255,255,255,.66);
  --advisor-line:rgba(255,255,255,.14);--advisor-glow:rgba(63,105,155,.26);
  background:radial-gradient(circle at 72% 18%,rgba(52,91,137,.32),transparent 38%),linear-gradient(145deg,#07101b,#0d1724 64%,#111820);
}
.advisor-dialog[data-advisor-theme="category-dama"]{
  --advisor-bg:#2b0711;--advisor-ink:#fff8f5;--advisor-muted:rgba(255,245,242,.67);
  --advisor-line:rgba(255,255,255,.14);--advisor-glow:rgba(151,37,72,.26);
  background:radial-gradient(circle at 72% 16%,rgba(150,38,73,.32),transparent 40%),linear-gradient(145deg,#260710,#491224 65%,#2a0b14);
}
.advisor-dialog[data-advisor-theme="category-unisex"]{
  --advisor-bg:#24272b;--advisor-ink:#f8f8f6;--advisor-muted:rgba(255,255,255,.66);
  --advisor-line:rgba(255,255,255,.14);--advisor-glow:rgba(170,175,182,.18);
  background:radial-gradient(circle at 70% 16%,rgba(185,189,194,.18),transparent 40%),linear-gradient(145deg,#1f2226,#353a40 68%,#24282c);
}
.advisor-dialog[data-advisor-theme="climate-calor"]{
  --advisor-bg:#39200c;--advisor-ink:#fff9ef;--advisor-muted:rgba(255,247,232,.7);
  --advisor-line:rgba(255,255,255,.14);--advisor-glow:rgba(240,166,72,.3);
  background:radial-gradient(circle at 76% 14%,rgba(246,170,76,.34),transparent 32%),linear-gradient(145deg,#2b1607,#6a3512 68%,#40200c);
}
.advisor-dialog[data-advisor-theme="climate-templado"]{
  --advisor-bg:#28302f;--advisor-ink:#f7f8f4;--advisor-muted:rgba(247,248,244,.68);
  --advisor-line:rgba(255,255,255,.14);--advisor-glow:rgba(161,179,169,.2);
  background:radial-gradient(circle at 74% 15%,rgba(185,197,190,.22),transparent 36%),linear-gradient(145deg,#202827,#45504d 70%,#2a3331);
}
.advisor-dialog[data-advisor-theme="climate-frio"]{
  --advisor-bg:#0b1f32;--advisor-ink:#f6fbff;--advisor-muted:rgba(240,249,255,.7);
  --advisor-line:rgba(255,255,255,.14);--advisor-glow:rgba(116,183,232,.25);
  background:radial-gradient(circle at 76% 14%,rgba(118,190,241,.28),transparent 34%),linear-gradient(145deg,#081827,#123a5c 70%,#0c2438);
}
.advisor-shell{
  position:relative;z-index:2;
  min-height:100%;
}
.advisor-atmosphere{
  position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;
}
.advisor-atmosphere span{
  position:absolute;display:block;border-radius:50%;
  opacity:.22;filter:blur(1px);
  transition:background .45s ease,opacity .45s ease,transform .6s ease;
}
.advisor-atmosphere span:nth-child(1){width:180px;height:180px;right:-60px;top:12%;background:radial-gradient(circle,rgba(255,255,255,.48),transparent 68%)}
.advisor-atmosphere span:nth-child(2){width:110px;height:110px;left:-42px;bottom:24%;background:radial-gradient(circle,rgba(255,255,255,.32),transparent 70%)}
.advisor-atmosphere span:nth-child(3){width:70px;height:70px;right:24%;bottom:12%;background:radial-gradient(circle,rgba(255,255,255,.28),transparent 72%)}
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-atmosphere span:nth-child(1){
  opacity:.42;background:radial-gradient(circle,#ffd68b 0 16%,rgba(255,173,65,.42) 17% 42%,transparent 70%);
  animation:advisorHeatPulse 3.6s ease-in-out infinite;
}
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-atmosphere span{
  border-radius:48% 52% 54% 46%;background:rgba(230,237,233,.12);filter:blur(8px);
  animation:advisorCloudDrift 8s ease-in-out infinite alternate;
}
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-atmosphere{
  background-image:
    radial-gradient(circle at 18% 28%,rgba(255,255,255,.7) 0 1.5px,transparent 2px),
    radial-gradient(circle at 67% 21%,rgba(255,255,255,.55) 0 1.5px,transparent 2px),
    radial-gradient(circle at 84% 48%,rgba(255,255,255,.65) 0 1.5px,transparent 2px),
    radial-gradient(circle at 35% 63%,rgba(255,255,255,.48) 0 1.5px,transparent 2px),
    radial-gradient(circle at 72% 79%,rgba(255,255,255,.52) 0 1.5px,transparent 2px);
  background-size:120px 150px;
  animation:advisorSnow 10s linear infinite;
}
@keyframes advisorHeatPulse{50%{transform:scale(1.12);opacity:.58}}
@keyframes advisorCloudDrift{to{transform:translate3d(24px,-10px,0) scale(1.08)}}
@keyframes advisorSnow{to{background-position:0 150px}}

.advisor-close{
  color:var(--advisor-ink)!important;
  border-color:var(--advisor-line)!important;
  background:color-mix(in srgb,var(--advisor-bg) 72%,transparent)!important;
  backdrop-filter:blur(16px);
}
.advisor-head{position:relative;z-index:2}
.advisor-head .detail-eyebrow{color:var(--prive-gold-light,var(--accent))}
.advisor-head h2{color:var(--advisor-ink)}
.advisor-head>p:not(.detail-eyebrow):not(.advisor-progress-text){color:var(--advisor-muted)}
.advisor-progress{background:var(--advisor-line)!important}
.advisor-progress span{background:linear-gradient(90deg,var(--prive-gold,#bda678),var(--prive-gold-light,#d8c79f))!important}
.advisor-progress-text{color:var(--advisor-muted)!important}
.advisor-steps,.advisor-results{position:relative;z-index:2}
.advisor-step{animation:advisorStepIn .32s ease both}
@keyframes advisorStepIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.advisor-step-label{
  margin:0 0 8px;color:var(--prive-gold-light,var(--accent));
  font-size:.6rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase
}
.advisor-question{color:var(--advisor-ink)!important}
.advisor-question-note{
  max-width:520px;margin:-10px 0 18px;color:var(--advisor-muted);
  font-size:.72rem;line-height:1.55
}
.advisor-options{gap:11px}
.advisor-option{
  min-height:88px;
  border:1px solid var(--advisor-line)!important;
  border-radius:16px!important;
  background:color-mix(in srgb,var(--advisor-bg) 58%,transparent)!important;
  color:var(--advisor-ink)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 30px rgba(0,0,0,.035);
  backdrop-filter:blur(18px) saturate(1.1);
  transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease;
}
.advisor-option:hover{transform:translateY(-2px)}
.advisor-option span{font-size:1.5rem;line-height:1}
.advisor-option strong{font-size:.96rem}
.advisor-option.is-selected{
  color:#171512!important;
  border-color:rgba(224,204,164,.72)!important;
  background:linear-gradient(145deg,#e8d8b7,#cdb47e)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
  transform:translateY(-2px);
}
.advisor-options--age,.advisor-options--intensity,.advisor-options--climate{grid-template-columns:repeat(2,minmax(0,1fr))}
.advisor-actions{
  z-index:4;
  border-color:var(--advisor-line)!important;
  background:color-mix(in srgb,var(--advisor-bg) 80%,transparent)!important;
  backdrop-filter:blur(22px) saturate(1.15)!important;
}
.advisor-primary{
  border-color:var(--prive-gold,#bda678)!important;
  background:linear-gradient(135deg,#c7ae79,#ad9158)!important;
  color:#171512!important;font-weight:700;
}
.advisor-secondary{
  border-color:var(--advisor-line)!important;
  background:color-mix(in srgb,var(--advisor-bg) 68%,transparent)!important;
  color:var(--advisor-muted)!important;
}
.advisor-results-heading h3{color:var(--advisor-ink)}
.advisor-results-heading>p:last-child{color:var(--advisor-muted)!important}
.advisor-result-card{
  border-color:var(--advisor-line)!important;
  background:color-mix(in srgb,var(--advisor-bg) 62%,transparent)!important;
  color:var(--advisor-ink);
  backdrop-filter:blur(16px);
}
.advisor-result-top p,.advisor-why>span{color:var(--prive-gold-light,var(--accent))!important}
.advisor-result-top small,.advisor-why ul{color:var(--advisor-muted)!important}
.advisor-why{border-color:var(--advisor-line)!important}
.advisor-result-card>button{color:var(--advisor-ink)!important}
.advisor-score{font-variant-numeric:tabular-nums}
.advisor-no-match{
  border-color:rgba(216,199,159,.45)!important;
  background:color-mix(in srgb,var(--advisor-bg) 76%,transparent)!important;
  color:var(--advisor-ink);
}
.advisor-no-match p{color:var(--advisor-muted)!important}

@media(min-width:600px){
  .entry-paths{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:980px!important}
  .advisor-options--age{grid-template-columns:repeat(4,minmax(0,1fr))}
  .advisor-options--intensity,.advisor-options--climate{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:420px){
  .advisor-option{min-height:80px;padding:11px 8px}
  .advisor-options--age{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .advisor-question{font-size:1.42rem}
}
@media(prefers-reduced-motion:reduce){
  .advisor-atmosphere,.advisor-atmosphere span,.advisor-step{animation:none!important}
}


/* =========================================================
   SPRINT 5.1 · PULIDO DEL ASESOR + BÚSQUEDA CONTEXTUAL
   ========================================================= */
.entry-card--coming .entry-arrow--bestsellers{
  position:absolute;
  right:18px;
  top:18px;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:50%;
  font-size:1.18rem;
  filter:drop-shadow(0 0 7px rgba(216,199,159,.5));
  animation:bestSellerMedalGlow 2.8s ease-in-out infinite;
}
@keyframes bestSellerMedalGlow{50%{filter:drop-shadow(0 0 13px rgba(216,199,159,.8));transform:translateY(-1px)}}

/* El diálogo completo es la superficie de scroll. Así ninguna opción ni resultado
   queda atrapado detrás de la barra sticky de acciones en iPhone/Safari. */
.advisor-dialog{
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scroll-behavior:auto;
}
.advisor-shell{
  min-height:100dvh!important;
  padding-bottom:calc(94px + var(--safe-bottom))!important;
}
.advisor-steps,.advisor-results{
  flex:0 0 auto!important;
  min-height:0;
}
.advisor-step{
  padding-bottom:34px!important;
}
.advisor-results{
  padding-bottom:34px!important;
}
.advisor-actions{
  position:sticky!important;
  bottom:0!important;
  margin-top:auto!important;
}

/* Expansión de color nacida exactamente en el botón seleccionado. */
.advisor-theme-ripple{
  position:fixed;
  z-index:1;
  left:var(--advisor-ripple-x,50%);
  top:var(--advisor-ripple-y,50%);
  width:var(--advisor-ripple-size,20px);
  height:var(--advisor-ripple-size,20px);
  border-radius:50%;
  pointer-events:none;
  background:var(--advisor-ripple-color,transparent);
  opacity:0;
  transform:translate(-50%,-50%) scale(0);
  will-change:transform,opacity;
}
.advisor-theme-ripple.is-animating{
  animation:advisorThemeBloom .68s cubic-bezier(.2,.72,.18,1) both;
}
@keyframes advisorThemeBloom{
  0%{opacity:.62;transform:translate(-50%,-50%) scale(0)}
  70%{opacity:.34}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1)}
}

/* Climas: paisajes abstractos, no ilustraciones pesadas. */
.advisor-atmosphere::before,.advisor-atmosphere::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  transition:opacity .45s ease;
}
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-atmosphere::before{
  opacity:.48;
  background:
    radial-gradient(ellipse at 50% 88%,rgba(182,92,22,.5) 0 22%,transparent 23%),
    radial-gradient(ellipse at 12% 100%,rgba(94,42,10,.5) 0 28%,transparent 29%),
    linear-gradient(to top,rgba(111,48,9,.42),transparent 48%);
  clip-path:polygon(0 58%,12% 52%,28% 61%,43% 48%,62% 60%,78% 50%,100% 59%,100% 100%,0 100%);
}
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-atmosphere::after{
  opacity:.42;
  background:
    radial-gradient(ellipse at 18% 94%,rgba(255,159,57,.65) 0 2%,transparent 4%),
    radial-gradient(ellipse at 28% 97%,rgba(255,114,36,.55) 0 2%,transparent 5%),
    radial-gradient(ellipse at 82% 96%,rgba(255,153,47,.55) 0 2%,transparent 5%);
  filter:blur(2px);
  animation:advisorFlameFlicker 2.4s ease-in-out infinite alternate;
}
@keyframes advisorFlameFlicker{to{transform:translateY(-12px) scaleY(1.18);opacity:.22}}
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-atmosphere::before{
  opacity:.38;
  background:
    radial-gradient(ellipse at 18% 26%,rgba(232,238,237,.28) 0 12%,transparent 13%),
    radial-gradient(ellipse at 35% 22%,rgba(232,238,237,.22) 0 16%,transparent 17%),
    radial-gradient(ellipse at 72% 34%,rgba(222,230,228,.24) 0 18%,transparent 19%),
    linear-gradient(145deg,transparent 0 55%,rgba(228,237,236,.06) 56% 100%);
  filter:blur(7px);
  animation:advisorCloudLayer 10s ease-in-out infinite alternate;
}
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-atmosphere::after{
  opacity:.14;
  background:linear-gradient(112deg,transparent 48%,rgba(255,255,240,.95) 49% 49.6%,transparent 50.5%);
  animation:advisorLightning 6.5s steps(1,end) infinite;
}
@keyframes advisorCloudLayer{to{transform:translate3d(28px,8px,0) scale(1.05)}}
@keyframes advisorLightning{0%,82%,86%,100%{opacity:0}83%{opacity:.32}84%{opacity:.08}85%{opacity:.22}}
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-atmosphere::before{
  opacity:.35;
  background:
    radial-gradient(ellipse at 20% 22%,rgba(237,247,255,.22) 0 15%,transparent 16%),
    radial-gradient(ellipse at 68% 27%,rgba(237,247,255,.18) 0 20%,transparent 21%),
    repeating-linear-gradient(170deg,transparent 0 28px,rgba(219,240,255,.10) 30px 32px,transparent 34px 66px);
  filter:blur(5px);
  animation:advisorColdWind 5.5s linear infinite;
}
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-atmosphere::after{
  opacity:.58;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.82) 0 1.2px,transparent 1.8px),
    radial-gradient(circle,rgba(239,249,255,.58) 0 1px,transparent 1.6px);
  background-size:54px 64px,82px 92px;
  background-position:0 0,21px 17px;
  animation:advisorSnowStorm 7s linear infinite;
}
@keyframes advisorColdWind{to{transform:translate3d(-36px,12px,0)}}
@keyframes advisorSnowStorm{to{background-position:-80px 150px,-45px 190px}}

/* La barra flotante es una única zona táctil sólida. Nada de su rectángulo
   permite click-through a una tarjeta situada detrás. */
.catalog-search-dock{
  z-index:500!important;
  pointer-events:none;
  isolation:isolate;
}
.catalog-search-dock.is-visible{pointer-events:auto!important}
.catalog-search-dock__box{
  position:relative;
  z-index:2;
  pointer-events:auto!important;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.catalog-search-dock__box *{pointer-events:auto}

@media(max-width:700px){
  .advisor-dialog{height:100dvh!important;max-height:100dvh!important}
  .advisor-shell{padding-bottom:calc(104px + var(--safe-bottom))!important}
  .advisor-actions{padding-bottom:calc(16px + var(--safe-bottom))!important}
}
@media(prefers-reduced-motion:reduce){
  .advisor-theme-ripple,.entry-arrow--bestsellers,.advisor-atmosphere::before,.advisor-atmosphere::after{animation:none!important}
}


/* =========================================================
   SPRINT 5.2 · ASESOR FULL-SCREEN + NAVEGACIÓN ANCLADA
   ========================================================= */

/* Top más vendidos: medalla realmente centrada en el rectángulo. */
.entry-card--coming{
  min-height:142px;
  grid-template-columns:1fr!important;
  grid-template-rows:auto auto auto!important;
  place-items:center;
  text-align:center!important;
  padding:48px 18px 18px!important;
}
.entry-card--coming .entry-index{
  position:absolute;
  left:18px;
  top:18px;
}
.entry-card--coming .entry-copy{
  display:grid;
  justify-items:center;
  gap:3px;
}
.entry-card--coming .entry-arrow--bestsellers{
  left:50%!important;
  right:auto!important;
  top:14px!important;
  transform:translateX(-50%);
}
.entry-card--coming .entry-coming-badge{
  grid-column:auto!important;
  justify-self:center;
  margin-top:7px;
}
@keyframes bestSellerMedalGlow{
  0%,100%{filter:drop-shadow(0 0 7px rgba(216,199,159,.48));transform:translateX(-50%) translateY(0)}
  50%{filter:drop-shadow(0 0 14px rgba(216,199,159,.84));transform:translateX(-50%) translateY(-1px)}
}

/* La vista del asesor no deja ver el Home ni durante el rebote/toolbar de Safari. */
html.advisor-open,
body.advisor-open{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  background:#f3f0ea!important;
}
body.advisor-open{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
}
.advisor-dialog[open]{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background-color:var(--advisor-bg)!important;
  overscroll-behavior:none!important;
}
.advisor-dialog[open]::backdrop{
  background:var(--advisor-bg)!important;
  backdrop-filter:none!important;
}

/* El fondo visual se extiende más allá del viewport dinámico para cubrir la
   zona que Safari revela detrás de las barras superior e inferior. */
.advisor-dialog[open]::before{
  content:"";
  position:fixed;
  z-index:-1;
  inset:-30vh -10vw;
  background:var(--advisor-bg);
  pointer-events:none;
}

/* Arquitectura: cabecera fija, contenido desplazable, acciones ancladas. */
.advisor-shell{
  box-sizing:border-box;
  width:100%;
  height:100%;
  min-height:0!important;
  padding:calc(36px + env(safe-area-inset-top)) 18px 0!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto;
  overflow:hidden!important;
}
.advisor-head{
  min-height:0;
  padding-right:42px;
  padding-bottom:8px;
}
.advisor-steps,
.advisor-results{
  min-height:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scrollbar-width:none;
  padding-bottom:26px!important;
}
.advisor-steps::-webkit-scrollbar,
.advisor-results::-webkit-scrollbar{display:none}
.advisor-step{padding:22px 0 28px!important}
.advisor-results{padding-top:22px!important}
.advisor-actions{
  position:relative!important;
  inset:auto!important;
  z-index:8!important;
  margin:0 -18px!important;
  padding:12px 18px calc(12px + env(safe-area-inset-bottom))!important;
  flex:0 0 auto;
  background:color-mix(in srgb,var(--advisor-bg) 96%,transparent)!important;
  border-top:1px solid var(--advisor-line)!important;
  box-shadow:0 -10px 24px rgba(0,0,0,.05);
  backdrop-filter:blur(22px) saturate(1.12)!important;
}

/* La transición nace del botón y tarda lo suficiente para percibirse.
   Dos ondas adicionales generan un efecto de agua, no un único destello. */
.advisor-theme-ripple{
  z-index:7!important;
  background:transparent!important;
  opacity:0;
  overflow:visible;
}
.advisor-theme-ripple::before,
.advisor-theme-ripple::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:var(--advisor-ripple-color,transparent);
  transform:scale(0);
  opacity:0;
}
.advisor-theme-ripple.is-animating{
  animation:advisorThemeBloomSlow 1.78s cubic-bezier(.18,.68,.16,1) both!important;
}
.advisor-theme-ripple.is-animating::before{
  animation:advisorWaterWaveOne 1.78s cubic-bezier(.18,.68,.16,1) both;
}
.advisor-theme-ripple.is-animating::after{
  animation:advisorWaterWaveTwo 1.78s cubic-bezier(.18,.68,.16,1) both;
}
@keyframes advisorThemeBloomSlow{
  0%{opacity:1;transform:translate(-50%,-50%) scale(0)}
  20%{opacity:1}
  82%{opacity:1}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1)}
}
@keyframes advisorWaterWaveOne{
  0%,8%{opacity:0;transform:scale(0)}
  12%{opacity:.38}
  78%{opacity:.16}
  100%{opacity:0;transform:scale(.78)}
}
@keyframes advisorWaterWaveTwo{
  0%,22%{opacity:0;transform:scale(0)}
  27%{opacity:.26}
  84%{opacity:.1}
  100%{opacity:0;transform:scale(.54)}
}

/* Visuales de clima explícitos: llamas, nubes y copos de nieve reales. */
.advisor-weather{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:0;
  transition:opacity .75s ease;
}
.advisor-weather i{position:absolute;display:block;font-style:normal}

/* Calor: varias llamas suaves, no una vela/halo. */
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-weather--heat{opacity:.72}
.advisor-weather--heat i{
  width:52px;
  height:86px;
  bottom:-18px;
  border-radius:58% 42% 64% 36% / 70% 58% 42% 30%;
  transform:rotate(8deg);
  transform-origin:50% 100%;
  background:
    radial-gradient(ellipse at 52% 78%,rgba(255,229,143,.86) 0 19%,transparent 20%),
    radial-gradient(ellipse at 50% 62%,rgba(255,151,48,.88) 0 47%,transparent 49%),
    linear-gradient(to top,rgba(211,67,17,.9),rgba(255,121,24,.28) 67%,transparent 69%);
  filter:blur(.2px) drop-shadow(0 0 14px rgba(255,111,20,.18));
  animation:advisorRealFlame 2.7s ease-in-out infinite alternate;
}
.advisor-weather--heat i:nth-child(1){left:7%;scale:.82;animation-delay:-.6s}
.advisor-weather--heat i:nth-child(2){left:24%;scale:1.18;animation-delay:-1.4s}
.advisor-weather--heat i:nth-child(3){left:48%;scale:.95;animation-delay:-.9s}
.advisor-weather--heat i:nth-child(4){left:69%;scale:1.1;animation-delay:-1.8s}
.advisor-weather--heat i:nth-child(5){left:87%;scale:.72;animation-delay:-.3s}
@keyframes advisorRealFlame{
  0%{transform:translateY(4px) rotate(-5deg) scaleY(.92)}
  55%{transform:translateY(-9px) rotate(5deg) scaleY(1.11)}
  100%{transform:translateY(-16px) rotate(-2deg) scaleY(1.2)}
}

/* Nubes compuestas por varios lóbulos, para que se lean como nubes. */
.advisor-weather--clouds i{
  width:150px;
  height:44px;
  border-radius:999px;
  background:rgba(238,243,241,.16);
  filter:blur(.3px);
  animation:advisorRealCloud 13s ease-in-out infinite alternate;
}
.advisor-weather--clouds i::before,
.advisor-weather--clouds i::after{
  content:"";
  position:absolute;
  bottom:9px;
  border-radius:50%;
  background:inherit;
}
.advisor-weather--clouds i::before{width:64px;height:64px;left:24px}
.advisor-weather--clouds i::after{width:82px;height:82px;right:20px;bottom:4px}
.advisor-weather--clouds i:nth-child(1){left:-30px;top:20%;scale:.9}
.advisor-weather--clouds i:nth-child(2){right:-38px;top:34%;scale:1.15;animation-delay:-4s}
.advisor-weather--clouds i:nth-child(3){left:18%;top:58%;scale:.7;animation-delay:-7s}
.advisor-weather--clouds i:nth-child(4){right:16%;top:12%;scale:.62;animation-delay:-2s}
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-weather--clouds,
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-weather--clouds{opacity:.72}
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-weather--clouds i{
  background:rgba(225,240,250,.14);
}
@keyframes advisorRealCloud{
  to{transform:translate3d(32px,7px,0)}
}

/* Frío: copos de nieve visibles, con velocidades/tamaños distintos. */
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-weather--snow{opacity:.82}
.advisor-weather--snow i{
  top:-10%;
  color:rgba(245,251,255,.82);
  font-family:system-ui,"Apple Color Emoji","Segoe UI Symbol",sans-serif;
  font-size:18px;
  text-shadow:0 0 8px rgba(214,240,255,.22);
  animation:advisorRealSnow 7.5s linear infinite;
}
.advisor-weather--snow i:nth-child(1){left:5%;animation-delay:-1s;font-size:14px}
.advisor-weather--snow i:nth-child(2){left:14%;animation-delay:-5s;font-size:19px}
.advisor-weather--snow i:nth-child(3){left:23%;animation-delay:-2.3s;font-size:12px}
.advisor-weather--snow i:nth-child(4){left:33%;animation-delay:-6.2s;font-size:22px}
.advisor-weather--snow i:nth-child(5){left:42%;animation-delay:-3.6s;font-size:15px}
.advisor-weather--snow i:nth-child(6){left:51%;animation-delay:-.4s;font-size:20px}
.advisor-weather--snow i:nth-child(7){left:61%;animation-delay:-4.8s;font-size:13px}
.advisor-weather--snow i:nth-child(8){left:69%;animation-delay:-2s;font-size:18px}
.advisor-weather--snow i:nth-child(9){left:77%;animation-delay:-6.8s;font-size:15px}
.advisor-weather--snow i:nth-child(10){left:86%;animation-delay:-3.1s;font-size:21px}
.advisor-weather--snow i:nth-child(11){left:93%;animation-delay:-5.6s;font-size:12px}
.advisor-weather--snow i:nth-child(12){left:36%;animation-delay:-7.2s;font-size:16px}
@keyframes advisorRealSnow{
  0%{transform:translate3d(0,-8vh,0) rotate(0deg)}
  50%{transform:translate3d(28px,54vh,0) rotate(170deg)}
  100%{transform:translate3d(-18px,112vh,0) rotate(360deg)}
}

/* Conservamos un relámpago muy discreto en templado. */
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-atmosphere::after{
  opacity:.11!important;
  background:linear-gradient(112deg,transparent 48%,rgba(255,255,240,.95) 49% 49.5%,transparent 50.4%)!important;
  animation:advisorLightning 7.8s steps(1,end) infinite!important;
}

/* Anulamos las formas abstractas previas que podían parecer círculos/vela. */
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-atmosphere::after,
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-atmosphere::after{
  opacity:0!important;
}
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-atmosphere::before,
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-atmosphere::before{
  opacity:0!important;
}
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-atmosphere span,
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-atmosphere span,
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-atmosphere span{
  opacity:.08!important;
  animation:none!important;
}

/* iPhone/Safari: el área útil siempre termina en la barra de acciones. */
@media(max-width:700px){
  .advisor-dialog[open]{
    height:100dvh!important;
    min-height:100dvh!important;
  }
  .advisor-shell{
    height:100dvh!important;
    min-height:0!important;
    padding-bottom:0!important;
  }
  .advisor-head h2{font-size:clamp(2rem,10vw,3.45rem)}
  .advisor-head>p:not(.detail-eyebrow):not(.advisor-progress-text){
    line-height:1.52;
  }
}

@supports(height:100svh){
  @media(max-width:700px){
    /* 100dvh gobierna el layout; 100lvh solo extiende la capa de fondo. */
    .advisor-dialog[open]::before{min-height:100lvh}
  }
}

@media(prefers-reduced-motion:reduce){
  .advisor-theme-ripple.is-animating,
  .advisor-theme-ripple.is-animating::before,
  .advisor-theme-ripple.is-animating::after,
  .advisor-weather i{animation:none!important}
}


/* =========================================================
   SPRINT 5.3 · HOME UNIFICADO + TRANSICIONES ORGÁNICAS
   ========================================================= */

/* Home: las tres rutas comparten el lenguaje visual grande y centrado
   aprobado en "Top más vendidos". */
.entry-paths{
  width:min(980px,100%);
  margin:32px auto 0!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:14px!important;
}
.entry-card,
.entry-card--primary,
.entry-card--coming{
  min-height:174px!important;
  padding:24px 22px!important;
  position:relative!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  text-align:center!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:18px!important;
  color:#fff!important;
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 38px rgba(0,0,0,.08)!important;
  transition:transform .28s ease,border-color .28s ease,background .28s ease,box-shadow .28s ease!important;
}
button.entry-card:not(.entry-card--coming):hover,
a.entry-card:hover{
  transform:translateY(-2px);
  border-color:rgba(216,199,159,.32)!important;
  background:linear-gradient(145deg,rgba(189,166,120,.12),rgba(255,255,255,.035))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 42px rgba(0,0,0,.12)!important;
}
.entry-index{
  position:absolute!important;
  top:16px!important;
  left:18px!important;
  color:rgba(255,255,255,.34)!important;
  font-size:.54rem!important;
  letter-spacing:.16em!important;
}
.entry-copy{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  max-width:520px!important;
  gap:7px!important;
}
.entry-card strong{
  font-size:clamp(1.28rem,4.8vw,1.62rem)!important;
  line-height:1.08!important;
}
.entry-card small{
  max-width:440px!important;
  color:rgba(255,255,255,.6)!important;
  font-size:.74rem!important;
  line-height:1.55!important;
  text-align:center!important;
}
.entry-arrow,
.entry-arrow--advisor,
.entry-card--coming .entry-arrow--bestsellers{
  position:static!important;
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  order:-1!important;
  border:1px solid rgba(216,199,159,.28)!important;
  border-radius:50%!important;
  color:#eadab5!important;
  background:rgba(189,166,120,.06)!important;
  font-size:1.22rem!important;
  filter:drop-shadow(0 0 6px rgba(216,199,159,.28));
}
.entry-arrow--advisor{animation:entryIconSoftGlow 3.1s ease-in-out infinite}
.entry-card--coming .entry-arrow--bestsellers{animation:bestSellerMedalGlow 2.8s ease-in-out infinite}
.entry-card[href="#catalogo"] .entry-arrow{animation:entryIconSoftGlow 3.6s ease-in-out infinite .4s}
@keyframes entryIconSoftGlow{
  50%{filter:drop-shadow(0 0 11px rgba(216,199,159,.58));transform:translateY(-1px)}
}
.entry-coming-badge{
  grid-column:auto!important;
  margin-top:3px!important;
  align-self:center!important;
}

/* La expansión de tema es una capa de fondo completa con máscara circular.
   Nunca se superpone a textos o botones y el tema definitivo no "aparece":
   queda revelado progresivamente desde el punto exacto seleccionado. */
.advisor-theme-ripple{
  position:fixed!important;
  inset:0!important;
  left:0!important;
  top:0!important;
  width:100%!important;
  height:100%!important;
  z-index:1!important;
  border-radius:0!important;
  pointer-events:none!important;
  opacity:0!important;
  transform:none!important;
  background:var(--advisor-ripple-background,var(--advisor-ripple-color,transparent))!important;
  clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  will-change:clip-path,opacity;
}
.advisor-theme-ripple::before,
.advisor-theme-ripple::after{display:none!important}
.advisor-theme-ripple.is-animating{
  animation:advisorOrganicReveal 1.82s cubic-bezier(.22,.62,.18,1) both!important;
}
@keyframes advisorOrganicReveal{
  0%{
    opacity:1;
    clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
  18%{
    opacity:1;
    clip-path:circle(calc(var(--advisor-ripple-radius,1000px) * .12) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
  42%{
    opacity:1;
    clip-path:circle(calc(var(--advisor-ripple-radius,1000px) * .38) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
  70%{
    opacity:1;
    clip-path:circle(calc(var(--advisor-ripple-radius,1000px) * .72) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
  96%,100%{
    opacity:1;
    clip-path:circle(var(--advisor-ripple-radius,1000px) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
}

/* El contenido permanece por encima de cualquier transición. */
.advisor-shell{z-index:2!important}
.advisor-head,.advisor-steps,.advisor-results,.advisor-actions,.advisor-close{position:relative;z-index:3!important}

/* Fondos climáticos sin figuras geométricas artificiales. */
.advisor-dialog[data-advisor-theme="climate-calor"]{
  --advisor-bg:#6a3512;
  background:linear-gradient(180deg,#4b2610 0%,#7b421b 48%,#b56a2b 100%)!important;
}
.advisor-dialog[data-advisor-theme="climate-templado"]{
  --advisor-bg:#33403d;
  background:linear-gradient(155deg,#202827 0%,#45504d 64%,#2a3331 100%)!important;
}
.advisor-dialog[data-advisor-theme="climate-frio"]{
  --advisor-bg:#123a5c;
  background:linear-gradient(155deg,#081827 0%,#123a5c 68%,#0c2438 100%)!important;
}

/* Desactivamos los orbes/formas abstractas anteriores. */
.advisor-atmosphere > .advisor-orb{display:none!important}
.advisor-atmosphere::before,.advisor-atmosphere::after{display:none!important}

/* Elementos meteorológicos reconocibles mediante símbolos nativos/emoji.
   Quedan en el fondo, discretos y detrás de toda la interfaz. */
.advisor-weather{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  opacity:0;
  transition:opacity .72s ease 80ms!important;
}
.advisor-weather i{
  position:absolute!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  border-radius:0!important;
  background:none!important;
  filter:none!important;
  font-style:normal!important;
  font-family:system-ui,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
  user-select:none;
}

/* CALOR: paisaje desértico discreto + llamas reconocibles. */
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-weather--heat{opacity:.48!important}
.advisor-weather--heat i:nth-child(1){
  left:50%!important;bottom:-5%!important;
  font-size:clamp(9rem,42vw,20rem)!important;
  opacity:.24!important;
  transform:translateX(-50%)!important;
  animation:advisorDesertBreathe 7s ease-in-out infinite alternate!important;
}
.advisor-weather--heat i:not(:first-child){
  bottom:-1%!important;
  font-size:clamp(2.5rem,9vw,4.8rem)!important;
  opacity:.35!important;
  animation:advisorEmojiFlame 2.8s ease-in-out infinite alternate!important;
}
.advisor-weather--heat i:nth-child(2){left:6%!important;animation-delay:-.8s!important}
.advisor-weather--heat i:nth-child(3){left:29%!important;animation-delay:-1.6s!important}
.advisor-weather--heat i:nth-child(4){right:28%!important;animation-delay:-.3s!important}
.advisor-weather--heat i:nth-child(5){right:6%!important;animation-delay:-1.2s!important}
@keyframes advisorDesertBreathe{to{transform:translateX(-50%) scale(1.025);opacity:.29}}
@keyframes advisorEmojiFlame{to{transform:translateY(-13px) scale(1.08);opacity:.48}}

/* TEMPLADO / FRÍO: nubes emoji, no círculos dibujados. */
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-weather--clouds,
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-weather--clouds{opacity:.34!important}
.advisor-weather--clouds i{
  font-size:clamp(5rem,23vw,10rem)!important;
  opacity:.58!important;
  animation:advisorEmojiCloud 13s ease-in-out infinite alternate!important;
}
.advisor-weather--clouds i:nth-child(1){left:-8%!important;top:9%!important}
.advisor-weather--clouds i:nth-child(2){right:-10%!important;top:28%!important;animation-delay:-4s!important}
.advisor-weather--clouds i:nth-child(3){left:14%!important;top:57%!important;font-size:clamp(4rem,18vw,8rem)!important;animation-delay:-7s!important}
.advisor-weather--clouds i:nth-child(4){right:12%!important;top:4%!important;font-size:clamp(3rem,15vw,7rem)!important;animation-delay:-2s!important}
@keyframes advisorEmojiCloud{to{transform:translate3d(36px,7px,0)}}

/* Templado: relámpagos reales y muy ocasionales. */
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-weather--storm{opacity:.24!important}
.advisor-weather--storm i{
  font-size:clamp(2.6rem,10vw,5rem)!important;
  opacity:0;
  animation:advisorEmojiLightning 7.8s steps(1,end) infinite!important;
}
.advisor-weather--storm i:nth-child(1){left:23%!important;top:26%!important}
.advisor-weather--storm i:nth-child(2){right:19%!important;top:48%!important;animation-delay:-3.4s!important}
@keyframes advisorEmojiLightning{
  0%,88%,93%,100%{opacity:0}
  89%,91%{opacity:.68}
  90%,92%{opacity:.18}
}

/* Frío: copos visibles + viento reconocible. */
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-weather--snow{opacity:.62!important}
.advisor-weather--snow i{
  top:-12%!important;
  color:rgba(245,251,255,.88)!important;
  font-size:18px!important;
  opacity:.75!important;
  text-shadow:0 0 8px rgba(214,240,255,.2)!important;
  animation:advisorEmojiSnow 7.8s linear infinite!important;
}
.advisor-weather--snow i:nth-child(1){left:5%!important;animation-delay:-1s!important;font-size:14px!important}
.advisor-weather--snow i:nth-child(2){left:14%!important;animation-delay:-5s!important;font-size:19px!important}
.advisor-weather--snow i:nth-child(3){left:23%!important;animation-delay:-2.3s!important;font-size:12px!important}
.advisor-weather--snow i:nth-child(4){left:33%!important;animation-delay:-6.2s!important;font-size:22px!important}
.advisor-weather--snow i:nth-child(5){left:42%!important;animation-delay:-3.6s!important;font-size:15px!important}
.advisor-weather--snow i:nth-child(6){left:51%!important;animation-delay:-.4s!important;font-size:20px!important}
.advisor-weather--snow i:nth-child(7){left:61%!important;animation-delay:-4.8s!important;font-size:13px!important}
.advisor-weather--snow i:nth-child(8){left:69%!important;animation-delay:-2s!important;font-size:18px!important}
.advisor-weather--snow i:nth-child(9){left:77%!important;animation-delay:-6.8s!important;font-size:15px!important}
.advisor-weather--snow i:nth-child(10){left:86%!important;animation-delay:-3.1s!important;font-size:21px!important}
.advisor-weather--snow i:nth-child(11){left:93%!important;animation-delay:-5.6s!important;font-size:12px!important}
.advisor-weather--snow i:nth-child(12){left:36%!important;animation-delay:-7.2s!important;font-size:16px!important}
@keyframes advisorEmojiSnow{
  0%{transform:translate3d(0,-8vh,0) rotate(0)}
  50%{transform:translate3d(24px,54vh,0) rotate(170deg)}
  100%{transform:translate3d(-18px,112vh,0) rotate(360deg)}
}
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-weather--wind{opacity:.3!important}
.advisor-weather--wind i{
  left:-18%!important;
  font-size:clamp(2.8rem,11vw,5.2rem)!important;
  opacity:.55!important;
  animation:advisorEmojiWind 6.5s ease-in-out infinite!important;
}
.advisor-weather--wind i:nth-child(1){top:24%!important}
.advisor-weather--wind i:nth-child(2){top:48%!important;animation-delay:-2.1s!important}
.advisor-weather--wind i:nth-child(3){top:71%!important;animation-delay:-4.2s!important}
@keyframes advisorEmojiWind{
  0%{transform:translateX(-12vw);opacity:0}
  18%{opacity:.5}
  72%{opacity:.34}
  100%{transform:translateX(132vw);opacity:0}
}

@media(min-width:720px){
  .entry-paths{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .entry-card,.entry-card--primary,.entry-card--coming{min-height:196px!important}
}
@media(prefers-reduced-motion:reduce){
  .advisor-theme-ripple.is-animating{animation-duration:.01ms!important}
  .advisor-weather i,.entry-arrow{animation:none!important}
}

/* =========================================================
   SPRINT 5.4 · CORRECCIÓN ESTRUCTURAL DEL ASESOR + SAFE AREA
   ========================================================= */

/* Safari/iPhone: el lienzo que existe detrás de la interfaz del navegador
   comparte el negro PRIVÉ del Home. El contenido normal conserva su fondo claro. */
html{background:#07090d!important}
body{background:#07090d!important}
main{background:#eeeae2}
.hero{background-color:#07090d!important}

/* Las tres rutas del Home mantienen sus iconos geométricamente centrados.
   La animación histórica de la medalla tenía translateX(-50%) heredado de
   cuando era position:absolute y por eso la desplazaba. */
.entry-card--coming .entry-arrow--bestsellers{
  margin-inline:auto!important;
  transform:none!important;
  animation:bestSellerMedalCenteredGlow 2.8s ease-in-out infinite!important;
}
@keyframes bestSellerMedalCenteredGlow{
  0%,100%{filter:drop-shadow(0 0 7px rgba(216,199,159,.48));transform:translateY(0)}
  50%{filter:drop-shadow(0 0 14px rgba(216,199,159,.84));transform:translateY(-1px)}
}

/* Arquitectura inequívoca del asesor:
   1 cabecera, 2 zona desplazable, 3 navegación. Nada más participa del grid. */
.advisor-shell{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  grid-template-areas:"head" "content" "actions"!important;
  gap:0!important;
}
.advisor-head{
  grid-area:head!important;
  position:relative!important;
  z-index:4!important;
  margin:0!important;
  padding:0 44px 16px 0!important;
  border-bottom:1px solid var(--advisor-line)!important;
}
.advisor-steps,.advisor-results{
  grid-area:content!important;
  position:relative!important;
  z-index:4!important;
  align-self:stretch!important;
  min-height:0!important;
  padding-top:18px!important;
}
.advisor-actions{
  grid-area:actions!important;
  position:relative!important;
  z-index:6!important;
}

/* La X queda fuera del flujo y siempre en la esquina superior derecha. */
.advisor-close{
  position:fixed!important;
  top:calc(max(12px,env(safe-area-inset-top)) + 2px)!important;
  right:14px!important;
  left:auto!important;
  z-index:30!important;
  margin:0!important;
}

/* Liquid Glass en opciones y navegación: superficie propia, legible y separada. */
.advisor-option{
  background:
    linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.035) 55%,rgba(0,0,0,.035)),
    color-mix(in srgb,var(--advisor-bg) 52%,transparent)!important;
  border-color:color-mix(in srgb,var(--advisor-line) 88%,rgba(255,255,255,.18))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(255,255,255,.035),
    0 10px 28px rgba(0,0,0,.055)!important;
  -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
  backdrop-filter:blur(22px) saturate(145%)!important;
}
.advisor-secondary{
  background:
    linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.035)),
    color-mix(in srgb,var(--advisor-bg) 64%,transparent)!important;
  -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
  backdrop-filter:blur(20px) saturate(135%)!important;
}

/* CORRECCIÓN DE RAÍZ: la regla anterior opacity:0!important impedía que la
   animación pudiera hacerse visible. La capa se ve mientras la clase está activa. */
.advisor-theme-ripple.is-animating{
  opacity:1!important;
  z-index:2!important;
}
.advisor-theme-ripple{
  z-index:2!important;
}
.advisor-atmosphere{z-index:1!important}
.advisor-head,.advisor-steps,.advisor-results,.advisor-actions,.advisor-close{z-index:5!important}

/* El reveal tarda lo suficiente para leer el nacimiento en el botón y el fondo
   queda cubierto gradualmente, sin aparecer de golpe al final. */
.advisor-theme-ripple.is-animating{
  animation:advisorOrganicRevealVisible 1.95s cubic-bezier(.2,.63,.16,1) both!important;
}
@keyframes advisorOrganicRevealVisible{
  0%{clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%))}
  16%{clip-path:circle(calc(var(--advisor-ripple-radius,1000px) * .10) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%))}
  38%{clip-path:circle(calc(var(--advisor-ripple-radius,1000px) * .32) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%))}
  66%{clip-path:circle(calc(var(--advisor-ripple-radius,1000px) * .66) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%))}
  100%{clip-path:circle(var(--advisor-ripple-radius,1000px) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%))}
}

/* Clima cálido: paisaje y fuego más visibles, siempre detrás de la interfaz. */
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-weather--heat{opacity:.74!important}
.advisor-weather--heat i:nth-child(1){opacity:.42!important}
.advisor-weather--heat i:not(:first-child){opacity:.58!important}

/* Templado: más nubes y una tormenta eléctrica reconocible, sin figuras CSS. */
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-weather--clouds{opacity:.52!important}
.advisor-weather--clouds i:nth-child(5){left:-3%!important;top:73%!important;font-size:clamp(3.6rem,17vw,7.5rem)!important;animation-delay:-9s!important}
.advisor-weather--clouds i:nth-child(6){right:-4%!important;top:66%!important;font-size:clamp(4.4rem,19vw,8.5rem)!important;animation-delay:-5.5s!important}
.advisor-dialog[data-advisor-theme="climate-templado"] .advisor-weather--storm{opacity:.38!important}
.advisor-weather--storm i:nth-child(3){left:54%!important;top:68%!important;animation-delay:-5.2s!important}

/* Frío conserva nieve y suma viento visible sin invadir el contenido. */
.advisor-dialog[data-advisor-theme="climate-frio"] .advisor-weather--wind{opacity:.26!important}
.advisor-weather--wind i{
  font-size:clamp(2.4rem,10vw,4.6rem)!important;
  opacity:.55!important;
  animation:advisorWindEmoji 5.8s ease-in-out infinite alternate!important;
}
.advisor-weather--wind i:nth-child(1){left:-4%!important;top:33%!important}
.advisor-weather--wind i:nth-child(2){right:9%!important;top:52%!important;animation-delay:-2s!important}
.advisor-weather--wind i:nth-child(3){left:24%!important;top:76%!important;animation-delay:-3.7s!important}
@keyframes advisorWindEmoji{to{transform:translateX(38px);opacity:.72}}

@media(max-width:700px){
  .advisor-head{
    padding-right:42px!important;
    padding-bottom:13px!important;
  }
  .advisor-head h2{margin-top:8px!important}
  .advisor-steps,.advisor-results{padding-top:14px!important}
  .advisor-close{right:12px!important}
}

@media(prefers-reduced-motion:reduce){
  .entry-card--coming .entry-arrow--bestsellers,
  .advisor-theme-ripple.is-animating,
  .advisor-weather--wind i{animation:none!important}
}

/* =========================================================
   SPRINT 5.5 · PULIDO INMERSIVO DEL ASESOR
   Cambios aislados: fondo neutro, safe-area/Safari, intensidad,
   transición continua, clima cálido y pantalla de resultados.
   ========================================================= */

/* Fondo neutro oscuro: hace visible el Liquid Glass sin tocar el resto del sitio. */
.advisor-dialog{
  --advisor-bg:#171a1f!important;
  --advisor-ink:#f7f5f1!important;
  --advisor-muted:rgba(247,245,241,.68)!important;
  --advisor-line:rgba(255,255,255,.14)!important;
  --advisor-glow:rgba(189,166,120,.12)!important;
  background:
    radial-gradient(circle at 78% 14%,rgba(189,166,120,.10),transparent 38%),
    linear-gradient(145deg,#14171b,#1d2127 68%,#121519)!important;
}
.advisor-dialog[data-advisor-theme="category-caballero"],
.advisor-dialog[data-advisor-theme="category-dama"],
.advisor-dialog[data-advisor-theme="category-unisex"],
.advisor-dialog[data-advisor-theme="climate-calor"],
.advisor-dialog[data-advisor-theme="climate-templado"],
.advisor-dialog[data-advisor-theme="climate-frio"]{
  color:var(--advisor-ink)!important;
}

/* Safari/iPhone: el color de la vista del asesor también vive en html/body,
   de modo que las zonas expuestas por las barras del navegador nunca queden blancas. */
html.advisor-open,
html.advisor-open body{
  background:var(--advisor-browser-bg,#171a1f)!important;
  overscroll-behavior:none!important;
}
.advisor-dialog[open],
.advisor-dialog[open]::backdrop,
.advisor-dialog[open]::before{
  background-color:var(--advisor-browser-bg,var(--advisor-bg,#171a1f))!important;
}
.advisor-dialog[open]::before{
  inset:-60vh -30vw!important;
  width:auto!important;
  height:auto!important;
  min-height:220vh!important;
}

/* Liquid Glass un poco más evidente sobre el nuevo fondo neutro. */
.advisor-option{
  background:
    linear-gradient(145deg,rgba(255,255,255,.15),rgba(255,255,255,.055) 58%,rgba(255,255,255,.025)),
    rgba(21,24,29,.34)!important;
  border-color:rgba(255,255,255,.17)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.19),0 12px 30px rgba(0,0,0,.16)!important;
  -webkit-backdrop-filter:blur(24px) saturate(150%)!important;
  backdrop-filter:blur(24px) saturate(150%)!important;
}
.advisor-option.is-selected{
  background:linear-gradient(145deg,rgba(255,255,255,.24),rgba(255,255,255,.10))!important;
  border-color:rgba(255,255,255,.36)!important;
}

/* Los tres símbolos de intensidad tienen exactamente el mismo diámetro. */
.advisor-options--intensity .advisor-option span{
  width:28px!important;
  height:28px!important;
  display:grid!important;
  place-items:center!important;
  font-size:0!important;
  line-height:1!important;
}
.advisor-options--intensity .advisor-option span::before{
  content:"";
  width:22px;
  height:22px;
  box-sizing:border-box;
  border:2px solid currentColor;
  border-radius:50%;
  display:block;
}
.advisor-options--intensity .advisor-option[data-value="Equilibrado"] span::before{
  background:linear-gradient(90deg,currentColor 0 50%,transparent 50% 100%);
}
.advisor-options--intensity .advisor-option[data-value="Intenso"] span::before{
  background:currentColor;
}

/* Expansión continua: solo inicio y final para que el navegador interpole cada frame.
   Se elimina la sensación de pum/pum causada por etapas discretas. */
.advisor-theme-ripple.is-animating{
  animation:advisorImmersiveReveal 2.2s cubic-bezier(.16,.72,.18,1) both!important;
}
@keyframes advisorImmersiveReveal{
  from{
    opacity:1;
    clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
  to{
    opacity:1;
    clip-path:circle(var(--advisor-ripple-radius,1200px) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
}

/* Calor: usamos los emojis reales del HTML y sumamos cactus/paisaje/sol.
   Se anulan las antiguas llamas construidas con formas CSS. */
.advisor-dialog[data-advisor-theme="climate-calor"] .advisor-weather--heat{opacity:.78!important}
.advisor-weather--heat i{
  width:auto!important;height:auto!important;
  border-radius:0!important;
  background:none!important;
  filter:drop-shadow(0 8px 14px rgba(33,12,3,.18))!important;
  font-family:system-ui,"Apple Color Emoji","Segoe UI Emoji",sans-serif!important;
  font-size:clamp(2.4rem,12vw,5.4rem)!important;
  opacity:.54!important;
  bottom:auto!important;
  scale:1!important;
  animation:advisorDesertFloat 7s ease-in-out infinite alternate!important;
}
.advisor-weather--heat i:nth-child(1){left:4%!important;top:66%!important;font-size:clamp(4.6rem,21vw,9rem)!important;opacity:.34!important}
.advisor-weather--heat i:nth-child(2){left:15%!important;top:43%!important;animation-delay:-2.1s!important}
.advisor-weather--heat i:nth-child(3){left:39%!important;top:63%!important;animation-delay:-4.2s!important}
.advisor-weather--heat i:nth-child(4){right:12%!important;left:auto!important;top:48%!important;animation-delay:-1.4s!important}
.advisor-weather--heat i:nth-child(5){right:23%!important;left:auto!important;top:72%!important;animation-delay:-5.1s!important}
.advisor-weather--heat i:nth-child(6){right:8%!important;left:auto!important;top:15%!important;font-size:clamp(3rem,14vw,6rem)!important;opacity:.42!important}
.advisor-weather--heat i:nth-child(7){left:58%!important;top:35%!important;animation-delay:-3.2s!important}
.advisor-weather--heat i:nth-child(8){left:7%!important;top:21%!important;animation-delay:-6s!important}
@keyframes advisorDesertFloat{to{transform:translate3d(0,-8px,0) scale(1.025)}}

/* Pantalla de resultados independiente: desaparece la introducción de los pasos
   y el contenido arranca arriba, centrado, con scroll propio intacto. */
.advisor-dialog.is-results .advisor-head{display:none!important}
.advisor-dialog.is-results .advisor-shell{
  grid-template-rows:minmax(0,1fr) auto!important;
  grid-template-areas:"content" "actions"!important;
  padding-top:calc(34px + env(safe-area-inset-top))!important;
}
.advisor-dialog.is-results .advisor-results{
  display:block!important;
  padding-top:12px!important;
}
.advisor-results-heading{
  max-width:620px;
  margin:0 auto 24px!important;
  text-align:center!important;
  padding:0 10px!important;
}
.advisor-results-heading .detail-eyebrow{
  margin:0 0 12px!important;
  color:var(--prive-gold-light,var(--accent))!important;
}
.advisor-results-heading h3{
  margin:0!important;
  font-size:clamp(2.15rem,10vw,4rem)!important;
  line-height:1!important;
  letter-spacing:-.035em!important;
}
.advisor-results-heading #advisorResultsIntro{
  max-width:520px;
  margin:16px auto 0!important;
  color:var(--advisor-muted)!important;
  font-size:.88rem!important;
  line-height:1.65!important;
}
.advisor-results-subtitle{
  margin:22px 0 0!important;
  color:var(--advisor-ink)!important;
  font-family:"Playfair Display",serif!important;
  font-size:1.22rem!important;
}

@media(max-width:700px){
  .advisor-dialog.is-results .advisor-shell{
    padding-top:calc(30px + env(safe-area-inset-top))!important;
  }
  .advisor-results-heading{margin-bottom:18px!important}
}


/* =========================================================
   SPRINT 5.6 · TRANSICIÓN CONTINUA + RETORNO A RESULTADOS
   ========================================================= */
html.advisor-open,
body.advisor-open{
  background:var(--advisor-browser-fill,var(--advisor-browser-bg,#171a1f))!important;
  background-attachment:fixed!important;
}
.advisor-dialog[open]::before,
.advisor-dialog[open]::backdrop{
  background:var(--advisor-browser-fill,var(--advisor-browser-bg,#171a1f))!important;
}
.advisor-theme-ripple{
  background:var(--advisor-ripple-background,var(--advisor-ripple-color,transparent))!important;
}
.advisor-theme-ripple.is-animating{
  animation:advisorImmersiveRevealContinuous 2.18s linear both!important;
}
@keyframes advisorImmersiveRevealContinuous{
  from{opacity:1;clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));}
  to{opacity:1;clip-path:circle(var(--advisor-ripple-radius,1400px) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));}
}
/* El diálogo también hereda el mismo color base para que el corte con el área
   del navegador no se perciba como un cuadro separado. */
.advisor-dialog[data-advisor-theme="category-caballero"]{--advisor-bg:#07101b!important;}
.advisor-dialog[data-advisor-theme="category-dama"]{--advisor-bg:#260710!important;}
.advisor-dialog[data-advisor-theme="category-unisex"]{--advisor-bg:#1f2226!important;}
.advisor-dialog[data-advisor-theme="climate-calor"]{--advisor-bg:#4b2610!important;}
.advisor-dialog[data-advisor-theme="climate-templado"]{--advisor-bg:#202827!important;}
.advisor-dialog[data-advisor-theme="climate-frio"]{--advisor-bg:#081827!important;}

/* Botón exclusivo para volver a resultados del asesor desde una ficha abierta
   a partir de esas recomendaciones. */
.dialog-back{
  position:fixed;
  top:max(14px,env(safe-area-inset-top));
  left:14px;
  z-index:31;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid rgba(229,208,167,.22);
  border-radius:50%;
  background:rgba(19,17,14,.54);
  color:#eee3cf;
  font-size:1.15rem;
  line-height:1;
  box-shadow:0 10px 30px rgba(0,0,0,.24);
  backdrop-filter:blur(14px);
}
.dialog-back:hover{transform:translateY(-1px);background:rgba(19,17,14,.78);border-color:rgba(229,208,167,.38)}
.dialog-back[hidden]{display:none!important}
@media(max-width:700px){
  .dialog-back{top:max(14px,env(safe-area-inset-top))!important;left:14px!important;width:38px!important;height:38px!important}
}

/* =========================================================
   SPRINT 5.7 · FONDO INMERSIVO ESTABLE + ESTADO LIMPIO
   ========================================================= */

/* Safari/iPhone: las zonas visibles detrás de las barras del navegador usan
   un color real de página y lo interpolan durante la misma duración que el
   reveal. El diálogo no recibe el fondo final antes de que termine la animación. */
html.advisor-open,
body.advisor-open{
  background-color:var(--advisor-browser-bg,#171a1f)!important;
  background-image:none!important;
  transition:background-color 2.18s linear!important;
}
.advisor-dialog[open]::before{
  background:var(--advisor-bg,#171a1f)!important;
}
.advisor-dialog[open]::backdrop{
  background:var(--advisor-browser-bg,var(--advisor-bg,#171a1f))!important;
  transition:background-color 2.18s linear!important;
}

/* El background definitivo nunca hace una segunda interpolación al finalizar
   el círculo: la propia capa animada ya mostró exactamente ese mismo fondo. */
.advisor-dialog{
  transition:color .36s ease!important;
}
.advisor-dialog.is-theme-committing{
  transition:none!important;
}

/* Reveal continuo, sin escalones intermedios. */
.advisor-theme-ripple.is-animating{
  animation:advisorFullScreenReveal 2.2s linear both!important;
}
@keyframes advisorFullScreenReveal{
  from{
    opacity:1;
    clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
  to{
    opacity:1;
    clip-path:circle(var(--advisor-ripple-radius,1500px) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));
  }
}

/* La X del Asesor/resultados siempre es la capa superior, incluso cuando las
   tarjetas con backdrop-filter crean sus propios contextos de composición. */
.advisor-close,
.advisor-dialog.is-results .advisor-close{
  position:fixed!important;
  z-index:2147483000!important;
  pointer-events:auto!important;
  isolation:isolate!important;
  transform:translateZ(0);
}
.advisor-results,
.advisor-recommendations,
.advisor-result-card{
  z-index:auto!important;
}

/* Mantiene el área de resultados por debajo de los controles flotantes. */
.advisor-dialog.is-results .advisor-results{
  position:relative!important;
  z-index:4!important;
}

/* La flecha de retorno desde una coincidencia sigue siendo exclusiva de ese
   flujo y queda claramente separada de la X de salida al Home. */
.dialog-back{
  z-index:2147482999!important;
}

@media(prefers-reduced-motion:reduce){
  html.advisor-open,body.advisor-open{transition:none!important}
}


/* =========================================================
   SPRINT 5.8 · FULL-SCREEN REAL + TRANSICIÓN SIN CORTE
   ========================================================= */
/* Una sola fuente visual para el fondo exterior del navegador y del Asesor. */
html.advisor-open,
body.advisor-open{
  background:var(--advisor-browser-fill,var(--advisor-browser-bg,#171a1f))!important;
  background-color:var(--advisor-browser-bg,#171a1f)!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-attachment:fixed!important;
  transition:none!important;
}
.advisor-dialog[open]::backdrop,
.advisor-dialog[open]::before{
  background:var(--advisor-browser-fill,var(--advisor-browser-bg,var(--advisor-bg,#171a1f)))!important;
  background-color:var(--advisor-browser-bg,var(--advisor-bg,#171a1f))!important;
  background-size:cover!important;
  transition:none!important;
}

/* El estado permanente usa EXACTAMENTE el mismo background de la capa de reveal. */
.advisor-dialog[data-advisor-theme="category-caballero"]{
  --advisor-bg:#07101b!important;
  background:radial-gradient(circle at 72% 18%,rgba(52,91,137,.32),transparent 38%),linear-gradient(145deg,#07101b,#0d1724 64%,#111820)!important;
}
.advisor-dialog[data-advisor-theme="category-dama"]{
  --advisor-bg:#260710!important;
  background:radial-gradient(circle at 72% 16%,rgba(150,38,73,.32),transparent 40%),linear-gradient(145deg,#260710,#491224 65%,#2a0b14)!important;
}
.advisor-dialog[data-advisor-theme="category-unisex"]{
  --advisor-bg:#1f2226!important;
  background:radial-gradient(circle at 70% 16%,rgba(185,189,194,.18),transparent 40%),linear-gradient(145deg,#1f2226,#353a40 68%,#24282c)!important;
}
.advisor-dialog[data-advisor-theme="climate-calor"]{
  --advisor-bg:#4b2610!important;
  background:linear-gradient(180deg,#4b2610 0%,#7b421b 48%,#b56a2b 100%)!important;
}
.advisor-dialog[data-advisor-theme="climate-templado"]{
  --advisor-bg:#202827!important;
  background:linear-gradient(155deg,#202827 0%,#45504d 64%,#2a3331 100%)!important;
}
.advisor-dialog[data-advisor-theme="climate-frio"]{
  --advisor-bg:#081827!important;
  background:linear-gradient(155deg,#081827 0%,#123a5c 68%,#0c2438 100%)!important;
}

/* El reveal no cambia de opacidad al final: solo crece hasta cubrir la vista. */
.advisor-theme-ripple.is-animating{
  opacity:1!important;
  animation:advisorSeamlessFullReveal 2.2s cubic-bezier(.18,.70,.20,1) both!important;
}
@keyframes advisorSeamlessFullReveal{
  from{clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));}
  to{clip-path:circle(var(--advisor-ripple-radius,1600px) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));}
}
.advisor-dialog.is-theme-committing{transition:none!important}

/* Resultados: el mismo lienzo inmersivo se conserva de borde a borde. */
.advisor-dialog.is-results[open]{
  min-width:100vw!important;
  min-height:100dvh!important;
  background-size:cover!important;
}



/* =========================================================
   SPRINT 5.9 · REVEAL ÚNICO + SAFARI SIN CAMBIO PREVIO
   ========================================================= */
/* El lienzo exterior usa color sólido para que Safari pueda tintar sus barras;
   el gradiente vive dentro del diálogo y en la capa de reveal. */
html.advisor-open,
body.advisor-open{
  background:var(--advisor-browser-bg,#171a1f)!important;
  background-color:var(--advisor-browser-bg,#171a1f)!important;
  transition:none!important;
}
.advisor-dialog[open]::backdrop,
.advisor-dialog[open]::before{
  background:var(--advisor-browser-bg,var(--advisor-bg,#171a1f))!important;
  background-color:var(--advisor-browser-bg,var(--advisor-bg,#171a1f))!important;
  transition:none!important;
}
/* La animación es una sola interpolación continua y permanece totalmente opaca
   mientras cubre la pantalla. */
.advisor-theme-ripple.is-animating{
  opacity:1!important;
  animation:advisorSingleReveal 2.18s linear both!important;
}
@keyframes advisorSingleReveal{
  from{clip-path:circle(0 at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));}
  to{clip-path:circle(var(--advisor-ripple-radius,1800px) at var(--advisor-ripple-x,50%) var(--advisor-ripple-y,50%));}
}
/* Al comprometer el estado final se desactiva cualquier transición heredada;
   la capa de reveal aún está encima, por lo que no hay frame visible de cambio. */
.advisor-dialog.is-theme-committing,
.advisor-dialog.is-theme-committing *{
  transition-property:none!important;
}
.advisor-dialog.is-results[open]{
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  border-radius:0!important;
}

/* =========================================================
   SPRINT 6.0 · MOTOR VISUAL ÚNICO / SAFARI FULL-SCREEN
   Una sola fuente de color: reveal, fondo final y lienzo extendido.
   ========================================================= */
:root{--advisor-theme-duration:1680ms}

/* Safari toma el fondo extendido de html/body. No usamos gradientes aquí:
   el mismo color sólido que revela el Asesor es el que existe detrás del
   Liquid Glass superior e inferior. */
html.advisor-open,
body.advisor-open{
  background-image:none!important;
  background-color:var(--advisor-browser-bg,#171a1f)!important;
  transition:none!important;
}
html.advisor-open.advisor-chrome-animating,
body.advisor-open.advisor-chrome-animating{
  transition:background-color var(--advisor-theme-duration) cubic-bezier(.18,.72,.16,1)!important;
}

/* El diálogo ya no tiene un segundo gradiente que pueda diferir del reveal. */
.advisor-dialog{
  --advisor-bg:#171a1f!important;
  background-image:none!important;
  background-color:var(--advisor-bg)!important;
  transition:none!important;
}
.advisor-dialog[data-advisor-theme="neutral"]{--advisor-bg:#171a1f!important}
.advisor-dialog[data-advisor-theme="category-caballero"]{--advisor-bg:#0d2742!important;background:#0d2742!important}
.advisor-dialog[data-advisor-theme="category-dama"]{--advisor-bg:#671b34!important;background:#671b34!important}
.advisor-dialog[data-advisor-theme="category-unisex"]{--advisor-bg:#555b61!important;background:#555b61!important}
.advisor-dialog[data-advisor-theme="climate-calor"]{--advisor-bg:#7a3d10!important;background:#7a3d10!important}
.advisor-dialog[data-advisor-theme="climate-templado"]{--advisor-bg:#45504d!important;background:#45504d!important}
.advisor-dialog[data-advisor-theme="climate-frio"]{--advisor-bg:#123a5c!important;background:#123a5c!important}

/* Backdrop y superficie que cubre el rebote/overscroll comparten el mismo color. */
.advisor-dialog[open]::backdrop,
.advisor-dialog[open]::before{
  background-image:none!important;
  background-color:var(--advisor-browser-bg,#171a1f)!important;
  transition:none!important;
}
html.advisor-chrome-animating .advisor-dialog[open]::before,
body.advisor-chrome-animating .advisor-dialog[open]::before{
  transition:background-color var(--advisor-theme-duration) cubic-bezier(.18,.72,.16,1)!important;
}

/* Reveal GPU-friendly: un círculo físico escalado con transform. No clip-path. */
.advisor-theme-ripple{
  position:fixed!important;
  inset:auto!important;
  left:var(--advisor-ripple-x,50%)!important;
  top:var(--advisor-ripple-y,50%)!important;
  width:var(--advisor-ripple-size,1px)!important;
  height:var(--advisor-ripple-size,1px)!important;
  border-radius:50%!important;
  background:var(--advisor-ripple-color,transparent)!important;
  opacity:0!important;
  transform:translate3d(-50%,-50%,0) scale(.001)!important;
  transform-origin:50% 50%!important;
  clip-path:none!important;
  animation:none!important;
  will-change:transform!important;
  contain:strict!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  pointer-events:none!important;
  z-index:3!important;
}
.advisor-theme-ripple::before,
.advisor-theme-ripple::after{display:none!important}
.advisor-theme-ripple.is-animating{
  opacity:1!important;
  animation:none!important;
}

/* Todo el contenido permanece encima del reveal. */
.advisor-atmosphere{z-index:2!important}
.advisor-head,.advisor-steps,.advisor-results,.advisor-actions,.advisor-close{z-index:5!important}

/* Las capas atmosféricas aportan contexto sin alterar el color base. */
.advisor-atmosphere{
  background:transparent!important;
}

/* Resultados también usan exactamente el lienzo extendido del tema vigente. */
.advisor-dialog.is-results[open]{
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  border-radius:0!important;
  background-color:var(--advisor-bg,#171a1f)!important;
}

@media(prefers-reduced-motion:reduce){
  html.advisor-open.advisor-chrome-animating,
  body.advisor-open.advisor-chrome-animating{transition:none!important}
}

/* SPRINT 6.0.1 · Fill interno para composición GPU estable. */
.advisor-theme-ripple{
  background:transparent!important;
  transform:translate3d(-50%,-50%,0)!important;
  opacity:0!important;
  overflow:visible!important;
}
.advisor-theme-ripple.is-animating{opacity:1!important}
.advisor-theme-ripple__fill{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  border-radius:50%;
  background:var(--advisor-ripple-color,transparent);
  transform:translateZ(0) scale(.001);
  transform-origin:50% 50%;
  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  pointer-events:none;
}
/* La superficie del backdrop acompaña la misma transición del lienzo extendido. */
html.advisor-chrome-animating .advisor-dialog[open]::backdrop,
body.advisor-chrome-animating .advisor-dialog[open]::backdrop,
html.advisor-chrome-animating .advisor-dialog[open]::before,
body.advisor-chrome-animating .advisor-dialog[open]::before{
  transition:background-color var(--advisor-theme-duration) cubic-bezier(.18,.72,.16,1)!important;
}
/* Corrección de especificidad detectada en prueba real: ninguna regla [open]
   puede tomar --advisor-browser-bg como fondo del diálogo antes del commit. */
.advisor-dialog[open]{
  background:var(--advisor-bg,#171a1f)!important;
  background-color:var(--advisor-bg,#171a1f)!important;
  background-image:none!important;
}
/* La navegación inferior es vidrio, no una placa opaca: el tema/reveal se ve detrás. */
.advisor-actions{
  background:rgba(12,14,18,.22)!important;
  -webkit-backdrop-filter:blur(24px) saturate(135%)!important;
  backdrop-filter:blur(24px) saturate(135%)!important;
}


/* =========================================================
   SPRINT 6.1 · SAFARI SAFE-AREA / UNDER-PAGE REAL
   Solo afecta el lienzo que Safari ve detrás de su Liquid Glass.
   ========================================================= */
html.advisor-open,
body.advisor-open{
  width:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  background-image:none!important;
  background-color:var(--advisor-browser-bg,#171a1f)!important;
}
/* Safari puede derivar el tinte de la página que existe debajo de un elemento
   del top-layer. Mientras el Asesor está abierto, ocultamos el Home/catálogo
   subyacente para que la única superficie disponible sea el color del tema. */
body.advisor-open > main,
body.advisor-open > .site-footer,
body.advisor-open > #catalogSearchDock{
  visibility:hidden!important;
}
/* Under-page sólido: cubre rebote, overscroll y cualquier franja que Safari
   revele al expandir/contraer sus barras. El dialog, al vivir en top-layer,
   permanece por encima de esta superficie. */
body.advisor-open::before{
  content:"";
  position:fixed;
  inset:-100lvh -20vw;
  z-index:2147480000;
  pointer-events:none;
  background:var(--advisor-browser-bg,#171a1f)!important;
  transition:none!important;
}
body.advisor-open.advisor-chrome-animating::before{
  transition:background-color var(--advisor-theme-duration) cubic-bezier(.18,.72,.16,1)!important;
}
/* El propio top-layer cubre siempre el viewport físico disponible. */
.advisor-dialog[open]{
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-width:100vw!important;
  min-height:100dvh!important;
}
@supports(height:100lvh){
  .advisor-dialog[open]::before{min-height:220lvh!important}
}