/* 문의 랜딩
   구조 토큰(본문·선·배경·서체) = 레버캐스트 브랜드(levercast-brand 스킬)
   강조색(--accent) = 클라이언트 브랜드 로고에서 추출 — 페이지는 클라이언트 브랜드의 문의 페이지로 읽혀야 한다.
   ⚠️ --accent / --accent-tint 는 템플릿이 클라이언트별로 주입한다(기본값은 폴백). */
:root{
  --jade:#22C55E; --jade-ink:#15803D;
  --ink:#2D3748; --slate:#64748B; --mist:#94A3B8;
  --line:#E2E8F0; --light:#F1F5F9; --paper:#FFFFFF;
  --red:#DC2626; --amber:#D97706;
  --accent:#0EA5E9; --accent-tint:#EFF8FE;
  --font:"Pretendard Variable","Pretendard","Inter","Apple SD Gothic Neo",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; font-family:var(--font); color:var(--ink); background:var(--light);
  font-size:16px; line-height:1.65; word-break:keep-all;
}
.wrap{max-width:680px; margin:0 auto; padding:0 20px}

/* 헤더 */
.hd{background:var(--paper); border-bottom:1px solid var(--line)}
.hd-in{display:flex; align-items:center; gap:10px; height:56px}
.hd-logo{height:28px; width:auto; display:block}
.hd-name{font-size:14px; color:var(--slate); font-weight:600}

/* 브랜드 블록 */
main{padding:28px 0 40px}
.relation{margin:0 0 6px; font-size:14px; color:var(--accent); font-weight:600}
.headline{margin:0 0 20px; font-size:26px; line-height:1.35; font-weight:800; letter-spacing:-.02em}

.btn-hero{display:block; margin:0 0 22px; padding:14px; text-align:center; text-decoration:none;
  font-size:16px; font-weight:700; color:#fff; background:var(--accent); border-radius:9px}
.btn-hero:hover{filter:brightness(1.25)}

.video{margin:0 0 22px}
.video-box{position:relative; width:100%; aspect-ratio:16/9; background:#000; border-radius:10px; overflow:hidden}
.video-box iframe{position:absolute; inset:0; width:100%; height:100%; border:0}

/* 카드 */
.card{background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:20px; margin:0 0 16px}
.card h2{margin:0 0 12px; font-size:16px; font-weight:700; line-height:1.45}
.card-quiet{background:var(--light)}
.card-note{background:var(--light)}
.card-note p{margin:0; font-size:13.5px; color:var(--slate); line-height:1.7}

.benefits{margin:0; padding-left:18px}
.benefits li{margin:0 0 8px; font-size:15px}
.benefits li:last-child{margin-bottom:0}
.notes{margin:14px 0 0; padding:12px 14px 12px 30px; list-style:none; background:var(--light); border-radius:8px}
.notes li{position:relative; margin:0 0 6px; font-size:12.5px; color:var(--slate); line-height:1.65}
.notes li:last-child{margin:0}
.notes li::before{content:"※"; position:absolute; left:-16px; color:var(--mist)}
.conds{margin:0; padding-left:20px}
.conds li{margin:0 0 6px; font-size:14px; color:var(--slate)}
.conds li:last-child{margin-bottom:0}

/* 폼 */
.card-form{padding:22px 20px 24px}
.form-h{font-size:19px !important; margin-bottom:4px !important}
.form-sub{margin:0 0 20px; font-size:14px; color:var(--slate)}
.field{margin:0 0 18px}
label,.lab{display:block; margin:0 0 7px; font-size:14px; font-weight:600}
.req{display:inline-block; margin-left:5px; font-size:11px; font-weight:700; color:var(--accent);
     background:var(--accent-tint); border-radius:4px; padding:1px 5px; vertical-align:1px}
input[type=text],input[type=tel],select{
  width:100%; padding:12px 13px; font-family:inherit; font-size:16px; color:var(--ink);
  background:var(--paper); border:1px solid var(--line); border-radius:8px; appearance:none;
}
select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%2364748B' stroke-width='1.6'/></svg>");
  background-repeat:no-repeat; background-position:right 13px center; background-size:12px; padding-right:36px}
input:focus,select:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-tint)}
input.bad{border-color:var(--red)}
.err{margin:6px 0 0; font-size:13px; color:var(--red)}
.hint{margin:6px 0 0; font-size:12.5px; color:var(--mist)}

