/* Candidate 2 refinement. Local presentation only; behavior and API boundaries unchanged.
   Visual thesis: quiet white surfaces, tactile product imagery, precise blue selection.
   Content: hero > products > process > help; one-page specification workspace.
   Interaction: restrained hover, a single active-step marker, persistent editable summary.
   Keep candidate.css (including the approved 12s wave) unchanged for comparison. */
:root {
  --ink: #202d3e;
  --muted: #626f80;
  --blue: #346bb8;
  --blue-soft: #f0f5fc;
  --line: #e5e9ef;
}
.container { width: min(1240px, calc(100% - 80px)); }
.header-inner { height: 76px; }
.header nav a { padding-block: 24px; }
.header nav a[aria-current=page]:after { height: 2px; bottom: 14px; }
.button { border-radius: 12px; }
.button:hover { transform: translateY(-1px); }
.button.soft { background: white; color: #334b68; box-shadow: inset 0 0 0 1px #dce3ec; }
.button.soft:hover { background: #f1f5fa; }
.eyebrow { color: #5e718b; font-size: 14px; }
.home-hero { background: #fff; }
.hero-layout { min-height: 628px; padding-block: 44px 58px; gap: 58px; grid-template-columns: 1.25fr 1fr; }
.hero-copy { padding: 0; }
.hero-copy .eyebrow { margin-bottom: 22px; }
.hero-copy .headline-primary { font-size: clamp(30px, 3.15vw, 44px); line-height: 1.35; word-break: keep-all; overflow-wrap: break-word; }
.hero-second { font-size: clamp(38px, 3.6vw, 52px); line-height: 1.35; }
.hero-description { font-size: 16px; margin-top: 24px; }
.hero-actions { margin-top: 32px; gap: 8px; }
.hero-actions .button { padding-inline: 16px; font-size: 14px; gap: 13px; min-height: 54px; }
.hero-reassurance { font-size: 13px; margin-top: 16px; }
.hero-visual { background: #f7f8fa; border-radius: 24px; display: grid; grid-template-rows: minmax(0, 1fr) auto; padding: 22px; max-height: 510px; align-self: stretch; }
.hero-visual img { mix-blend-mode: normal; width: 100%; height: 100%; min-height: 0; object-fit: contain; padding: 0; border-radius: 8px; }
.hero-visual figcaption { position: static; width: auto; padding-top: 19px; font-size: 14px; align-items: center; }
.hero-visual figcaption br { display: none; }
.hero-visual strong { display: block; margin-top: 3px; font-size: 20px; }
.image-label { font-size: 12px; max-width: 115px; text-align: right; }
.section { padding-block: 80px; }
.home-examples { border-top: 1px solid var(--line); }
.section-heading h2 { font-size: 32px; }
.home-example-grid { gap: 32px; }
.home-example-grid .case-media, .case-media { height: 350px; border-radius: 18px; background: #f6f7f9; }
.case-media img { mix-blend-mode: normal; padding: 20px; }
.case-open:hover .case-media { background: #eef2f6; }
.case-open:hover img { transform: scale(1.02); }
.case-text { padding: 21px 0 8px; }
.case-text strong { font-size: 24px; font-weight: 680; }
.case-text p { max-width: 46ch; line-height: 1.75; }
.case .text-link { min-height: 44px; }
.process { background: #f7f9fb; }
.process-list li>span { background: transparent; color: #4774aa; font-size: 20px; border-radius: 0; justify-content: start; }
.process-list h3 { margin-top: 16px; }
.process-list p { margin-top: 10px; }
.closing { padding-block: 84px; }
.closing h2 { font-size: 38px; }
.page-heading { padding: 48px 0 38px; }
.page-heading h1 { font-size: 38px; }
.page-heading p:last-child { font-size: 16px; }
.mobile-copy-break { display: none; }
.quote-layout { grid-template-columns: minmax(0, 1fr) 318px; gap: 64px; }
#quote-form { overflow-anchor: none; }
.page[data-page="quote"] { animation: none; }
#quote-form fieldset { display: flow-root; border: 1px solid transparent; border-radius: 16px; padding: 24px; margin: 0 0 24px; background: white; transition: background-color .28s ease, border-color .28s ease, box-shadow .28s ease; }
#quote-form fieldset+fieldset { padding-top: 24px; }
/* Keep the legend inside normal flow, not in fieldset's special border cutout. */
#quote-form legend { float: left; width: 100%; font-size: 23px; gap: 12px; margin-bottom: 18px; padding: 0; }
#quote-form legend ~ * { clear: both; }
.step { width: 30px; height: 30px; border-radius: 50%; background: #f0f2f5; color: #778393; }
/* The step number guides; the bordered option marks selection. They are not the same state. */
#quote-form fieldset.is-guided { background: #f4f8fd; border-color: #9cbade; box-shadow: 0 3px 16px #346bb80a; }
#quote-form fieldset.is-guided .step { background: var(--blue); box-shadow: 0 0 0 5px #edf3fa; animation: none; }
.guide-label { background: #e3edf9; color: #305e96; padding: 5px 9px; border-radius: 6px; font-weight: 650; font-size: 12px; opacity: 0; visibility: hidden; transition: opacity .2s ease; }
.is-guided .guide-label { opacity: 1; visibility: visible; }
.guide-next { margin-top: 18px; min-height: 44px; font-size: 14px; }
#quote-form fieldset:not(.is-guided) .guide-next { visibility: hidden; }
#quote-form fieldset.has-error { box-shadow: none; background: #fffafa; border-color: #d48787; }
#quote-form fieldset.has-error legend { color: #a62b2b; }
#quote-form fieldset.has-error .step { background: #b73a3a; color: white; box-shadow: none; }
.field-help { font-size: 15px; margin-bottom: 18px; }
.choices { gap: 10px; }
.choice { padding: 16px; border: 1px solid #dce2ea; border-radius: 12px; box-shadow: none; }
.choice:hover { border-color: #89a6cc; background: #fafcff; transform: none; }
.choice:has(input:checked) { border-color: var(--blue); background: #f1f6fc; box-shadow: inset 0 0 0 1px var(--blue); }
.choice:has(input:checked) .choice-head strong { color: #214e86; }
.choice .checkmark { width: 19px; height: 19px; }
.choice-head strong { font-size: 17px; }
.choice small { margin-top: 4px; font-size: 14px; font-weight: 400; }
.availability { background: #eef3f9; color: #466487; font-size: 12px; padding: 3px 7px; border-radius: 5px; margin-top: 10px; font-weight: 500; }
.availability.consult { background: #fff4dc; color: #886016; }
.packaging-choices { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.packaging-choices .choice { grid-column: span 2; }
.packaging-choices .choice:nth-last-child(-n+2) { grid-column: span 3; display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 12px; }
.packaging-choices .choice:nth-last-child(-n+2) .choice-head { grid-column: 1; }
.packaging-choices .choice:nth-last-child(-n+2) small { grid-column: 1; }
.packaging-choices .choice:nth-last-child(-n+2) .availability { grid-column: 2; grid-row: 1 / 3; margin: 0; }
.packaging-choices .choice:nth-last-child(-n+2) .checkmark { display: none; }
.packaging-choices .choice:nth-last-child(-n+2):has(input:checked) .checkmark { display: flex; }
.consult-route { background: transparent; padding: 16px 0 0; margin-top: 4px; border-radius: 0; }
.consult-route strong { font-size: 14px; color: #425977; }
.consult-route small { font-size: 13px; margin-top: 1px; }
.consult-route>span:last-child { font-size: 20px; }
.material-choices { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.material-choices .choice { padding: 12px; }
.material-choices img, .material-letter { height: 105px; width: 100%; object-fit: contain; margin-bottom: 13px; mix-blend-mode: normal; border-radius: 7px; }
.material-letter { background: #f5f7fa; color: #72839a; }
.material-choices .choice small { font-size: 14px; }
.color-choices .choice { padding: 14px 12px; }
.color-choices .choice:before { content: ''; display: block; width: 27px; height: 27px; border: 1px solid #c8d1dc; border-radius: 50%; margin-bottom: 10px; background: #fff; }
.color-choices .choice:has([value=transparent]):before { background: linear-gradient(135deg, #e4ebf2, #fff 48%, #e0e8f2); }
.color-choices .choice:has([value=black]):before { background: #26313e; border-color: #26313e; }
.color-choices .choice:has([value=other]):before { background: conic-gradient(#c98d8d, #d4c493, #92b3ac, #8da3cb, #c98d8d); }
.strength-choices .choice { padding: 17px 12px; }
.switch-row { padding: 18px 0; background: transparent; border-block: 1px solid var(--line); border-radius: 0; margin-top: 24px; }
input:not([type=radio]):not([type=checkbox]):not([type=file]), textarea { background: #fff; border-color: #dce2ea; border-width: 1px; border-radius: 10px; min-height: 54px; }
input:focus, textarea:focus { border-color: var(--blue) !important; box-shadow: 0 0 0 3px #346bb815; }
input[readonly] { background: #f7f9fb !important; }
label { font-size: 15px; }
details { padding: 14px 0; background: transparent; border-radius: 0; border-bottom: 1px solid var(--line); }
.quote-summary { padding: 26px; border-radius: 18px; background: #f6f8fb; top: 100px; max-height: calc(100dvh - 118px); }
.quote-summary h2 { font-size: 20px; margin: 12px 0 20px; }
.quote-summary progress, #progress-label { display: none; }
.quote-summary .summary-row { min-height: 49px; padding: 13px 0; }
.summary-row strong { font-weight: 580; }
.summary-row strong.missing { color: #727f90; }
.summary-bottom>p:first-child { font-size: 14px; line-height: 1.65; }
.quote-summary .summary-bottom { padding-top: 22px; }
.quote-summary .summary-bottom .button { min-height: 54px; }
.quote-summary #consult-notice { padding: 16px; border: 0; }
.filter-bar { gap: 10px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.filter-bar button { background: white; border: 1px solid var(--line); border-radius: 24px; padding-inline: 19px; }
.filter-bar button[aria-pressed=true] { background: #2c415e; border-color: #2c415e; }
.portfolio-grid { gap: 42px 30px; }
.portfolio-note { margin-bottom: 24px; }
.inline-help { background: transparent; padding: 30px 0 0; border-top: 1px solid var(--line); border-radius: 0; }
.consult-layout { grid-template-columns: minmax(0, 740px) 300px; gap: 80px; }
.form-section h2 { font-size: 23px; }
.form-section+.form-section { margin-top: 40px; padding-top: 38px; }
.upload-zone { background: #f8fafc; padding: 25px; border-radius: 12px; }
.consult-aside { padding: 27px; border-radius: 18px; background: #f6f8fb; }
.aside-symbol { display: none; }
.consult-aside h2 { font-size: 24px; }
.consult-aside>p { font-size: 15px; }
.contact-grid { gap: 24px 18px; }
.detail-image, .detail-image img { mix-blend-mode: normal; }
.detail-image { background: #f7f8fa; }
.amount-preview { background: #f5f8fc; padding: 28px; }
.quote-amounts>div:first-child { flex-direction: column; align-items: start; gap: 8px; }
.quote-amounts>div:first-child dd { font-size: 42px; }
.quote-amounts>div+div dd { font-size: 25px; }
@media (max-width: 1100px) {
  .hero-layout { gap: 30px; grid-template-columns: 1.25fr 1fr; }
  .hero-actions .button { padding-inline: 13px; }
  .quote-layout { gap: 35px; grid-template-columns: minmax(0, 1fr) 290px; }
  .material-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .packaging-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .packaging-choices .choice, .packaging-choices .choice:nth-last-child(-n+2) { grid-column: auto; display: block; }
  .packaging-choices .choice:nth-last-child(-n+2) .availability { margin-top: 10px; }
  .consult-layout { gap: 44px; grid-template-columns: minmax(0, 1fr) 280px; }
}
@media (max-width: 1023px) {
  .quote-layout { display: block; }
  .quote-summary { position: static; max-height: none; margin-top: 10px; }
  .quote-summary #summary-rows { display: grid; grid-template-columns: 1fr 1fr; gap: 0 25px; }
  .packaging-choices { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .material-choices { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .consult-layout { display: block; }
  .consult-aside { display: none; }
}
@media (max-width: 700px) {
  .container { width: calc(100% - 40px); }
  .header-inner { height: 65px; }
  .header nav a { padding: 13px 12px; }
  .hero-layout { display: flex; gap: 24px; padding-block: 26px 24px; min-height: 0; }
  .hero-copy .eyebrow { margin-bottom: 14px; }
  .hero-copy .headline-primary { font-size: clamp(27px, 7.5vw, 34px); margin-bottom: 18px; }
  .hero-second { font-size: 35px; }
  .hero-description { font-size: 14px; margin-top: 18px; }
  .hero-actions { margin-top: 24px; gap: 8px; }
  .hero-actions .button { min-height: 52px; font-size: 15px; padding-inline: 18px; }
  .hero-reassurance { font-size: 12px; }
  .hero-visual { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); grid-template-rows: 1fr; height: 220px; padding: 14px; border-radius: 18px; }
  .hero-visual img { width: 100%; height: 100%; margin: 0; padding: 0; object-position: center; align-self: center; }
  .hero-visual figcaption { position: static; width: auto; display: block; padding: 12px; font-size: 13px; }
  .hero-visual strong { font-size: 17px; }
  .image-label { font-size: 11px; text-align: left; margin-top: 16px; }
  .section { padding-block: 52px; }
  .section-heading h2 { font-size: 28px; }
  .home-example-grid .case-media, .case-media { height: 290px; }
  .case-text strong { font-size: 22px; }
  .closing { padding-block: 55px; }
  .closing h2 { font-size: 31px; }
  .page-heading { padding: 34px 0 30px; }
  .page-heading h1 { font-size: 32px; }
  .page-heading p:last-child { font-size: 15px; }
  .mobile-copy-break { display: initial; }
  #quote-form legend { font-size: 20px; gap: 10px; flex-wrap: wrap; align-items: start; }
  #quote-form legend .step { width: 26px; height: 26px; font-size: 13px; margin-top: 2px; }
  .guide-label { display: inline-block; font-size: 11px; padding: 4px 7px; }
  #quote-form fieldset.is-guided { box-shadow: none; }
  #quote-form fieldset, #quote-form fieldset+fieldset { padding: 18px 14px; margin-bottom: 18px; }
  .packaging-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .packaging-choices .choice:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr auto; gap: 0 8px; }
  .packaging-choices .choice:last-child .availability { grid-row: 1 / 3; grid-column: 2; align-self: center; margin: 0; }
  .choice { padding: 14px 12px; }
  .choice-head strong { font-size: 16px; }
  .choice small { font-size: 13px; }
  .material-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .material-choices img, .material-letter { height: 95px; }
  .color-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .color-choices .choice { display: grid; grid-template-columns: 23px minmax(0, 1fr); column-gap: 9px; align-items: center; }
  .color-choices .choice:before { width: 23px; height: 23px; margin: 0; }
  .color-choices .choice .availability { grid-column: 2; justify-self: start; }
  .color-choices .choice-head strong { font-size: 14px; }
  .color-choices .checkmark { width: 15px; height: 15px; font-size: 10px; }
  .quote-summary { padding: 24px; }
  .quote-summary #summary-rows { display: block; }
  .mobile-quote-bar { border-radius: 13px; box-shadow: 0 3px 16px #1c365a17; }
  .mobile-quote-bar>span { display: none; }
  .mobile-quote-bar .button { width: 100%; }
  .contact-grid { grid-template-columns: 1fr; gap: 21px; }
  .form-section h2 { font-size: 22px; }
  .quote-amounts>div+div { flex-direction: column; align-items: start; }
  .quote-amounts dd { white-space: normal; overflow-wrap: anywhere; max-width: 100%; }
  .quote-amounts>div:first-child dd { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { transition: none !important; }
}

#print-document { display: none; }

/* Print Media Styles for 1:1 Scale Print Feature */
@media print {
    @page print-portrait {
        size: A4 portrait;
        margin: 0;
    }
    @page print-landscape {
        size: A4 landscape;
        margin: 0;
    }
    html, body {
        width: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #ffffff !important;
    }
    body > *:not(#print-document) { display: none !important; }
    #print-document { display: block !important; }
    .print-sheet {
        position: relative;
        overflow: hidden;
        margin: 0;
        padding: 0;
        break-after: page;
        page-break-after: always;
        background: #ffffff !important;
        color: #000000 !important;
    }
    .print-sheet[data-orientation="portrait"] { page: print-portrait; }
    .print-sheet[data-orientation="landscape"] { page: print-landscape; }
    .print-sheet:last-child {
        break-after: auto;
        page-break-after: auto;
    }
    .print-drawing-fragment {
        position: absolute;
        box-sizing: border-box;
        border: 0.45mm dashed #0f172a;
    }
    .print-drawing-viewport {
        position: absolute;
        overflow: hidden;
    }
    .print-drawing-label {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        padding: 3mm;
        background: rgba(255, 255, 255, 0.95) !important;
        color: #0f172a !important;
        font-family: Arial, sans-serif;
        text-align: center;
        line-height: 1.45;
    }
    .print-drawing-label-title {
        margin-bottom: 1.5mm;
        color: #64748b !important;
        font-size: 8pt;
        font-weight: 700;
    }
    .print-drawing-label-size {
        font-size: 12pt;
        font-weight: 800;
        letter-spacing: 0.02em;
    }
    .print-drawing-label-plan {
        margin-top: 1.5mm;
        color: #2563eb !important;
        font-size: 8pt;
        font-weight: 700;
    }
    .print-sheet-meta {
        position: absolute;
        z-index: 2;
        top: 3mm;
        left: 4mm;
        right: 4mm;
        height: 9mm;
        border-bottom: 0.45mm solid #0f172a;
        background: #ffffff !important;
        color: #0f172a !important;
        font-family: Arial, sans-serif;
        font-size: 7.5pt;
        line-height: 8mm;
        white-space: nowrap;
    }
    .print-sheet-brand {
        font-size: 11pt;
        font-weight: 800;
    }
    .print-sheet-subtitle {
        margin-left: 3mm;
        color: #64748b !important;
    }
    .print-sheet-date {
        float: right;
        color: #64748b !important;
    }
    .print-calibration {
        position: absolute;
        z-index: 2;
        left: 4mm;
        top: 19mm;
        width: 100mm;
        height: 4mm;
        padding: 0 1mm;
        box-sizing: border-box;
        background: #0f172a !important;
        color: #ffffff !important;
        font-family: Arial, sans-serif;
        font-size: 5.5pt;
        font-weight: 700;
        line-height: 4mm;
        display: flex;
        justify-content: space-between;
    }
    .print-calibration::before {
        content: '100mm 검증용 기준선 (자로 측정하여 10cm인지 확인)';
        position: absolute;
        left: 0;
        bottom: 5mm;
        color: #475569 !important;
        font-size: 7.5pt;
        line-height: 3mm;
        white-space: nowrap;
    }
}
/* Production connections, preserving the approved candidate composition. */
.spec-help { margin-top: 20px; padding: 16px; border: 1px solid #c8d8eb; border-radius: 14px; background: #f0f5fc; }
.spec-help p { margin: 0 0 12px; font-size: 15px; font-weight: 650; line-height: 1.6; color: #334b68; }
.consultation-help-button { min-height: 50px; background: white; color: #24538e; border: 2px solid #6087b9; font-size: 16px; }
.consultation-help-button:hover { background: #e4eefb; border-color: #346bb8; }
.detail-gallery { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.detail-gallery .file-preview { width: 76px; height: 76px; }
#detail-summary { white-space: pre-line; }
/* Ready is a visual cue only. Missing-input validation and consultation stay usable. */
#quote-action.is-quote-ready, #mobile-quote-action.is-quote-ready {
  position: relative; overflow: hidden; isolation: isolate;
  animation: none;
}
#quote-action.is-quote-ready::after, #mobile-quote-action.is-quote-ready::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 20%, rgb(255 255 255 / 55%) 50%, transparent 80%);
  transform: translateX(-120%); animation: quote-ready-shine 2.4s cubic-bezier(.65, 0, .35, 1) infinite;
}
@keyframes quote-ready-shine {
  0%, 8% { transform: translateX(-120%); opacity: 0; }
  16%, 45% { opacity: 1; }
  60%, 100% { transform: translateX(120%); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  #quote-action.is-quote-ready, #mobile-quote-action.is-quote-ready {
    animation: none; transform: none; box-shadow: 0 0 0 3px rgb(49 103 180 / 16%);
  }
  #quote-action.is-quote-ready::after, #mobile-quote-action.is-quote-ready::after { display: none; animation: none; }
}
#site-status { margin: 12px auto; padding: 16px; max-width: 1280px; }
#postcode-mount { width: 100%; height: min(480px, 65dvh); min-height: 300px; }
#address-dialog { width: min(560px, calc(100vw - 32px)); }
#portfolio-grid[data-count="1"] { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
#portfolio-grid[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 700px) {
  #portfolio-grid[data-count="2"] { grid-template-columns: minmax(0, 1fr); }
}