/* Flip Box */
.fb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2vw,1.8rem);max-width:1320px;margin:0 auto}
.fb-card{position:relative;aspect-ratio:3/4;perspective:1400px;-webkit-tap-highlight-color:transparent}
.fb-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,.9,.25,1)}
.fb-card[data-axis="y"].is-flipped .fb-inner{transform:rotateY(180deg)}
.fb-card[data-axis="x"].is-flipped .fb-inner{transform:rotateX(-180deg)}
.fb-face{position:absolute;inset:0;border-radius:16px;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.fb-front{background:var(--bg2);box-shadow:0 30px 60px -30px rgba(0,0,0,.85)}
.fb-front img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.fb-card:hover .fb-front img{transform:scale(1.05)}
.fb-front::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,20,40,0) 40%,rgba(8,20,40,.88))}
.fb-front-cap{position:absolute;z-index:1;left:1.2rem;right:1.2rem;bottom:1.1rem;color:#f7f4ee}
.fb-cat{display:block;font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.35rem}
.fb-front .fb-cat{color:var(--m-gold2)}
.fb-face h3{font-size:clamp(1.5rem,2vw,1.9rem);font-style:italic;line-height:1.05}
.fb-hint{display:inline-flex;align-items:center;gap:.4rem;margin-top:.8rem;font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(243,233,220,.8)}
.fb-hint svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fb-back{display:flex;flex-direction:column;justify-content:center;padding:clamp(1.2rem,2.2vw,2rem);background:linear-gradient(160deg,#21180f,#120d09);border:1px solid rgba(var(--gold-rgb),.35);color:var(--cream)}
.fb-card[data-axis="y"] .fb-back{transform:rotateY(180deg)}
.fb-card[data-axis="x"] .fb-back{transform:rotateX(180deg)}
.fb-back p{margin:.8rem 0;color:var(--muted);font-size:.92rem;line-height:1.55}
.fb-back ul{list-style:none;margin:0 0 1rem;padding:0;font-size:.78rem;color:var(--muted)}
.fb-back li{padding:.35rem 0;border-top:1px solid rgba(var(--ink-rgb),.12)}
.fb-back li::before{content:"✦";color:var(--gold);margin-right:.5rem;font-size:.6rem}
.fb-price{margin:auto 0 0!important;font-family:var(--serif);font-size:1.8rem!important;color:var(--gold2)!important}
.fb-toggle{-webkit-appearance:none;appearance:none;position:absolute;inset:0;z-index:2;width:100%;margin:0;padding:0;border:0;background:transparent;border-radius:16px;cursor:pointer}
.fb-toggle:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
/* light theme */
.theme-light .fb-front{box-shadow:0 30px 60px -32px rgba(var(--shadow-rgb),.45)}
.theme-light .fb-back{background:linear-gradient(160deg,#fbf7f1,#f3ebdf);border-color:rgba(var(--gold-rgb),.35);box-shadow:0 30px 60px -32px rgba(var(--shadow-rgb),.45)}
@media (max-width:1000px){.fb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.fb-grid{gap:.8rem}.fb-face h3{font-size:1.25rem}.fb-back p{font-size:.8rem;margin:.5rem 0}.fb-back ul{font-size:.68rem;margin-bottom:.4rem}.fb-back li{padding:.25rem 0}.fb-price{font-size:1.4rem!important}.fb-front-cap{left:.8rem;right:.8rem;bottom:.8rem}.fb-back{padding:1rem}}
/* reduced motion: cross-fade instead of 3D */
@media (prefers-reduced-motion:reduce){
  .fb-inner{transition:none;transform:none!important}
  .fb-face{transform:none!important;transition:opacity .3s}
  .fb-back{opacity:0}
  .fb-card.is-flipped .fb-back{opacity:1}
  .fb-card.is-flipped .fb-front{opacity:0}
}
