:root{--navy:#101f40;--navy2:#182e58;--gold:#ffd22c;--ink:#14203b;--muted:#59647a;--paper:#f6f8fd}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:#e9edf5;color:var(--ink)}button,input{font:inherit}button{cursor:pointer}a{color:#164a9c}.shell{max-width:1180px;min-height:100vh;margin:auto;background:white;box-shadow:0 5px 50px #15213a15}.topbar{height:94px;background:linear-gradient(120deg,#07132d,#182d55);color:white;display:flex;align-items:center;justify-content:space-between;padding:12px 22px;position:relative;z-index:5}.iconbtn{border:0;background:transparent;color:white;font-size:34px;min-width:44px}.brand{border:0;background:none;color:white;display:flex;align-items:center;gap:12px;text-align:center}.brand strong{display:block;font-size:clamp(23px,4vw,40px);letter-spacing:.02em;line-height:1.15}.brand em{font-style:normal;color:var(--gold)}.brand small{display:block;font-size:clamp(11px,1.7vw,18px);font-weight:400}.bee{font-size:37px;color:var(--gold)}.drawer{position:absolute;z-index:8;top:80px;left:max(0px,calc((100vw - 1180px)/2));background:white;padding:14px;box-shadow:0 10px 25px #101f4033;border-radius:0 0 16px 16px}.drawer button{display:block;width:220px;text-align:left;background:none;border:0;padding:12px;color:var(--ink)}.drawer button:hover{background:#f1f4fb}.hero{min-height:370px;background:radial-gradient(circle at 76% 26%,#e1a06799,transparent 32%),linear-gradient(110deg,#08152d 5%,#1a335bba 60%,#b56e58 120%);color:white;display:flex;align-items:center;padding:45px clamp(22px,5vw,65px);position:relative;overflow:hidden}.hero:after{content:'✦';position:absolute;right:10%;bottom:0;font-size:250px;color:#ffcc3540;transform:rotate(-12deg)}.hero .copy{position:relative;z-index:1;max-width:620px}.eyebrow{font-weight:800;color:var(--gold);letter-spacing:.03em}.hero h1{font-size:clamp(46px,7vw,78px);margin:14px 0 10px;line-height:1.05}.hero p{font-size:clamp(19px,3vw,30px);line-height:1.3;max-width:480px;margin:0 0 24px}.cta{background:var(--gold);color:#151515;border:0;border-radius:40px;padding:15px 25px;font-weight:800;display:inline-flex;gap:12px;align-items:center;text-decoration:none;box-shadow:0 5px 15px #0002}.cta:hover{filter:brightness(.96)}.inner{padding:26px clamp(18px,4vw,44px) 110px}.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tile{border:0;border-radius:23px;min-height:145px;padding:19px 12px;text-align:center;color:#141928;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;transition:transform .15s}.tile:hover{transform:translateY(-3px)}.tile .sym{font-size:39px;line-height:1.2}.tile b{font-size:clamp(16px,2.5vw,23px)}.tile small{font-size:clamp(12px,1.6vw,16px);line-height:1.3}.pink{background:#ffe8e6}.lavender{background:#e6e4ff}.mint{background:#d3f7f2}.lilac{background:#f4e0f6}.cream{background:#fff0d6}.blue{background:#dcecff}.feature{margin-top:24px;border-radius:25px;padding:27px 32px;color:white;background:radial-gradient(circle at 80% 55%,#f5a7c560,transparent 32%),linear-gradient(120deg,#0d1e41,#4055a1 65%,#815f9c);position:relative;overflow:hidden}.feature:after{content:'✿ ✿ ✿';position:absolute;right:12px;top:20px;color:#ffc9dc99;font-size:52px;transform:rotate(24deg)}.feature>*{position:relative;z-index:1}.feature h2{font-size:clamp(26px,4vw,43px);max-width:540px;margin:9px 0}.feature p{font-size:18px;max-width:480px}.pill{display:inline-block;background:var(--gold);color:#181818;border-radius:22px;padding:5px 13px;font-weight:800}.section-title{font-size:clamp(27px,4vw,42px);margin:4px 0 10px}.intro{font-size:17px;color:var(--muted);line-height:1.6;max-width:720px}.panel{background:var(--paper);border:1px solid #e2e7f0;border-radius:20px;padding:22px;margin:22px 0}.panel h2{margin-top:0}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px}.card{border:1px solid #e2e6ee;border-radius:18px;padding:20px;background:white}.card h3{margin:0 0 9px}.card p{line-height:1.55;color:var(--muted)}.card a{font-weight:700}.back{border:0;background:#e9edf6;border-radius:20px;padding:9px 16px;margin-bottom:18px}.choices{display:grid;gap:11px;margin:22px 0}.choice{border:2px solid #dce3ee;background:white;border-radius:14px;text-align:left;padding:15px 17px}.choice:hover,.choice:focus{border-color:#c8a100;background:#fffbe4}.progress{height:8px;background:#dfe5ef;border-radius:20px;overflow:hidden}.progress div{height:100%;background:var(--gold);transition:width .2s}.tag{font-size:13px;color:#6d7687}.result{background:#101f40;color:white;border-radius:20px;padding:28px}.result h2{color:var(--gold)}.field{width:100%;padding:15px;border:1px solid #bdc8da;border-radius:13px;margin:12px 0}.checkrow{display:flex;align-items:flex-start;gap:11px;padding:12px 0;border-bottom:1px solid #e2e7f0}.checkrow input{width:20px;height:20px;accent-color:#d5a600}.notice{font-size:13px;line-height:1.6;color:#626d80}.footer{padding:30px 22px;text-align:center;background:#f4f6fa;color:#697488;font-size:13px}.bottomnav{position:sticky;bottom:0;z-index:6;background:var(--navy);display:grid;grid-template-columns:repeat(6,1fr);padding:10px 7px max(10px,env(safe-area-inset-bottom));box-shadow:0 -5px 20px #07142d25}.bottomnav button{background:none;border:0;color:white;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:13px;padding:6px 2px}.bottomnav button span{font-size:27px;line-height:1}.bottomnav button.active{color:var(--gold)}#toast{position:fixed;bottom:92px;left:50%;transform:translateX(-50%);background:#142849;color:white;padding:10px 20px;border-radius:20px;display:none;z-index:20}@media(max-width:600px){.topbar{height:77px;padding:8px 12px}.brand{gap:4px}.bee{font-size:26px}.brand strong{font-size:25px}.brand small{font-size:11px}.iconbtn{font-size:27px}.hero{min-height:310px;padding:30px 24px}.hero:after{font-size:170px;right:-10%}.hero h1{font-size:50px}.hero p{font-size:21px}.inner{padding:17px 14px 20px}.tiles{gap:9px}.tile{border-radius:16px;min-height:128px;padding:9px 5px}.tile .sym{font-size:29px}.tile b{font-size:15px}.tile small{font-size:11px}.feature{padding:23px 20px}.feature p{font-size:15px}.cards{grid-template-columns:1fr}.bottomnav button{font-size:11px}.bottomnav button span{font-size:23px}}@media(max-width:350px){.brand strong{font-size:20px}.bee{display:none}.tile b{font-size:13px}}

/* V2: stable mobile layout, locally hosted imagery, SVG icons */
html{scroll-behavior:smooth}body{overflow-x:hidden}.shell{padding-bottom:78px}.topbar{position:sticky;top:0;z-index:10}.hero{background:linear-gradient(90deg,rgba(6,16,37,.94) 0%,rgba(6,16,37,.65) 52%,rgba(6,16,37,.16) 100%),url('assets/korea-night.png') center/cover no-repeat;min-height:400px}.hero:after{display:none}.feature{background:linear-gradient(90deg,rgba(7,18,48,.94),rgba(36,42,90,.62)),url('assets/korea-night.png') center/cover no-repeat}.feature:after{display:none}.bottomnav{position:fixed;left:50%;transform:translateX(-50%);width:min(100%,1180px);bottom:0;z-index:12;min-height:70px}.bottomnav .navsvg{display:block;width:25px;height:25px}.bottomnav button span{height:28px;display:flex;align-items:center;justify-content:center}.drawer[hidden]{display:none}.tile{box-shadow:0 3px 12px #16213b09}.tile:focus-visible,.bottomnav button:focus-visible,.cta:focus-visible{outline:3px solid #d4a900;outline-offset:2px}@media(max-width:600px){.shell{padding-bottom:72px}.topbar{height:78px}.hero{min-height:350px;background-position:55% center}.hero h1{font-size:clamp(43px,11vw,58px)}.bottomnav{min-height:68px}.bottomnav .navsvg{width:23px;height:23px}.tile .sym{font-size:27px}}

/* v3: exact photographic portions of user-approved mockup, without baked-in interface text */
.hero{background-image:linear-gradient(90deg,#091831 0%,#091831 28%,rgba(9,24,49,.94) 43%,rgba(9,24,49,.28) 78%),url('assets/mockup-hero-photo.webp');background-position:center,right center;background-size:cover,auto 100%;background-repeat:no-repeat;min-height:420px}
.feature{background-image:linear-gradient(90deg,#111d43 0%,rgba(17,29,67,.94) 35%,rgba(17,29,67,.2) 80%),url('assets/mockup-seoul-photo.webp');background-position:center,right center;background-size:cover,auto 100%;background-repeat:no-repeat;min-height:280px;display:flex;flex-direction:column;justify-content:center}
.hero .copy{max-width:52%}.hero h1{font-size:clamp(42px,6vw,75px)}.hero p{font-size:clamp(17px,2.3vw,27px)}
@media(max-width:600px){.hero{min-height:350px;background-position:center,right center;background-size:cover,auto 100%;padding:26px 18px}.hero .copy{max-width:63%}.hero h1{font-size:clamp(32px,9vw,53px);overflow-wrap:anywhere}.hero p{font-size:clamp(15px,4vw,20px)}.hero .cta{padding:12px 15px;font-size:13px}.feature{min-height:250px;background-position:center,right center;background-size:cover,auto 100%}.feature h2{max-width:66%;font-size:clamp(23px,6vw,32px)}.feature p{max-width:65%;font-size:14px}.feature .cta{align-self:flex-start;font-size:13px;padding:12px 16px}}
/* v4: portrait-first iPhone hero. Keep the subject visible above the copy. */
@media (max-width:600px){
  .hero{min-height:470px;display:flex;align-items:flex-end;padding:245px 20px 24px;background-image:linear-gradient(to bottom,rgba(5,17,37,.02) 0%,rgba(5,17,37,.02) 34%,rgba(5,17,37,.35) 53%,rgba(5,17,37,.96) 77%,#07172f 100%),url('assets/mockup-hero-photo.webp');background-size:100% 100%,auto 335px;background-position:center top,right top;background-repeat:no-repeat;background-color:#07172f}
  .hero .copy{max-width:100%;width:100%;text-shadow:0 1px 3px #07172f88}
  .hero .eyebrow{font-size:13px}
  .hero h1{font-size:clamp(37px,10vw,48px);margin:8px 0}
  .hero p{font-size:clamp(15px,4vw,18px);max-width:340px;margin-bottom:14px}
  .hero .cta{font-size:14px;padding:12px 18px}
  .inner{padding-top:14px}
}
@media (max-width:380px){.hero{min-height:450px;padding-top:232px;background-size:100% 100%,auto 318px}}
@media (min-width:601px){.hero{background-image:linear-gradient(90deg,#091831 0%,rgba(9,24,49,.95) 30%,rgba(9,24,49,.35) 65%,rgba(9,24,49,.02) 100%),url('assets/mockup-hero-photo.webp');background-position:center,right center;background-size:cover,auto 100%}}
