/* Halloween 2026, "Night of the Open Eye": one seasonal section on the front door.
   Linked from index.html only. To take it down after the season, remove the <link> to this file
   and the section with id "open-eye" from index.html, then refresh HOME_FREEZE_MANIFEST.json.
   Uses only the look C tokens set in front-door.css: no new colours, type or button shapes.
   Words sit beside or below each picture, never on it. No text under 14px; buttons stay 48px tall. */

.open-eye-hero{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);align-items:center}
.open-eye-art{width:100%;aspect-ratio:2/3;object-fit:cover;background:var(--ns-bg-2)}
.open-eye-words{display:flex;flex-direction:column;gap:.8rem;padding:1.75rem 2rem}
.open-eye-words h2{font-size:clamp(28px,4vw,48px)}
.open-eye-words p{color:var(--ns-muted);max-width:52ch}
.open-eye-words .eyebrow{color:var(--ns-gold);font-size:14px}
.open-eye-words .actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.4rem}
.open-eye-note{font-size:15px}

.open-eye-shop{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1rem}
/* wide screens: picture on the left of each card, words on the right */
@media (min-width:721px){
  .open-eye-shop .pictured{--pic:min(38%,200px);min-height:200px}
  .open-eye-shop .pictured .card-pic{position:absolute;inset:0 auto 0 0;width:var(--pic);height:100%;aspect-ratio:auto}
  .open-eye-shop .pictured .card-body{margin-left:var(--pic)}
}

@media (max-width:720px){
  .open-eye-hero{grid-template-columns:minmax(0,1fr)}
  .open-eye-art{aspect-ratio:4/5;object-position:50% 40%}
  .open-eye-words{gap:.55rem;padding:1rem 1rem 1.15rem}
  .open-eye-words h2{font-size:26px}
  .open-eye-words .actions{margin-top:.2rem}
  .open-eye-words .actions .button{flex:1 1 100%}
  .open-eye-note{font-size:14px}
  .open-eye-shop{gap:.6rem;margin-top:.6rem}
}