*{margin:0;padding:0;box-sizing:border-box}
:root{--navy:#0f172a;--navy-2:#1e293b;--ivory:#fdfcf8;--cream:#f5f0e6;--gold:#c9a961;--gold-dk:#9c7e3f;--gold-lt:#e8d4a0;--ink:#1a1f2e;--mute:#64748b;--line:#e2dcc9}
html{scroll-behavior:smooth}
body{font-family:'Noto Sans KR',sans-serif;background:var(--ivory);color:var(--ink);line-height:1.85;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.topbar{background:var(--navy);color:#cbd5e1;padding:9px 24px;text-align:center;font-size:.85em}.topbar b{color:var(--gold-lt)}
.nav{position:sticky;top:0;z-index:1000;background:rgba(253,252,248,.96);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav-in{max-width:1180px;margin:0 auto;padding:18px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px}
.logo .mark{width:42px;height:42px;background:var(--navy);color:var(--gold);display:flex;align-items:center;justify-content:center;border-radius:8px;font-weight:900;font-size:1.2em;border:2px solid var(--gold)}
.logo .t{font-weight:900;font-size:1.35em;color:var(--navy);line-height:1}
.logo .t .sub{display:block;font-family:'Cormorant Garamond',serif;font-size:.55em;color:var(--gold-dk);font-weight:600;letter-spacing:2px;margin-top:-2px}
.nmenu{display:flex;gap:6px;flex-wrap:wrap}
.nmenu a{padding:8px 14px;font-size:.92em;font-weight:600;color:var(--mute);border-radius:6px;transition:.2s}
.nmenu a:hover,.nmenu a.active{color:var(--navy);background:var(--cream)}
.nactions{display:flex;gap:10px}
.nbtn{padding:11px 22px;border-radius:4px;font-weight:700;font-size:.92em;transition:.2s}
.nbtn.c{background:var(--navy);color:var(--gold-lt)}
.nbtn.h{background:transparent;color:var(--navy);border:1px solid var(--navy)}
.nbtn:hover{transform:translateY(-2px);background:var(--gold);border-color:var(--gold);color:var(--navy)}
.crumb{max-width:1080px;margin:30px auto 0;padding:0 24px;font-size:.88em;color:var(--mute)}.crumb a:hover{color:var(--navy)}
.page-hero{padding:60px 24px 50px;text-align:center;background:linear-gradient(180deg,var(--cream) 0%,var(--ivory) 100%)}
.page-hero h1{font-size:2.4em;font-weight:900;color:var(--navy);margin-bottom:12px;letter-spacing:-1px}
.page-hero h1 .g{color:var(--gold-dk)}
.page-hero p{color:var(--mute);font-size:1.08em;max-width:680px;margin:0 auto}
section.s{padding:60px 24px}
.s.cream{background:var(--cream)}
.si{max-width:1080px;margin:0 auto}
.si h2{font-family:'Cormorant Garamond',serif;font-size:2em;color:var(--navy);margin-bottom:20px;border-bottom:3px solid var(--gold);padding-bottom:12px;display:inline-block;font-weight:700}
.si h3{font-size:1.25em;font-weight:900;color:var(--navy);margin:24px 0 12px}
.si p{margin-bottom:18px;color:var(--ink);font-size:1.05em}
.si p strong{color:var(--gold-dk);font-weight:800}
.values,.factors{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.factors{grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px}
.val,.fac{background:#fff;padding:30px 26px;border-radius:8px;border:1px solid var(--line);transition:.3s}
.val:hover,.fac:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(15,23,42,.1);border-color:var(--gold-lt)}
.val .ico,.fac .i{width:50px;height:50px;background:var(--cream);color:var(--gold-dk);display:flex;align-items:center;justify-content:center;border-radius:6px;font-size:1.4em;margin-bottom:16px;border:1px solid var(--gold-lt)}
.fac{padding:24px 26px;display:flex;gap:16px;align-items:flex-start}
.fac .i{flex-shrink:0;width:38px;height:38px;background:var(--gold);color:var(--navy);border-radius:50%;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:1.05em;margin-bottom:0;border:none}
.val h3,.fac h3{font-size:1.15em;font-weight:900;color:var(--navy);margin-bottom:8px}
.val p,.fac p{color:var(--mute);font-size:.96em;margin:0}
.facts{background:var(--navy);color:var(--ivory);padding:50px 30px;border-radius:10px;margin-top:30px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.facts .f .n{font-family:'Cormorant Garamond',serif;font-size:2.6em;font-weight:700;color:var(--gold-lt);line-height:1}
.facts .f .l{font-size:.88em;color:#cbd5e1;margin-top:6px;letter-spacing:1px}
.rtbl{background:#fff;border-radius:10px;overflow:hidden;border:1px solid var(--line);margin-top:24px;box-shadow:0 10px 24px rgba(15,23,42,.05)}
.rtbl-row{display:grid;grid-template-columns:1fr 1fr 1fr 1.2fr;border-bottom:1px solid var(--line);font-size:.96em}
.rtbl-row:last-child{border:none}
.rtbl-row.head{background:var(--navy);color:var(--gold-lt);font-weight:800}
.rtbl-cell{padding:18px 22px}
.rtbl-cell.hi{font-weight:800;color:var(--gold-dk);font-family:'Cormorant Garamond',serif;font-size:1.05em}
.note{background:var(--cream);border-left:4px solid var(--gold);padding:22px 26px;border-radius:0 8px 8px 0;margin-top:24px}
.note h4{color:var(--gold-dk);font-weight:900;margin-bottom:8px;font-size:1.1em}.note p{color:var(--ink);margin:0;font-size:.96em}
.warn{background:#fef2f2;border:1px solid #fecaca;border-left:5px solid #dc2626;padding:22px 26px;border-radius:0 8px 8px 0;margin-top:24px}
.warn h4{color:#991b1b;font-weight:900;margin-bottom:6px}.warn p{color:#7f1d1d;margin:0}
.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px}
.stp{background:#fff;border:1px solid var(--line);padding:26px;border-radius:8px;display:flex;gap:18px;transition:.25s}
.stp:hover{border-color:var(--gold);transform:translateY(-4px)}
.stp .n{flex-shrink:0;font-family:'Cormorant Garamond',serif;font-size:2.6em;color:var(--gold);line-height:1;font-weight:700}
.stp h3{font-size:1.15em;font-weight:900;color:var(--navy);margin-bottom:6px}
.stp p{color:var(--mute);font-size:.95em;margin:0;line-height:1.75}
.timeline{margin-top:24px;position:relative;padding-left:30px;border-left:2px solid var(--gold)}
.tlitem{margin-bottom:24px;position:relative}
.tlitem::before{content:"";position:absolute;left:-37px;top:6px;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--gold)}
.tlitem .y{font-family:'Cormorant Garamond',serif;color:var(--gold-dk);font-size:1.3em;font-weight:700;margin-bottom:4px}
.tlitem .t{font-weight:800;color:var(--navy);margin-bottom:4px}
.tlitem .d{color:var(--mute);font-size:.96em}
.notice-list{margin-top:24px;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.notice-item{display:grid;grid-template-columns:80px 1fr 110px;gap:16px;padding:18px 24px;border-bottom:1px solid var(--line);align-items:center}
.notice-item:last-child{border:none}
.notice-item:hover{background:var(--cream)}
.notice-item .nbadge{display:inline-block;padding:4px 10px;background:var(--navy);color:var(--gold-lt);font-size:.78em;font-weight:700;border-radius:4px;text-align:center}
.notice-item .nbadge.alert{background:#dc2626;color:#fff}
.notice-item .ttitle{color:var(--navy);font-weight:700}
.notice-item .ndate{color:var(--mute);font-size:.88em;text-align:right}
.review-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px}
.rev{background:#fff;border:1px solid var(--line);padding:26px;border-radius:8px}
.rev .stars{color:var(--gold-dk);margin-bottom:10px;font-size:1.05em}
.rev .quote{color:var(--ink);font-size:.98em;line-height:1.85;margin-bottom:14px;font-weight:500}
.rev .who{border-top:1px dashed var(--line);padding-top:12px;display:flex;justify-content:space-between;font-size:.86em;color:var(--mute)}
.rev .who b{color:var(--gold-dk);font-weight:700}
details.faq{background:#fff;border:1px solid var(--line);border-radius:6px;margin-bottom:11px;transition:.2s;overflow:hidden}
details.faq[open]{border-color:var(--gold)}
details.faq summary{cursor:pointer;padding:22px 26px;font-weight:700;color:var(--navy);list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:center;font-size:1.02em}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";font-family:'Cormorant Garamond',serif;color:var(--gold-dk);font-size:1.7em;font-weight:700;transition:.2s;line-height:1}
details.faq[open] summary::after{transform:rotate(45deg);color:var(--gold)}
details.faq .a{padding:0 26px 22px;color:var(--mute);line-height:1.9;border-top:1px solid var(--line)}
details.faq[open] .a{padding-top:18px}
.cta-band{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:var(--ivory);text-align:center;padding:70px 24px}
.cta-band h2{font-family:'Cormorant Garamond',serif;color:var(--ivory);font-size:2em;margin-bottom:16px;font-weight:700;border:none;padding:0}
.cta-band p{color:#cbd5e1;font-size:1.08em;margin-bottom:24px}
.cta-ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{padding:16px 32px;border-radius:6px;font-weight:800;transition:.25s;display:inline-flex;align-items:center;gap:8px}
.btn.p{background:var(--gold);color:var(--navy)}
.btn.p:hover{background:var(--gold-lt);transform:translateY(-3px)}
.btn.s{background:transparent;color:var(--ivory);border:2px solid var(--gold-lt)}
.btn.s:hover{background:var(--gold-lt);color:var(--navy);transform:translateY(-3px)}
footer{background:#070b14;color:#94a3b8;padding:50px 24px 30px;text-align:center}
.fmark{font-family:'Cormorant Garamond',serif;font-size:1.6em;color:var(--gold-lt);margin-bottom:10px;letter-spacing:2px}
.ftel{font-size:1.3em;color:#fff;font-weight:800;margin-bottom:14px}.ftel a{color:var(--gold-lt)}
.fnav{margin:18px 0;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.fnav a{color:#cbd5e1;font-size:.9em}.fnav a:hover{color:var(--gold-lt)}
footer p{font-size:.92em;line-height:1.85}.disc{font-size:.82em;opacity:.65;max-width:780px;margin:18px auto 0}
.float{position:fixed;right:22px;bottom:22px;display:flex;flex-direction:column;gap:10px;z-index:999}
.fb{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.55em;box-shadow:0 12px 28px rgba(15,23,42,.4);transition:.25s}
.fb.tel{background:var(--navy);color:var(--gold-lt);animation:p 2.4s infinite;border:2px solid var(--gold)}
.fb.ch{background:var(--gold);color:var(--navy)}
.fb:hover{transform:scale(1.1)}
@keyframes p{0%,100%{box-shadow:0 12px 28px rgba(15,23,42,.4)}50%{box-shadow:0 12px 36px rgba(201,169,97,.7)}}
@media(max-width:900px){.page-hero h1{font-size:1.7em}.values{grid-template-columns:1fr}.factors,.steps,.review-grid{grid-template-columns:1fr}.facts{grid-template-columns:repeat(2,1fr);padding:30px}.rtbl-row{grid-template-columns:1fr 1fr 1fr 1fr;font-size:.85em}.rtbl-cell{padding:12px 10px}.notice-item{grid-template-columns:60px 1fr;font-size:.9em}.notice-item .ndate{grid-column:2}.nmenu{order:3;width:100%;justify-content:center}}

/* === Mobile Hamburger Drawer === */
.hmb{display:none;background:transparent;border:none;cursor:pointer;padding:8px;width:44px;height:44px;align-items:center;justify-content:center;flex-direction:column;gap:5px;border-radius:8px;color:inherit}
.hmb span{display:block;width:24px;height:2.5px;background:currentColor;border-radius:2px;transition:.3s}
.hmb:hover{background:rgba(0,0,0,.05)}
.drwBg{position:fixed;inset:0;background:rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:.3s;z-index:1500}
.drw{position:fixed;top:0;left:0;bottom:0;width:84%;max-width:320px;background:#fff;z-index:1600;transform:translateX(-100%);transition:transform .3s ease;display:flex;flex-direction:column;box-shadow:8px 0 32px rgba(0,0,0,.15)}
body.drwO{overflow:hidden}
body.drwO .drwBg{opacity:1;visibility:visible}
body.drwO .drw{transform:translateX(0)}
.drwH{padding:22px 24px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center}
.drwH .drwBrand{font-weight:900;font-size:1.25em;color:#111827}
.drwH .drwX{background:transparent;border:none;font-size:1.4em;cursor:pointer;line-height:1;padding:4px 10px;border-radius:6px;color:#6b7280}
.drwH .drwX:hover{background:#f3f4f6;color:#111827}
.drwMenu{flex:1;padding:12px 0;display:flex;flex-direction:column;overflow-y:auto}
.drwMenu a{padding:15px 24px;font-weight:600;font-size:1.02em;color:#374151;text-decoration:none;border-left:3px solid transparent;transition:.2s}
.drwMenu a:hover,.drwMenu a.active{background:#f9fafb;color:#111827}
.drwCta{padding:20px 24px;border-top:1px solid #e5e7eb;display:flex;flex-direction:column;gap:10px}
.drwCta a{display:block;text-align:center;padding:14px;border-radius:10px;font-weight:800;text-decoration:none;font-size:.98em}
.drwCta .drwTel{background:#111827;color:#fff}
.drwCta .drwCh{background:#fbbf24;color:#3b2200}
@media(max-width:900px){
  .hmb{display:flex !important}
  .nmenu{display:none !important}
  .nbtn .txt{display:none}
  .nactions{gap:6px}
  .nbtn.h{padding:11px 14px}
  .nbtn.c{padding:11px 14px}
}

        /* === Mobile UX Improvements === */
        @media(max-width:900px){
          .topbar{font-size:.74em;padding:7px 12px;letter-spacing:0;line-height:1.4}
          .nav-in{padding:10px 14px !important;gap:8px !important;flex-wrap:nowrap !important;justify-content:flex-start !important;align-items:center !important}
          .hmb{display:flex !important;width:42px;height:42px;padding:8px;border-radius:10px;flex-shrink:0;order:-1}
          .hmb span{width:22px;height:2.5px;margin:0}
          .logo,.brand{gap:8px !important;flex-shrink:1;min-width:0;margin-right:auto !important}
          .logo .mark,.brand .b{width:36px !important;height:36px !important;font-size:.95em !important;flex-shrink:0;border-radius:9px !important}
          .logo .t,.brand .t{font-size:1.05em !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.3px}
          .logo .t .sub,.brand .t .s{display:none}
          .nmenu{display:none !important}
          .nbtn .txt,.nbtn span.txt{display:none}
          .nactions,.nav-actions,.nav-act{display:flex !important;gap:6px !important;flex-shrink:0 !important;align-items:center !important}
          .nbtn{padding:0 !important;width:42px !important;height:42px !important;min-width:42px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;font-size:1.2em !important;border-radius:10px !important;gap:0 !important;line-height:1 !important}
        }
        @media(max-width:380px){
          .topbar{display:none}
          .logo .t,.brand .t{display:none}
          .nav-in{padding:10px 12px !important;gap:6px !important}
          .nbtn{width:40px !important;height:40px !important;min-width:40px !important;font-size:1.1em !important}
          .hmb{width:40px;height:40px;padding:7px}
        }

        /* === Mobile-First Polish (≤560px) === */
        @media(max-width:560px){
          /* Hero — tight & focused */
          .hero,.page-hero{padding:50px 16px 40px !important}
          .hero h1,.page-hero h1{font-size:1.7em !important;line-height:1.22 !important;margin-bottom:14px !important;letter-spacing:-.8px !important}
          .hero .sub{font-size:.95em !important;margin-bottom:16px !important;line-height:1.4 !important}
          .hero p.lead,.hero .lead,.hero p,.page-hero p{font-size:.96em !important;margin-bottom:22px !important;line-height:1.7 !important}
          .ribbon{font-size:.7em !important;padding:6px 14px !important;margin-bottom:16px !important;letter-spacing:.5px !important}
          .ribbon::before,.ribbon::after{width:14px !important}
          .badge,.pill,.kicker{font-size:.78em !important;padding:6px 14px !important;margin-bottom:14px !important;letter-spacing:.5px !important}

          /* CTAs full-width */
          .ctas,.cta-row,.hero-cta,.cta-ctas{gap:8px !important;display:flex !important;flex-wrap:wrap !important}
          .ctas .btn,.cta-row .btn,.hero-cta .btn,.cta-ctas .btn{flex:1 1 calc(50% - 4px);min-width:0;padding:14px 16px !important;font-size:.92em !important;border-radius:10px !important;justify-content:center !important;gap:6px !important}

          /* Sections */
          section,section.s,section.section,.sec,section.sec{padding:48px 16px !important}
          .si h2,.s-head h2,.section-head h2,.sh h2,h2{font-size:1.5em !important;margin-bottom:12px !important;line-height:1.3 !important}
          .si p,.s-head p,.section-head p,.sh p{font-size:.95em !important}
          .eyebrow,.tag,.sh .lbl,.s-head .lbl,.s-head .num{font-size:.7em !important;letter-spacing:.5px !important;margin-bottom:8px !important}

          /* Stats — compact 2x2 */
          .stats,.stats{margin:-30px auto 50px !important;padding:0 16px !important}
          .stats-grid,.sg,.facts{padding:22px 14px !important;gap:12px !important;border-radius:14px !important}
          .stats-grid,.sg{grid-template-columns:repeat(2,1fr) !important}
          .stat,.facts .f{padding:10px 6px !important}
          .stat .num,.stat .n,.facts .f .n{font-size:1.5em !important;line-height:1}
          .stat .label,.stat .l,.facts .f .l{font-size:.74em !important;margin-top:4px !important;letter-spacing:.3px !important}

          /* Cards single column */
          .features-grid,.fg,.values,.factors,.steps,.proc,.pillars,.cri-grid,.trans-grid,.fpr,.tr-cards{grid-template-columns:1fr !important;gap:12px !important}
          .feature,.ft,.val,.fac,.cri,.tr-card,.stp,.pil,.step{padding:22px 18px !important;border-radius:14px !important}
          .feature h3,.ft h3,.val h3,.cri h3,.tr-card h3,.stp h3,.pil h3,.step h3{font-size:1.05em !important;margin-bottom:6px !important}
          .feature p,.ft p,.val p,.cri p,.tr-card p,.stp p,.pil p,.step p{font-size:.92em !important}

          /* CTA Band */
          .cta-band,.cta{padding:50px 18px !important}
          .cta-band h2,.cta h2{font-size:1.45em !important;margin-bottom:14px !important;letter-spacing:-.5px !important}
          .cta-band p,.cta p{font-size:.94em !important;margin-bottom:20px !important}

          /* FAQ — touch-friendly */
          details.faq summary{padding:18px 16px !important;font-size:.96em !important;gap:10px !important}
          details.faq summary::after{font-size:1.3em !important}
          details.faq .a,details.faq .ans,details.faq .answer{padding:0 16px 18px 16px !important;font-size:.92em !important;line-height:1.75 !important}
          details.qa summary{padding:18px 16px !important;font-size:.94em !important}
          details.qa summary .qm,details.qa summary .qmark{width:28px !important;height:28px !important;font-size:.85em !important}
          details.qa .a{padding:0 16px 18px 56px !important;font-size:.92em !important}

          /* Notice list */
          .notice-item{padding:14px 16px !important;font-size:.88em !important;grid-template-columns:60px 1fr !important;gap:10px !important}
          .notice-item .ndate{grid-column:2 !important;font-size:.78em !important}

          /* Timeline card */
          .tl-card{padding:22px 18px !important}
          .tl-card .th{font-size:.96em !important;margin-bottom:12px !important}
          .tl-item .t{font-size:.9em !important}
          .tl-item .min{font-size:.78em !important}

          /* Crumb */
          .crumb{margin:18px auto 0 !important;padding:0 16px !important;font-size:.82em !important}

          /* Floating buttons compact */
          .float-btns,.float{right:14px !important;bottom:14px !important;gap:8px !important}
          .floating-btn,.fb{width:52px !important;height:52px !important;font-size:1.35em !important}

          /* Body breathing room for floats */
          body{padding-bottom:0 !important}
          footer{padding:36px 18px 28px !important}
          footer .ftel{font-size:1.2em !important}
          footer .fnav{gap:12px !important}
          footer .fnav a{font-size:.85em !important}
          footer p{font-size:.85em !important}
          footer .disc{font-size:.75em !important}
        }

        @media(max-width:380px){
          .hero h1,.page-hero h1{font-size:1.5em !important}
          .ctas .btn,.cta-row .btn,.hero-cta .btn,.cta-ctas .btn{flex:1 1 100%}
          .si h2,h2{font-size:1.35em !important}
        }
