/* 구독 창 전용. 스크롤은 표시 중인 모달 바디 하나만 소유한다. */
#subscribeModal [hidden], .subscription-verify-card [hidden] { display:none !important; }
#subscribeModal { --subscription-inset:28px; top:var(--subscription-viewport-top,0px); bottom:auto; height:var(--subscription-viewport-height,100dvh); container:subscription-viewport / size; transition:opacity .2s ease,visibility .2s ease; }
body:has(#subscribeModal.active) #scrollTopBtn { visibility:hidden; pointer-events:none; }
#subscribeModal .modal-content { box-sizing:border-box; display:flex; flex-direction:column; width:min(560px,calc(100% - 24px)); max-height:calc(100% - 24px); padding:20px 0; overflow:clip; transition:transform .2s ease; }
#subscribeModal .modal-content:has([data-sub-view=subscribe]:not([hidden])) { height:min(920px,calc(100% - 24px)); }
#subscribeModal .modal-header { flex:0 0 auto; padding:0 38px 14px 16px; margin:0 var(--subscription-inset) 14px; gap:16px; }
#subscribeModal .modal-icon { flex:0 0 40px; width:40px; height:40px; margin:0; }
#subscribeModal .modal-icon i { font-size:22px; }
#subscribeModal .modal-header h2 { font-size:1.4rem; margin:0; }
#subscribeModal .modal-close { top:8px; right:12px; line-height:1; font-size:28px; }
#subscribeModal .subscription-panels, #subscribeModal [data-sub-view=subscribe], #subscribeModal [data-sub-form=subscribe] { display:flex; flex-direction:column; flex:1 1 auto; min-height:0; }
#subscribeModal .subscribe-form { min-height:0; margin:0; }
#subscribeModal .subscription-fixed-fields, #subscribeModal .subscription-footer { flex:0 0 auto; padding:0 var(--subscription-inset); }
#subscribeModal .subscription-tabs { display:flex; gap:8px; margin:0 var(--subscription-inset) 14px; flex:0 0 auto; }
#subscribeModal .subscription-tabs button { flex:1; padding:10px 8px; border:1px solid #516178; border-radius:8px; background:#18212e; color:#e6eefb; cursor:pointer; }
#subscribeModal .subscription-tabs button[aria-pressed=true] { background:#6549dd; border-color:#917eff; }
#subscribeModal .form-group { margin-bottom:12px; min-width:0; }
#subscribeModal .subscribe-form label { margin-bottom:6px; }
#subscribeModal .subscribe-form .form-row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
#subscribeModal .subscribe-form input[type=email], #subscribeModal .subscribe-form input[type=text], #subscribeModal .subscribe-form input[type=tel] { box-sizing:border-box; width:100%; padding:10px 12px; }
/* 가로 패딩은 바디 안에 둬서 레일이 모달 오른쪽 경계에 닿게 한다. */
#subscribeModal .subscription-body { --subscription-scroll-track:#161b22; --subscription-scroll-thumb:#536278; --subscription-scroll-hover:#8191a8; flex:1 1 auto; min-height:0; padding:0 var(--subscription-inset); overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--subscription-scroll-thumb) var(--subscription-scroll-track); }
#subscribeModal .subscription-body::-webkit-scrollbar { width:8px; height:8px; }
#subscribeModal .subscription-body::-webkit-scrollbar-track { background:var(--subscription-scroll-track); border-radius:8px; }
#subscribeModal .subscription-body::-webkit-scrollbar-thumb { background:var(--subscription-scroll-thumb); border:2px solid var(--subscription-scroll-track); border-radius:8px; }
#subscribeModal .subscription-body::-webkit-scrollbar-thumb:hover { background:var(--subscription-scroll-hover); }
#subscribeModal .subscription-body::-webkit-scrollbar-corner { background:var(--subscription-scroll-track); }
#subscribeModal .subscription-body:hover { scrollbar-color:var(--subscription-scroll-hover) var(--subscription-scroll-track); }
html[data-theme=white] #subscribeModal .subscription-body { --subscription-scroll-track:#edf1f6; --subscription-scroll-thumb:#8795a8; --subscription-scroll-hover:#566a84; }
html[data-theme=white] #subscribeModal .modal-content { background:#f8fafc; border-color:#ccd5e1; color:#253247; }
html[data-theme=white] #subscribeModal .modal-header h2, html[data-theme=white] #subscribeModal .subscribe-form label, html[data-theme=white] #subscribeModal .subscription-email { color:#253247; }
html[data-theme=white] #subscribeModal .subscription-categories legend, html[data-theme=white] #subscribeModal .form-hint { color:#526177; }
html[data-theme=white] #subscribeModal .subscribe-form input[type=email], html[data-theme=white] #subscribeModal .subscribe-form input[type=text], html[data-theme=white] #subscribeModal .subscribe-form input[type=tel], html[data-theme=white] #subscribeModal .checkbox-item { background:#fff; border-color:#ccd5e1; color:#253247; }
html[data-theme=white] #subscribeModal .subscription-tabs button:not([aria-pressed=true]), html[data-theme=white] #subscribeModal .btn-cancel { background:#eef2f7; border-color:#b8c5d6; color:#253247; }
html[data-theme=white] #subscribeModal .subscription-notice { background:#eef2ff; color:#303b70; }
html[data-theme=white] #subscribeModal .subscription-notice[data-error=true] { background:#fff1f2; color:#8b243a; }
html[data-theme=white] #subscribeModal .subscription-resend { color:#5d3bc6; }
html[data-theme=white] #subscribeModal input::placeholder { color:#718096; }
/* 크기 전환을 애니메이션하면 고정 영역이 잠시 겹칠 수 있으므로 색상만 전환한다. */
#subscribeModal button, #subscribeModal input, #subscribeModal label { transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease; }
#subscribeModal .subscription-categories { border:0; padding:0 0 4px; margin:0; min-width:0; }
#subscribeModal .subscription-categories legend { color:var(--support-muted,#c0ccdc); font-size:.93rem; margin-bottom:0; }
#subscribeModal .checkbox-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
#subscribeModal .checkbox-item { display:flex; align-items:center; gap:8px; min-width:0; white-space:normal; }
#subscribeModal .checkbox-item input[type=checkbox] { flex:0 0 16px; width:16px; height:16px; margin:0; }
#subscribeModal .checkbox-item > span { min-width:0; overflow-wrap:anywhere; }
#subscribeModal .form-hint { color:var(--support-muted,#c0ccdc); line-height:1.45; font-size:.85rem; margin:8px 0 0; }
#subscribeModal .form-actions { display:flex; flex-direction:row; gap:10px; margin-top:12px; padding-top:10px; border-top:1px solid #354052; background:transparent; }
#subscribeModal .form-actions > button { min-height:44px; flex:1; padding:10px; }
#subscribeModal .subscription-notice { flex:0 0 auto; margin:0 var(--subscription-inset) 12px; padding:10px; border:1px solid #687cf0; border-radius:8px; background:#1b2850; color:#e4ebff; font-size:.9rem; line-height:1.45; overflow-wrap:anywhere; }
#subscribeModal .subscription-notice[data-error=true] { border-color:#f28d8d; background:#3b2330; color:#ffe2e2; }
#subscribeModal .subscription-email { overflow-wrap:anywhere; color:#d8dfff; }
#subscribeModal .subscription-cancel-confirm { border:1px solid #b86969; border-radius:10px; padding:14px; margin-top:16px; }
#subscribeModal .subscription-resend { flex:0 0 auto; margin:0 var(--subscription-inset); background:transparent; color:#c5baff; border:0; text-decoration:underline; padding:10px 8px 0; cursor:pointer; }
#subscribeModal button:disabled, #subscribeModal input:disabled { opacity:.6; cursor:wait; }
#subscribeModal button:focus-visible, #subscribeModal input:focus-visible { outline:3px solid #b8b0ff; outline-offset:3px; }
#subscribeModal .subscription-body:focus-visible { outline:2px solid #b8b0ff; outline-offset:-2px; }
@media(max-width:480px) {
 #subscribeModal { --subscription-inset:16px; }
 #subscribeModal .modal-header { gap:8px; }
 #subscribeModal .modal-header h2 { font-size:1.15rem; }
 #subscribeModal .modal-icon { flex-basis:32px; width:32px; height:32px; }
 #subscribeModal .checkbox-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
/* 고정 영역을 줄여 낮은 화면에서도 업종 선택과 제출 버튼을 함께 노출한다. */
@container subscription-viewport (max-height:700px) {
 #subscribeModal .modal-content { padding:14px 0; }
 #subscribeModal .modal-header { padding:0 38px 8px 12px; margin-bottom:10px; }
 #subscribeModal .modal-icon { flex-basis:30px; width:30px; height:30px; }
 #subscribeModal .modal-icon i { font-size:17px; }
 #subscribeModal .modal-header h2 { font-size:1.2rem; }
 #subscribeModal .subscription-tabs { margin-bottom:10px; }
 #subscribeModal .subscription-tabs button { padding:8px; }
 #subscribeModal .form-group { margin-bottom:8px; }
 #subscribeModal .form-hint { font-size:.8rem; margin-top:6px; }
 #subscribeModal .form-actions { margin-top:8px; padding-top:8px; }
 #subscribeModal .subscription-notice { margin-bottom:8px; padding:8px; font-size:.85rem; }
}
@container subscription-viewport (max-height:600px) {
 #subscribeModal .modal-header { padding-bottom:6px; margin-bottom:6px; }
 #subscribeModal .subscription-tabs { margin-bottom:6px; }
 #subscribeModal .subscribe-form label { font-size:.85rem; margin-bottom:3px; }
 #subscribeModal .subscribe-form input[type=email], #subscribeModal .subscribe-form input[type=text], #subscribeModal .subscribe-form input[type=tel] { padding:6px 10px; }
 #subscribeModal .subscription-notice { font-size:.8rem; padding:6px; line-height:1.35; }
 #subscribeModal .form-actions > button { min-height:40px; padding:7px; font-size:.9rem; }
 #subscribeModal .subscription-resend { padding-top:6px; font-size:.85rem; }
}
@container subscription-viewport (min-width:700px) and (max-height:600px) {
 #subscribeModal .modal-content { width:min(760px,calc(100% - 24px)); max-width:760px; }
 #subscribeModal .subscription-fixed-fields { display:grid; grid-template-columns:1fr 1.3fr; gap:16px; }
 #subscribeModal .subscription-footer { display:grid; grid-template-columns:1fr 280px; align-items:end; gap:16px; }
 #subscribeModal .subscription-footer .form-actions { border-top:0; margin:0; }
}
.subscription-verify-page { margin:0; min-height:100svh; background:radial-gradient(ellipse at 10% 4%,#29325b80,transparent 52%),radial-gradient(ellipse at 100% 100%,#58408238,transparent 55%),#101729; color:#f5f7fc; font:16px/1.65 var(--consol-font-sans); padding:clamp(24px,5vw,72px); box-sizing:border-box; }
.subscription-verify-page *, .subscription-verify-page *::before, .subscription-verify-page *::after { box-sizing:border-box; }
.subscription-verify-shell { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:center; gap:clamp(40px,7vw,104px); max-width:1080px; min-height:calc(100svh - 144px); margin:auto; }
.subscription-verify-intro { display:flex; flex-direction:column; align-self:center; justify-content:center; padding:0; }
.subscription-verify-story { padding:24px 0; }
.subscription-verify-eyebrow { display:inline-flex; align-items:center; gap:9px; color:#b9aaff; font-size:12px; font-weight:700; letter-spacing:.08em; }
.subscription-verify-eyebrow::before { content:""; width:6px; height:6px; border-radius:50%; background:#b9aaff; }
.subscription-verify-headline { margin:19px 0 20px; font-size:clamp(34px,4.4vw,53px); font-weight:700; line-height:1.24; letter-spacing:-.055em; }
.subscription-verify-lead { color:#b8c3dc; font-size:16px; line-height:1.85; margin:0; }
.subscription-verify-divider { width:38px; height:1px; margin:32px 0 22px; background:#7a8bb05c; }
.subscription-verify-caption, .subscription-verify-copyright { color:#a5b2ce; font-size:12px; line-height:1.8; margin:0; }
.subscription-verify-copyright { font-size:10px; letter-spacing:.025em; }
.subscription-verify-card { min-width:0; padding:36px; background:#fff; color:#17223a; border:1px solid #ffffffb3; border-radius:24px; box-shadow:0 28px 90px #03081540,0 0 0 6px #ffffff03; overflow-wrap:anywhere; }
.subscription-verify-card-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:28px; }
.subscription-verify-step { padding:5px 10px; background:#f1edff; color:#6040c7; border-radius:6px; font-size:10px; font-weight:700; letter-spacing:.03em; }
.subscription-verify-step-detail { font-size:10px; color:#637086; }
.subscription-verify-icon { display:grid; place-items:center; width:48px; height:48px; margin-bottom:19px; border:1px solid #e5defa; background:linear-gradient(145deg,#fbfaff,#eee9ff); border-radius:14px; color:#7050d2; }
.subscription-verify-icon svg { width:25px; height:25px; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.subscription-verify-card h1 { margin:0 0 12px; font-size:27px; line-height:1.35; letter-spacing:-.045em; font-weight:700; }
.subscription-verify-description { margin:0 0 25px; color:#5c6880; font-size:13px; line-height:1.8; }
.subscription-verify-address { padding:15px 17px; margin-bottom:19px; border:1px solid #e5e9f2; border-radius:11px; background:#f8f9fc; }
.subscription-verify-address > span { display:block; color:#6e788b; font-size:10px; }
.subscription-verify-address .subscription-email { margin:4px 0 0; font-size:15px; font-weight:700; letter-spacing:-.02em; }
.subscription-verify-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 20px; padding:0 2px; margin:0 0 26px; }
.subscription-verify-details-wide { grid-column:1/-1; }
.subscription-verify-details dt { margin:0 0 4px; color:#758096; font-size:10px; }
.subscription-verify-details dd { margin:0; color:#28344d; font-size:13px; font-weight:700; }
.subscription-verify-note { padding-left:13px; border-left:2px solid #e6dffc; margin:0 0 25px; color:#65718a; font-size:12px; line-height:1.85; }
.subscription-verify-card form { margin:0; }
.subscription-verify-card button, .subscription-verify-retry { display:flex; justify-content:center; align-items:center; gap:12px; width:100%; min-height:50px; padding:13px 18px; color:#fff; background:linear-gradient(110deg,#7050d7,#5936bd); border:1px solid #6341c5; border-radius:10px; font-size:14px; font-weight:700; cursor:pointer; text-decoration:none; box-shadow:0 5px 12px #6340c51a; transition:background .16s,box-shadow .16s; }
.subscription-verify-card button > span { font-size:19px; line-height:1; }
.subscription-verify-card button:hover, .subscription-verify-retry:hover { background:#5533b6; box-shadow:0 7px 18px #6340c52b; }
.subscription-verify-card button:disabled { opacity:.6; cursor:wait; box-shadow:none; }
.subscription-verify-card a:focus-visible, .subscription-verify-card button:focus-visible { outline:3px solid #a894f5; outline-offset:4px; }
.subscription-verify-assurance { margin:12px 0 0; color:#737e91; font-size:10px; line-height:1.7; text-align:center; }
.subscription-verify-card-footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-top:28px; padding-top:19px; border-top:1px solid #edf0f6; font-size:10px; }
.subscription-verify-card-footer a { color:#5e6478; text-underline-offset:3px; }
.subscription-verify-card-footer > span { color:#8490a2; }
.subscription-verify-card .subscription-notice { border:1px solid #c2cde6; border-radius:9px; padding:12px 14px; margin:18px 0 0; color:#384b71; background:#f4f7fc; font-size:12px; }
.subscription-verify-card .subscription-notice[data-error=true] { border-color:#e9bfc5; color:#973e4c; background:#fff6f6; }
.subscription-verify-card-error .subscription-verify-icon { color:#ad7532; border-color:#f0ddbe; background:#fff8eb; }
.subscription-verify-card-error .subscription-verify-step { color:#966328; background:#fff4df; }
@media(max-width:820px) {
 .subscription-verify-page { padding:28px 24px; }
 .subscription-verify-shell { grid-template-columns:minmax(0,1fr); gap:28px; max-width:520px; min-height:auto; }
 .subscription-verify-story, .subscription-verify-copyright { display:none; }
 .subscription-verify-intro { display:none; }
 .subscription-verify-card { padding:30px; border-radius:20px; }
}
@media(max-width:480px) {
 .subscription-verify-page { padding:23px 16px 32px; }
 .subscription-verify-shell { gap:24px; }
 .subscription-verify-card { padding:25px 22px; border-radius:18px; }
 .subscription-verify-card h1 { font-size:25px; }
 .subscription-verify-card-header { margin-bottom:25px; }
}
@media(prefers-reduced-motion:reduce) { .subscription-verify-card button, .subscription-verify-retry { transition:none; } }
/* Common navigation keeps its own height; the confirmation content flows below it. */
.subscription-verify-page { display:flex; flex-direction:column; padding:0; --bg-main:#101729; --text-main:#f5f7fc; }
.subscription-verify-page > .main-header { position:sticky; flex:none; }
.subscription-verify-page .subscription-verify-shell { flex:1; width:100%; max-width:1224px; min-height:0; padding:clamp(24px,5vw,72px); }
.subscription-verify-page .main-header .mobile-menu-container { top:100%; max-height:70svh; overflow-y:auto; }
.subscription-verify-page .main-header button { font-family:inherit; }
.subscription-verify-page .main-header .fa-youtube::before { content:'▶'; }
.subscription-verify-page .main-header .fa-chevron-down::before { content:'⌄'; }
.subscription-verify-page .main-header .fa-globe::before { content:'◎'; }
.subscription-verify-page .main-header .fa-bars::before, .subscription-verify-page .main-header .fa-list-ul::before { content:'☰'; }
.subscription-verify-page .main-header .fa-times::before { content:'×'; }
#subscribeModal .subscribe-form input[type=tel] { background:rgba(255,255,255,.05); border:1px solid var(--support-line); border-radius:10px; color:#fff; font-size:1rem; }
@media(max-width:820px) { .subscription-verify-page .subscription-verify-shell { padding:28px 24px; } }
@media(max-width:480px) { .subscription-verify-page .subscription-verify-shell { padding:23px 16px 32px; } }
