:root { color-scheme: light; --ink:#172f33; --muted:#56696c; --green:#153d3b; --line:#d5dfda; --wash:#f3f5ef; }
* { box-sizing:border-box; }
body { margin:0; background:var(--wash); color:var(--ink); font-family:'Malgun Gothic','Apple SD Gothic Neo',sans-serif; font-size:20px; line-height:1.65; }
.brand { max-width:780px; margin:auto; padding:22px 24px; display:flex; gap:12px; align-items:center; font-size:18px; font-weight:700; }
.brand small { display:block; color:var(--muted); font-size:14px; font-weight:400; }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:var(--green); color:white; font-family:Georgia,serif; font-size:28px; }
main { max-width:732px; margin:auto; padding:0 20px 32px; }
h1 { font-size:clamp(29px,6vw,42px); line-height:1.35; letter-spacing:-1px; margin:14px 0 20px; }
h2 { font-size:27px; line-height:1.45; margin:0 0 22px; }
p { margin:12px 0; }
.eyebrow { color:var(--green); font-size:15px; font-weight:700; letter-spacing:2px; }
.hero,.panel { background:white; border:1px solid var(--line); border-radius:22px; padding:28px; margin-bottom:22px; }
.hero { padding-top:36px; }
.subtitle { color:var(--muted); font-size:22px; }
.profile { display:flex; align-items:center; gap:18px; padding:24px 0; margin:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.portrait { width:88px; height:106px; border-radius:14px; background:#e8eeea; display:grid; place-items:center; font-size:16px; color:var(--muted); text-align:center; flex-shrink:0; object-fit:cover; }
.profile strong { font-size:26px; }
.profile p { font-size:18px; margin:4px 0; }
.intro { font-size:18px; color:var(--muted); }
.intro strong { color:var(--ink); }
button { font:inherit; min-height:60px; padding:14px 18px; border-radius:12px; border:2px solid var(--line); background:white; color:var(--ink); cursor:pointer; line-height:1.45; touch-action:manipulation; }
button:focus-visible,input:focus-visible { outline:3px solid #b07728; outline-offset:3px; }
button:hover { border-color:var(--green); }
.primary { background:var(--green); border-color:var(--green); color:white; width:100%; font-weight:700; font-size:22px; }
.secondary { width:100%; margin-top:12px; }
.hint { font-size:16px; color:var(--muted); }
.notice { padding:18px; background:#edf2ec; border-left:4px solid #839b85; border-radius:8px; font-size:17px; margin:22px 0; }
.notice strong { display:block; margin-bottom:8px; }
.todo { color:#795420; background:#fff5df; padding:8px 12px; border-radius:8px; font-size:15px; }
.progress-wrap { position:sticky; top:0; z-index:2; background:var(--wash); padding:14px 0; }
progress { width:100%; height:10px; accent-color:var(--green); border:none; border-radius:8px; overflow:hidden; }
progress::-webkit-progress-bar { background:#dce5db; }
progress::-webkit-progress-value { background:var(--green); border-radius:8px; }
.save-status { font-size:15px; color:var(--muted); }
.save-status.error,.error-text { color:#a42824; }
.question { margin-bottom:28px; }
label,.question-title { display:block; font-size:23px; font-weight:700; line-height:1.45; margin-bottom:12px; }
.required { font-size:16px; color:#a42824; margin-left:8px; }
.input-row { display:flex; gap:12px; align-items:center; }
input { width:100%; min-width:0; min-height:62px; border:2px solid #b9cbc4; border-radius:12px; padding:12px; font:inherit; font-size:23px; background:white; color:var(--ink); }
.unit { flex-shrink:0; font-size:20px; }
.unit.pending { font-size:14px; max-width:72px; }
.options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.option { width:100%; text-align:left; font-size:20px; }
.option[aria-pressed="true"] { color:white; background:var(--green); border-color:var(--green); }
.option[aria-pressed="true"]::before { content:'✓ '; }
.nav { display:flex; gap:12px; margin-top:24px; }
.nav .back { flex:0 0 100px; }
.history { margin:24px 0; }
.history summary { min-height:60px; padding:12px 0; cursor:pointer; font-weight:700; font-size:21px; }
.history button { display:block; width:100%; text-align:left; margin:12px 0; overflow-wrap:anywhere; }
.history small { display:block; color:var(--muted); font-size:17px; font-weight:400; }
.site-id { overflow-wrap:anywhere; font-size:21px; font-weight:700; }
.error-text { font-size:17px; }
footer { max-width:732px; margin:auto; padding:20px 24px 36px; font-size:15px; color:var(--muted); text-align:center; }
.business-card { display:block; width:min(100%,419px); height:auto; margin:0 auto 24px; }
.card-cover { text-align:center; }
.consent-details dt { font-weight:700; margin-top:20px; }
.consent-details dd { margin:8px 0 16px; font-size:18px; }
#current-panel { scroll-margin-top:75px; }
@media(max-width:420px) { main { padding:0 14px 24px; } .hero,.panel { padding:22px 18px; } .brand { padding:18px; } .options { gap:10px; } .nav .back { flex-basis:82px; } }
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; } }

/* 소개는 정확히 두 영역. 이어지는 동의 영역은 입력 전 필수 절차입니다. */
body.intro-mode > .brand, body.intro-mode > footer { display:none; }
body.intro-mode main { padding:0; max-width:732px; }
.intro-page { padding:28px 24px; }
.digital-card { min-height:100vh; min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:space-between; gap:14px; text-align:center; background:#fffdf7; padding-top:max(22px,env(safe-area-inset-top)); padding-bottom:max(16px,env(safe-area-inset-bottom)); }
.carry-brand strong { color:#76551e; font-size:24px; letter-spacing:5px; }
.carry-brand p { font-size:18px; margin:4px 0 0; }
.intro-portrait { width:clamp(148px,23vh,224px); height:clamp(164px,26vh,252px); border-radius:24px; object-fit:cover; object-position:center; }
img.intro-portrait { object-position:center 28%; }
.photo-placeholder { background:linear-gradient(145deg,#e4ebe1,#d5dfd9); display:flex; flex-direction:column; justify-content:center; gap:16px; color:#324e45; }
.photo-placeholder span { font-size:40px; font-weight:700; letter-spacing:8px; }
.photo-placeholder small { font-size:16px; }
.card-identity h1 { font-size:30px; margin:0 0 5px; }
.card-identity p { margin:0; font-size:18px; }
.project-brand strong,.profile-start > strong { font-size:24px; color:#76551e; letter-spacing:1px; }
.project-brand p { margin:4px 0 0; font-size:17px; }
.service-scope p { margin:0 0 5px; font-size:18px; line-height:1.5; }
.intro-page blockquote { margin:0; font-size:20px; line-height:1.55; font-weight:700; }
.next-arrow { display:flex; flex-direction:column; align-items:center; background:transparent; border:0; padding:0 36px; min-height:80px; color:var(--green); }
.next-arrow span { font-size:48px; line-height:1; }
.next-arrow strong { font-size:20px; }
.detailed-profile { background:white; padding-top:42px; padding-bottom:40px; }
.detailed-profile > h2 { font-size:32px; margin-bottom:14px; }
.detailed-profile > blockquote { margin-bottom:32px; font-size:22px; }
.profile-section { padding:20px 0; border-top:1px solid var(--line); }
.profile-section h3 { font-size:23px; color:var(--green); margin:0 0 12px; }
.profile-section ul { list-style:none; margin:0; padding:0; }
.profile-section li { font-size:20px; margin:0 0 14px; line-height:1.6; }
.profile-section li:last-child { margin-bottom:0; }
.detailed-profile { padding-top:24px; padding-bottom:24px; }
.detailed-profile > .eyebrow { margin:0 0 6px; }
.detailed-profile > h2 { margin-bottom:10px; }
.detailed-profile > blockquote { margin-bottom:14px; font-size:20px; word-break:keep-all; }
.profile-expand-hint { margin:0 0 12px; font-size:16px; color:var(--muted); }
.university-logos { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:22px; }
.university-logos img { width:calc(50% - 12px); height:58px; object-fit:contain; }
.university-logos img:first-child { height:96px; }
.carry-introduction { font-size:18px; line-height:1.65; margin:0 0 16px; }
details.profile-section { padding:0; }
.profile-section summary { display:grid; grid-template-columns:90px 1fr 22px; align-items:center; gap:8px; min-height:64px; padding:10px 0; cursor:pointer; list-style:none; }
.profile-section summary::-webkit-details-marker { display:none; }
.profile-section summary strong { font-size:20px; }
.profile-section summary span { font-size:16px; color:var(--muted); }
.profile-section summary::after { content:'＋'; font-size:24px; color:var(--green); }
.profile-section[open] summary::after { content:'−'; }
.profile-section summary:focus-visible { outline:3px solid #b07728; outline-offset:2px; }
.profile-section[open] { padding-bottom:16px; }
.profile-section li { margin-bottom:8px; font-size:18px; }
.profile-section > p { font-size:18px; }
.profile-start { margin-top:16px; padding-top:28px; text-align:center; border-top:1px solid var(--line); }
.profile-start > p { margin:14px 0 24px; }
.profile-start { margin-top:8px; padding-top:16px; }
.profile-start > p { margin:8px 0 16px; font-size:18px; }
.profile-start > .hint { font-size:15px; margin-bottom:0; }
.start-arrow { display:block; font-size:42px; line-height:1.2; margin-top:8px; }
#intro-entry { padding:28px 18px; background:var(--wash); scroll-margin-top:0; }
#intro-entry h1 { scroll-margin-top:12px; }
@media(max-height:760px) { .digital-card { gap:10px; padding-top:14px; padding-bottom:12px; } .intro-portrait { width:142px; height:156px; } .carry-brand strong { font-size:22px; } .card-identity h1 { font-size:28px; } .next-arrow { min-height:70px; } }
@media(max-height:700px) { .digital-card { gap:8px; } .intro-portrait { width:124px; height:136px; } }
@media(max-width:360px) { .intro-page { padding-left:18px; padding-right:18px; } .card-identity p { font-size:17px; } .project-brand p { font-size:16px; } }

.with-business-card { background:#fffdf9; gap:10px; }
.card-visuals { display:flex; justify-content:center; align-items:center; gap:22px; width:100%; }
.card-visuals a { display:block; line-height:0; }
.original-business-card { display:block; width:auto; height:min(30svh,252px); max-width:100%; object-fit:contain; box-shadow:0 8px 25px #59472618; border:1px solid #e5ddcd; }
.card-visuals .intro-portrait { width:clamp(100px,24vw,150px); height:clamp(120px,28vw,175px); border-radius:50% 50% 18px 18px; border:3px solid #c9ad72; }
.detailed-profile { position:relative; isolation:isolate; background:#fcfbf8; }
.detailed-profile::before { content:''; position:absolute; z-index:-1; inset:0; background-color:#fdfcf9; background-image:linear-gradient(127deg,transparent 12%,#d4d3ce28 14%,#ffffffb8 18%,transparent 22%),linear-gradient(155deg,transparent 35%,#c7c7c127 39%,#fff 44%,transparent 51%),linear-gradient(115deg,transparent 63%,#d2d1cb25 67%,#ffffffbb 72%,transparent 79%),repeating-linear-gradient(142deg,#ffffff66 0 90px,#dbdbd514 105px,#ffffff99 132px,#ffffff11 180px); }
.detailed-profile::after { content:''; position:absolute; z-index:-1; inset:0; pointer-events:none; background:linear-gradient(135deg,transparent 0 7%,#b49b6040 7.1% 7.25%,transparent 7.4%),linear-gradient(25deg,transparent 0 90%,#b49b6050 90.1% 90.25%,transparent 90.4%); }
.detailed-profile .profile-section { background:#ffffffb8; padding-left:12px; padding-right:12px; border-color:#d9cdb7; }
.detailed-profile .profile-section[open] { padding-bottom:16px; }
.detailed-profile > h2 { color:#76551e; }
.detailed-profile .university-logos { background:#ffffffbf; padding:12px; border-radius:12px; border:1px solid #e8dfcf; }
.detailed-profile .profile-start { border-color:#d9cdb7; }
.mobile-carry-introduction,.mobile-professional-quote { display:none; }
@media(max-width:700px) and (max-height:700px) { .with-business-card .original-business-card { height:25svh; } }
@media(max-width:700px) {
  .detailed-profile { min-height:100svh; display:flex; flex-direction:column; padding:10px 18px; }
  .detailed-profile .university-logos { flex-shrink:0; margin:0 0 5px; padding:4px 8px; }
  .detailed-profile .university-logos img:first-child { height:clamp(64px,10svh,96px); }
  .detailed-profile .university-logos img:last-child { height:48px; }
  .detailed-profile > .eyebrow,
  .detailed-profile > .carry-introduction,
  .detailed-profile > blockquote,
  .detailed-profile > .profile-expand-hint { display:none; }
  .detailed-profile > h2 { flex-shrink:0; font-size:26px; line-height:1.2; margin:0 0 4px; }
  .mobile-carry-introduction { display:block; flex-shrink:0; font-size:15px; line-height:1.35; margin:0 0 6px; }
  .mobile-professional-quote { display:block; }
  .detailed-profile .profile-section { flex-shrink:0; }
  .detailed-profile .profile-section summary { min-height:44px; padding:5px 0; grid-template-columns:92px 1fr 20px; gap:6px; }
  .detailed-profile .profile-section summary strong { white-space:nowrap; }
  .detailed-profile .profile-section summary strong { font-size:18px; }
  .detailed-profile .profile-section summary span { font-size:13px; line-height:1.3; }
  .detailed-profile .profile-start { margin-top:auto; padding-top:8px; flex-shrink:0; }
  .detailed-profile .profile-start > strong { font-size:18px; line-height:1.3; }
  .detailed-profile .profile-start > p { font-size:15px; line-height:1.3; margin:4px 0 8px; }
  .detailed-profile .profile-start > .hint { display:none; }
  .detailed-profile #start { display:flex; align-items:center; justify-content:center; gap:10px; font-size:18px; line-height:1.3; min-height:52px; padding:10px; }
  .detailed-profile .start-arrow { font-size:28px; line-height:1; margin:0; }
}
@media(max-width:700px) and (max-height:700px) { .detailed-profile { padding-top:7px; padding-bottom:7px; } }
@media(max-height:760px) { .with-business-card { gap:6px; } .original-business-card { height:28svh; } .with-business-card .card-visuals { gap:14px; } .with-business-card .intro-portrait { width:100px; height:120px; } .with-business-card .service-scope p { font-size:17px; } .with-business-card blockquote { font-size:18px; } }

@media(max-width:700px) and (pointer:coarse) {
  body.form-mode > .brand,body.form-mode > footer { display:none; }
  body.form-mode main { padding:0 12px 12px; }
  body.form-mode #app { display:flex; flex-direction:column; }
  body.form-mode .progress-wrap { order:0; position:static; padding:6px 0; }
  body.form-mode .save-status { font-size:13px; line-height:1.3; }
  body.form-mode #app > .hint { order:4; font-size:14px; margin:6px 0; }
  body.form-mode #current-panel { order:1; margin:0; padding:14px; border-radius:16px; max-height:calc(100svh - 65px); overflow:auto; scroll-margin-top:0; }
  body.form-mode #current-panel > .eyebrow { display:none; }
  body.form-mode #current-panel > h2 { font-size:23px; line-height:1.3; margin:0 0 8px; }
  body.form-mode #current-panel > .hint { font-size:14px; margin:4px 0; }
  body.form-mode .question { margin-bottom:14px; }
  body.form-mode label,body.form-mode .question-title { font-size:20px; line-height:1.35; margin-bottom:8px; }
  body.form-mode input { min-height:50px; padding:9px 10px; font-size:21px; }
  body.form-mode .options { gap:8px; }
  body.form-mode .option { min-height:48px; padding:10px; font-size:18px; }
  body.form-mode .question .hint { font-size:14px; margin:4px 0; }
  body.form-mode #questions-form > .notice { padding:10px; margin:10px 0; font-size:14px; line-height:1.4; }
  body.form-mode #questions-form > .notice strong { margin-bottom:4px; }
  body.form-mode .nav { margin-top:12px; }
  body.form-mode .nav button { min-height:50px; padding:10px; font-size:20px; }
  body.form-mode .history { order:3; margin:6px 0; }
  body.form-mode .history summary { min-height:44px; font-size:18px; }
  body:not(.form-mode):not(.intro-mode) .panel { max-height:calc(100svh - 120px); overflow:auto; }
}

/* Only touch phones with an open keyboard: keep both current questions in the visible area. */
@media(max-width:700px) and (pointer:coarse) {
  body.mobile-keyboard-open { overflow:hidden; }
  body.mobile-keyboard-open > .brand,
  body.mobile-keyboard-open > footer,
  body.mobile-keyboard-open .progress-wrap,
  body.mobile-keyboard-open .history { display:none; }
  body.mobile-keyboard-open #current-panel {
    position:fixed; z-index:5; top:var(--keyboard-top,0px); left:0; right:0;
    height:var(--keyboard-height); max-height:none; overflow:auto; border-radius:0; border:0;
    margin:0; padding:12px 14px; scroll-margin:0; background:white;
  }
  body.mobile-keyboard-open #current-panel > p,
  body.mobile-keyboard-open #current-panel > h2,
  body.mobile-keyboard-open #questions-form > .notice,
  body.mobile-keyboard-open .question > .hint,
  body.mobile-keyboard-open .question > .todo { display:none; }
  body.mobile-keyboard-open .question { margin-bottom:12px; }
  body.mobile-keyboard-open label,
  body.mobile-keyboard-open .question-title { font-size:19px; line-height:1.3; margin:0 0 6px; }
  body.mobile-keyboard-open input { min-height:46px; height:46px; padding:8px 10px; font-size:20px; }
  body.mobile-keyboard-open .input-row { gap:8px; }
  body.mobile-keyboard-open .unit { font-size:17px; }
  body.mobile-keyboard-open .error-text { margin:0; font-size:15px; }
  body.mobile-keyboard-open .nav { margin-top:8px; gap:8px; }
  body.mobile-keyboard-open button { min-height:44px; padding:8px 12px; font-size:19px; }
  body.mobile-keyboard-open .options { gap:6px; }
}

/* 첫 페이지: 원본 명함 전체를 자르지 않고 화면 안에 표시합니다. */
.business-card-cover { height:100svh; min-height:0; display:flex; flex-direction:column; align-items:center; gap:10px; padding: max(16px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left)); background:#f7f5f0; }
.business-card-cover .full-card-link { flex:1; min-height:0; width:100%; display:flex; align-items:center; justify-content:center; }
.business-card-cover .original-business-card { width:100%; height:100%; max-height:100%; object-fit:contain; border:0; box-shadow:none; }
.business-card-cover .next-arrow { flex:none; min-height:54px; padding:0 28px; display:flex; flex-direction:row; gap:12px; align-items:center; justify-content:center; }
.business-card-cover .next-arrow span { font-size:36px; }
.business-card-cover .next-arrow strong { font-size:20px; }
@media(max-width:700px) and (max-height:660px) { .detailed-profile { padding-top:4px; padding-bottom:4px; } }

/* ===== 2페이지 캐리헌 소개 (모바일 한 화면 우선) ===== */
.detailed-profile { min-height:100svh; display:flex; flex-direction:column; padding:12px 18px 16px; }
.detailed-profile > * { flex-shrink:0; }
.detailed-profile .university-logos { justify-content:space-between; align-items:center; gap:14px; margin:0 0 6px; padding:6px 10px; }
.detailed-profile .university-logos img { width:auto; max-width:48%; height:44px; object-fit:contain; }
.detailed-profile .university-logos img:first-child { height:clamp(64px,11svh,96px); }
.detailed-profile > h2 { font-size:26px; line-height:1.2; margin:2px 0 2px; text-align:center; display:block; }
.profile-name { text-align:center; font-size:19px; margin:0; color:#76551e; }
.profile-name strong { font-size:22px; color:var(--ink); }
.profile-tagline { text-align:center; font-size:17px; line-height:1.4; font-weight:700; margin:6px 0 4px; word-break:keep-all; }
.profile-fields { text-align:center; font-size:16px; margin:0 0 6px; color:var(--green); font-weight:700; letter-spacing:.5px; }
.profile-fields span { display:inline-block; }
.brand-box { display:flex; flex-direction:column; align-items:center; gap:0; padding:6px 10px; margin:0 0 6px; border:1px solid #c9ad72; border-radius:10px; background:#fffdf6cc; text-align:center; }
.brand-box strong { font-size:19px; color:#76551e; letter-spacing:1px; line-height:1.3; }
.brand-box span { font-size:14px; line-height:1.3; color:var(--muted); }
.detailed-profile .service-scope { text-align:center; font-size:15px; line-height:1.45; margin:0 0 6px; }
.detailed-profile > blockquote { text-align:center; font-size:17px; line-height:1.4; margin:0 0 8px; word-break:keep-all; color:#5a4216; }
.profile-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:6px; }
.profile-tab { min-height:44px; padding:6px; font-size:17px; font-weight:700; background:#ffffffd9; border-color:#d9cdb7; }
.profile-tab[aria-expanded="true"] { background:var(--green); color:#fff; border-color:var(--green); }
.profile-detail { background:#ffffffe6; border:1px solid #d9cdb7; border-radius:10px; padding:10px 14px; margin-bottom:6px; max-height:38svh; overflow:auto; }
.profile-detail h3 { margin:0 0 6px; font-size:19px; color:var(--green); }
.profile-detail ul { list-style:none; margin:0; padding:0; }
.profile-detail li,.profile-detail p { font-size:17px; margin:0 0 6px; line-height:1.5; }
.books-line { text-align:center; font-size:15px; margin:0 0 6px; color:var(--muted); }
.detailed-profile .profile-start { margin-top:auto; padding-top:4px; border:0; }
.detailed-profile #start { display:flex; align-items:center; justify-content:center; gap:10px; font-size:19px; line-height:1.3; min-height:54px; padding:8px; }
.detailed-profile .start-arrow { font-size:28px; line-height:1; margin:0; }
.profile-more { margin-top:8px; font-size:16px; }
.profile-more summary { cursor:pointer; min-height:44px; display:flex; align-items:center; color:var(--muted); }
.profile-more blockquote { font-size:18px; margin:8px 0; text-align:center; }
.profile-more .closing { text-align:center; font-size:16px; }
@media(max-height:680px) { .detailed-profile { padding-top:6px; padding-bottom:8px; } .detailed-profile .university-logos img:first-child { height:56px; } .detailed-profile > h2 { font-size:23px; } .profile-tagline { font-size:16px; margin:3px 0; } .brand-box strong { font-size:17px; } .detailed-profile > blockquote { font-size:16px; margin-bottom:5px; } .profile-tab { min-height:40px; font-size:16px; } .detailed-profile .service-scope { font-size:14px; line-height:1.35; margin-bottom:4px; } }
@media(min-width:701px) { .detailed-profile { padding:32px 40px; } .detailed-profile .university-logos img { height:64px; } .detailed-profile .university-logos img:first-child { height:110px; } }

/* 개인정보 동의·확인·완료 화면 */
.notice-soft { color:#795420; font-size:17px; min-height:1.6em; }
.notice-soft:empty { display:none; }
.save-big { padding:16px; margin:16px 0; background:#edf2ec; border-left:4px solid #839b85; border-radius:8px; font-size:18px; font-weight:700; }
.save-big.error { background:#fbeceb; border-color:#a42824; color:#a42824; }
.history-list button { display:block; width:100%; text-align:left; margin:10px 0; overflow-wrap:anywhere; }
.history-list small { display:block; color:var(--muted); font-size:16px; font-weight:400; }
button:disabled { opacity:.5; cursor:not-allowed; }
@media(max-width:700px) { .detailed-profile > blockquote { display:block; } }

.backup-title { margin:28px 0 4px; font-size:22px; }
button[hidden] { display:none; }

.pdf-page-img { display:block; width:100%; height:auto; margin:10px 0; border:1px solid var(--line); -webkit-touch-callout:default; user-select:auto; }

/* 상담 선택 페이지 */
.choice-page h1 { text-align:center; font-size:28px; margin:4px 0 18px; }
.choice-card { border:1px solid var(--line); border-radius:16px; padding:18px; margin-bottom:16px; background:#fff; }
.choice-card h2 { font-size:22px; margin:0 0 6px; }
.choice-card p { margin:0 0 14px; font-size:18px; color:var(--muted); word-break:keep-all; }
.choice-btn { display:block; text-align:center; text-decoration:none; font-weight:700; font-size:20px; padding:15px 12px; border-radius:12px; margin-top:10px; min-height:56px; }
.choice-btn.kakao { background:#fee500; color:#191919; }
.choice-btn.call { background:#fff; color:var(--green); border:2px solid var(--green); }

body.choice-mode > .brand, body.choice-mode > footer { display:none; }
body.choice-mode main { padding-top:12px; }
@media(max-height:700px) { .choice-page { padding:16px; margin-bottom:0; } .choice-page h1 { font-size:24px; margin:0 0 12px; } .choice-card { padding:12px 14px; margin-bottom:12px; } .choice-card h2 { font-size:20px; } .choice-card p { font-size:16px; margin-bottom:8px; } .choice-btn { font-size:18px; padding:10px; min-height:48px; margin-top:8px; } .choice-page .primary { min-height:52px; font-size:20px; } }

body.choice-mode .choice-page { max-height:none !important; overflow:visible !important; }
.choice-btn.call { white-space:nowrap; }

.choice-back { margin-top:0; }
@media(max-height:700px) { .choice-back { min-height:46px; padding:8px; font-size:18px; } }
@media(max-height:700px) { .choice-page { padding:12px 14px; } .choice-page h1 { margin-bottom:8px; } .choice-card { margin-bottom:8px; } .choice-card p { margin-bottom:6px; } .choice-btn { margin-top:6px; min-height:44px; padding:8px; } .choice-page .primary { min-height:46px; } .choice-back { min-height:42px; } }

/* 오프닝 페이지(명함 앞) */
.opening-page { min-height:100svh; display:flex; flex-direction:column; padding:14px 18px 16px; position:relative; isolation:isolate; background:#fcfbf8; }
.opening-page > * { flex-shrink:0; }
.opening-page::before { content:''; position:absolute; z-index:-1; inset:0; background-color:#fdfcf9; background-image:linear-gradient(127deg,transparent 12%,#d4d3ce28 14%,#ffffffb8 18%,transparent 22%),linear-gradient(155deg,transparent 35%,#c7c7c127 39%,#fff 44%,transparent 51%),linear-gradient(115deg,transparent 63%,#d2d1cb25 67%,#ffffffbb 72%,transparent 79%),repeating-linear-gradient(142deg,#ffffff66 0 90px,#dbdbd514 105px,#ffffff99 132px,#ffffff11 180px); }
.opening-page::after { content:''; position:absolute; z-index:-1; inset:0; pointer-events:none; background:linear-gradient(135deg,transparent 0 7%,#b49b6040 7.1% 7.25%,transparent 7.4%),linear-gradient(25deg,transparent 0 90%,#b49b6050 90.1% 90.25%,transparent 90.4%); }
.hanok { display:block; width:min(62%,250px); height:auto; margin:4px auto 6px; }
.op-title { text-align:center; font-size:27px; line-height:1.3; margin:0 0 4px; color:#76551e; word-break:keep-all; }
.op-sub { text-align:center; font-size:17px; line-height:1.4; margin:0 0 12px; color:var(--ink); word-break:keep-all; }
.op-cards { display:grid; gap:7px; margin-bottom:10px; }
.op-card { background:#ffffffd9; border:1px solid #d9cdb7; border-radius:12px; padding:0 12px; }
.op-card summary { cursor:pointer; list-style:none; padding:8px 0; min-height:48px; display:flex; flex-direction:column; justify-content:center; }
.op-card summary::-webkit-details-marker { display:none; }
.op-card summary small { color:var(--muted); font-size:13px; line-height:1.2; }
.op-card summary strong { font-size:18px; line-height:1.3; color:var(--ink); }
.op-card[open] { border-color:#b49b60; }
.op-card p { margin:0 0 10px; font-size:16px; line-height:1.45; color:var(--muted); word-break:keep-all; }
.op-free { text-align:center; margin:0 0 10px; }
.op-free strong { display:block; font-size:17px; color:#76551e; line-height:1.35; }
.op-free small { display:block; font-size:13px; color:var(--muted); line-height:1.35; margin-top:2px; }
.opening-page #opening-start { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:auto; font-size:19px; min-height:52px; padding:8px; }
.opening-page .start-arrow { font-size:26px; line-height:1; }
@media(max-height:700px) { .opening-page { padding:8px 16px 10px; } .hanok { width:min(50%,190px); margin:0 auto 2px; } .op-title { font-size:23px; } .op-sub { font-size:15px; margin-bottom:8px; } .op-card summary { min-height:42px; padding:5px 0; } .op-card summary strong { font-size:16px; } .op-free strong { font-size:15px; } .op-free small { font-size:12px; } .opening-page #opening-start { min-height:46px; } }
@media(min-width:701px) { .opening-page { padding:32px 40px; } }

.op-sub { font-size:16px; line-height:1.5; margin-bottom:8px; }
.op-sub strong { display:block; font-size:19px; color:#76551e; margin-bottom:2px; }
.op-sub b { color:#76551e; }
.op-offer { text-align:center; margin:0 0 10px; padding:8px 10px; border:1px solid #b49b60; border-radius:12px; background:#fffdf6cc; }
.op-offer strong { display:block; font-size:17px; color:#76551e; line-height:1.4; }
.op-offer small { display:block; font-size:13px; color:var(--muted); line-height:1.35; }
@media(max-height:700px) { .op-sub { font-size:14px; line-height:1.4; margin-bottom:6px; } .op-sub strong { font-size:16px; } .op-offer { padding:5px 8px; margin-bottom:6px; } .op-offer strong { font-size:15px; } .op-offer small { font-size:12px; } }
@media(max-height:700px) { .opening-page .hanok { width:min(42%,150px); } .op-title { margin-bottom:2px; } .op-cards { gap:5px; margin-bottom:6px; } .op-card summary { min-height:38px; padding:3px 0; } .op-card summary small { font-size:12px; } .op-card summary strong { font-size:15px; } .op-free { margin-bottom:6px; } .op-free small { font-size:11px; } .opening-page #opening-start { min-height:44px; } }