/* 백년살롱 — 프리미엄 웨딩 커머스 · 매거진. 아이보리·블러시 바탕 + 버건디, 세리프 제목 + 가는 산세리프, 얇은 테두리 버튼. */
:root{--bg:#faf6f1;--blush:#f3e4e0;--ink:#2a1d1f;--ink2:#6a5a5c;--w:#7a1f33;--line:#e6dbd4;
  --serif:"Noto Serif KR",serif;--f:"Noto Sans KR",-apple-system,"Apple SD Gothic Neo",system-ui,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;font-family:var(--f);font-weight:300;color:var(--ink);font-size:15px;line-height:1.6;background:var(--bg)}
a{color:inherit;text-decoration:none}
.hd{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;max-width:1100px;margin:0 auto;padding:16px 18px;font-size:13px;font-weight:500}
.hd-l{display:flex;gap:14px}.hd-r{justify-self:end}
.logo{font-family:var(--serif);font-weight:600;font-size:21px;letter-spacing:.18em;color:var(--w)}
.ph{background:#e8dcd6;color:#4a3a3c;display:grid;place-items:center;font-size:12px;font-weight:500;text-align:center;width:100%;overflow:hidden}
.hero{position:relative}
.hero .ph,.hero img{display:block;width:100%;height:auto;aspect-ratio:4/5;max-height:86vh;object-fit:cover}
.hero-txt{position:absolute;inset:auto 0 0 0;padding:40px 22px 34px;text-align:center;color:#fff;background:linear-gradient(transparent,rgba(42,29,31,.55))}
.kick{margin:0;font-family:var(--serif);font-style:italic;font-size:15px;letter-spacing:.12em}
h1{font-family:var(--serif);font-weight:400;font-size:38px;margin:10px 0 22px;letter-spacing:-.01em}
.line-btn{display:inline-block;border:1px solid currentColor;padding:12px 30px;font-size:14px;letter-spacing:.14em;font-weight:500}
.cats{display:flex;justify-content:center;gap:18px;padding:30px 12px 10px;max-width:1100px;margin:0 auto}
.cats a{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13px;font-weight:500}
.cats .ph,.cats img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
h2{font-family:var(--serif);font-weight:400;font-style:italic;font-size:26px;text-align:center;margin:0 0 18px;color:var(--w)}
.shop{max-width:1100px;margin:0 auto;padding:36px 16px 10px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 12px}
.grid a{display:flex;flex-direction:column;gap:2px}
.grid .ph,.grid img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;margin-bottom:8px}
.grid b{font-family:var(--serif);font-weight:600;font-size:16px}
.grid span{font-size:12.5px;color:var(--ink2)}
.grid em{font-style:normal;font-weight:500;font-size:15px;margin-top:2px}
.grid s{color:var(--ink2);font-weight:300}
.grid i{font-style:normal;color:var(--w);font-weight:500}
.also{list-style:none;margin:26px 0 0;padding:0;border-top:1px solid var(--ink)}
.also a{display:flex;justify-content:space-between;padding:13px 2px;border-bottom:1px solid var(--line);font-family:var(--serif)}
.also span{font-family:var(--f);color:var(--ink2);font-size:14px}
.real{padding:44px 0 10px;background:var(--blush);margin-top:36px}
.rail{display:flex;gap:10px;overflow-x:auto;padding:0 16px 24px;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail .ph,.rail img{flex:0 0 200px;width:200px;height:auto;aspect-ratio:3/4;object-fit:cover}
.faq{max-width:720px;margin:0 auto;padding:44px 18px 20px}
.about{font-family:var(--serif);text-align:center;color:var(--ink2);margin:0 0 20px}
.nfaq{margin:0;padding:0;list-style:none;counter-reset:n}
.nfaq li{counter-increment:n;display:grid;grid-template-columns:44px 1fr;column-gap:8px;padding:16px 0;border-top:1px solid var(--line)}
.nfaq li::before{content:counter(n,decimal-leading-zero);grid-row:1/3;font-family:var(--serif);font-size:20px;color:var(--w)}
.nfaq b{font-weight:500}
.nfaq p{margin:4px 0 0;color:var(--ink2)}
.foot{margin-top:30px;padding:34px 18px 50px;text-align:center;font-size:12px;color:var(--ink2);line-height:1.8;border-top:1px solid var(--line)}
.f-logo{font-family:var(--serif);font-weight:600;letter-spacing:.2em;color:var(--w);font-size:17px;margin:0 0 10px}
.foot .biz a{color:var(--ink2)}
@media (min-width:820px){
  .hero .ph,.hero img{aspect-ratio:16/8}
  h1{font-size:54px}
  .grid{grid-template-columns:repeat(4,1fr)}
  .rail .ph,.rail img{flex-basis:260px;width:260px}
}

/* ── 신청: 웨딩 폼 ───────────────────────── */
.rsvp-page{background:var(--bg)}
.rsvp-wrap{max-width:520px;margin:0 auto;padding:0 18px 50px}
.rsvp-wrap .top{display:flex;justify-content:space-between;align-items:center;height:62px;border-bottom:1px solid var(--line);margin-bottom:22px}
.rsvp-wrap .mark{font-family:var(--serif);font-weight:600;letter-spacing:.18em;color:var(--w);font-size:18px}
.rsvp-wrap .latin{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--ink2)}
.card2{position:relative;background:#fff;border:1px solid var(--line);padding:30px 22px 24px;animation:fade .25s ease both}
@keyframes fade{from{opacity:0}to{opacity:1}}
.card2 .pg{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--w);text-align:center;margin:0}
.card2 h1{font-size:26px;text-align:center;margin:6px 0 22px;color:var(--ink)}
.ln{display:block;margin:0 0 14px}
.ln span{display:block;font-size:12px;font-weight:500;letter-spacing:.06em;color:var(--ink2);margin-bottom:4px}
.ln input,.ln select,.ln textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink2);border-radius:0;padding:8px 1px;outline:none}
.ln textarea{height:100px;resize:none;border:1px solid var(--line);padding:10px}
.ln input:focus,.ln select:focus,.ln textarea:focus{border-color:var(--w)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mini{font-size:13px;color:var(--ink2);display:flex;gap:6px;align-items:center;margin:-6px 0 14px}
.mini input,.agree input{accent-color:var(--w)}
.acts{display:flex;gap:12px;align-items:center;margin-top:24px}
.acts .bk{background:none;border:0;font:inherit;color:var(--ink2);cursor:pointer;font-size:14px}
.acts .nx{flex:1;text-align:center;font:inherit;font-weight:500;letter-spacing:.14em;font-size:14px;background:transparent;color:var(--w);border:1px solid var(--w);padding:13px;cursor:pointer}
.acts .nx:hover{background:var(--w);color:#fff}
.acts .nx:disabled{opacity:.5}
.err{color:var(--w);font-size:13.5px;text-align:center;min-height:20px;margin:10px 0 0}
.seal{display:block;width:100%;margin:6px 0 0;font:inherit;font-weight:500;letter-spacing:.14em;font-size:15px;background:var(--w);color:#fff;border:0;padding:15px;cursor:pointer}
.seal:disabled{opacity:.6}
.sum{list-style:none;margin:0 0 16px;padding:0;font-size:14.5px;border-top:1px solid var(--line)}
.sum li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.sum li b{font-weight:300;color:var(--ink2)}
.agree{font-size:12.5px;color:var(--ink2);display:flex;gap:8px;align-items:flex-start;margin:0 0 14px}
.agree input{margin-top:4px}
.amt{text-align:center;font-family:var(--serif);font-size:40px;color:var(--w);margin:4px 0 14px}
.acct{text-align:center;font-size:14.5px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;margin-bottom:14px}
.acct button{font:inherit;font-size:12.5px;margin-left:6px;background:none;border:1px solid var(--ink);color:var(--ink);padding:2px 10px;cursor:pointer}
.planpick{display:grid;gap:0;border-top:1px solid var(--line)}
.planpick button{display:flex;justify-content:space-between;font:inherit;font-size:15px;background:transparent;border:0;border-bottom:1px solid var(--line);padding:13px 2px;cursor:pointer;color:var(--ink);font-family:var(--serif)}
.planpick button em{font-style:normal;font-family:var(--f);color:var(--ink2)}
.planpick button.on{color:var(--w)}

/* 2026-11-09 수정: 제목이 얼굴을 가리지 않게 — 모바일은 아래쪽 옅은 막 위에 작게, 넓은 화면은 사진 아래 띠로 */
.hero img{object-position:center 35%}
.hero-txt{padding:60px 20px 22px !important;background:linear-gradient(transparent,rgba(42,29,31,.62) 70%) !important}
.hero-txt h1{font-size:30px;margin:6px 0 14px}
@media (min-width:820px){
  .hero-txt{position:static !important;background:var(--bg) !important;color:var(--ink) !important;padding:34px 20px 10px !important}
  .hero-txt h1{font-size:44px}
  .hero .line-btn{color:var(--w)}
  .hero .ph,.hero img{aspect-ratio:16/7 !important;max-height:none}
}