/* Section « Boisson et snack » (livret) + page frigo.html — uniquement Le Refuge Éclatant */

/* ── Section dans le livret ── */
.fr-card { max-width: 560px; margin: 0 auto; text-align: center; }
.fr-card .fr-intro { color: var(--ink-soft); line-height: 1.6; margin: 0 auto 22px; max-width: 460px; }
.fr-box { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 10px 24px; box-shadow: var(--shadow); text-align: left; }
.fr-cta-wrap { margin-top: 28px; text-align: center; }
.fr-note { color: var(--ink-faint); font-size: .82rem; margin-top: 14px; line-height: 1.5; }

/* Liste de produits (livret + page) */
.fr-list { list-style: none; margin: 0; padding: 0; }
.fr-list li { display: flex; align-items: baseline; gap: 10px; padding: 13px 0; border-bottom: 1px solid rgba(155,134,99,.16); }
.fr-list li:last-child { border-bottom: 0; }
.fr-name { color: var(--ink); }
.fr-dots { flex: 1; border-bottom: 1px dotted var(--gold-light); transform: translateY(-4px); min-width: 12px; }
.fr-price { font-family: 'Cormorant Garamond', serif; font-size: 1.35rem; font-weight: 500; color: var(--gold-dark); white-space: nowrap; }
.hz-main .fr-list { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 6px 20px; box-shadow: var(--shadow); text-align: left; max-width: 460px; margin: 0 auto; }

/* Bouton « Ouvrir le frigo » : bleu glacier, reflet qui glisse, flocon qui tourne */
.fr-btn {
  position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 12px;
  padding: 16px 34px; border-radius: 999px; color: #fff; text-decoration: none; cursor: pointer; border: 0;
  font-family: var(--font-sans); font-weight: 500; font-size: .86rem; letter-spacing: .16em; text-transform: uppercase;
  background: linear-gradient(120deg, #1d8fd1, #5fd0e6, #1d8fd1) 0 0 / 200% 100%;
  box-shadow: 0 12px 24px -10px rgba(29,143,209,.85); text-shadow: 0 1px 2px rgba(0,40,80,.3);
  animation: ctaFlow 4s ease-in-out infinite, ctaFloat 3s ease-in-out infinite; transition: filter .25s;
}
.fr-btn:hover { filter: brightness(1.08) saturate(1.1); color: #fff; }
.fr-btn::before { content: "❄"; font-size: 1.05rem; display: inline-block; animation: frSpin 7s linear infinite; text-shadow: none; }
.fr-btn::after { content: ""; position: absolute; top: 0; left: -70%; width: 40%; height: 100%; pointer-events: none; background: linear-gradient(100deg, transparent, rgba(255,255,255,.6), transparent); transform: skewX(-20deg); animation: btnShine 3s ease-in-out infinite; }
@keyframes frSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .fr-btn, .fr-btn::before, .fr-btn::after { animation: none; } }

/* ── Page frigo.html ── */
.fr-sub { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 500; font-size: 1.6rem; margin: 26px 0 12px; }
.fr-h2 { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 500; font-size: 1.9rem; margin: 6px 0; }
.fr-steps { list-style: none; margin: 28px auto 26px; padding: 0; max-width: 460px; text-align: left; display: grid; gap: 12px; }
.fr-steps li { display: flex; gap: 14px; align-items: flex-start; color: var(--ink-soft); line-height: 1.5; font-size: .95rem; }
.fr-steps b { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--gold); color: #fff; display: grid; place-items: center; font-weight: 500; font-size: .85rem; }
.fr-steps strong { color: var(--ink); font-weight: 500; }
.hz-form .fr-check { display: flex; gap: 12px; align-items: flex-start; font-size: .85rem; line-height: 1.5; }
.hz-form .fr-check input { flex: none; width: 20px; height: 20px; margin-top: 2px; padding: 0; accent-color: var(--gold); }
.hz-pay.fr-open { background: linear-gradient(120deg, #1d8fd1, #5fd0e6, #1d8fd1) 0 0 / 200% 100%; animation: ctaFlow 4s ease-in-out infinite; box-shadow: 0 12px 24px -10px rgba(29,143,209,.85); border-radius: 999px; }
.hz-pay.fr-open:hover:not(:disabled) { background: linear-gradient(120deg, #1d8fd1, #5fd0e6, #1d8fd1) 0 0 / 200% 100%; filter: brightness(1.08); }
.fr-already { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: #eef8fc; border: 1px solid #bfe3f2; color: #14658f; border-radius: 12px; padding: 12px 16px; margin: 0 auto 8px; max-width: 460px; font-size: .9rem; }
.fr-link { font: inherit; font-weight: 500; background: none; border: 0; color: #14658f; text-decoration: underline; cursor: pointer; }

/* Fenêtre du code */
.fr-modal { position: fixed; inset: 0; z-index: 9999; background: rgba(40,30,20,.55); backdrop-filter: blur(4px); display: grid; place-items: center; padding: 20px; opacity: 0; transition: opacity .3s; }
.fr-modal.show { opacity: 1; }
.fr-modal-card { background: #fff; border-radius: 20px; padding: 32px 26px 26px; max-width: 400px; width: 100%; text-align: center; box-shadow: 0 30px 60px -20px rgba(0,0,0,.45); transform: translateY(24px) scale(.96); transition: transform .45s cubic-bezier(.2,.8,.2,1); border-top: 4px solid #1d8fd1; }
.fr-modal.show .fr-modal-card { transform: none; }
.fr-modal-card h2 { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 500; font-size: 2rem; margin: 6px 0 4px; color: var(--ink); }
.fr-modal-lead { color: var(--ink-soft); margin: 0 0 6px; }
.fr-digits { font-size: clamp(3.4rem, 18vw, 4.6rem) !important; color: #0e4f78 !important; background: #eef8fc; border: 1px dashed #8fcbe6; border-radius: 14px; padding: 14px 0 14px .22em; margin: 10px 0 14px; }
.fr-modal-note { color: var(--ink-soft); font-size: .88rem; line-height: 1.5; margin: 0 0 18px; }
.fr-ok { font: inherit; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; font-size: .82rem; background: var(--gold); color: #fff; border: 0; border-radius: 999px; padding: 13px 28px; cursor: pointer; }
.fr-ok:hover { background: var(--gold-dark); }
