/* Paperlogy (SIL OFL 1.1) — files in assets/fonts, trimmed to everyday Hangul + this site's characters */
  @font-face{font-family:'Paperlogy'; font-weight:400; font-style:normal; font-display:swap; src:url('fonts/Paperlogy-4Regular.woff2') format('woff2'); size-adjust:106%;}
  @font-face{font-family:'Paperlogy'; font-weight:500; font-style:normal; font-display:swap; src:url('fonts/Paperlogy-5Medium.woff2') format('woff2'); size-adjust:106%;}
  @font-face{font-family:'Paperlogy'; font-weight:600; font-style:normal; font-display:swap; src:url('fonts/Paperlogy-6SemiBold.woff2') format('woff2'); size-adjust:106%;}
  @font-face{font-family:'Paperlogy'; font-weight:700; font-style:normal; font-display:swap; src:url('fonts/Paperlogy-7Bold.woff2') format('woff2'); size-adjust:106%;}
  @font-face{font-family:'Paperlogy'; font-weight:800; font-style:normal; font-display:swap; src:url('fonts/Paperlogy-8ExtraBold.woff2') format('woff2'); size-adjust:106%;}
  :root{
    --navy: #002146;
    --navy-deep: #03182f;
    --navy-ink: #0c2645;
    --green: #0b9539;
    --green-dark: #087a2e;
    --green-tint: #e3f5e7;
    --paper: #f7f5ef;
    --paper-line: #ded9c9;
    --ink: #16233a;
    --muted: #5c6b82;
    --muted-on-navy: #9fb0c7;
    --white: #ffffff;
    --serif: 'Paperlogy', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
    --sans: 'Paperlogy', 'Apple SD Gothic Neo', 'Malgun Gothic', -apple-system, sans-serif;
    --mono: 'Paperlogy', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth; -webkit-text-size-adjust:100%; text-size-adjust:100%;}
  body{
    font-family: var(--sans);
    color: var(--ink);
    background: var(--paper);
    line-height:1.6;
    letter-spacing:.01em; word-spacing:.05em;   /* Paperlogy sets Hangul tightly; a little air keeps body text readable */
    word-break:keep-all; overflow-wrap:break-word;   /* Korean wraps at spaces, not between syllables; a too-long URL/e-mail may still break */
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1160px; margin:0 auto; padding:0 32px;}
  section{position:relative;}
  .eyebrow{
    font-family: var(--mono);
    font-size:12.5px;
    letter-spacing:.12em;
    text-transform:uppercase;
    color: var(--green-dark);
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    font-weight:600;
  }
  .eyebrow::before{
    content:"";
    width:22px;height:1px;background:var(--green-dark);
    display:inline-block;
  }
  .eyebrow.on-dark{color:#8fe3a8;}
  .eyebrow.on-dark::before{background:#8fe3a8;}
  h1,h2,h3{font-family:var(--serif); font-weight:700; letter-spacing:0;}
  .section-title{
    font-size: clamp(26px, 3.4vw, 40px);
    line-height:1.35;
    color: var(--navy);
    margin-bottom:14px;
  }
  .section-sub{
    color: var(--muted);
    font-size:16px;
    max-width:620px;
    margin-bottom:52px;
  }

  /* ---------- HEADER ---------- */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    background: rgba(247,245,239,.88);
    backdrop-filter: blur(10px);
    border-bottom:1px solid rgba(0,33,70,.08);
    transition: all .3s ease;
  }
  .nav{
    max-width:1160px; margin:0 auto; padding:14px 32px;
    display:flex; align-items:center; justify-content:space-between;
  }
  .logo-group{display:flex; align-items:center; gap:10px;}
  .logo-icon{height:50px; width:auto;}
  .logo-text{font-family:var(--sans); font-weight:700; font-size:30px; color:var(--navy); letter-spacing:0;}
  .nav-links{display:flex; gap:34px; align-items:center;}
  .nav-links a{
    font-size:14.5px; font-weight:500; color:var(--navy);
    position:relative; padding:4px 0;
  }
  .nav-links a::after{
    content:""; position:absolute; left:0; bottom:0; width:0; height:2px;
    background:var(--green); transition: width .25s ease;
  }
  .nav-links a:hover::after{width:100%;}

  .nav-dropdown{position:relative;}
  .nav-dropdown-menu{
    position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(6px);
    background:#fff; border:1px solid var(--paper-line); border-radius:6px;
    box-shadow:0 20px 40px -24px rgba(0,33,70,.35);
    padding:8px; min-width:168px;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .2s ease, transform .2s ease, visibility .2s;
    z-index:150;
  }
  .nav-dropdown:hover .nav-dropdown-menu,
  .nav-dropdown:focus-within .nav-dropdown-menu{
    opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0);
  }
  .nav-dropdown-menu a{
    display:block; padding:10px 14px; font-size:14px; font-weight:500; color:var(--navy);
    border-radius:4px; white-space:nowrap;
  }
  .nav-dropdown-menu a::after{display:none;}
  .nav-dropdown-menu a:hover{background:var(--green-tint); color:var(--green-dark);}

  .nav-inquiry-btn{
    font-family:var(--sans); font-size:14.5px; font-weight:700;
    background:var(--green); color:#fff; padding:10px 20px; border-radius:3px;
    display:inline-flex; align-items:center; border:none; cursor:pointer;
  }
  .nav-inquiry-btn:hover{background:var(--green-dark);}
  .nav-toggle{display:none;}

  /* ---------- HERO ---------- */
  .hero{
    background: radial-gradient(120% 140% at 85% -10%, #0a3c6b 0%, var(--navy) 42%, var(--navy-deep) 100%);
    color:#fff;
    padding: 168px 0 120px;
    overflow:hidden;
    position:relative;
  }
  .hero-video-wrap{position:absolute; inset:0; z-index:0; overflow:hidden;}
  .hero-video{width:100%; height:100%; object-fit:cover; display:block;}
  .hero-video-wrap::after{
    content:"";
    position:absolute; inset:0;
    background: linear-gradient(100deg, rgba(2,16,32,.88) 0%, rgba(2,18,35,.78) 28%, rgba(3,20,38,.5) 50%, rgba(3,20,38,.26) 70%, rgba(3,20,38,.14) 100%);
  }
  @media (prefers-reduced-motion: reduce){
    .hero-video-wrap{display:none;}
  }
  .hero::before{
    content:"";
    position:absolute; inset:0; z-index:1;
    background-image:
      linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: radial-gradient(60% 60% at 70% 30%, black, transparent);
    pointer-events:none;
  }
  .hero-grid{
    position:relative; z-index:2;
  }
  .hero-grid > div{max-width:720px;}
  .hero-tag{
    font-family:var(--mono); font-size:13px; letter-spacing:.14em; text-transform:uppercase;
    color:#8fe3a8; margin-bottom:22px; display:flex; align-items:center; gap:10px;
  }
  .hero-tag::before{content:"+"; font-size:16px;}
  .hero h1{
    font-size: clamp(34px, 4.6vw, 58px);
    line-height:1.28;
    margin-bottom:26px;
  }
  .hero h1 .accent{color:#8fe3a8;}
  .hero-desc{
    font-size:17px; color:#c3d1e3; margin-bottom:30px;
    font-weight:400;
  }
  .hero-stats{
    display:flex; gap:0; border-top:1px solid rgba(255,255,255,.14); padding-top:26px;
  }
  .hero-stats div{flex:1; padding-right:20px;}
  .hero-stats .num{font-family:var(--mono); font-size:26px; font-weight:600; color:#fff;}
  .hero-stats .num span{color:#8fe3a8;}
  .hero-stats .label{font-size:12.5px; color:var(--muted-on-navy); margin-top:4px;}

  .ekg-line{
    position:absolute; bottom:-6px; left:50%; transform:translateX(-50%);
    width:120%; z-index:1; opacity:.9;
  }
  .ekg-line polyline{
    stroke-dasharray:1600; stroke-dashoffset:1600;
    animation: ekgDraw 2.4s ease-out .3s forwards;
  }
  @keyframes ekgDraw{ to{ stroke-dashoffset:0; } }

  /* ---------- SECTION GENERIC ---------- */
  .section{padding:110px 0;}
  .section.paper{background:var(--paper);}
  .section.tint{background:var(--green-tint);}
  .section.navy{background:var(--navy); color:#fff;}

  /* ---------- CHART / SYMPTOMS ---------- */
  .chart-card{
    background:#fff;
    border:1px solid var(--paper-line);
    border-radius:6px;
    box-shadow: 0 24px 60px -34px rgba(0,33,70,.25);
    overflow:hidden;
  }
  .chart-head{
    display:flex; justify-content:space-between; align-items:center;
    padding:22px 34px; border-bottom:1.5px dashed var(--paper-line);
    background: linear-gradient(180deg, #fff, #fbfaf6);
  }
  .chart-head .ch-title{font-family:var(--mono); font-size:13px; color:var(--muted); letter-spacing:.06em;}
  .chart-head .ch-id{font-family:var(--mono); font-size:12px; color:var(--muted); opacity:.7;}
  .symptom-list{padding:6px 0;}
  .symptom{
    display:grid; grid-template-columns: 46px 1fr; gap:20px;
    padding:26px 34px;
    border-bottom:1px solid #f0efe8;
    align-items:flex-start;
  }
  .symptom:last-child{border-bottom:none;}
  .symptom .mark{
    width:30px; height:30px; border-radius:50%;
    background:var(--green-tint); color:var(--green-dark);
    display:flex; align-items:center; justify-content:center;
    font-weight:700; font-size:14px; border:1.5px solid var(--green);
    margin-top:2px;
  }
  .symptom h4{font-size:17px; color:var(--navy); margin-bottom:6px; font-family:var(--sans); font-weight:700;}
  .symptom p{font-size:14.5px; color:var(--muted);}

  /* ---------- DEPARTMENTS ---------- */
  .dept-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--paper-line); border:1px solid var(--paper-line); border-radius:6px; overflow:hidden;}
  .dept-card{display:block; background:#fff; padding:42px 34px; position:relative; transition: background .3s ease, transform .25s ease, box-shadow .25s ease; cursor:pointer;}
  .dept-card:hover{background:#fbfbf7; transform:translateY(-6px); box-shadow:0 20px 40px -24px rgba(0,33,70,.35); z-index:2;}
  .dept-num{font-family:var(--mono); font-size:12.5px; color:var(--green-dark); margin-bottom:22px; letter-spacing:.08em;}
  .dept-icon{width:46px; height:46px; margin-bottom:24px;}
  .dept-card h3{font-size:21px; color:var(--navy); margin-bottom:6px;}
  .dept-card .dept-sub{font-family:var(--mono); font-size:12px; color:var(--muted); margin-bottom:18px;}
  .dept-card ul{list-style:none;}
  .dept-card li{
    font-size:14px; color:var(--ink); padding:9px 0 9px 20px; position:relative;
    border-top:1px solid #f0efe8;
  }
  .dept-card li:first-child{border-top:none;}
  .dept-card li::before{content:"+"; position:absolute; left:0; color:var(--green); font-weight:700;}
  .dept-more{
    font-family:var(--mono); font-size:12.5px; font-weight:600; color:var(--green-dark);
    margin-top:22px; display:flex; align-items:center; gap:6px; transition:gap .2s ease;
  }
  .dept-card:hover .dept-more{gap:10px;}

  /* ---------- PAGE HERO (detail pages) ---------- */
  .page-hero{
    background: radial-gradient(120% 140% at 85% -10%, #0a3c6b 0%, var(--navy) 42%, var(--navy-deep) 100%);
    color:#fff; padding:150px 0 70px;
    position:relative; overflow:hidden;
  }
  .page-hero.has-photo{
    background-size: cover;
    background-position: center;
  }
  .page-hero.has-photo::before{
    content:"";
    position:absolute; inset:0; z-index:1;
    background: linear-gradient(100deg, rgba(2,16,32,.90) 0%, rgba(2,18,35,.82) 32%, rgba(3,20,38,.55) 55%, rgba(3,20,38,.30) 75%, rgba(3,20,38,.16) 100%);
  }
  .page-hero .wrap{position:relative; z-index:2;}
  .breadcrumb{
    font-family:var(--mono); font-size:12.5px; color:var(--muted-on-navy);
    margin-bottom:22px; display:flex; gap:8px; align-items:center; flex-wrap:wrap;
  }
  .breadcrumb a{color:var(--muted-on-navy); transition:color .2s ease;}
  .breadcrumb a:hover{color:#fff;}
  .breadcrumb .sep{opacity:.5;}
  .page-hero h1{font-size:clamp(32px, 4.2vw, 46px); margin:14px 0 18px;}
  .page-hero-desc{font-size:16px; color:#c3d1e3; max-width:600px; font-weight:400;}

  /* ---------- DETAIL BLOCKS ---------- */
  .detail-grid{display:flex; flex-direction:column; gap:2px; background:var(--paper-line); border:1px solid var(--paper-line); border-radius:6px; overflow:hidden;}
  .detail-block{background:#fff; padding:44px 42px;}
  .detail-num{font-family:var(--mono); font-size:12.5px; color:var(--green-dark); margin-bottom:14px; letter-spacing:.08em;}
  .detail-block h3{font-size:23px; color:var(--navy); margin-bottom:12px;}
  .detail-block > p{font-size:15px; color:var(--muted); max-width:660px; margin-bottom:20px;}
  .detail-points{list-style:none; max-width:660px;}
  .detail-points li{
    font-size:14.5px; color:var(--ink); padding:11px 0 11px 20px; position:relative;
    border-top:1px solid #f0efe8;
  }
  .detail-points li:first-child{border-top:none;}
  .detail-points li::before{content:"+"; position:absolute; left:0; color:var(--green); font-weight:700;}

  /* ---------- PROCESS ---------- */
  .process-track{position:relative; padding-top:10px;}
  .process-line{
    position:absolute; top:23px; left:0; right:0; height:2px;
    background: repeating-linear-gradient(90deg, var(--paper-line) 0 8px, transparent 8px 14px);
  }
  .process-steps{display:grid; grid-template-columns:repeat(5,1fr); gap:18px; position:relative;}
  .p-step .p-dot{
    width:46px; height:46px; border-radius:50%; background:var(--navy); color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-family:var(--mono); font-weight:600; font-size:15px;
    margin-bottom:22px; position:relative; z-index:2;
    border:5px solid var(--paper);
  }
  .p-step:nth-child(3) .p-dot{background:var(--green);}
  .p-step h4{font-size:16px; color:var(--navy); margin-bottom:8px;}
  .p-step p{font-size:13.5px; color:var(--muted);}

  /* ---------- CASES · PROGRESS NOTE ---------- */
  .prog{background:#fff; color:var(--ink); border-radius:8px; overflow:hidden;}
  .prog-hd{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:16px 28px; background:var(--navy-deep); border-bottom:1px solid rgba(255,255,255,.08); color:#fff; font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:.14em;}
  .prog-hd span:last-child{color:#8fe3a8;}
  .prog-row{display:grid; grid-template-columns:1.3fr .8fr 1.6fr .8fr 1fr; align-items:center; text-align:center; padding:26px 28px; border-top:1px dashed var(--paper-line);}
  .prog-th{padding:13px 28px; background:var(--paper); border-top:0; border-bottom:1px solid var(--paper-line); font-size:12.5px; font-weight:700; letter-spacing:.06em; color:var(--muted);}
  .prog-th + .prog-row{border-top:0;}
  .prog-name small{display:block; font-family:var(--mono); font-size:11.5px; font-weight:700; letter-spacing:.14em; color:var(--green);}
  .prog-name b{display:block; font-size:20px; color:var(--navy); margin-top:2px;}
  .prog-num{font-family:var(--mono); font-size:28px; font-weight:800; color:var(--navy);}
  .prog-num.after{color:var(--green);}
  .prog-ekg svg{display:block; width:100%; max-width:200px; height:44px; margin:0 auto; fill:none; stroke:var(--green); stroke-width:2.2; stroke-linejoin:round; vector-effect:non-scaling-stroke;}
  .prog-ekg path{stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1.6s cubic-bezier(.4,0,.2,1) .3s;}
  .prog.in .prog-ekg path{stroke-dashoffset:0;}
  .prog-row:nth-child(4) .prog-ekg path{transition-delay:.7s;}
  .prog-stamp{justify-self:center; display:flex; flex-direction:column; align-items:center; justify-content:center; width:96px; height:96px; border:2.5px solid var(--green); border-radius:50%; color:var(--green); font-family:var(--mono); font-size:22px; font-weight:800; line-height:1.1; transform:rotate(-8deg) scale(.6); opacity:0; transition:transform .5s cubic-bezier(.3,1.6,.5,1) 1.4s, opacity .3s ease 1.4s;}
  .prog.in .prog-stamp{transform:rotate(-8deg) scale(1); opacity:1;}
  .prog-row:nth-child(4) .prog-stamp{transition-delay:1.8s;}
  .prog-stamp em{font-style:normal; font-size:12px; letter-spacing:.1em;}
  @media (prefers-reduced-motion: reduce){
    .prog-ekg path{stroke-dashoffset:0; transition:none;}
    .prog-stamp{transform:rotate(-8deg); opacity:1; transition:none;}
  }
  .case-note{font-size:13px; color:var(--muted); margin-top:22px; text-align:center;}

  /* ---------- CAREER / FOUNDER ---------- */
  .founder-card{
    display:grid; grid-template-columns:auto minmax(0,1fr); gap:0 72px; align-items:center;
    background:#fff; border:1px solid var(--paper-line); border-radius:6px; padding:40px 44px;
  }
  .founder-card .role{font-family:var(--mono); font-size:12px; color:var(--green-dark); letter-spacing:.08em; margin-bottom:10px;}
  .founder-card h3{font-size:26px; color:var(--navy); margin-bottom:4px;}
  .founder-card .title-en{font-size:13px; color:var(--muted);}
  .founder-quote{
    font-family:var(--serif); font-size:15px; color:var(--ink); line-height:1.8;
    border-left:3px solid var(--green); padding-left:18px; font-style:normal;
  }
  .founder-career{
    display:flex; align-items:baseline; gap:14px; margin:24px 0 0; padding-top:20px;
    border-top:1px solid var(--paper-line); font-size:14.5px; color:var(--ink); line-height:1.7;
  }
  .founder-career .fc-label{flex:none; font-family:var(--mono); font-size:12px; letter-spacing:.08em; color:var(--green-dark);}

  /* ---------- CTA / FOOTER ---------- */
  .cta-section{
    background: var(--navy-deep);
    color:#fff; text-align:center; padding:120px 0 90px;
  }
  .cta-section h2{font-size:clamp(28px,3.6vw,42px); margin-bottom:16px;}
  .cta-section p{color:var(--muted-on-navy); font-size:16px; margin-bottom:40px;}
  .contact-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
    background:rgba(255,255,255,.12); border-top:1px solid rgba(255,255,255,.12); border-bottom:1px solid rgba(255,255,255,.12);
    max-width:900px; margin:0 auto;
  }
  .contact-item{background:var(--navy-deep); padding:26px 14px; text-align:center;}
  .contact-item .c-label{font-family:var(--mono); font-size:11px; color:var(--green-dark); background:#8fe3a8; display:inline-block; padding:3px 8px; border-radius:3px; color:#04321a; font-weight:700; margin-bottom:12px;}
  .contact-item .c-val{font-size:14.5px; color:#e8eef6; word-break:break-word;}

  footer{background:var(--navy-deep); color:var(--muted-on-navy); text-align:center; padding:34px 0 44px; font-size:13px; border-top:1px solid rgba(255,255,255,.08);}

  /* ---------- INQUIRY MODAL ---------- */
  .modal-backdrop{
    position:fixed; inset:0; background:rgba(10,18,28,.55); z-index:1000;
    display:none; align-items:flex-start; justify-content:center; padding:20px; overflow-y:auto;
  }
  .modal-backdrop.open{display:flex;}
  .modal-card{
    background:#fff; border-radius:8px; max-width:420px; width:100%;
    padding:34px 30px; position:relative; box-shadow:0 30px 70px -20px rgba(0,20,40,.4);
    margin:auto;
  }
  .modal-close{
    position:absolute; top:14px; right:14px; background:none; border:none;
    font-size:22px; line-height:1; color:var(--muted); cursor:pointer; padding:6px;
  }
  .modal-close:hover{color:var(--navy);}
  .modal-card h3{font-family:var(--serif); font-size:22px; color:var(--navy); margin-bottom:8px;}
  .modal-sub{font-size:13.5px; color:var(--muted); margin-bottom:24px;}
  .modal-row{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 12px;}
  @media (max-width: 480px){ .modal-row{grid-template-columns:minmax(0,1fr);} }
  #inquiryForm label{display:block; font-size:13px; color:var(--muted); margin-bottom:16px;}
  #inquiryForm input, #inquiryForm textarea{
    width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--paper-line);
    border-radius:4px; font-family:var(--sans); font-size:14px; color:var(--ink); resize:vertical;
  }
  #inquiryForm input:focus, #inquiryForm textarea:focus{outline:none; border-color:var(--green);}
  .modal-error{font-size:13px; color:#b3311f; margin-bottom:14px;}
  .modal-card button[type="submit"], #inquirySuccess button{
    width:100%; text-align:center; border:none; cursor:pointer; margin-top:4px;
    background:var(--green); color:#fff; padding:12px; border-radius:4px; font-weight:700; font-size:14.5px;
  }
  .modal-card button[type="submit"]:hover, #inquirySuccess button:hover{background:var(--green-dark);}
  .modal-card button[type="submit"]:disabled{opacity:.6; cursor:default;}

  /* ---------- CALCULATOR PAGE ---------- */
  .calc-grid{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:28px; align-items:start;}
  .calc-card{background:#fff; border:1px solid var(--paper-line); border-radius:6px; box-shadow:0 24px 60px -34px rgba(0,33,70,.25); overflow:hidden;}
  .calc-head{
    display:flex; justify-content:space-between; align-items:center; gap:12px;
    padding:18px 28px; border-bottom:1.5px dashed var(--paper-line);
    background:linear-gradient(180deg, #fff, #fbfaf6);
  }
  .calc-head .ch-title{font-family:var(--mono); font-size:13px; color:var(--muted); letter-spacing:.06em;}
  .calc-head .ch-id{font-family:var(--mono); font-size:12px; color:var(--muted); opacity:.7;}
  .calc-fields{display:grid; grid-template-columns:1fr 1fr; gap:24px 20px; padding:28px;}
  .calc-field{min-width:0;}
  .calc-field label{display:flex; justify-content:space-between; align-items:baseline; gap:8px; font-size:14px; font-weight:700; color:var(--navy); margin-bottom:8px;}
  .calc-field label span{font-family:var(--mono); font-weight:600; color:var(--green-dark); font-variant-numeric:tabular-nums;}
  .calc-unit{position:relative;}
  .calc-unit::after{content:attr(data-u); position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--muted); font-size:14px; pointer-events:none;}
  .calc-field input[type=number]{
    width:100%; font-family:var(--mono); font-size:17px; font-weight:600; color:var(--ink);
    padding:11px 34px 11px 12px; border:1px solid var(--paper-line); border-radius:4px; background:#fff;
    -moz-appearance:textfield; appearance:textfield;
  }
  .calc-field input[type=number]::-webkit-outer-spin-button,
  .calc-field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
  .calc-field input[type=number]:focus{outline:none; border-color:var(--green);}
  .calc-field input[type=range]{width:100%; accent-color:var(--green);}
  .calc-field small{display:block; font-size:12.5px; color:var(--muted); margin-top:6px; line-height:1.5;}

  .calc-result{
    background:var(--navy); color:#fff; border-radius:6px; padding:34px 32px;
    position:sticky; top:96px; overflow:hidden;
  }
  .calc-result::before{
    content:""; position:absolute; top:0; right:0; width:160px; height:160px;
    background:radial-gradient(circle at top right, rgba(11,149,57,.35), transparent 70%);
    pointer-events:none;
  }
  .calc-result > *{position:relative; z-index:1;}
  .calc-tag{display:inline-block; font-family:var(--mono); font-size:11px; letter-spacing:.08em; background:rgba(255,255,255,.12); padding:5px 10px; border-radius:20px; margin-bottom:16px;}
  .calc-lbl{font-size:14px; color:var(--muted-on-navy);}
  .calc-big{font-family:var(--mono); font-size:clamp(30px, 4.4vw, 46px); font-weight:600; line-height:1.15; margin:8px 0 6px; color:#fff; overflow-wrap:anywhere; font-variant-numeric:tabular-nums;}
  .calc-big small{font-family:var(--sans); font-size:.42em; font-weight:500; color:var(--muted-on-navy);}
  .calc-yr{font-size:15px; color:#cfe0f2;}
  .calc-yr b{color:#8fe3a8; font-weight:700;}
  .calc-split{display:grid; gap:12px; margin-top:24px; padding-top:22px; border-top:1px solid rgba(255,255,255,.14);}
  .calc-mini{background:var(--navy-ink); border-radius:6px; padding:16px 18px;}
  .calc-mini .t{font-size:13px; color:var(--muted-on-navy);}
  .calc-mini .v{font-family:var(--mono); font-size:clamp(19px, 2.2vw, 23px); font-weight:600; margin-top:4px; overflow-wrap:anywhere; font-variant-numeric:tabular-nums;}
  .calc-mini .v.g{color:#8fe3a8;}
  .calc-mini p{font-size:12.5px; color:var(--muted-on-navy); margin-top:4px; line-height:1.5;}
  .calc-mini p b{color:#fff;}
  .calc-note{font-size:12.5px; color:var(--muted); margin-top:18px; line-height:1.7;}

  .calc-lead{margin-top:28px; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:40px; align-items:center; padding:38px 36px;}
  .calc-lead > *{min-width:0;}
  .calc-lead h3{font-size:24px; color:var(--navy); line-height:1.4; margin-bottom:14px;}
  .calc-lead h3 em{font-style:normal; color:var(--green);}
  .calc-lead ul{list-style:none;}
  .calc-lead li{font-size:14.5px; color:var(--ink); padding:10px 0 10px 20px; position:relative; border-top:1px solid #f0efe8;}
  .calc-lead li:first-child{border-top:none;}
  .calc-lead li::before{content:"+"; position:absolute; left:0; color:var(--green); font-weight:700;}
  #calcLeadForm{display:grid; grid-template-columns:minmax(0,1fr); gap:10px;}
  #calcLeadForm input[type=text], #calcLeadForm input[type=tel]{
    width:100%; min-width:0; font-family:var(--sans); font-size:15px; color:var(--ink);
    padding:12px; border:1px solid var(--paper-line); border-radius:4px;
  }
  #calcLeadForm input[type=text]:focus, #calcLeadForm input[type=tel]:focus{outline:none; border-color:var(--green);}
  .calc-agree{display:flex; gap:8px; align-items:flex-start; font-size:12.5px; color:var(--muted); line-height:1.5;}
  .calc-agree input{flex:none; margin-top:3px; accent-color:var(--green);}
  #calcLeadForm button{
    font-family:var(--sans); font-size:15px; font-weight:700; padding:13px; border:0; border-radius:4px;
    background:var(--green); color:#fff; cursor:pointer;
  }
  #calcLeadForm button:hover{background:var(--green-dark);}
  #calcLeadForm button:disabled{opacity:.6; cursor:default;}
  .calc-ok{display:none; background:var(--green-tint); color:var(--green-dark); border-radius:4px; padding:20px; font-weight:700; text-align:center; line-height:1.6;}
  .calc-err{display:none; color:#b3311f; font-size:13px;}

  @media (max-width: 960px){
    .calc-grid{grid-template-columns:minmax(0,1fr);}
    .calc-result{position:static;}
  }
  @media (max-width: 720px){
    .calc-lead{grid-template-columns:minmax(0,1fr); gap:26px; padding:28px 22px;}
  }
  @media (max-width: 640px){
    .calc-head{padding:16px 22px;}
    .calc-fields{grid-template-columns:minmax(0,1fr); padding:22px;}
    .calc-result{padding:28px 22px;}
  }

  /* ---------- HERO CTA ---------- */
  .hero-cta{display:flex; flex-wrap:wrap; gap:12px; margin:0 0 44px;}
  .btn-hero{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    min-height:52px; padding:0 26px; border-radius:4px;
    font-family:var(--sans); font-size:15.5px; font-weight:700; line-height:1.2;
    border:1.5px solid transparent; cursor:pointer; text-decoration:none;
    transition:background .2s ease, border-color .2s ease, transform .2s ease;
  }
  .btn-hero.primary{background:var(--green); border-color:var(--green); color:#fff;}
  .btn-hero.primary:hover{background:var(--green-dark); border-color:var(--green-dark); transform:translateY(-1px);}
  .btn-hero.ghost{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.55); color:#fff;}
  .btn-hero.ghost:hover{background:rgba(255,255,255,.14); border-color:#fff;}
  .btn-hero:focus-visible, .fab-btn:focus-visible{outline:3px solid #8fe3a8; outline-offset:2px;}
  @media (max-width: 560px){
    .hero-cta{flex-direction:column; margin-bottom:36px;}
    .btn-hero{width:100%;}
  }

  /* ---------- LINKED CONTACT ITEMS ---------- */
  a.contact-item{transition:background .2s ease;}
  a.contact-item:hover{background:#0a2a4d;}

  /* ---------- FLOATING CONTACT BUTTONS ---------- */
  .fab{
    position:fixed; right:22px; bottom:22px; z-index:900;
    display:flex; flex-direction:column; gap:10px;
    opacity:0; transform:translateY(10px); pointer-events:none;
    transition:opacity .25s ease, transform .25s ease;
  }
  .fab.is-visible{opacity:1; transform:none; pointer-events:auto;}
  .fab-btn{
    display:flex; align-items:center; justify-content:center; gap:8px;
    height:48px; padding:0 20px; border-radius:24px; border:none; cursor:pointer;
    font-family:var(--sans); font-size:14.5px; font-weight:700; white-space:nowrap; text-decoration:none;
    box-shadow:0 10px 24px -8px rgba(0,33,70,.5);
    transition:background .2s ease;
  }
  .fab-btn svg{width:18px; height:18px; flex:none;}
  .fab-tel{background:var(--navy); color:#fff;}
  .fab-tel:hover{background:var(--navy-deep);}
  .fab-inquiry{background:var(--green); color:#fff;}
  .fab-inquiry:hover{background:var(--green-dark);}
  /* 오른쪽에 고정 패널이 있는 도구 페이지(계산기·진단 리포트)는 데스크톱에서 겹치지 않게 숨김 */
  @media (min-width: 961px){
    body.has-side-panel .fab{display:none;}
  }
  @media (max-width: 880px){
    .fab{
      left:0; right:0; bottom:0; flex-direction:row; gap:0;
      padding-bottom:env(safe-area-inset-bottom); background:#fff;
      box-shadow:0 -8px 24px -12px rgba(0,33,70,.45); transform:translateY(100%);
    }
    .fab.is-visible{transform:none;}
    .fab-btn{flex:1; height:56px; border-radius:0; box-shadow:none; font-size:15px;}
    footer{padding-bottom:calc(44px + 56px + env(safe-area-inset-bottom));}
  }

  /* ---------- FOOTER (company info) ---------- */
  .footer-brand{display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:16px;}
  .footer-logo{height:46px; width:auto;}
  .footer-brand-text{display:flex; flex-direction:column; align-items:flex-start; line-height:1.2; text-align:left;}
  .footer-brand-text b{font-size:23px; font-weight:700; color:#fff; letter-spacing:0;}
  .footer-brand-text span{font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.2em; color:var(--muted-on-navy); margin-top:2px;}
  .footer-info{display:flex; flex-wrap:wrap; justify-content:center; gap:4px 20px; font-size:13px; line-height:1.9;}
  .footer-info b{font-weight:500; color:#dfe8f2; margin-right:6px;}
  .footer-links{display:flex; justify-content:center; gap:20px; margin:14px 0 12px; font-size:13px;}
  .footer-links a{color:var(--muted-on-navy); transition:color .2s ease;}
  .footer-links a:hover{color:#fff;}
  .footer-copy{font-size:12px; opacity:.7;}
  @media (max-width: 560px){
    .footer-info{flex-direction:column; align-items:center; gap:2px;}
  }

  /* ---------- INQUIRY MODAL: consent ---------- */
  #inquiryForm label.consent{display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--ink); line-height:1.55; margin-bottom:8px;}
  #inquiryForm label.consent input[type="checkbox"]{width:auto; margin:3px 0 0; padding:0; flex:none; accent-color:var(--green);}
  #inquiryForm label.consent a{color:var(--green-dark); text-decoration:underline;}
  .consent-note{font-size:12px; color:var(--muted); line-height:1.65; margin:0 0 16px;}

  /* ---------- LEGAL PAGES (privacy / terms) ---------- */
  .legal > *{max-width:820px;}
  .legal .legal-meta{font-family:var(--mono); font-size:12.5px; color:var(--muted); margin-bottom:26px;}
  .legal h2{font-family:var(--sans); font-size:19px; font-weight:700; color:var(--navy); margin:40px 0 12px; letter-spacing:0;}
  .legal p, .legal li{font-size:15px; line-height:1.85; color:var(--ink);}
  .legal p{margin-bottom:10px;}
  .legal ul, .legal ol{padding-left:22px; margin:8px 0 12px;}
  .legal li{margin-bottom:4px;}
  .legal a{color:var(--green-dark); text-decoration:underline; text-underline-offset:3px;}
  .legal-optout{
    display:flex; align-items:center; flex-wrap:wrap; gap:12px 18px; margin:6px 0 14px; padding:14px 16px;
    background:#fff; border:1px solid var(--paper-line); border-radius:6px; font-size:14px; color:var(--ink);
  }
  .legal-optout .btn-cta{min-height:40px; padding:0 16px; font-size:14px;}
  .legal-scroll{overflow-x:auto; margin:12px 0 14px;}
  .legal table{width:100%; border-collapse:collapse; font-size:14px; background:#fff;}
  .legal th, .legal td{border:1px solid var(--paper-line); padding:10px 12px; text-align:left; vertical-align:top; line-height:1.6;}
  .legal th{background:#fbfaf6; color:var(--navy); font-weight:700; white-space:nowrap;}
  @media (max-width: 880px){
    .legal h2{font-size:18px; margin-top:32px;}
  }

  @media (prefers-reduced-motion: reduce){
    .fab, .btn-hero{transition:none;}
  }

  /* ---------- TOOLS (무료 자가 진단) ---------- */
  .tool-grid{display:grid; grid-template-columns:1fr 1fr; gap:28px;}
  .tool-card{
    display:flex; flex-direction:column; background:#fff; color:var(--ink);
    border-radius:6px; padding:36px 36px 30px; position:relative; overflow:hidden;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .tool-card::after{
    content:""; position:absolute; top:0; right:0; width:170px; height:170px; pointer-events:none;
    background:radial-gradient(circle at top right, rgba(11,149,57,.16), transparent 70%);
  }
  .tool-card:hover{transform:translateY(-6px); box-shadow:0 28px 54px -26px rgba(0,0,0,.6);}
  .tool-card:focus-visible{outline:3px solid #8fe3a8; outline-offset:3px;}
  .tool-tag{
    align-self:flex-start; font-family:var(--mono); font-size:11px; letter-spacing:.08em;
    color:var(--green-dark); background:var(--green-tint); padding:5px 11px; border-radius:20px; margin-bottom:18px;
  }
  .tool-card h3{font-size:24px; color:var(--navy); margin-bottom:10px; line-height:1.35;}
  .tool-card > p{font-size:14.5px; color:var(--muted); margin-bottom:26px;}
  .tool-preview{
    margin-top:auto; position:relative; display:flex; align-items:center; gap:22px;
    background:var(--paper); border:1px solid var(--paper-line); border-radius:6px; padding:26px 22px 20px;
  }
  .pv-badge{
    position:absolute; top:8px; right:12px; font-family:var(--mono); font-size:10.5px;
    letter-spacing:.06em; color:var(--muted); opacity:.85;
  }
  .tool-more{
    font-family:var(--mono); font-size:12.5px; font-weight:600; color:var(--green-dark);
    margin-top:22px; display:flex; align-items:center; gap:6px; transition:gap .2s ease;
  }
  .tool-card:hover .tool-more{gap:10px;}
  .tool-note{font-size:12.5px; color:var(--muted-on-navy); margin-top:24px;}
  #tools .section-title{text-wrap:balance;}   /* on the narrowest phones the one-line heading splits into two even lines */

  .pv-ring{position:relative; width:92px; height:92px; flex:none;}
  .pv-ring svg{width:100%; height:100%; transform:rotate(-90deg);}
  .pv-ring circle{fill:none; stroke-width:7;}
  .pv-ring .trk{stroke:#e9e5d6;}
  .pv-ring .val{stroke:var(--green); stroke-linecap:round; stroke-dasharray:0 100; transition:stroke-dasharray 1.4s cubic-bezier(.22,.9,.32,1) .2s;}
  .tool-grid.in .pv-ring .val{stroke-dasharray:var(--pct) 100;}
  .pv-num{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1;}
  .pv-num b{font-family:var(--mono); font-size:26px; font-weight:600; color:var(--navy);}
  .pv-num small{font-family:var(--mono); font-size:10.5px; color:var(--muted); margin-top:3px;}
  .pv-bars{flex:1; min-width:0; display:grid; gap:8px;}
  .pv-bars div{display:grid; grid-template-columns:50px 1fr; align-items:center; gap:8px; font-size:11.5px; color:var(--muted);}
  .pv-bars i{display:block; position:relative; height:6px; border-radius:3px; background:#e9e5d6; overflow:hidden;}
  .pv-bars i::after{
    content:""; position:absolute; inset:0 auto 0 0; width:0; border-radius:3px; background:var(--green);
    transition:width 1.1s cubic-bezier(.22,.9,.32,1);
  }
  .tool-grid.in .pv-bars i::after{width:var(--w);}
  .pv-bars div:nth-child(2) i::after{transition-delay:.08s;}
  .pv-bars div:nth-child(3) i::after{transition-delay:.16s;}
  .pv-bars div:nth-child(4) i::after{transition-delay:.24s;}
  .pv-bars div:nth-child(5) i::after{transition-delay:.32s;}

  .pv-calc{flex-direction:column; align-items:stretch; gap:14px;}
  .pv-top{display:flex; align-items:flex-end; justify-content:space-between; gap:10px 14px; flex-wrap:wrap;}
  .pv-loss small{display:block; font-size:12px; color:var(--muted); margin-bottom:6px;}
  .pv-loss b{font-family:var(--mono); font-size:30px; font-weight:600; color:var(--navy); line-height:1;}
  .pv-loss em{font-style:normal; font-family:var(--mono); font-size:14px; color:var(--navy); margin-left:3px;}
  .pv-gain{font-size:12.5px; font-weight:700; color:var(--green-dark); background:var(--green-tint); border-radius:20px; padding:6px 12px;}
  .pv-split{display:flex; height:12px; border-radius:6px; overflow:hidden; background:#e9e5d6;}
  .pv-split i{display:block; width:0; height:100%; transition:width 1.2s cubic-bezier(.22,.9,.32,1);}
  .pv-split .now{background:var(--navy);}
  .pv-split .lost{background:repeating-linear-gradient(135deg, var(--green) 0 6px, #36b562 6px 12px); transition-delay:.25s;}
  .tool-grid.in .pv-split .now{width:48%;}
  .tool-grid.in .pv-split .lost{width:52%;}
  .pv-legend{display:flex; justify-content:space-between; gap:12px; font-size:11.5px; color:var(--muted);}
  .pv-basis{font-size:11px; line-height:1.5; color:var(--muted); opacity:.9; margin:-6px 0 0;}

  /* ---------- DOCUMENTS (진단 리포트 예시) ---------- */
  .doc-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:64px; align-items:center;}
  .doc-points{list-style:none; margin:0 0 32px; max-width:500px;}
  .doc-points li{
    display:grid; grid-template-columns:120px 1fr; gap:0 14px; align-items:baseline;
    padding:13px 0; border-top:1px solid rgba(0,33,70,.14); font-size:14.5px; color:var(--muted);
  }
  .doc-points li:last-child{border-bottom:1px solid rgba(0,33,70,.14);}
  .doc-points b{color:var(--navy); font-weight:700;}
  .doc-actions{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:18px;}
  .doc-note{font-size:12.5px; color:var(--muted); max-width:500px;}
  .btn-cta{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    min-height:50px; padding:0 24px; border-radius:4px; cursor:pointer; text-decoration:none;
    font-family:var(--sans); font-size:15px; font-weight:700; line-height:1.2;
    border:1.5px solid var(--green); background:var(--green); color:#fff;
    transition:background .2s ease, border-color .2s ease, transform .2s ease;
  }
  .btn-cta:hover{background:var(--green-dark); border-color:var(--green-dark); transform:translateY(-1px);}
  .btn-cta.line{background:transparent; color:var(--navy); border-color:rgba(0,33,70,.38);}
  .btn-cta.line:hover{background:rgba(0,33,70,.06); border-color:var(--navy);}
  .btn-cta:focus-visible{outline:3px solid var(--green); outline-offset:2px;}

  .doc-stack{position:relative; width:100%; max-width:560px; aspect-ratio:1 / .94; justify-self:end;}
  .doc-sheet{
    position:absolute; width:56%; padding:0; border:none; background:#fff; border-radius:3px;
    line-height:0; overflow:hidden; cursor:zoom-in;
    box-shadow:0 34px 60px -28px rgba(0,33,70,.6), 0 2px 8px rgba(0,33,70,.14);
    transition:transform .5s cubic-bezier(.22,.9,.32,1), box-shadow .3s ease;
  }
  .doc-sheet img{width:100%; height:auto;}
  .doc-sheet-1{left:0; bottom:0; transform:rotate(-3.2deg); z-index:2;}
  .doc-sheet-2{right:0; top:0; transform:rotate(2.6deg); z-index:1;}
  .doc-stack:hover .doc-sheet-1{transform:translate(-8px, 6px) rotate(-4.6deg);}
  .doc-stack:hover .doc-sheet-2{transform:translate(8px, -6px) rotate(4deg);}
  .doc-sheet:focus-visible{outline:3px solid var(--green); outline-offset:4px;}
  .doc-badge{
    position:absolute; top:12px; left:12px; z-index:2; line-height:1.2;
    font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:.06em;
    color:#fff; background:var(--navy); padding:4px 9px; border-radius:20px;
  }
  .doc-hint{
    position:absolute; right:4%; bottom:-6px; z-index:3; font-family:var(--mono); font-size:11.5px; letter-spacing:.04em;
    color:var(--muted); background:rgba(255,255,255,.85); padding:5px 10px; border-radius:20px;
  }

  /* report sample window: the page opens large and scrolls inside the window; .zoomed enlarges it further */
  .doc-lightbox{position:fixed; inset:0; z-index:1100; display:none; background:rgba(3,24,47,.92);}
  .doc-lightbox.open{display:block;}
  .dl-stage{position:absolute; inset:0; overflow:auto; overscroll-behavior:contain; padding:76px 28px 112px;}
  .dl-stage:focus{outline:none;}
  .dl-stage:focus-visible{outline:3px solid #8fe3a8; outline-offset:-6px;}
  .doc-lightbox figure{margin:0 auto; width:min(1080px, 100%);}
  .doc-lightbox.zoomed figure{width:1600px;}
  .doc-lightbox img{
    display:block; width:100%; height:auto; background:#fff; border-radius:3px;
    box-shadow:0 30px 80px rgba(0,0,0,.55); cursor:zoom-in;
  }
  .doc-lightbox.zoomed img{cursor:zoom-out;}
  .dl-close, .dl-nav, .dl-zoom{
    display:flex; align-items:center; justify-content:center; cursor:pointer;
    background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.32);
    font-size:26px; line-height:1; transition:background .2s ease;
  }
  .dl-close:hover, .dl-nav:hover, .dl-zoom:hover{background:rgba(255,255,255,.26);}
  .dl-close:focus-visible, .dl-nav:focus-visible, .dl-zoom:focus-visible{outline:3px solid #8fe3a8; outline-offset:2px;}
  .dl-close{position:absolute; z-index:3; top:18px; right:18px; width:44px; height:44px; border-radius:50%; padding:0 0 3px;}
  .dl-bar{
    position:absolute; z-index:3; left:50%; bottom:20px; transform:translateX(-50%);
    display:flex; align-items:center; gap:6px; padding:6px; border-radius:32px;
    background:rgba(3,24,47,.88); border:1px solid rgba(255,255,255,.28); box-shadow:0 14px 34px -14px rgba(0,0,0,.7);
  }
  .dl-nav{width:40px; height:40px; border-radius:50%; padding:0 0 3px; font-size:24px;}
  .dl-zoom{height:40px; min-width:108px; padding:0 16px; border-radius:20px; font-family:var(--sans); font-size:13.5px; font-weight:600; white-space:nowrap;}
  .dl-count{min-width:96px; padding:0 6px; text-align:center; white-space:nowrap; font-family:var(--mono); font-size:12.5px; letter-spacing:.04em; color:#dce6f2;}

  /* ---------- CALC SAMPLE (매출계산기 결과 예시) ---------- */
  .cs-stack{position:relative; width:100%; max-width:540px; justify-self:start; padding-bottom:12px;}
  .cs-in{width:88%;}
  .cs-in .calc-head{padding:14px 22px;}
  .cs-fields{display:grid; grid-template-columns:1fr 1fr; gap:16px 18px; padding:20px 22px 46px;}
  .cs-field{min-width:0; font-size:12.5px; line-height:1.4; color:var(--muted);}
  .cs-field b{display:block; margin-top:3px; font-family:var(--mono); font-size:16px; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums;}
  .cs-field i{display:block; position:relative; height:5px; margin-top:8px; border-radius:3px; background:#e9e5d6; overflow:hidden;}
  .cs-field i::after{content:""; position:absolute; inset:0 auto 0 0; width:var(--w); border-radius:3px; background:var(--green);}
  .cs-out.calc-result{position:relative; top:auto; z-index:2; width:92%; margin:-32px 0 0 auto; padding:30px 30px 32px; box-shadow:0 34px 60px -28px rgba(0,33,70,.6), 0 2px 8px rgba(0,33,70,.14);}
  @media (min-width: 881px){
    .cs-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);}
    .cs-grid .cs-stack{order:-1;}
  }

  @media (max-width: 880px){
    .tool-grid{grid-template-columns:1fr; gap:20px;}
    .tool-card{padding:28px 24px 24px;}
    .tool-card h3{font-size:22px;}
    .doc-grid{grid-template-columns:1fr; gap:48px;}
    .doc-stack, .cs-stack{justify-self:center;}
    .dl-stage{padding:68px 12px 104px;}
  }
  @media (max-width: 560px){
    .doc-points li{grid-template-columns:1fr; gap:2px;}
    .doc-actions .btn-cta{width:100%;}
    .pv-loss b{font-size:26px;}
    .cs-in{width:94%;}
    .cs-fields{gap:14px; padding:18px 18px 42px;}
    .cs-field b{font-size:15px;}
    .cs-out.calc-result{width:96%; margin-top:-28px; padding:26px 22px 28px;}
    .doc-lightbox.zoomed figure{width:1000px;}
    .dl-count{min-width:74px;}
    .dl-zoom{min-width:100px; padding:0 12px;}
  }
  @media (max-width: 359px){
    .dl-count-label{display:none;}
    .dl-count{min-width:56px;}
  }
  @media (prefers-reduced-motion: reduce){
    .tool-card, .doc-sheet, .btn-cta{transition:none;}
    .pv-ring .val, .pv-bars i::after, .pv-split i{transition:none;}
  }

  /* ---------- INQUIRY MODAL: after-inquiry guidance + route select ---------- */
  .modal-flow{list-style:none; display:flex; gap:4px; margin:0 0 22px; padding:0;}
  .modal-flow li{
    flex:1; position:relative; display:flex; flex-direction:column; align-items:center; gap:6px;
    text-align:center; font-size:12px; line-height:1.4; color:var(--muted);
  }
  .modal-flow li::before{content:""; position:absolute; top:12px; left:calc(-50% + 16px); right:calc(50% + 16px); height:1px; background:var(--paper-line);}
  .modal-flow li:first-child::before{display:none;}
  .modal-flow b{
    position:relative; z-index:1; width:24px; height:24px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:var(--paper); border:1px solid var(--paper-line); color:var(--muted);
    font-family:var(--mono); font-size:11.5px; font-weight:600;
  }
  .modal-flow li.on{color:var(--navy); font-weight:700;}
  .modal-flow li.on b{background:var(--green); border-color:var(--green); color:#fff;}
  .modal-flow small{display:block; font-size:11.5px; font-weight:400; color:var(--muted); line-height:1.5;}
  #inquiryForm select{
    width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--paper-line); border-radius:4px;
    background:#fff; font-family:var(--sans); font-size:14px; color:var(--ink);
  }
  #inquiryForm select:focus{outline:none; border-color:var(--green);}
  #inquiryForm .opt{font-size:11.5px; color:var(--muted); opacity:.85;}
  #inquiryForm .when-field{border:0; padding:0; margin:0 0 16px; min-width:0;}
  #inquiryForm .when-field legend{font-size:13px; color:var(--muted); padding:0; margin-bottom:6px;}
  .when-chips{display:flex; gap:6px;}
  #inquiryForm .when-chips label{flex:1; position:relative; margin:0;}
  #inquiryForm .when-chips input{position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; opacity:0; cursor:pointer;}
  .when-chips span{
    display:flex; align-items:center; justify-content:center; height:38px; border:1px solid var(--paper-line); border-radius:4px;
    background:#fff; font-size:13.5px; color:var(--ink); transition:border-color .2s ease, background .2s ease, color .2s ease;
  }
  .when-chips label:hover span{border-color:var(--green);}
  .when-chips input:checked + span{border-color:var(--green); background:var(--green-tint); color:var(--green-dark); font-weight:700;}
  .when-chips input:focus-visible + span{outline:3px solid var(--green); outline-offset:2px;}
  .modal-note{font-size:12.5px; line-height:1.65; color:var(--muted); text-align:center; margin:14px 0 0;}
  #inquirySuccess .modal-flow{margin:6px 0 18px;}
  /* short laptop screens: keep the submit button within reach */
  @media (max-height: 820px){
    .modal-card{padding:26px 26px 22px;}
    .modal-sub{margin-bottom:14px;}
    .modal-flow{margin-bottom:14px;}
    #inquiryForm label{margin-bottom:11px;}
    #inquiryForm .when-field{margin-bottom:11px;}
    .when-chips span{height:34px;}
    #inquiryForm textarea{height:78px;}
    .consent-note{margin-bottom:12px;}
  }
  /* phones: tighter spacing keeps the 보내기 button within reach */
  @media (max-width: 480px){
    .modal-card{padding:28px 22px 22px;}
    .modal-sub{margin-bottom:16px;}
    .modal-flow{margin-bottom:16px;}
    #inquiryForm label, #inquiryForm .when-field{margin-bottom:12px;}
    #inquiryForm textarea{height:84px;}
    .when-chips span{height:36px;}
    .consent-note{margin-bottom:12px;}
  }

  /* ---------- 진단 대상 chips, section-end buttons ---------- */
  #symptoms .section-sub{margin-bottom:22px;}
  .type-chips{list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 40px;}
  .type-chips li{font-size:13.5px; font-weight:600; color:var(--navy); background:#fff; border:1px solid var(--paper-line); border-radius:20px; padding:6px 14px;}
  .type-chips li.tc-label{font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.08em; color:var(--green-dark); background:none; border:none; padding:0 6px 0 0;}
  .section-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:44px;}
  .section.navy .btn-cta.line{color:#fff; border-color:rgba(255,255,255,.5);}
  .section.navy .btn-cta.line:hover{background:rgba(255,255,255,.1); border-color:#fff;}

  /* ---------- COST (비용 안내) ---------- */
  .cost-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px;}
  .cost-card{background:#fff; border:1px solid var(--paper-line); border-radius:6px; padding:30px 28px 30px;}
  .cost-card.free{border-color:rgba(11,149,57,.5); box-shadow:0 22px 46px -30px rgba(11,149,57,.6);}
  .cost-tag{display:inline-block; font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--green-dark); background:var(--green-tint); padding:5px 11px; border-radius:20px; margin-bottom:16px;}
  .cost-card.free .cost-tag{background:var(--green); color:#fff;}
  .cost-card h3{font-size:20px; line-height:1.4; color:var(--navy); margin-bottom:10px;}
  .cost-card p{font-size:14.5px; line-height:1.75; color:var(--muted);}

  /* ---------- FAQ (자주 묻는 질문) ---------- */
  .faq-grid{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:64px; align-items:start;}
  .faq-head{position:sticky; top:112px;}
  .faq-head .section-sub{margin-bottom:26px;}
  .faq-list{border-top:1px solid rgba(0,33,70,.16);}
  .faq-item{border-bottom:1px solid rgba(0,33,70,.16);}
  .faq-item summary{
    list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:18px;
    padding:22px 4px; font-size:17px; font-weight:700; line-height:1.5; color:var(--navy); transition:color .2s ease;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{
    content:""; flex:none; width:16px; height:16px; transition:transform .3s ease;
    background:linear-gradient(var(--green), var(--green)) center / 100% 2px no-repeat, linear-gradient(var(--green), var(--green)) center / 2px 100% no-repeat;
  }
  .faq-item[open] summary::after{transform:rotate(45deg);}
  .faq-item summary:hover{color:var(--green-dark);}
  .faq-item summary:focus-visible{outline:3px solid var(--green); outline-offset:2px; border-radius:4px;}
  .faq-a{padding:0 4px 24px; max-width:640px;}
  .faq-a p{font-size:15px; line-height:1.85; color:var(--muted);}
  .faq-item[open] .faq-a{animation:faqIn .35s ease;}
  @keyframes faqIn{from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:none;}}
  @media (max-width: 880px){
    .cost-grid{grid-template-columns:minmax(0,1fr); gap:16px;}
    .faq-grid{grid-template-columns:minmax(0,1fr); gap:36px;}
    .faq-head{position:static;}
    .type-chips{margin-bottom:30px;}
  }
  @media (max-width: 560px){
    .section-cta .btn-cta{width:100%;}
    .cost-card{padding:26px 22px;}
    .faq-item summary{font-size:16px; padding:19px 2px;}
  }
  @media (prefers-reduced-motion: reduce){
    .faq-item[open] .faq-a{animation:none;}
    .faq-item summary::after, .faq-item summary{transition:none;}
  }

  /* reveal animation */
  .reveal{opacity:0; transform:translateY(24px); transition:opacity 1.1s ease-out, transform 1.1s ease-out;}
  .reveal.in{opacity:1; transform:translateY(0);}

  @media (prefers-reduced-motion: reduce){
    .reveal{opacity:1; transform:none; transition:none;}
    .ekg-line polyline{animation:none; stroke-dashoffset:0;}
    .bar-col .bar{transition:none;}
    html{scroll-behavior:auto;}
  }

  /* nav: keep all six menu items on one line between the mobile breakpoint and ~1040px */
  @media (min-width: 881px) and (max-width: 1040px){
    .logo-text{font-size:26px;}
    .logo-icon{height:44px;}
    .nav-links{gap:22px;}
    .nav-links a, .nav-inquiry-btn{white-space:nowrap;}
    .nav-links a{font-size:14px;}
  }
  @media (min-width: 881px) and (max-width: 940px){
    .logo-text{font-size:24px;}
    .logo-icon{height:40px;}
    .nav-links{gap:16px;}
  }

  @media (max-width: 880px){
    .hero-video-wrap::after{
      background: linear-gradient(180deg, rgba(2,16,32,.82) 0%, rgba(2,18,35,.72) 55%, rgba(2,18,35,.8) 100%);
    }
    .wrap{padding:0 22px;}
    .nav{padding:14px 22px;}
    .nav-links{position:fixed; top:62px; left:0; right:0; background:var(--paper); flex-direction:column; align-items:flex-start; padding:24px; gap:18px; border-bottom:1px solid var(--paper-line); display:none;}
    .nav-links.open{display:flex;}
    .nav-toggle{display:block; background:none; border:none; font-size:22px; color:var(--navy); cursor:pointer;}
    .nav-dropdown{display:flex; flex-direction:column; align-items:flex-start; gap:12px; width:100%;}
    .nav-dropdown-menu{
      position:static; opacity:1; visibility:visible; pointer-events:auto; transform:none;
      background:none; border:none; box-shadow:none; padding:0 0 0 16px;
      display:flex; flex-direction:column; gap:12px; min-width:0;
    }
    .nav-dropdown-menu a{padding:0; font-size:13.5px; color:var(--muted);}
    .nav-dropdown-menu a:hover{background:none; color:var(--green-dark);}
    .hero{padding:130px 0 80px;}
    .hero-stats{flex-wrap:wrap; gap:20px;}
    .hero-stats div{flex:1 1 40%;}
    .section{padding:76px 0;}
    .section-sub{margin-bottom:36px;}
    .dept-grid{grid-template-columns:1fr;}
    .process-steps{grid-template-columns:1fr; gap:34px;}
    .process-line{display:none;}
    .prog-hd{padding:14px 20px;}
    .prog-th{display:none;}
    .prog-row{grid-template-columns:1fr 1fr auto; grid-template-areas:"name name stamp" "before after stamp" "ekg ekg ekg"; gap:12px 16px; text-align:left; padding:22px 20px;}
    .prog-th + .prog-row{border-top:0;}
    .prog-name{grid-area:name;}
    .prog-num{grid-area:before; font-size:24px;}
    .prog-num.after{grid-area:after;}
    .prog-num::before{content:attr(data-label); display:block; font-size:11.5px; font-weight:600; color:var(--muted); letter-spacing:.04em; margin-bottom:2px;}
    .prog-ekg{grid-area:ekg;}
    .prog-ekg svg{max-width:none; height:36px;}
    .prog-stamp{grid-area:stamp; width:80px; height:80px; font-size:18px;}
    .founder-card{grid-template-columns:1fr; gap:26px 0; padding:30px 26px;}
    .contact-grid{grid-template-columns:1fr 1fr;}
    .page-hero{padding:120px 0 50px;}
    .detail-block{padding:32px 24px;}
    /* iOS Safari zooms the whole page when a focused field is under 16px */
    #inquiryForm input, #inquiryForm textarea, #inquiryForm select,
    #calcLeadForm input[type=text], #calcLeadForm input[type=tel]{font-size:16px;}
  }

  /* contact cells: keep the e-mail and phone number whole on narrow phones */
  @media (max-width: 400px){
    .contact-item{padding:26px 8px;}
  }
  @media (max-width: 359px){
    .contact-grid{grid-template-columns:1fr;}
  }

  /* nav on phones: keep the logo and the 문의하기 button on one line each */
  @media (max-width: 560px){
    .logo-group{gap:8px;}
    .logo-icon{height:38px;}
    .logo-text{font-size:22px; white-space:nowrap;}
    .nav-inquiry-btn{padding:9px 14px; font-size:13.5px; white-space:nowrap;}
  }
  @media (max-width: 359px){
    .nav{padding:12px 14px;}
    .logo-icon{height:32px;}
    .logo-text{font-size:19px;}
    .nav-inquiry-btn{padding:8px 10px;}
  }