/* ==========================================================================
   Atlas Del Whisky — estilos de la ficha de whisky (Fase 4)
   Complementa atlas.css + motion.css. Prefijo fw- (ficha de whisky).
   ========================================================================== */

/* ---- Breadcrumb (misma receta que las páginas de país) ---- */
.breadcrumb{display:flex;align-items:center;gap:.55rem;padding:.7rem 1.6rem;
  border-bottom:1px solid var(--line);background:rgba(12,10,7,.5);font-size:.78rem;color:var(--muted);
  flex-wrap:wrap}
.breadcrumb a{color:var(--gold);transition:color .2s}
.breadcrumb a:hover{color:var(--gold-bright)}
.breadcrumb .sep{color:var(--muted-2)}
.breadcrumb .cur{color:var(--cream)}
.breadcrumb svg{width:14px;height:14px;color:var(--gold);flex:none}

/* ---- Layout de la ficha ---- */
.ficha-main{flex:1;width:100%}
.ficha{display:grid;grid-template-columns:minmax(300px,420px) 1fr;gap:2.6rem;
  padding:2.4rem 2.2rem 3rem;max-width:1240px;margin:0 auto;width:100%}

/* ---- Columna izquierda: botella sobre pergamino ---- */
.ficha-left{min-width:0}
.botella-stage{position:relative;border:1px solid var(--line-strong);border-radius:12px;
  padding:2.2rem 1.6rem 1.5rem;box-shadow:var(--shadow);overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(231,216,181,.16), rgba(231,216,181,.05) 55%, rgba(20,17,12,0) 100%),
    linear-gradient(180deg,#221c12,#171208)}
.botella-stage::before{content:"";position:absolute;inset:9px;border:1px solid var(--line);
  border-radius:8px;pointer-events:none}
.botella-stage::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.06;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.botella-stage svg{width:min(300px,74%);margin:0 auto;position:relative;z-index:1;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.5))}
.botella-img{width:auto;max-width:86%;max-height:520px;object-fit:contain;margin:0 auto;display:block;position:relative;z-index:1;border-radius:8px;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.5))}
.botella-cap{position:relative;z-index:1;text-align:center;margin-top:1rem;
  font-family:var(--serif-body);font-style:italic;color:var(--muted);font-size:.95rem}
@media (min-width:941px){.botella-stage{position:sticky;top:86px}}

/* ---- Columna derecha ---- */
.ficha-right{min-width:0}
.fw-head .eyebrow{letter-spacing:.26em}
.fw-name{font-family:var(--serif-display);font-weight:700;color:var(--cream);
  font-size:clamp(1.9rem,3.4vw,2.7rem);line-height:1.08;letter-spacing:.02em;margin-top:.45rem}
.fw-dest{display:inline-flex;align-items:center;gap:.45rem;margin-top:.6rem;color:var(--gold);
  font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;transition:color .2s}
.fw-dest:hover{color:var(--gold-bright)}
.fw-dest svg{width:14px;height:14px;transition:transform .2s}
.fw-dest:hover svg{transform:translateX(3px)}

