.hatyai-android-page{background:#fff;color:#182b28;letter-spacing:0}
.hatyai-android-page *{box-sizing:border-box;letter-spacing:0}
.ha-hero{position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 82% 28%,#24403c 0,transparent 34%),radial-gradient(circle at 20% 80%,#24244c 0,transparent 40%),#0c1127}
.ha-hero::after{content:"";position:absolute;inset:auto -8% -160px 45%;height:300px;border-radius:50%;background:#65d99a14;filter:blur(45px);pointer-events:none}
.ha-breadcrumb{position:relative;z-index:1;display:flex;align-items:center;gap:12px;padding:30px 0;color:#a9b8c8;font-size:13px}
.ha-breadcrumb a{color:#d5e0e8;text-decoration:none}
.ha-breadcrumb a:hover{text-decoration:underline}
.ha-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:center;gap:clamp(24px,5vw,76px);min-height:600px;padding:12px 0 72px}
.ha-hero-copy{max-width:680px}
.ha-eyebrow,.ha-kicker{margin:0 0 18px;font-size:12px;font-weight:700;letter-spacing:.12em!important;text-transform:uppercase}
.ha-eyebrow{display:flex;align-items:center;gap:9px;color:#a9edc3}
.ha-eyebrow-dot{width:8px;height:8px;border-radius:50%;background:#81efac;box-shadow:0 0 0 6px #81efac22}
.ha-hero h1{margin:0;font-size:clamp(42px,5vw,68px);line-height:1.13;letter-spacing:-.035em!important;font-weight:700}
.ha-hero h1 span{color:#a5efbd}
.ha-lead{max-width:570px;margin:26px 0 0;color:#c8d3df;font-size:clamp(16px,1.6vw,19px);line-height:1.85}
.ha-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hatyai-android-page .ha-button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:54px;padding:13px 20px;border:1px solid transparent;border-radius:11px;text-decoration:none;font-size:15px;font-weight:700;line-height:1.35;transition:transform .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease}
.hatyai-android-page .ha-button:hover{transform:translateY(-2px)}
.ha-button span{font-size:20px;line-height:1}
.hatyai-android-page .ha-button-primary{background:#a3edbb;color:#103326;box-shadow:0 10px 30px #071b1b44}
.hatyai-android-page .ha-button-primary:hover{background:#c1f7d0;box-shadow:0 14px 35px #071b1b55}
.hatyai-android-page .ha-button-secondary{border-color:#52627a;background:#ffffff0a;color:#f4f8fa}
.hatyai-android-page .ha-button-secondary:hover{border-color:#a3edbb;background:#ffffff14}
.ha-destination{max-width:560px;margin:14px 0 0;color:#aebcc8;font-size:12px;line-height:1.7}
.ha-quick-points{display:flex;flex-wrap:wrap;gap:9px;list-style:none;padding:0;margin:34px 0 0}
.ha-quick-points li{border:1px solid #53677b;border-radius:999px;padding:8px 13px;color:#d9e4e4;font-size:12px;font-weight:500}
.ha-visual{position:relative;min-height:540px;isolation:isolate}
.ha-visual-halo{position:absolute;left:50%;top:47%;width:470px;height:470px;max-width:100%;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#5ace9b34 0,#3c7d8540 32%,transparent 68%);filter:blur(8px);z-index:-1}
.ha-phone{position:absolute;aspect-ratio:360/638;overflow:hidden;border:6px solid #202b37;border-radius:29px;background:#0c131b;box-shadow:0 35px 70px #02080d88,0 0 0 1px #ffffff33}
.ha-phone img{position:absolute;display:block;width:464.45%;max-width:none;height:auto;left:50%;top:54.2%;transform:translate(-50%,-50%)}
.ha-phone-light{width:min(48%,230px);left:1%;top:55px;transform:rotate(-10deg);opacity:.92;z-index:1}
.ha-phone-dark{width:min(58%,292px);right:4%;top:5px;transform:rotate(7deg);z-index:2}
.ha-visual-caption{position:absolute;right:3%;bottom:8px;color:#beced2;font-size:12px}
.ha-section{padding:88px 0}
.ha-section-heading{display:flex;align-items:end;justify-content:space-between;gap:36px;margin-bottom:32px}
.ha-kicker{color:#247b58;margin-bottom:13px}
.ha-section h2,.ha-bottom h2{margin:0;font-size:clamp(30px,3.2vw,44px);line-height:1.25}
.ha-section-heading>p{max-width:350px;margin:0 0 4px;color:#60746d;line-height:1.75}
.ha-features{background:#f6f9f7}
.ha-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ha-feature{min-width:0;padding:30px;border:1px solid #dce8df;border-radius:18px;background:#fff;box-shadow:0 16px 32px #1039230a}
.ha-feature-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;background:#e6f7eb;color:#1d7652;font-size:17px;font-weight:700}
.ha-feature h3{margin:24px 0 9px;color:#18372a;font-size:21px;line-height:1.35}
.ha-feature p{margin:0;color:#61736a;font-size:15px;line-height:1.75}
.ha-steps-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,7vw,110px)}
.ha-steps-intro>p:not(.ha-kicker){max-width:380px;color:#61736a;line-height:1.8}
.ha-steps-intro>a{display:inline-flex;gap:9px;margin-top:12px;color:#217454;font-weight:700;text-decoration:none}
.ha-steps-intro>a:hover{text-decoration:underline}
.ha-step-list{list-style:none;padding:0;margin:0}
.ha-step-list li{display:grid;grid-template-columns:54px minmax(0,1fr);gap:20px;padding:23px 0;border-bottom:1px solid #e1e9e3}
.ha-step-list li:first-child{padding-top:0}
.ha-step-list li:last-child{border-bottom:0}
.ha-step-list li>span{color:#257953;font-size:18px;font-weight:700}
.ha-step-list h3{margin:0 0 7px;font-size:19px;line-height:1.35}
.ha-step-list p{margin:0;color:#61736a;font-size:15px;line-height:1.75}
.ha-bottom{padding:54px 0;background:linear-gradient(110deg,#10241e,#123b2d);color:#fff}
.ha-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.ha-bottom .ha-kicker{color:#9eedb8;margin-bottom:10px}
.ha-bottom p:last-child{margin:12px 0 0;color:#cbdbd2;line-height:1.7}
.hatyai-android-page a:focus-visible{outline:3px solid #7bdc9c;outline-offset:4px}
@media(max-width:1000px){.ha-hero-grid{grid-template-columns:minmax(0,1fr);gap:8px;padding-bottom:40px}.ha-hero-copy{max-width:750px}.ha-visual{width:min(100%,620px);min-height:530px;margin:0 auto}.ha-phone-light{left:12%}.ha-phone-dark{right:12%}}
@media(max-width:700px){.ha-breadcrumb{padding:22px 0}.ha-hero-grid{padding:8px 0 45px}.ha-hero h1{font-size:clamp(34px,8vw,48px)}.ha-lead{margin-top:20px;font-size:16px}.ha-actions{margin-top:25px}.ha-visual{min-height:445px}.ha-phone{border-width:5px;border-radius:22px}.ha-phone-light{width:38%;left:9%;top:65px}.ha-phone-dark{width:50%;right:9%;top:12px}.ha-visual-caption{bottom:5px;right:9%}.ha-section{padding:64px 0}.ha-section-heading{display:block}.ha-section-heading>p{margin-top:12px}.ha-feature-grid{grid-template-columns:1fr;gap:12px}.ha-feature{padding:24px}.ha-feature h3{margin-top:16px}.ha-steps-grid{grid-template-columns:1fr;gap:30px}.ha-bottom-inner{display:block}.ha-bottom .ha-button{margin-top:22px}}
@media(max-width:430px){.ha-hero h1{font-size:36px}.ha-actions{display:grid;grid-template-columns:1fr}.hatyai-android-page .ha-button{width:100%;font-size:14px}.ha-quick-points{margin-top:25px}.ha-visual{min-height:370px}.ha-phone-light{width:42%;left:3%;top:48px}.ha-phone-dark{width:55%;right:14%;top:4px}.ha-visual-caption{right:14%;font-size:11px}.ha-feature-grid{gap:10px}.ha-step-list li{grid-template-columns:42px minmax(0,1fr);gap:12px}}
@media(prefers-reduced-motion:reduce){.hatyai-android-page .ha-button{transition:none}.hatyai-android-page .ha-button:hover{transform:none}}