.opts{display:flex; gap:8px; flex-wrap:wrap}
.opts-col{flex-direction:column; gap:8px}
.opt{display:flex; align-items:flex-start; gap:9px; margin:0; padding:11px 13px; font-weight:500;
     border:1px solid var(--line); border-radius:8px; background:var(--paper); cursor:pointer; flex:1 1 auto}
.opts-col .opt{flex:none}
.opt input{margin:2px 0 0; accent-color:var(--accent); width:17px; height:17px; flex:none}
.opt span{font-size:14.5px; line-height:1.5}
.opt:has(input:checked){border-color:var(--accent); background:var(--accent-tint)}

.consents{margin:22px 0 20px; padding-top:18px; border-top:1px solid var(--line)}
.opt-all{margin:0 0 12px; background:var(--accent-tint); border-color:var(--accent)}
.all-note{font-weight:400; font-size:12.5px; color:var(--slate)}
.consent{margin:0 0 10px}
.opt-consent{align-items:flex-start}
.opt-consent span strong{font-weight:600; font-size:14px}
.consent-body{margin:6px 0 0 40px}
.consent-body summary{font-size:12.5px; color:var(--slate); cursor:pointer; list-style:none}
.consent-body summary::-webkit-details-marker{display:none}
.consent-body summary::before{content:"▸ "; color:var(--mist)}
.consent-body[open] summary::before{content:"▾ "}
.consent-body div{margin:8px 0 0; padding:12px; background:var(--light); border-radius:8px}
.consent-body p{margin:0 0 5px; font-size:12.5px; color:var(--slate); line-height:1.65}
.consent-body p:last-child{margin:0}

.submit{
  width:100%; padding:15px; font-family:inherit; font-size:16.5px; font-weight:700; color:#fff;
  background:var(--accent); border:0; border-radius:9px; cursor:pointer;
}
.submit:hover{filter:brightness(1.25)}
.submit:disabled{background:var(--mist); cursor:default}
.submit-note{margin:10px 0 0; font-size:12.5px; color:var(--mist); text-align:center}

/* 완료 */
.card-done h2{font-size:20px !important; color:var(--jade-ink)}
.done-lead{margin:0 0 18px; font-size:15px}
.done-sub{margin:0 0 12px; font-size:14px; color:var(--slate)}
.done-links{padding-top:16px; border-top:1px solid var(--line)}
.btn-ghost{
  display:block; margin:0 0 8px; padding:13px; text-align:center; text-decoration:none;
  font-size:15px; font-weight:600; color:var(--accent);
  background:var(--paper); border:1px solid var(--accent); border-radius:9px;
}
.done-other{margin-top:8px}

/* 다른 브랜드 */
.other-list a{
  display:block; padding:13px 15px; margin:0 0 8px; text-decoration:none; color:var(--ink);
  background:var(--light); border-radius:9px; font-size:15px; font-weight:600;
}
.other-list a:last-child{margin:0}
.other-list a::after{content:" →"; color:var(--accent)}

/* 카페 CTA */
.card-cafe p{margin:0 0 14px; font-size:14px; color:var(--slate)}
.card-cafe .btn-ghost{margin:0}

/* 푸터 */
.ft{background:var(--paper); border-top:1px solid var(--line); padding:22px 0 30px}
.ft p{margin:0 0 7px; font-size:12.5px; color:var(--mist); line-height:1.7}
.ft-op{color:var(--slate) !important; font-weight:500}
.ft-c{margin-top:12px !important}

#gf-sink{display:none}

@media (max-width:480px){
  .headline{font-size:22px}
  .wrap{padding:0 16px}
  .card{padding:18px 16px}
}
@media (prefers-reduced-motion:no-preference){
  .submit,.opt,input,select{transition:background-color .12s, border-color .12s, box-shadow .12s}
}