/* ---- Meta grid (ficha técnica) ---- */
.fw-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-top:1.5rem}
.fw-mi{border:1px solid var(--line);border-radius:8px;padding:.55rem .7rem;background:rgba(201,162,74,.04)}
.fw-mi .k{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.fw-mi .v{font-family:var(--serif-body);font-size:1.05rem;color:var(--cream);margin-top:.12rem;line-height:1.25}

/* ---- Notas de cata ---- */
.fw-cata{display:flex;flex-direction:column;gap:.65rem}
.fw-crow{display:grid;grid-template-columns:38px 1fr;gap:.75rem;align-items:start;
  border:1px solid var(--line);border-radius:9px;padding:.7rem .8rem;background:rgba(201,162,74,.03)}
.fw-cic{width:38px;height:38px;border:1px solid var(--line-strong);border-radius:50%;
  display:grid;place-items:center;color:var(--gold)}
.fw-cic svg{width:18px;height:18px}
.fw-ck{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.fw-cv{font-family:var(--serif-body);font-size:1.08rem;color:#e4d9bf;margin-top:.15rem;line-height:1.4;
  display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.fw-swatch{width:15px;height:15px;border-radius:50%;flex:none;
  box-shadow:0 0 0 1px rgba(0,0,0,.55),0 0 10px rgba(201,162,74,.35)}

/* ---- Niveles (pips de cata: rombos rellenables, no barras de progreso) ---- */
.fw-lvls{display:flex;flex-direction:column;gap:.8rem}
.fw-lvl{display:grid;grid-template-columns:96px 1fr 44px;gap:.8rem;align-items:center}
.fw-lvl-name{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.fw-pips{display:flex;gap:.5rem;align-items:center}
.fw-pip{width:14px;height:14px;flex:none;transform:rotate(45deg);border-radius:2px;
  border:1px solid var(--line-strong);background:rgba(20,17,12,.4)}
.fw-pip.on{border-color:var(--gold);
  background:linear-gradient(135deg,var(--gold-bright),var(--gold) 55%,var(--gold-deep));
  box-shadow:0 0 9px rgba(201,162,74,.5);
  animation:pipPop .5s cubic-bezier(.34,1.56,.64,1) both;animation-delay:var(--pd,0s)}
@keyframes pipPop{from{transform:rotate(45deg) scale(0);opacity:0}to{transform:rotate(45deg) scale(1);opacity:1}}
.fw-lvl-val{font-family:var(--serif-body);font-size:1.05rem;color:var(--gold-bright);text-align:right}
.fw-lvl-val span{color:var(--muted-2);font-size:.78rem}
@media (prefers-reduced-motion:reduce){ .fw-pip.on{animation:none} }

/* ---- Premios ---- */
.fw-premios{display:flex;flex-direction:column;gap:.5rem}
.fw-premio{display:flex;gap:.6rem;align-items:center;font-family:var(--serif-body);
  font-size:1.05rem;color:#e4d9bf;line-height:1.3}
.fw-premio svg{width:18px;height:18px;color:var(--gold);flex:none}

/* ---- Tarjeta de precio ---- */
.fw-price{margin-top:1.6rem;border:1px solid var(--line-strong);border-top:2px solid var(--gold);
  border-radius:11px;padding:1.2rem 1.4rem;position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(90,60,40,.4),rgba(31,74,55,.16) 55%,rgba(20,17,12,.5));
  box-shadow:0 10px 30px rgba(0,0,0,.35)}
.fw-price::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;
  border:1px solid var(--line);border-radius:50%;opacity:.5;pointer-events:none}
.fw-price-h{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-bright)}
.fw-price-v{font-family:var(--serif-display);font-size:2.5rem;font-weight:700;
  color:var(--gold-bright);margin-top:.25rem;letter-spacing:.02em;text-shadow:0 2px 14px rgba(201,162,74,.25)}
.fw-price-note{font-family:var(--serif-body);font-style:italic;font-size:.95rem;
  color:var(--muted-2);margin-top:.15rem}
.fw-stars{display:flex;align-items:center;gap:.28rem;margin-top:.75rem}
.fw-star{width:18px;height:18px;color:var(--gold-bright);filter:drop-shadow(0 0 5px rgba(201,162,74,.4))}
.fw-star.off{color:var(--muted-2);opacity:.4;filter:none}
.fw-stars-lbl{margin-left:.5rem;font-size:.64rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted)}

/* ---- Whiskies similares ---- */
.fw-sims{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.fw-sim{display:flex;gap:.65rem;align-items:center;border:1px solid var(--line);border-radius:9px;
  padding:.65rem .75rem;transition:all .18s;background:rgba(201,162,74,.03)}
.fw-sim:hover{border-color:var(--line-strong);background:rgba(201,162,74,.09);transform:translateY(-2px)}
.fw-sim-bottle{width:22px;height:30px;flex:none;filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
.fw-sim-txt{flex:1;min-width:0}
.fw-sim-n{display:block;font-family:var(--serif-body);font-weight:600;font-size:1rem;
  color:var(--cream);line-height:1.15}
.fw-sim-t{display:block;font-size:.64rem;color:var(--muted-2);margin-top:.12rem}
.fw-sim-arrow{color:var(--gold);opacity:.5;flex:none;transition:opacity .2s,transform .2s}
.fw-sim-arrow svg{width:15px;height:15px}
.fw-sim:hover .fw-sim-arrow{opacity:1;transform:translateX(2px)}

/* ---- CTA comparador ---- */
.fw-cta{margin-top:1.7rem}

/* ---- Estado "Ficha en preparación" ---- */
.ficha-empty{max-width:560px;margin:0 auto;padding:4.5rem 1.4rem 5.5rem;text-align:center}
.fe-orn{width:76px;height:76px;margin:0 auto 1.5rem;border:1px solid var(--line-strong);
  border-radius:50%;display:grid;place-items:center;color:var(--gold);
  background:radial-gradient(80% 80% at 50% 30%,rgba(201,162,74,.14),transparent)}
.fe-orn svg{width:32px;height:32px}
.ficha-empty h1{font-family:var(--serif-display);font-size:2rem;font-weight:700;
  letter-spacing:.04em;color:var(--cream)}
.ficha-empty p{font-family:var(--serif-body);font-size:1.15rem;color:var(--muted);
  margin-top:.7rem;line-height:1.55}
.fe-cta{max-width:300px;margin:1.9rem auto 0}

/* ---- Responsive ---- */
@media (max-width:940px){
  .ficha{grid-template-columns:1fr;gap:1.8rem;padding:1.6rem 1.1rem 2.2rem}
  .botella-stage svg{width:min(240px,64%)}
}
@media (max-width:700px){
  .fw-sims{grid-template-columns:1fr}
}
@media (max-width:560px){
  .fw-meta{grid-template-columns:1fr 1fr}
  .fw-lvl{grid-template-columns:82px 1fr 40px;gap:.6rem}
  .breadcrumb{font-size:.72rem}
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  .fw-lvl-fill{transition:none}
  .fw-sim:hover{transform:none}
}

/* ¿Dónde comprar este whisky? — tiendas online (debajo del precio) */
.fw-comprar{margin-top:1.4rem}
.fw-comprar .panel-h4{display:flex;align-items:center;gap:.5rem}
.fw-tiendas{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.7rem}
.fw-tienda{display:flex;gap:.65rem;align-items:center;border:1px solid var(--line);border-radius:9px;
  padding:.6rem .75rem;background:rgba(201,162,74,.04);text-decoration:none;
  transition:border-color .2s,background .2s,transform .2s}
.fw-tienda:hover{border-color:var(--gold);background:rgba(201,162,74,.1);transform:translateY(-2px)}
.fw-tienda-ic{width:20px;height:28px;flex:none;color:var(--gold-bright);filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
.fw-tienda-txt{flex:1;min-width:0}
.fw-tienda-n{display:block;font-family:var(--serif-body);font-weight:600;font-size:1rem;color:var(--cream);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fw-tienda-h{display:block;font-size:.64rem;color:var(--muted-2);margin-top:.1rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fw-tienda .fw-sim-arrow{color:var(--gold);opacity:.5;flex:none;transition:opacity .2s,transform .2s}
.fw-tienda:hover .fw-sim-arrow{opacity:1;transform:translateX(2px)}
@media (max-width:640px){.fw-tiendas{grid-template-columns:1fr}.fw-tienda:hover{transform:none}}
