
:root{--navy:#082454;--blue:#0c5ed6;--ink:#0b285a;--body:#64738d;--line:#e0e8f3;--soft:#f3f7fe;--green:#09a94e;--shadow:0 9px 28px rgba(11,49,104,.055)}
*,*::before,*::after{box-sizing:border-box}
html{background:#edf2f8;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:Montserrat,system-ui,-apple-system,sans-serif;color:var(--navy);font-size:15px}
button,input,select{font:inherit}button{cursor:pointer}a{color:inherit}input{min-width:0;appearance:none}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #78b7fd;outline-offset:3px}
[hidden]{display:none!important}
.site-shell{width:100%;max-width:440px;min-height:100svh;margin:auto;background:#fff;display:flex;flex-direction:column;box-shadow:0 18px 50px #0b254315;overflow:hidden}
.site-header{width:100%;padding:16px 18px 13px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#fff}
.identity{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;line-height:1.12;letter-spacing:-.035em;white-space:nowrap}
.logo-house{width:31px;height:34px;color:#0e5dd0;flex:none}
.area-label{display:flex;align-items:center;gap:5px;background:#f3f6fb;border-radius:50px;padding:9px 10px;font-size:9px;line-height:1.1;white-space:nowrap}
.area-label .pin{color:#1463cc;font-size:11px}.area-label small{display:block;font-size:8.5px;color:#718097;font-weight:500;margin-top:3px}
main{flex:1;width:100%}.screen{animation:enter .32s cubic-bezier(.2,.65,.25,1) both;width:100%}
@keyframes enter{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.progress-region{padding:5px 20px 11px}.progress-row{display:flex;justify-content:space-between;align-items:center;color:#7c8aa1;font-size:11px;font-weight:600;margin-bottom:7px}.progress-track{background:#e8ebf1;height:7px;border-radius:10px;overflow:hidden}.progress-fill{width:0;height:100%;border-radius:inherit;background:linear-gradient(100deg,#0871e9,#1954bd);transition:width .35s ease}
/* Approved creative is rebuilt from native elements, not placed as one picture. */
.landing-content{padding:8px 20px 0}.micro-label,.eyebrow{display:inline-flex;align-items:center;gap:6px;border-radius:10px;background:#e9f1ff;color:#0d5dbf;font-size:10.5px;font-weight:800;padding:8px 11px}.micro-dot{width:6px;height:6px;border-radius:100%;background:#0e64d8}
h1{font-size:clamp(29px,7.6vw,37px);font-weight:800;line-height:1.075;letter-spacing:-.057em;margin:13px 0 10px;color:var(--navy)}h1 em{font-style:normal;color:#1760c7}
.landing-text p{color:#354b6b;font-size:13px;line-height:1.48;margin:0 0 14px}.landing-text strong{color:var(--navy)}
.hero-photo{position:relative;height:clamp(205px,28svh,280px);border-radius:20px;overflow:hidden;background:#ddc3ac}.hero-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 16%}.hero-photo .photo-label{position:absolute;bottom:12px;left:12px;padding:7px 10px;font-size:10px;font-weight:700;color:#133260;background:#fffE;border-radius:10px;box-shadow:0 5px 18px #0002}
.landing-action{padding-top:12px}.btn{width:100%;border:0;border-radius:17px;min-height:56px;padding:13px 15px;display:flex;align-items:center;justify-content:center;gap:9px;text-align:center;text-decoration:none;font-size:12px;font-weight:800;line-height:1.3;letter-spacing:-.019em;transition:transform .16s,filter .16s}.btn:active,.option:active{transform:scale(.985)}.btn-primary{background:linear-gradient(100deg,#086bf0,#1950b1);border:1px solid #7da6e9;color:#fff;box-shadow:0 9px 20px #1954ab25}.btn span{font-size:21px}.btn-whatsapp{background:#0bad53;color:#fff;margin:18px 0 8px}.btn-outline{background:#fff;border:1px solid #8abafc;color:#0f5ed1;margin:15px 0}.buyer-inline{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;margin-top:4px;text-decoration:none;color:#0e5bc9;font-size:11px;font-weight:700}.buyer-inline span{font-size:15px}
.trust-strip{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:6px 20px 12px;color:#586982;font-size:10px}.trust-strip>div{display:flex;align-items:center;gap:5px}.trust-strip>div:last-child{grid-column:span 2}.trust-strip span{color:#1164d2;font-size:14px;font-weight:800}
.under-hero{background:linear-gradient(#fff,#f7faff);text-align:center;padding:19px 20px 0}.under-hero h2{margin:0 0 5px;font-size:18px;letter-spacing:-.03em}.under-hero p{color:#667793;font-size:11px;line-height:1.5;margin:0 0 10px}.under-hero img{display:block;width:100%;height:68px;object-fit:cover;object-position:center bottom;opacity:.65}
/* Each screen has a scrollable, mobile-height composition. */
.step-screen,.completion,.exit-screen,.faq-screen{padding:14px 20px 26px;min-height:calc(100svh - 140px)}
.step-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px}.small-visual{width:111px;height:111px;flex:none;overflow:hidden;border-radius:18px;background:#ede1d8}.small-visual img{width:100%;height:100%;object-fit:cover;object-position:center 31%}.small-visual.agent-visual img{object-position:center 20%}
.step-screen h2,.completion h2,.exit-screen h2,.faq-screen h2{font-weight:800;font-size:clamp(27px,7.6vw,34px);line-height:1.1;letter-spacing:-.055em;margin:13px 0 11px}.step-lead,.exit-screen>p,.faq-screen>.step-lead{font-size:13px;line-height:1.55;color:var(--body);margin:0 0 19px}
.option-stack{display:grid;gap:11px}.option{font-family:inherit;display:flex;align-items:center;gap:12px;width:100%;padding:13px 12px;min-height:83px;background:#fff;border:1px solid #e2e9f3;border-radius:18px;box-shadow:var(--shadow);color:var(--navy);text-decoration:none;text-align:left}.option:first-child{background:#f2f7ff;border-color:#b5d4ff}.option-icon{width:43px;height:43px;border-radius:50%;display:grid;place-items:center;background:#e6efff;color:#0a61d0;flex:none;font-size:26px}.option-icon.gray{background:#eff2f7;color:#5d6f8a}.option-text{flex:1;min-width:0}.option-text strong{font-size:13px;line-height:1.35;display:block}.option-text small{display:block;margin-top:4px;color:#6a7890;font-size:10.5px;line-height:1.4}.option-arrow{font-size:22px;color:#0e64d7}.tight{gap:9px}.tight .option{min-height:66px;padding:9px 12px}.tight .option-icon{width:38px;height:38px;font-size:23px}
.helper-note{border-radius:13px;background:#f5f7fb;color:#6d7c93;font-size:11px;line-height:1.5;padding:12px;margin:15px 0}.back{display:block;margin:15px auto 0;min-height:44px;padding:8px 16px;border:0;background:transparent;color:#68788e;font-size:13px;font-weight:600}
label{display:block;margin:15px 0 7px;font-size:12.5px;font-weight:700}input{width:100%;height:54px;padding:0 16px;border:1px solid #d9e4f2;border-radius:13px;background:#fff;color:#0a2650;font-size:16px}input::placeholder{color:#9ba7b9}.form-submit{margin-top:22px}.field-error{color:#ae2e42;font-size:11px;font-weight:700}.privacy-notice{background:#f2f7ff;border-radius:12px;padding:11px;margin:15px 0 0;color:#5d708b;font-size:10.5px;line-height:1.5}.privacy-notice span{font-size:15px;color:#0d60d0}
.success-mark{width:56px;height:56px;border-radius:50%;background:#e2f7e9;color:#069549;display:grid;place-items:center;font-size:28px;font-weight:800;margin:10px 0}.success-mark.small{background:#e9f2ff;color:#0d5dd4}.summary{background:#f1f7ff;border:1px solid #d7e7fc;border-radius:17px;padding:14px 18px;font-size:12px;line-height:1.85;color:#586981}.summary b{font-size:14px;color:var(--navy)}.heart{border-radius:50%;display:grid;place-items:center;background:#ffedf1;color:#ef4d70;font-size:26px;width:54px;height:54px;margin:5px 0 15px}.exit-photo{width:106px;height:133px;border-radius:16px;float:right;overflow:hidden;margin:0 0 10px 14px}.exit-photo img{width:100%;height:100%;object-fit:cover;object-position:center 19%}.exit-screen h3{clear:both;font-size:15px;margin:21px 0 12px}.exit-screen .option{margin:10px 0}.exit-screen .helper-note{clear:both}.faq-screen details{padding:15px;border:1px solid #dce6f3;border-radius:15px;margin:9px 0}.faq-screen summary{font-weight:700;font-size:12px;line-height:1.45;cursor:pointer}.faq-screen details p{color:var(--body);line-height:1.5;font-size:11px}
.site-footer{text-align:center;font-size:9px;line-height:1.5;color:#8490a4;padding:10px 19px 19px;margin:auto 0 0}
@media(max-width:359px){.site-header{padding:13px 12px}.identity{font-size:12px;gap:5px}.logo-house{width:26px}.area-label{font-size:8px;padding:8px}.area-label small{font-size:7.5px}.landing-content,.step-screen,.completion,.exit-screen,.faq-screen{padding-left:14px;padding-right:14px}.landing-text p{font-size:12px}h1{font-size:27px}.hero-photo{height:clamp(150px,25svh,200px)}.step-screen h2{font-size:26px}.trust-strip{padding-left:14px}}
@media(max-height:730px) and (max-width:500px){h1{font-size:29px;margin:10px 0 8px}.landing-text p{font-size:12px;margin:0 0 10px}.hero-photo{height:clamp(185px,27svh,225px)}.landing-action{padding-top:9px}.btn{min-height:54px}.micro-label{padding:6px 9px}.site-header{padding-top:12px;padding-bottom:9px}}
@media(min-width:700px){.site-shell{margin:24px auto;min-height:min(900px,calc(100svh - 48px));border-radius:30px;box-shadow:0 20px 65px #0b25431c}.site-footer{margin-top:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

select{width:100%;height:54px;border:1px solid #d9e4f2;border-radius:13px;padding:0 16px;background:#fff;color:#092658;font-size:15px;font-weight:600}

/* Final mobile-first interaction polish */
.option{transition:border-color .18s ease,background-color .18s ease,transform .15s ease,box-shadow .18s ease}
.option:hover{border-color:#9dbfe9}
.option.is-selected{border-color:#1164d2;background:#eaf3ff;box-shadow:0 6px 24px #135fc326}
.screen h1:focus,.screen h2:focus{outline:none}
@media(max-width:500px){.site-shell{box-shadow:none}.option{touch-action:manipulation}.btn{touch-action:manipulation}}
@media(prefers-reduced-motion:reduce){.option{transition:none}}

/* Return to the home screen from every inner step; swaps with the region label. */
.home-nav{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:none;min-height:42px;padding:8px 12px;border:1px solid #bfd5f2;border-radius:14px;background:#f2f7ff;color:#0d59bf;font-size:12px;font-weight:800;line-height:1;transition:background .18s,transform .18s}
.home-nav svg{width:19px;height:19px;flex:none}.home-nav:hover{background:#e5efff}.home-nav:active{transform:scale(.97)}
@media(max-width:359px){.home-nav{padding:7px 9px;font-size:11px;min-height:40px}.home-nav svg{width:17px;height:17px}}
