/* 비수기 할인 프로모션 (2026.9 ~ 2027.3) — 종료 시 이 파일·promo.js·index.html의 promo 블록만 삭제 */

/* ── 본문 할인 섹션 ── */
.promo{background:linear-gradient(120deg,#fff7ed 0%,#fffbeb 100%);border-top:1px solid #fde6c4;border-bottom:1px solid #fde6c4;padding:56px 0}
.promo .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:center}
.promo .kicker{display:inline-flex;align-items:center;gap:8px;background:#c2410c;color:#fff;font-weight:800;font-size:.82rem;padding:6px 14px;border-radius:999px;margin-bottom:14px}
.promo h2{font-size:clamp(1.6rem,3.2vw,2.3rem);color:#7c2d12;margin-bottom:12px;letter-spacing:-.01em}
.promo h2 em{font-style:normal;color:#c2410c}
.promo p.lead{color:#7c4a1e;max-width:520px;margin-bottom:22px}
.promo .actions{display:flex;gap:10px;flex-wrap:wrap}
.promo .btn-orange{background:#c2410c;color:#fff;border-color:#c2410c}
.promo .btn-orange:hover{background:#9a3412;border-color:#9a3412}
.promo .btn-ghost{background:#fff;color:#9a3412;border-color:#fdba74}
.promo .btn-ghost:hover{background:#fff7ed}
.promo-tiles{display:grid;gap:12px}
.promo-tile{background:#fff;border:1px solid #fde6c4;border-radius:14px;padding:18px 20px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;box-shadow:0 6px 20px rgba(124,45,18,.06)}
.promo-tile .num{font-size:1.6rem;font-weight:900;color:#c2410c;letter-spacing:-.02em;white-space:nowrap}
.promo-tile .num small{font-size:.6em;font-weight:700;margin-left:2px}
.promo-tile b{display:block;color:#7c2d12;font-size:.98rem;margin-bottom:2px}
.promo-tile span{font-size:.85rem;color:#8a5a2b;line-height:1.5}
.promo-tile.total{background:#7c2d12;border-color:#7c2d12}
.promo-tile.total .num,.promo-tile.total b{color:#fff}
.promo-tile.total span{color:#fed7aa}
.promo .fine{margin-top:16px;font-size:.8rem;color:#92400e;line-height:1.6}

/* ── 첫 방문 팝업 ── */
.promo-modal{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;padding:20px}
.promo-modal.open{display:flex}
.promo-modal .backdrop{position:absolute;inset:0;background:rgba(6,16,36,.62);backdrop-filter:blur(3px)}
.promo-modal .box{position:relative;width:min(520px,100%);background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.35);animation:promoIn .35s cubic-bezier(.22,.8,.3,1)}
@keyframes promoIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.promo-modal .head{background:linear-gradient(120deg,#0f1f3d,#12459e);color:#fff;padding:26px 28px 22px}
.promo-modal .head .tag{display:inline-block;background:#c2410c;color:#fff;font-size:.78rem;font-weight:800;padding:5px 12px;border-radius:999px;margin-bottom:12px}
.promo-modal .head h3{color:#fff;font-size:1.45rem;line-height:1.3;margin-bottom:6px}
.promo-modal .head p{color:#c9d8f5;font-size:.92rem}
.promo-modal .body{padding:22px 28px 8px}
.promo-modal ul{display:grid;gap:10px}
.promo-modal li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 14px;background:#f5f8fc;border-radius:10px;font-size:.95rem}
.promo-modal li b{color:#c2410c;font-size:1.15rem;font-weight:900;white-space:nowrap}
.promo-modal li.sum{background:#fff7ed;border:1px solid #fdba74}
.promo-modal li.sum b{font-size:1.35rem}
.promo-modal .note{font-size:.78rem;color:#6b7280;margin-top:12px;line-height:1.55}
.promo-modal .cta{display:flex;gap:10px;padding:16px 28px 0}
.promo-modal .cta .btn{flex:1;padding:14px}
.promo-modal .foot{display:flex;justify-content:space-between;align-items:center;padding:14px 28px 18px;font-size:.85rem;color:#6b7280}
.promo-modal .foot label{display:flex;gap:6px;align-items:center;cursor:pointer}
.promo-modal .foot button{background:none;border:0;font-family:inherit;font-weight:700;color:var(--navy);cursor:pointer;font-size:.9rem;padding:6px 4px}
.promo-modal .x{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;border:0;font-size:1.3rem;cursor:pointer;line-height:1}
.promo-modal .x:hover{background:rgba(255,255,255,.26)}

@media (max-width:860px){
  .promo .wrap{grid-template-columns:1fr;gap:24px}
}
@media (max-width:720px){
  .promo{padding:44px 0}
  .promo-modal{padding:0;align-items:flex-end}
  .promo-modal .box{border-radius:20px 20px 0 0;max-height:92vh;overflow:auto}
  .promo-modal .head{padding:22px 20px 18px}
  .promo-modal .body,.promo-modal .cta{padding-left:20px;padding-right:20px}
  .promo-modal .foot{padding:12px 20px calc(22px + env(safe-area-inset-bottom))}
  .promo-modal .cta{flex-direction:column}
  .promo-tile{grid-template-columns:1fr;gap:6px}
}
@media (prefers-reduced-motion:reduce){.promo-modal .box{animation:none}}