@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

:root{
  --orange:#ff5c1f;
  --ink:#17191c;
  --cream:#fbf8f3;
  --footer:#eeebdf;
  --beige:#fff4ec;
  --line:#ebe6df;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#fff}
img{display:block;max-width:100%}
button,input{font:inherit}
button{cursor:pointer}
a{text-decoration:none;color:inherit}
.wrap{width:min(1120px,calc(100% - 80px));margin:0 auto}
.narrow{width:min(980px,calc(100% - 80px))}

.hero{min-height:980px;color:#fff;position:relative;overflow:hidden;background:#0e0f12}
.hero__bg,.hero__shade{position:absolute;inset:0}
.hero__bg{background:url('../assets/images/hero-bg-v29.png') center center/cover no-repeat;transform:translateY(145px) scale(1.03);transform-origin:center center;filter:brightness(.54) saturate(.88);animation:heroRevealBgV29 1.6s ease-out forwards}
.hero__shade{background:linear-gradient(180deg,rgba(4,4,6,.50) 0%,rgba(8,8,10,.18) 42%,rgba(7,7,8,.34) 100%);animation:heroRevealShade 1.6s ease-out forwards}
.nav{height:82px;display:flex;align-items:center;gap:16px;position:relative;z-index:2;padding-top:14px}
.logo.remember,.logo.ggmj{height:26px;width:auto;object-fit:contain;display:block}
.nav span{font-weight:300;color:#ded8d2;font-size:22px;line-height:1}
.hero-copy{position:relative;z-index:2;text-align:center;padding-top:34px;padding-bottom:96px;animation:fadeInUp .9s ease-out .2s both}
.event-pill{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,92,31,.9);border-radius:999px;padding:10px 20px;color:var(--orange);font-weight:700;font-size:14px;background:rgba(18,18,18,.12);backdrop-filter:blur(2px)}
.event-pill em{width:10px;height:10px;border-radius:50%;background:var(--orange);display:block}
.hero h1{font-size:74px;line-height:1.13;letter-spacing:-3.4px;margin:26px 0 12px;font-weight:800}
.hero mark,.how mark{background:none;color:var(--orange)}
.hero-copy>p{font-size:21px;line-height:1.45;color:#dfdfdf;margin:0;position:relative;z-index:2}
.cta{border:0;background:var(--orange);color:#fff;height:64px;border-radius:12px;padding:0 42px;font-weight:800;font-size:20px;display:inline-flex;align-items:center;justify-content:center;gap:8px;position:relative;transition:transform .22s ease, box-shadow .22s ease, background-color .22s ease}
.cta b{font-size:22px;font-weight:700}
.hero .cta{margin-top:328px;min-width:460px}
.hero small{display:block;color:#ddd;margin-top:18px;font-size:15px;padding-bottom:40px}

.section{padding:102px 0}
.benefit{background:#fffaf5;border-top:1px solid #f1ece6}
.section-head{display:flex;align-items:flex-start;gap:58px;margin-bottom:48px}
.section-head .num{font-size:112px;line-height:.84;font-weight:200;color:#b6b7ba;letter-spacing:-6px}
.section label,.section-head label{color:var(--orange);font-size:14px;font-weight:800;letter-spacing:.3px}
.section h2{font-size:56px;line-height:1.16;letter-spacing:-2px;margin:12px 0 0;font-weight:800}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cards article{border:1px solid var(--line);border-radius:18px;min-height:188px;padding:28px 28px 26px;position:relative;overflow:hidden;background:rgba(255,255,255,.86)}
.cards p{margin:0;color:#555;font-size:16px}
.cards h3{font-size:26px;line-height:1.2;margin:10px 0 10px;letter-spacing:-1px}
.cards small{display:block;color:#7c7c7c;line-height:1.6;font-size:15px}
.benefit-cards .orange{background:linear-gradient(135deg,#ff7d4f,#ff5c1f);color:#fff;border:0}
.benefit-cards .orange p{color:#fff}
.benefit-cards .orange h3{font-size:34px}
.card-asset{position:absolute;right:18px;bottom:14px}
.benefit-gift{width:140px}
.benefit-calendar,.benefit-chat{width:108px;right:22px;bottom:22px}

.how{background:#f7f8f7;border-top:1px solid #eceeed}
.how-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:30px;align-items:center}
.section-head.compact{gap:28px;margin-bottom:34px}
.compact .num{font-size:94px}
.steps{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-top:8px}
.steps>div{text-align:center;flex:1}
.step-icon{width:84px;height:84px;border:1px solid #e5ddd2;border-radius:50%;display:grid;place-items:center;margin:0 auto}
.steps label{display:block;margin:14px 0 8px;font-size:12px}
.steps strong{display:block;font-size:16px;line-height:1.5;letter-spacing:-.4px}
.steps i{font-style:normal;font-size:30px;color:#717171;padding-top:24px}
.products h3{text-align:center;font-size:25px;line-height:1.36;letter-spacing:-.8px;margin:0 0 10px;font-weight:800}
.products h3 mark{color:var(--orange)}
.products h3 small{font-size:12px;color:#777}
.products-visual{border-radius:20px;overflow:hidden}
.products-visual img{width:100%;height:auto}

.why{padding-top:96px;background:#fff;border-top:1px solid #ececec}
.why-cards article{min-height:462px;padding-bottom:20px}
.why-cards article>label{font-size:28px}
.why-cards article>p{line-height:1.6;color:#666;font-size:15px}
.why-asset{position:absolute;left:22px;right:22px;bottom:16px;height:214px;display:flex;align-items:flex-end;justify-content:center}
.why-asset img{max-height:100%;width:auto;max-width:100%}

.proof{background:#f5f0e8;border-top:1px solid #ece4d9}
.proof-grid{display:grid;grid-template-columns:2.05fr .95fr;gap:54px}
.proof h2{font-size:54px;line-height:1.16;letter-spacing:-2px;margin-top:12px}
.proof p{font-size:18px;color:#777;line-height:1.7;margin:18px 0 0}
.logos-grid-wrap{margin:34px 0 0}
.logos-grid-image{width:100%;display:block;border-radius:14px}
.proof small{font-size:13px;color:#999}
.proof aside{border-left:1px solid #e2ddd5;padding-left:44px;display:flex;flex-direction:column;justify-content:flex-start}
.proof aside h3{font-size:28px;line-height:1.4;margin:6px 0 8px}
.proof aside strong{display:block;color:var(--orange);font-size:66px;line-height:1;margin-top:26px}
.proof aside p{font-size:14px;line-height:1.5;margin-top:8px}
.proof blockquote{margin:36px 0 0;color:#525252}

.faq{background:#fafafa;border-top:1px solid #eeeeee}
.faq>div>h2{margin:12px 0 30px}
.accordion details{border:1px solid #ece8e2;border-radius:10px;margin:10px 0;padding:0 22px;background:#fff}
.accordion summary{list-style:none;padding:20px 0;font-weight:800;cursor:pointer;font-size:18px}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary:after{content:'⌄';float:right;color:#555}
.accordion details[open] summary:after{content:'⌃'}
.accordion details p{margin:-4px 0 20px 24px;color:#858585;font-size:14px;line-height:1.7}
.final{margin-top:58px;background:var(--beige);border-radius:18px;text-align:center;padding:52px 20px 60px;position:relative;overflow:hidden}
.final:before,.final:after{content:"";position:absolute;border-radius:50%;background:#ffe1cf;opacity:.9}
.final:before{width:230px;height:230px;left:-120px;bottom:-125px}
.final:after{width:200px;height:200px;right:-80px;top:-98px}
.final span{position:relative;z-index:2;color:var(--orange);background:#ffe2d2;border-radius:30px;padding:6px 14px;font-size:12px;font-weight:800}
.final h2{position:relative;z-index:2;font-size:54px;line-height:1.2;letter-spacing:-2px;margin:22px 0 34px}
.final .cta{position:relative;z-index:2;min-width:360px}

.site-footer{background:var(--footer);padding:28px 0 34px}
.footer-grid{display:grid;grid-template-columns:180px 1fr;gap:40px;align-items:start}
.footer-brand img{width:145px;height:auto}
.footer-content strong{display:block;font-size:12px;line-height:1.45;letter-spacing:-.1px;color:#111;font-weight:800}
.footer-content address{margin:12px 0 0;font-style:normal;color:#646464;font-size:11px;line-height:1.85;letter-spacing:-.1px}
.footer-policy{display:flex;gap:24px;flex-wrap:wrap;margin-top:16px}
.footer-policy a{font-size:11px;color:#555;text-decoration:underline;text-underline-offset:3px}
.copyright{margin:10px 0 0;color:#606060;font-size:11px;line-height:1.6}

.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:30;display:none;place-items:center;padding:20px}
.modal.show{display:grid}
.modal-card{width:min(460px,100%);background:#fff;border-radius:16px;padding:38px;position:relative}
.modal-card .close{position:absolute;right:18px;top:14px;border:0;background:none;font-size:30px}
.modal-card h2{margin:8px 0 24px;font-size:28px}
.modal-card label{color:var(--orange);font-weight:800}
.modal-card input{width:100%;height:52px;border:1px solid #ddd;border-radius:8px;padding:0 14px;margin:6px 0;font-size:15px}
.modal-card .cta{width:100%;margin-top:12px;height:54px}
.form-msg{font-size:12px;color:#777;text-align:center}

@media (max-width:1180px){
  .hero h1{font-size:64px}
  .hero-copy>p{font-size:19px}
    .footer-grid{grid-template-columns:180px 1fr;gap:40px}
  .footer-brand img{width:145px}
}

@media (max-width:1024px){
  .wrap,.narrow{width:calc(100% - 48px)}
  .hero{min-height:920px}
  .hero h1{font-size:56px}
  .hero-copy>p{font-size:18px}
    .hero .cta{margin-top:318px}
  .section h2,.proof h2,.final h2{font-size:44px}
  .proof-grid{grid-template-columns:1.7fr 1fr}
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-brand img{width:145px}
}

@media (max-width:760px){
  .hero__bg{transform:translateY(8px) scale(1.22);transform-origin:center center}
  .wrap,.narrow{width:calc(100% - 32px)}
  .hero{min-height:820px}
  .nav{height:56px;padding-top:10px;gap:10px}
  .logo.remember,.logo.ggmj{height:18px}
  .nav span{font-size:16px}
  .hero-copy{padding-top:18px}
  .event-pill{font-size:12px;padding:9px 15px}
  .hero h1{font-size:38px;letter-spacing:-1.4px;margin:18px 0 10px}
  .hero-copy>p{font-size:15px;line-height:1.5;padding:0 12px}
    .hero .cta{width:100%;max-width:350px;min-width:0;height:58px;margin-top:280px;font-size:17px;padding:0 20px}
  .hero small{font-size:13px;padding:0 8px 26px}

  .section{padding:74px 0}
  .section-head{gap:20px;margin-bottom:32px}
  .section-head .num{font-size:72px;letter-spacing:-4px}
  .section h2,.proof h2,.final h2{font-size:34px;letter-spacing:-1.2px}
  .cards{grid-template-columns:1fr}
  .cards article{min-height:176px;padding:24px}
  .benefit-gift{width:124px}
  .benefit-calendar,.benefit-chat{width:94px}

  .how-grid{grid-template-columns:1fr;gap:18px}
  .compact .num{font-size:72px}
  .steps{gap:6px}
  .step-icon{width:68px;height:68px}
  .steps strong{font-size:13px}
  .steps i{padding-top:18px;font-size:24px}
  .products h3{font-size:22px}

  .why-cards article{min-height:412px}
  .why-cards article>label{font-size:20px}
  .why-asset{height:176px}

  .proof-grid{grid-template-columns:1fr;gap:28px}
  .proof p{font-size:15px}
  .logos-grid-wrap{margin-top:28px}
  .logos-grid-image{width:100%;}
  .proof aside{border-left:0;border-top:1px solid #e2ddd5;padding:24px 0 0}
  .proof aside h3{font-size:22px}
  .proof aside strong{font-size:54px}
  .proof blockquote{font-size:14px}

  .accordion summary{font-size:15px;line-height:1.5;padding-right:16px}
  .accordion details p{margin-left:0;font-size:13px}
  .final{padding:42px 16px 46px}
  .final .cta{width:100%;min-width:0;height:56px}

  .site-footer{padding:22px 0 26px}
  .footer-brand img{width:86px}
  .footer-content strong{font-size:10px}
  .footer-content address{font-size:9.5px;line-height:1.75;margin-top:8px}
  .footer-policy{gap:14px;margin-top:12px}
  .footer-policy a,.copyright{font-size:9.5px}

  .modal-card{padding:28px 22px}
}

.consent-box{margin-top:14px;padding-top:12px;border-top:1px solid #ececec}
.consent-title{margin:0 0 12px;color:#8a8a8a;font-size:14px;line-height:1.5}
.consent-item{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0}
.consent-item.sub{padding-left:28px}
.check-row{display:flex;align-items:center;gap:12px;cursor:pointer;color:#8d8d8d;font-size:15px;line-height:1.5}
.check-row.main .check-text,.check-text.strong{font-weight:800;color:#6d6d6d}
.check-row input{position:absolute;opacity:0;pointer-events:none}
.fake-check{width:18px;height:18px;border-radius:6px;border:1.5px solid #d7d7d7;background:#f2f2f2;display:inline-block;position:relative;flex:0 0 18px}
.check-row input:checked + .fake-check{background:var(--orange);border-color:var(--orange)}
.check-row input:checked + .fake-check:after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(45deg)}
.term-link{border:0;background:none;padding:0;color:#8d8d8d;font-size:14px;cursor:pointer}
.consent-error{margin:8px 0 0 40px;color:#f04a4a;font-size:13px;line-height:1.5;min-height:20px}
.submit-cta[disabled]{opacity:.45;cursor:not-allowed}
.term-modal{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:40;display:none;place-items:center;padding:20px}
.term-modal.show{display:grid}
.term-card{width:min(720px,100%);max-height:min(80vh,820px);overflow:auto;background:#fff;border-radius:18px;padding:28px 28px 24px;position:relative}
.term-close{position:absolute;right:16px;top:12px;border:0;background:none;font-size:30px;cursor:pointer}
.term-heading{margin:0 0 18px;font-size:22px;line-height:1.35;letter-spacing:-.5px}
.term-body{color:#444;font-size:15px;line-height:1.85}
.term-body h4{margin:18px 0 6px;font-size:16px;color:#111}
.term-body p{margin:0 0 10px}
.term-body strong{font-weight:800;color:#111}


/* v7 refinements */
.modal-card{width:min(520px,100%);padding:34px 28px 30px;}
.modal-card label:first-of-type{display:block;margin-bottom:4px;}
.consent-box{margin-top:16px;padding-top:12px;border-top:1px solid #ececec;}
.consent-title{margin:0 0 10px;color:#9a9a9a;font-size:14px;line-height:1.5;font-weight:500;}
.consent-item{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0;}
.consent-item.sub{padding-left:58px;margin-top:4px;}
.check-row{display:flex;align-items:center;gap:12px;cursor:pointer;color:#8d8d8d;font-size:15px;line-height:1.5;}
.check-row.main .check-text,.check-text.strong{font-weight:800;color:#5f5f5f;}
.check-row input{position:absolute;opacity:0;pointer-events:none;}
.fake-check{width:18px;height:18px;border-radius:6px;border:1px solid #d2d2d2;background:#efefef;display:inline-block;position:relative;flex:0 0 18px;}
.check-row input:checked + .fake-check{background:var(--orange);border-color:var(--orange);}
.check-row input:checked + .fake-check:after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(45deg);}
.term-link{border:0;background:none;padding:0;color:#8f8f8f;font-size:14px;cursor:pointer;}
.consent-error{margin:8px 0 0 54px;color:#f04a4a;font-size:13px;line-height:1.5;min-height:20px;}
.submit-cta[disabled]{opacity:.45;cursor:not-allowed;filter:saturate(.8);}
@media (max-width:760px){
  .logo.remember,.logo.ggmj{height:18px;}
  .modal-card{padding:26px 18px 24px;width:min(100%, 460px);}
  .consent-item.sub{padding-left:28px;}
  .consent-error{margin-left:38px;font-size:12px;}
}


.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 67%, rgba(255,214,158,.24) 0%, rgba(255,194,112,.12) 18%, rgba(255,163,0,0) 42%);opacity:0;animation:heroSpot 1.8s ease-out .2s forwards;pointer-events:none}
.cta:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(255,92,31,.24);background:#ff6a2f}
.cta:active{transform:translateY(0)}
.reveal{opacity:0;transform:translateY(34px);transition:opacity .7s ease, transform .7s ease}
.reveal.is-visible{opacity:1;transform:none}
.testimonial{background:#f3f3f5;border-radius:22px;padding:34px 28px;margin-top:34px}
.testimonial p{margin:0;font-size:22px;line-height:1.75;letter-spacing:-.5px;font-style:italic;color:#4b4b52}
.testimonial span{color:var(--orange);font-weight:800}
.testimonial cite{display:block;margin-top:34px;font-size:28px;line-height:1.4;letter-spacing:-.8px;color:#303038;font-style:italic;font-weight:700}
@keyframes heroRevealBg{0%{filter:brightness(.18) saturate(.75);transform:translateY(18px) scale(1.14)}100%{filter:brightness(.98) saturate(1);transform:translateY(18px) scale(1.11)}}
@keyframes heroRevealShade{0%{opacity:1}100%{opacity:1}}
@keyframes heroSpot{0%{opacity:0}100%{opacity:1}}
@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:none}}
@media (max-width:1024px){
  .hero__bg{background-position:center 44%;transform:translateY(10px) scale(1.08)}
  .hero .cta{margin-top:292px}
  .testimonial p{font-size:19px}
  .testimonial cite{font-size:22px}
}
@media (max-width:760px){
  .hero__bg{background-position:center 43%;transform:translateY(4px) scale(1.06)}
  .hero .cta{margin-top:248px}
  .testimonial{padding:24px 20px}
  .testimonial p{font-size:16px;line-height:1.7}
  .testimonial cite{margin-top:22px;font-size:20px}
}


/* application consent modal */
.modal{overflow:auto;align-items:start;padding:28px 20px}
.modal.show{display:grid}
.modal-card{width:min(560px,100%);max-height:none;margin:auto;background:#fff;border-radius:18px;padding:32px 28px 28px;position:relative}
.modal-card>label{display:block;color:var(--orange);font-size:14px;font-weight:800;margin-bottom:5px}
.modal-card h2{margin:0 0 20px;font-size:28px;line-height:1.35;letter-spacing:-.7px}
.modal-card input:not([type="checkbox"]){width:100%;height:50px;border:1px solid #dedede;border-radius:9px;padding:0 14px;margin:5px 0;font-size:15px;color:#222;background:#fff}
.consent-box{margin-top:18px;padding-top:14px;border-top:1px solid #ededed}
.consent-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}
.consent-title{margin:0;color:#929292;font-size:14px;line-height:1.5;font-weight:500}
.consent-item{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:9px 0}
.consent-item.sub{padding-left:36px;margin-top:4px}
.consent-all-row{margin-top:12px}
.check-row{display:flex;align-items:center;gap:11px;cursor:pointer;color:#8a8a8a;font-size:15px;line-height:1.45;min-width:0}
.check-row.main .check-text,.check-text.strong{font-weight:800;color:#636363}
.check-row input{position:absolute;opacity:0;pointer-events:none}
.fake-check{width:20px;height:20px;border-radius:6px;border:1px solid #d4d4d4;background:#f1f1f1;display:inline-block;position:relative;flex:0 0 20px}
.check-row input:checked + .fake-check{background:var(--orange);border-color:var(--orange)}
.check-row input:checked + .fake-check:after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(45deg)}
.term-link{border:0;background:none;padding:3px 0;color:#8c8c8c;font-size:14px;cursor:pointer;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.term-link:hover{color:#555}
.consent-error{margin:8px 0 2px 47px;color:#f04a4a;font-size:13px;line-height:1.5;min-height:20px}
.submit-cta{width:100%;margin-top:14px;height:54px;border-radius:12px}
.submit-cta[disabled]{opacity:.38;cursor:not-allowed;box-shadow:none;transform:none;filter:saturate(.65)}
.term-modal{position:fixed;inset:0;background:rgba(0,0,0,.58);z-index:50;display:none;place-items:center;padding:20px}
.term-modal.show{display:grid}
.term-card{width:min(720px,100%);max-height:min(82vh,820px);overflow:auto;background:#fff;border-radius:18px;padding:32px 30px 28px;position:relative}
.term-close{position:absolute;right:16px;top:12px;border:0;background:none;font-size:30px;line-height:1;color:#444;cursor:pointer}
.term-heading{margin:0 42px 20px 0;font-size:24px;line-height:1.35;letter-spacing:-.7px}
.term-body{color:#444;font-size:15px;line-height:1.8}
.term-body h4{margin:22px 0 6px;font-size:16px;color:#111}
.term-body p{margin:0 0 10px}
.term-body strong{font-weight:800;color:#111}
@media (max-width:760px){
  .modal{padding:16px 10px}
  .modal-card{padding:26px 18px 22px;border-radius:16px}
  .modal-card h2{font-size:24px}
  .consent-item.sub{padding-left:28px}
  .check-row{font-size:14px;gap:9px}
  .term-link{font-size:13px}
  .consent-error{margin-left:37px;font-size:12px}
  .term-card{padding:26px 20px 22px}
  .term-heading{font-size:21px}
  .term-body{font-size:14px}
}
.form-msg.is-success{color:#16833b;font-weight:700}
.form-msg.is-error{color:#e54848;font-weight:700}
.submit-cta:disabled{cursor:not-allowed}


/* v13 mobile typography refinements */
.mobile-br{display:none}

@media (max-width:760px){
  .mobile-br{display:block}

  /* Hero: keep the headline visually balanced instead of leaving short syllables alone */
  .hero{min-height:820px}
  .hero-copy{padding-top:18px}
  .hero-title{font-size:36px;line-height:1.18;letter-spacing:-1.35px;margin:18px 0 12px;word-break:keep-all}
  .hero-copy>p{font-size:15px;line-height:1.55;padding:0 8px;word-break:keep-all}

  /* Section headings: smaller type + Korean word-preserving wrapping */
  .section-head{gap:16px}
  .section-head .num,.compact .num{font-size:68px;line-height:.9;flex:0 0 auto}
  .section h2,.proof h2,.final h2{font-size:30px;line-height:1.28;letter-spacing:-1px;word-break:keep-all;overflow-wrap:normal}
  .section-head h2{margin-top:8px}

  /* Benefit cards */
  .cards h3{font-size:24px;word-break:keep-all}
  .cards small{font-size:14px;line-height:1.55;word-break:keep-all}
  .benefit-cards .orange h3{font-size:31px}

  /* WHY REMEMBER cards */
  .why-cards article h3{font-size:27px;line-height:1.28;word-break:keep-all}
  .why-cards article>p{font-size:14px;line-height:1.65;word-break:keep-all}

  /* Social proof */
  .proof h2{font-size:30px;line-height:1.32}
  .proof>div>div>p{word-break:keep-all}

  /* FAQ */
  .faq>div>h2{font-size:30px;line-height:1.3;margin:10px 0 26px}
  .accordion summary{font-size:15px;line-height:1.45;word-break:keep-all}
  .accordion details p{font-size:13px;line-height:1.7;word-break:keep-all}

  /* Final CTA copy: intentional three-line break instead of an orphaned '요' */
  .final h2{font-size:29px;line-height:1.32;letter-spacing:-1px;margin:20px 0 30px}
  .final span{font-size:11px;white-space:nowrap}
  .final .cta{font-size:17px}
}

@media (max-width:390px){
  .hero-title{font-size:33px}
  .section h2,.proof h2,.faq>div>h2{font-size:28px}
  .final h2{font-size:27px}
  .section-head .num,.compact .num{font-size:62px}
}


/* v25: mobile hero uses a dedicated 9:16 image matching approved composition */
.hero-mobile-visual{display:none}
@media (max-width:760px){
  .hero{min-height:0;height:auto;background:#0b0b0b;overflow:hidden}
  .hero__bg,.hero__shade,.hero>.nav,.hero>.hero-copy,.hero::after{display:none!important}
  .hero-mobile-visual{display:block;position:relative;width:100%;aspect-ratio:941/1672;background:#0b0b0b;overflow:hidden}
  .hero-mobile-final-image{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.025);filter:brightness(.18) saturate(.85);animation:heroMobileImageReveal 1.55s ease-out forwards;transform-origin:center center}
  .hero-mobile-cta-hit{position:absolute;left:5.4%;top:80.4%;width:89.2%;height:8.7%;border:0;border-radius:18px;background:transparent;cursor:pointer;z-index:3;-webkit-tap-highlight-color:transparent}
  .hero-mobile-cta-hit:focus-visible{outline:3px solid rgba(255,255,255,.95);outline-offset:-5px}
}
@keyframes heroMobileImageReveal{
  0%{filter:brightness(.16) saturate(.8);transform:scale(1.055)}
  100%{filter:brightness(1) saturate(1);transform:scale(1.025)}
}


/* v27 hero refresh — preserve the supplied desktop image tone */
@keyframes heroRevealBgV27{
  0%{filter:brightness(.20) saturate(.72);transform:scale(1.045)}
  100%{filter:brightness(.78) saturate(.88);transform:scale(1.02)}
}
@media (min-width:761px){
  .hero__bg{background-position:center 50%;transform:scale(1.02)!important;animation:heroRevealBgV27 1.6s ease-out forwards!important}
  .hero__shade{background:linear-gradient(180deg,rgba(4,4,6,.58) 0%,rgba(8,8,10,.26) 45%,rgba(7,7,8,.42) 100%)}
}
@media (max-width:760px){
  .hero-mobile-visual{aspect-ratio:941/1672}
  .hero-mobile-final-image{transform:scale(1.01);filter:brightness(.18) saturate(.82);animation:heroMobileImageRevealV27 1.55s ease-out forwards}
  .hero-mobile-cta-hit{left:6%;top:82.3%;width:88%;height:8.2%}
}
@keyframes heroMobileImageRevealV27{
  0%{filter:brightness(.16) saturate(.72);transform:scale(1.035)}
  100%{filter:brightness(1) saturate(.92);transform:scale(1.01)}
}

/* v29 desktop hero: exact uploaded image, lowered to keep the subject's face clear of the headline */
@keyframes heroRevealBgV29{0%{filter:brightness(.18) saturate(.72);transform:translateY(145px) scale(1.06)}100%{filter:brightness(.78) saturate(.96);transform:translateY(145px) scale(1.03)}}
@media (min-width:761px) and (max-width:1180px){.hero__bg{transform:translateY(125px) scale(1.05);animation-name:heroRevealBgV29}.hero h1{font-size:64px}}

/* v30 hero refresh — use the newly approved PC/mobile hero images with copy overlaid */
@keyframes heroRevealBgV30 {
  0% { filter: brightness(.22) saturate(.72); transform: scale(1.06); }
  100% { filter: brightness(.58) saturate(.92); transform: scale(1.02); }
}

.hero__bg {
  background-image: url('../assets/images/hero-bg-v30.png') !important;
  background-position: center center !important;
  background-size: cover !important;
  transform: scale(1.02) !important;
  transform-origin: center center;
  filter: brightness(.58) saturate(.92) !important;
  animation: heroRevealBgV30 1.4s ease-out forwards !important;
}
.hero__shade {
  background: linear-gradient(180deg, rgba(5,5,7,.58) 0%, rgba(6,6,8,.26) 38%, rgba(7,7,8,.54) 100%) !important;
}
.hero {
  min-height: 980px;
}
.hero-copy {
  padding-top: 38px;
  padding-bottom: 92px;
}
.hero h1 {
  margin: 26px 0 14px;
}
.hero .cta {
  margin-top: 248px;
}
.hero small {
  padding-bottom: 50px;
}

@media (max-width: 1180px) {
  .hero__bg {
    background-position: center center !important;
    transform: scale(1.03) !important;
  }
  .hero .cta {
    margin-top: 232px;
  }
}

@media (max-width: 980px) {
  .hero {
    min-height: 900px;
  }
  .hero .cta {
    margin-top: 208px;
  }
}

@media (max-width: 760px) {
  .hero {
    min-height: 1340px;
    background: #0b0b0b;
  }
  .hero-mobile-visual {
    display: none !important;
  }
  .hero__bg,
  .hero__shade,
  .hero > .nav,
  .hero > .hero-copy,
  .hero::after {
    display: block !important;
  }
  .hero__bg {
    background-image: url('../assets/images/hero-mobile-v30.png') !important;
    background-position: center top !important;
    background-size: cover !important;
    transform: none !important;
    filter: brightness(.62) saturate(.92) !important;
    animation: heroRevealBgV30 1.35s ease-out forwards !important;
  }
  .hero__shade {
    background: linear-gradient(180deg, rgba(5,5,7,.56) 0%, rgba(6,6,8,.20) 24%, rgba(7,7,8,.28) 52%, rgba(7,7,8,.80) 100%) !important;
  }
  .wrap,
  .narrow {
    width: calc(100% - 32px);
  }
  .nav {
    height: auto;
    padding-top: 22px;
    gap: 12px;
    justify-content: flex-start;
  }
  .logo.remember,
  .logo.ggmj {
    height: 24px;
  }
  .nav span {
    font-size: 20px;
  }
  .hero-copy {
    padding-top: 42px;
    padding-bottom: 42px;
    animation: fadeInUp .85s ease-out .15s both;
  }
  .event-pill {
    font-size: 12px;
    padding: 10px 16px;
    background: rgba(18,18,18,.16);
  }
  .hero-title,
  .hero h1 {
    font-size: 33px !important;
    line-height: 1.18;
    letter-spacing: -1.4px;
    margin: 24px 0 16px;
    word-break: keep-all;
  }
  .hero-copy > p {
    font-size: 14px;
    line-height: 1.55;
    padding: 0 8px;
    word-break: keep-all;
  }
  .hero .cta {
    width: 100%;
    max-width: 360px;
    min-width: 0;
    height: 62px;
    margin-top: 560px;
    font-size: 19px;
    border-radius: 14px;
    padding: 0 20px;
  }
  .hero small {
    font-size: 13px;
    margin-top: 16px;
    padding-bottom: 22px;
  }
}

/* v31: exact approved hero composition as visual, clickable CTA overlay */
.hero{min-height:0;height:auto;background:#0b0b0b;overflow:hidden}
.hero__bg,.hero__shade,.hero>.nav,.hero>.hero-copy,.hero::after{display:none!important}
.hero-desktop-visual{display:block;position:relative;width:100%;aspect-ratio:3/2;background:#0b0b0b;overflow:hidden}
.hero-desktop-final-image{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;filter:none;transform:none}
.hero-desktop-cta-hit{position:absolute;left:27%;top:76.8%;width:46%;height:7.8%;border:0;border-radius:18px;background:transparent;cursor:pointer;z-index:3;-webkit-tap-highlight-color:transparent}
.hero-desktop-cta-hit:focus-visible{outline:3px solid rgba(255,255,255,.95);outline-offset:-5px}
.hero-mobile-visual{display:none}

@media (max-width:760px){
  .hero-desktop-visual{display:none}
  .hero-mobile-visual{display:block;position:relative;width:100%;aspect-ratio:944/2048;background:#0b0b0b;overflow:hidden}
  .hero-mobile-final-image{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;filter:none;transform:none}
  .hero-mobile-cta-hit{position:absolute;left:6%;top:82.5%;width:88%;height:8.2%;border:0;border-radius:18px;background:transparent;cursor:pointer;z-index:3;-webkit-tap-highlight-color:transparent}
  .hero-mobile-cta-hit:focus-visible{outline:3px solid rgba(255,255,255,.95);outline-offset:-5px}
}

/* v32: hero image is background only; all copy/CTA remain semantic HTML */
@keyframes heroBgV32 {
  from { opacity:.28; transform:scale(1.035); }
  to { opacity:1; transform:scale(1); }
}

.hero{
  min-height:980px !important;
  height:auto !important;
  position:relative !important;
  overflow:hidden !important;
  background:#0b0b0b !important;
  color:#fff;
}
.hero-desktop-visual,.hero-mobile-visual{display:none !important}
.hero__bg,.hero__shade{display:block !important;position:absolute !important;inset:0 !important}
.hero__bg{
  background-image:url('../assets/images/hero-bg-v32.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  filter:none !important;
  transform:scale(1) !important;
  opacity:1 !important;
  animation:heroBgV32 1.25s ease-out both !important;
}
.hero__shade{
  background:linear-gradient(180deg,rgba(5,5,7,.24) 0%,rgba(5,5,7,.08) 34%,rgba(5,5,7,.06) 64%,rgba(5,5,7,.18) 100%) !important;
  opacity:1 !important;
}
.hero::after{display:block !important;opacity:.35 !important}
.hero>.nav{display:flex !important;position:relative !important;z-index:3 !important}
.hero>.hero-copy{display:block !important;position:relative !important;z-index:3 !important}
.hero-copy{padding-top:34px !important;padding-bottom:72px !important}
.hero .event-pill{background:rgba(18,18,18,.10) !important;backdrop-filter:none !important}
.hero .cta{margin-top:286px !important;min-width:460px}
.hero small{padding-bottom:34px !important}

@media (min-width:1181px){
  .hero h1{font-size:74px !important;line-height:1.13 !important;letter-spacing:-3.4px !important;margin:26px 0 12px !important}
  .hero-copy>p{font-size:21px !important}
}

@media (min-width:761px) and (max-width:1180px){
  .hero{min-height:900px !important}
  .hero__bg{background-position:center center !important}
  .hero h1{font-size:60px !important}
  .hero .cta{margin-top:245px !important}
}

@media (max-width:760px){
  .hero{min-height:100svh !important;height:auto !important}
  .hero__bg{
    display:block !important;
    background-image:url('../assets/images/hero-mobile-bg-v32.png') !important;
    background-size:cover !important;
    background-position:center center !important;
    filter:none !important;
    transform:scale(1) !important;
    animation:heroBgV32 1.2s ease-out both !important;
  }
  .hero__shade{
    display:block !important;
    background:linear-gradient(180deg,rgba(5,5,7,.26) 0%,rgba(5,5,7,.08) 30%,rgba(5,5,7,.05) 62%,rgba(5,5,7,.28) 100%) !important;
  }
  .hero::after{display:block !important;opacity:.25 !important}
  .hero>.nav{display:flex !important;height:auto !important;padding-top:24px !important;justify-content:center !important;gap:12px !important}
  .hero>.hero-copy{display:flex !important;flex-direction:column !important;align-items:center !important;min-height:calc(100svh - 58px) !important;padding:28px 16px 28px !important;text-align:center !important}
  .logo.remember,.logo.ggmj{height:22px !important}
  .nav span{font-size:19px !important}
  .hero .event-pill{font-size:11px !important;padding:9px 14px !important;white-space:nowrap !important}
  .hero-title,.hero h1{font-size:33px !important;line-height:1.18 !important;letter-spacing:-1.35px !important;margin:26px 0 14px !important;word-break:keep-all !important}
  .hero-copy>p{font-size:14px !important;line-height:1.5 !important;padding:0 6px !important;word-break:keep-all !important}
  .hero .cta{width:100% !important;max-width:360px !important;min-width:0 !important;height:62px !important;margin-top:auto !important;font-size:18px !important;border-radius:14px !important;padding:0 18px !important}
  .hero small{font-size:12px !important;margin-top:15px !important;padding-bottom:6px !important}
}

@media (max-width:390px){
  .hero-title,.hero h1{font-size:31px !important}
  .hero .event-pill{font-size:10px !important;padding:8px 12px !important}
  .hero .cta{font-size:17px !important;height:58px !important}
}


/* v33: make the hero subject about 10% smaller and slightly lower so the forehead and handwriting do not compete with the headline */
.hero__bg{
  background-size:90% auto !important;
  background-repeat:no-repeat !important;
  background-position:center 72px !important;
}
.hero-copy{padding-top:40px !important;}
.hero .cta{margin-top:300px !important;}

@media (min-width:1181px){
  .hero{min-height:1000px !important;}
  .hero__bg{background-size:90% auto !important;background-position:center 74px !important;}
  .hero .cta{margin-top:306px !important;}
}

@media (min-width:761px) and (max-width:1180px){
  .hero{min-height:920px !important;}
  .hero__bg{background-size:98% auto !important;background-position:center 86px !important;}
  .hero .cta{margin-top:275px !important;}
}

@media (max-width:760px){
  .hero{min-height:100svh !important;}
  .hero__bg{
    background-size:auto 90% !important;
    background-repeat:no-repeat !important;
    background-position:center 88px !important;
  }
  .hero>.hero-copy{padding:30px 16px 26px !important;}
  .hero-title,.hero h1{margin:28px 0 14px !important;}
  .hero .cta{margin-top:auto !important;}
}

@media (max-width:390px){
  .hero__bg{background-size:auto 88% !important;background-position:center 92px !important;}
}


/* v34 hero rebuild: dedicated desktop/mobile images + object-fit cover + safer copy layout */
@keyframes heroImageInV34 {
  0% { opacity: .68; transform: scale(1.04); }
  100% { opacity: 1; transform: scale(1); }
}

.hero.hero-v34 {
  position: relative !important;
  min-height: 980px !important;
  height: auto !important;
  overflow: hidden !important;
  background: #0b0b0b !important;
  color: #fff !important;
}
.hero.hero-v34::after { display: none !important; }
.hero.hero-v34 .hero-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.hero.hero-v34 .hero-picture,
.hero.hero-v34 .hero-picture source {
  display: block;
  width: 100%;
  height: 100%;
}
.hero.hero-v34 .hero-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 52%;
  animation: heroImageInV34 1.05s ease-out both;
}
.hero.hero-v34 .hero__shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  background: linear-gradient(180deg, rgba(4,4,6,.28) 0%, rgba(4,4,6,.12) 22%, rgba(4,4,6,.10) 55%, rgba(4,4,6,.22) 100%) !important;
}
.hero.hero-v34 .nav,
.hero.hero-v34 .hero-copy {
  position: relative !important;
  z-index: 2 !important;
}
.hero.hero-v34 .nav {
  height: 84px !important;
  padding-top: 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}
.hero.hero-v34 .logo.remember,
.hero.hero-v34 .logo.ggmj {
  height: 26px !important;
  width: auto !important;
}
.hero.hero-v34 .nav span {
  font-size: 22px !important;
  color: #e3ddd7 !important;
}
.hero.hero-v34 .hero-copy {
  text-align: center !important;
  padding-top: 38px !important;
  padding-bottom: 68px !important;
  animation: fadeInUp .85s ease-out .12s both !important;
}
.hero.hero-v34 .event-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 20px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,92,31,.92) !important;
  color: var(--orange) !important;
  background: rgba(15,15,18,.08) !important;
  backdrop-filter: blur(1.5px) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}
.hero.hero-v34 .event-pill em {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: var(--orange) !important;
  display: block !important;
}
.hero.hero-v34 .hero-title,
.hero.hero-v34 h1 {
  max-width: min(1100px, calc(100vw - 88px)) !important;
  margin: 24px auto 14px !important;
  font-size: clamp(54px, 6vw, 82px) !important;
  line-height: 1.08 !important;
  letter-spacing: clamp(-1.6px, -0.22vw, -3.6px) !important;
  font-weight: 800 !important;
  word-break: keep-all !important;
  text-wrap: balance;
}
.hero.hero-v34 .hero-copy > p {
  max-width: 820px !important;
  margin: 0 auto !important;
  font-size: clamp(18px, 1.65vw, 22px) !important;
  line-height: 1.5 !important;
  color: rgba(255,255,255,.92) !important;
}
.hero.hero-v34 .cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 460px !important;
  height: 64px !important;
  margin-top: clamp(250px, 23vw, 330px) !important;
  border-radius: 14px !important;
  padding: 0 42px !important;
  font-size: 20px !important;
  font-weight: 800 !important;
}
.hero.hero-v34 small {
  display: block !important;
  margin-top: 18px !important;
  padding-bottom: 28px !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 15px !important;
}

@media (max-width: 1280px) and (min-width: 761px) {
  .hero.hero-v34 { min-height: 930px !important; }
  .hero.hero-v34 .hero-image { object-position: 50% 54%; }
  .hero.hero-v34 .hero-title,
  .hero.hero-v34 h1 { max-width: min(980px, calc(100vw - 72px)) !important; font-size: clamp(50px, 5.8vw, 72px) !important; }
  .hero.hero-v34 .cta { margin-top: clamp(220px, 22vw, 290px) !important; min-width: 430px !important; }
}

@media (max-width: 980px) and (min-width: 761px) {
  .hero.hero-v34 { min-height: 880px !important; }
  .hero.hero-v34 .hero-image { object-position: 50% 55%; }
  .hero.hero-v34 .hero-copy { padding-top: 34px !important; }
  .hero.hero-v34 .hero-title,
  .hero.hero-v34 h1 { font-size: clamp(46px, 6vw, 62px) !important; max-width: 760px !important; }
  .hero.hero-v34 .hero-copy > p { font-size: 18px !important; max-width: 700px !important; }
  .hero.hero-v34 .cta { margin-top: clamp(180px, 21vw, 230px) !important; min-width: 390px !important; }
}

@media (max-width: 760px) {
  .hero.hero-v34 {
    min-height: 100svh !important;
  }
  .hero.hero-v34 .nav {
    width: calc(100% - 32px) !important;
    margin: 0 auto !important;
    height: auto !important;
    padding-top: 22px !important;
    justify-content: flex-start !important;
    gap: 12px !important;
  }
  .hero.hero-v34 .logo.remember,
  .hero.hero-v34 .logo.ggmj { height: 24px !important; }
  .hero.hero-v34 .nav span { font-size: 20px !important; }
  .hero.hero-v34 .hero-image {
    object-position: 50% 54%;
  }
  .hero.hero-v34 .hero__shade {
    background: linear-gradient(180deg, rgba(4,4,6,.28) 0%, rgba(4,4,6,.12) 18%, rgba(4,4,6,.09) 54%, rgba(4,4,6,.28) 100%) !important;
  }
  .hero.hero-v34 .hero-copy {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    min-height: calc(100svh - 60px) !important;
    width: calc(100% - 32px) !important;
    margin: 0 auto !important;
    padding: 30px 0 26px !important;
    text-align: center !important;
  }
  .hero.hero-v34 .event-pill {
    max-width: 100% !important;
    font-size: 11px !important;
    padding: 9px 14px !important;
    white-space: nowrap !important;
  }
  .hero.hero-v34 .hero-title,
  .hero.hero-v34 h1 {
    max-width: 360px !important;
    font-size: clamp(32px, 9.5vw, 42px) !important;
    line-height: 1.15 !important;
    letter-spacing: -1.3px !important;
    margin: 24px auto 14px !important;
  }
  .hero.hero-v34 .hero-copy > p {
    max-width: 344px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
  }
  .hero.hero-v34 .cta {
    width: min(100%, 360px) !important;
    min-width: 0 !important;
    height: 60px !important;
    margin-top: auto !important;
    font-size: 18px !important;
    padding: 0 18px !important;
  }
  .hero.hero-v34 small {
    margin-top: 14px !important;
    padding-bottom: 6px !important;
    font-size: 12px !important;
  }
}

@media (max-width: 390px) {
  .hero.hero-v34 .event-pill { font-size: 10px !important; padding: 8px 12px !important; }
  .hero.hero-v34 .hero-title,
  .hero.hero-v34 h1 { font-size: 31px !important; }
  .hero.hero-v34 .cta { height: 58px !important; font-size: 17px !important; }
}


/* v35 hero asset loading hardening:
   direct <img> elements with desktop/mobile switch + CSS fallback background.
   This avoids a black hero if a prior picture/source or cached rule fails. */
.hero.hero-v34 .hero-media{
  background-image:url('../assets/images/hero-desktop-v35.jpg?v=35') !important;
  background-size:cover !important;
  background-position:50% 52% !important;
  background-repeat:no-repeat !important;
}
.hero.hero-v34 .hero-image{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  object-position:50% 52% !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
}
.hero.hero-v34 .hero-image--desktop{display:block !important;}
.hero.hero-v34 .hero-image--mobile{display:none !important;}

@media (max-width:1280px) and (min-width:761px){
  .hero.hero-v34 .hero-media{background-position:50% 54% !important;}
  .hero.hero-v34 .hero-image{object-position:50% 54% !important;}
}
@media (max-width:980px) and (min-width:761px){
  .hero.hero-v34 .hero-media{background-position:50% 55% !important;}
  .hero.hero-v34 .hero-image{object-position:50% 55% !important;}
}
@media (max-width:760px){
  .hero.hero-v34 .hero-media{
    background-image:url('../assets/images/hero-mobile-v35.jpg?v=35') !important;
    background-position:50% 54% !important;
  }
  .hero.hero-v34 .hero-image--desktop{display:none !important;}
  .hero.hero-v34 .hero-image--mobile{
    display:block !important;
    object-position:50% 54% !important;
  }
}
