/* Public home page (index.php): gateway info, contact, policies and the sign-in popup.
   Colours come from the logo: sky blue #00aeef -> indigo #2e3192, dark grey text #363435. */
.gw-site {
    --l1: #00aeef;
    --l2: #2e3192;
    --ink: #1f2433;
    --muted: #5b6475;
    --line: #e7ebf3;
    --soft: #f4f7fd;
    --wa: #25d366;
    margin: 0;
    background: #fff;
    color: var(--ink);
    font-family: "Source Sans Pro", "Segoe UI", Roboto, Arial, sans-serif;
    overflow-x: hidden;
    scroll-behavior: smooth;
}
.gw-site a { text-decoration: none; }
.gw-wrap { width: 1160px; max-width: calc(100% - 32px); margin: 0 auto; }
.gw-grad-text { background: linear-gradient(90deg, var(--l1), var(--l2)); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- top bar ---------- */
.gw-nav { position: sticky; top: 0; z-index: 1000; background: rgba(255, 255, 255, .9); backdrop-filter: blur(8px); border-bottom: 1px solid transparent; transition: border-color .2s, box-shadow .2s; }
.gw-nav.is-scrolled { border-bottom-color: var(--line); box-shadow: 0 6px 20px rgba(31, 36, 51, .06); }
.gw-nav .gw-wrap { display: flex; align-items: center; gap: 24px; height: 72px; }
.gw-nav-logo img { height: 46px; width: auto; display: block; }
.gw-nav-links { display: flex; gap: 22px; margin-left: auto; }
.gw-nav-links a { color: var(--ink); font-weight: 600; font-size: 15px; position: relative; padding: 6px 0; }
.gw-nav-links a:after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 2px; background: linear-gradient(90deg, var(--l1), var(--l2)); transition: right .25s; }
.gw-nav-links a:hover { color: var(--l2); }
.gw-nav-links a:hover:after { right: 0; }
.gw-nav-actions { display: flex; gap: 10px; align-items: center; }
.gw-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: 44px; padding: 0 22px; border-radius: 12px; border: 0;
    font-weight: 700; font-size: 15px; cursor: pointer; white-space: nowrap;
    transition: transform .15s ease, box-shadow .2s, background-position .5s, background .2s, color .2s;
}
.gw-btn:hover { transform: translateY(-1px); }
.gw-btn-main { color: #fff !important; background: linear-gradient(90deg, var(--l1), var(--l2), var(--l1)); background-size: 200% 100%; box-shadow: 0 10px 22px rgba(46, 49, 146, .25); }
.gw-btn-main:hover { background-position: 100% 0; }
.gw-btn-line { color: var(--l2) !important; background: #fff; box-shadow: inset 0 0 0 2px #d9def0; }
.gw-btn-line:hover { box-shadow: inset 0 0 0 2px var(--l2); }
.gw-btn-white { color: var(--l2) !important; background: #fff; box-shadow: 0 10px 22px rgba(0, 0, 0, .12); }
.gw-btn-glass { color: #fff !important; background: rgba(255, 255, 255, .14); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .7); }
.gw-btn-glass:hover { background: rgba(255, 255, 255, .24); }
.gw-burger { display: none; margin-left: auto; width: 44px; height: 44px; border: 0; border-radius: 12px; background: var(--soft); color: var(--l2); font-size: 20px; }

/* ---------- hero ---------- */
.gw-hero { position: relative; overflow: hidden; padding: 70px 0 90px; background: linear-gradient(140deg, #f2fbff 0%, #f5f6ff 55%, #ffffff 100%); }
.gw-hero:before, .gw-hero:after { content: ""; position: absolute; border-radius: 50%; filter: blur(10px); z-index: 0; }
.gw-hero:before { width: 520px; height: 520px; right: -160px; top: -160px; background: radial-gradient(circle, rgba(0, 174, 239, .20), transparent 65%); animation: gw-drift 14s ease-in-out infinite; }
.gw-hero:after { width: 460px; height: 460px; left: -180px; bottom: -220px; background: radial-gradient(circle, rgba(46, 49, 146, .16), transparent 65%); animation: gw-drift 16s ease-in-out infinite reverse; }
@keyframes gw-drift { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-30px, 24px); } }
.gw-hero .gw-wrap { position: relative; z-index: 1; display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items: center; }
.gw-pill { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 30px; background: #fff; box-shadow: 0 4px 14px rgba(46, 49, 146, .10); font-weight: 700; font-size: 13px; color: var(--l2); }
.gw-pill .fa { color: var(--wa); }
.gw-hero h1 { font-size: 50px; line-height: 1.12; font-weight: 800; margin: 18px 0 16px; letter-spacing: -.5px; }
.gw-hero p.lead { font-size: 18px; color: var(--muted); max-width: 560px; margin-bottom: 28px; }
.gw-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.gw-hero-points { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 26px; color: var(--muted); font-weight: 600; font-size: 14px; }
.gw-hero-points .fa { color: var(--l1); margin-right: 6px; }
.gw-reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .8, .2, 1); }
.gw-reveal.is-in { opacity: 1; transform: none; }

/* phone with a WhatsApp chat */
.gw-phone { position: relative; width: 300px; margin: 0 auto; border-radius: 38px; padding: 12px; background: #11131a; box-shadow: 0 40px 80px rgba(46, 49, 146, .30); animation: gw-float-phone 6s ease-in-out infinite; }
@keyframes gw-float-phone { 0%, 100% { transform: translateY(0) rotate(-1.5deg); } 50% { transform: translateY(-12px) rotate(1deg); } }
.gw-phone-screen { border-radius: 28px; overflow: hidden; background: #efeae2; height: 520px; display: flex; flex-direction: column; }
.gw-phone-top { background: #075e54; color: #fff; padding: 16px 14px 12px; display: flex; align-items: center; gap: 10px; }
.gw-phone-top .gw-av { width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, var(--l1), var(--l2)); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; }
.gw-phone-top b { display: block; font-size: 14px; }
.gw-phone-top small { opacity: .8; font-size: 11px; }
.gw-phone-top .fa-check-circle { color: #34b7f1; margin-left: 3px; }
.gw-phone-chat { flex: 1; padding: 14px 12px; display: flex; flex-direction: column; gap: 9px; }
.gw-bubble { max-width: 82%; padding: 8px 11px 6px; border-radius: 10px; font-size: 13px; line-height: 1.35; box-shadow: 0 1px 1px rgba(0, 0, 0, .1); opacity: 0; transform: translateY(10px) scale(.96); animation: gw-chat-loop 12s infinite; }
.gw-bubble small { display: block; text-align: right; font-size: 10px; color: #667781; margin-top: 2px; }
.gw-bubble small .fa { color: #53bdeb; }
.gw-b-in { align-self: flex-start; background: #fff; border-top-left-radius: 2px; }
.gw-b-out { align-self: flex-end; background: #d9fdd3; border-top-right-radius: 2px; }
.gw-b-file { display: flex; gap: 8px; align-items: center; }
.gw-b-file .fa-file-pdf-o { font-size: 22px; color: #e5484d; }
.gw-bubble:nth-child(1) { animation-delay: 0s; }
.gw-bubble:nth-child(2) { animation-delay: .9s; }
.gw-bubble:nth-child(3) { animation-delay: 1.8s; }
.gw-bubble:nth-child(4) { animation-delay: 2.7s; }
.gw-bubble:nth-child(5) { animation-delay: 3.6s; }
@keyframes gw-chat-loop {
    0% { opacity: 0; transform: translateY(10px) scale(.96); }
    4%, 88% { opacity: 1; transform: none; }
    96%, 100% { opacity: 0; transform: none; }
}
.gw-phone-input { margin: 0 10px 12px; background: #fff; border-radius: 22px; padding: 9px 14px; color: #8696a0; font-size: 13px; display: flex; justify-content: space-between; }
.gw-phone-input .fa-paper-plane { color: #075e54; }
.gw-float-card { position: absolute; background: #fff; border-radius: 14px; padding: 10px 14px; box-shadow: 0 14px 30px rgba(31, 36, 51, .14); display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; animation: gw-bob 5s ease-in-out infinite; }
.gw-float-card small { display: block; font-weight: 500; color: var(--muted); font-size: 11px; }
.gw-float-card .gw-fc-ico { width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 17px; }
.gw-fc-1 { left: -70px; bottom: 64px; }
.gw-fc-1 .gw-fc-ico { background: linear-gradient(135deg, #0866ff, #7b2ff7); }
.gw-fc-2 { right: -48px; top: 44px; animation-delay: -2.5s; }
.gw-fc-2 .gw-fc-ico { background: linear-gradient(135deg, #fb923c, #ea580c); }
@keyframes gw-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* ---------- strip ---------- */
.gw-strip { background: linear-gradient(90deg, var(--l2), #1b5fb8, var(--l1)); color: #fff; }
.gw-strip .gw-wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding: 26px 0; }
.gw-strip-item { display: flex; gap: 12px; align-items: center; }
.gw-strip-item .fa { width: 44px; height: 44px; border-radius: 12px; background: rgba(255, 255, 255, .16); display: flex; align-items: center; justify-content: center; font-size: 20px; flex: 0 0 44px; }
.gw-strip-item b { display: block; font-size: 15px; }
.gw-strip-item span { font-size: 13px; opacity: .85; }

/* ---------- sections ---------- */
.gw-sec { padding: 84px 0; }
.gw-sec-soft { background: var(--soft); }
.gw-sec-head { text-align: center; max-width: 700px; margin: 0 auto 46px; }
.gw-sec-head .gw-kicker { display: inline-block; font-weight: 800; font-size: 13px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--l1); margin-bottom: 10px; }
.gw-sec-head h2 { font-size: 36px; font-weight: 800; margin: 0 0 12px; letter-spacing: -.3px; }
.gw-sec-head p { color: var(--muted); font-size: 17px; margin: 0; }

.gw-grid { display: grid; gap: 20px; }
.gw-grid-3 { grid-template-columns: repeat(3, 1fr); }
.gw-grid-4 { grid-template-columns: repeat(4, 1fr); }
.gw-card { background: #fff; border-radius: 18px; padding: 26px 24px; border: 1px solid var(--line); transition: transform .25s ease, box-shadow .25s ease, border-color .25s; }
.gw-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(46, 49, 146, .12); border-color: transparent; }
.gw-card .gw-ico { width: 54px; height: 54px; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-size: 25px; color: #fff; margin-bottom: 18px; background: linear-gradient(135deg, var(--c1, var(--l1)), var(--c2, var(--l2))); box-shadow: 0 10px 20px var(--glow, rgba(46, 49, 146, .2)); }
.gw-card h3 { font-size: 19px; font-weight: 800; margin: 0 0 8px; }
.gw-card p { color: var(--muted); margin: 0; font-size: 15px; }
.gw-card ul { margin: 12px 0 0; padding: 0; list-style: none; }
.gw-card ul li { color: var(--muted); font-size: 14px; padding: 3px 0 3px 22px; position: relative; }
.gw-card ul li:before { content: "\f00c"; font-family: FontAwesome; position: absolute; left: 0; top: 3px; color: var(--c1, var(--l1)); font-size: 12px; }
.gw-c-meta  { --c1: #0866ff; --c2: #7b2ff7; --glow: rgba(8, 102, 255, .25); }
.gw-c-wa    { --c1: #25d366; --c2: #128c7e; --glow: rgba(37, 211, 102, .28); }
.gw-c-sms   { --c1: #fb923c; --c2: #ea580c; --glow: rgba(249, 115, 22, .25); }
.gw-c-chat  { --c1: #34b7f1; --c2: #0e7490; --glow: rgba(52, 183, 241, .25); }
.gw-c-db    { --c1: #f43f5e; --c2: #be123c; --glow: rgba(244, 63, 94, .22); }
.gw-c-api   { --c1: #00aeef; --c2: #2e3192; }
.gw-c-users { --c1: #8b5cf6; --c2: #6d28d9; --glow: rgba(139, 92, 246, .25); }
.gw-c-shield{ --c1: #10b981; --c2: #047857; --glow: rgba(16, 185, 129, .25); }

/* steps */
.gw-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; counter-reset: step; }
.gw-step { position: relative; text-align: center; padding: 10px 18px; }
.gw-step .gw-num { width: 64px; height: 64px; margin: 0 auto 16px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 800; color: #fff; background: linear-gradient(135deg, var(--l1), var(--l2)); box-shadow: 0 0 0 8px rgba(0, 174, 239, .12); }
.gw-step h3 { font-size: 19px; font-weight: 800; margin: 0 0 8px; }
.gw-step p { color: var(--muted); margin: 0; }
.gw-step:not(:last-child):after { content: ""; position: absolute; top: 42px; left: calc(50% + 48px); width: calc(100% - 96px); border-top: 2px dashed #c9d3ea; }

/* API */
.gw-api { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: center; }
.gw-api h2 { font-size: 34px; font-weight: 800; margin: 8px 0 14px; }
.gw-api p { color: var(--muted); font-size: 16px; }
.gw-api ul { padding: 0; list-style: none; margin: 18px 0 0; }
.gw-api li { padding: 6px 0; font-weight: 600; }
.gw-api li .fa { color: var(--l1); width: 22px; }
.gw-code { background: #0f1424; color: #d6e1ff; border-radius: 18px; padding: 22px 22px 18px; font-family: Consolas, "Courier New", monospace; font-size: 13px; line-height: 1.7; box-shadow: 0 30px 60px rgba(15, 20, 36, .3); overflow-x: auto; }
.gw-code .gw-dots { display: flex; gap: 7px; margin-bottom: 14px; }
.gw-code .gw-dots i { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; }
.gw-code .gw-dots i:nth-child(2) { background: #febc2e; }
.gw-code .gw-dots i:nth-child(3) { background: #28c840; }
.gw-code .k { color: #7dd3fc; }
.gw-code .s { color: #86efac; }
.gw-code .c { color: #64748b; }
.gw-code pre { margin: 0; background: transparent; border: 0; padding: 0; color: inherit; font: inherit; white-space: pre; }

/* policies */
.gw-policy { display: flex; gap: 14px; align-items: flex-start; padding: 20px; border-radius: 16px; background: #fff; border: 1px solid var(--line); color: var(--ink) !important; transition: transform .2s, box-shadow .2s, border-color .2s; height: 100%; }
.gw-policy:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(46, 49, 146, .10); border-color: #cfd8ef; }
.gw-policy .gw-p-ico { width: 44px; height: 44px; border-radius: 12px; flex: 0 0 44px; display: flex; align-items: center; justify-content: center; font-size: 20px; color: #fff; }
.gw-policy b { display: block; font-size: 15px; }
.gw-policy span { color: var(--muted); font-size: 13px; }
.gw-policy .fa-external-link { color: #9aa5ba; font-size: 12px; margin-left: 4px; }
.gw-p-ours .gw-p-ico { background: linear-gradient(135deg, var(--l1), var(--l2)); }
.gw-p-wa .gw-p-ico { background: linear-gradient(135deg, #25d366, #128c7e); }
.gw-p-meta .gw-p-ico { background: linear-gradient(135deg, #0866ff, #7b2ff7); }

/* contact */
.gw-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; align-items: stretch; }
.gw-contact-box { border-radius: 22px; padding: 34px; color: #fff; background: linear-gradient(140deg, var(--l2) 0%, #1b5fb8 55%, var(--l1) 100%); position: relative; overflow: hidden; }
.gw-contact-box:after { content: ""; position: absolute; width: 280px; height: 280px; border-radius: 50%; right: -90px; bottom: -110px; background: rgba(255, 255, 255, .08); }
.gw-contact-box h2 { font-size: 32px; font-weight: 800; margin: 0 0 10px; }
.gw-contact-box p { opacity: .9; font-size: 16px; }
.gw-contact-box .gw-hero-cta { margin-top: 24px; position: relative; z-index: 1; }
.gw-contact-list { display: grid; gap: 14px; }
.gw-ci { display: flex; gap: 16px; align-items: center; padding: 18px 20px; border-radius: 16px; background: #fff; border: 1px solid var(--line); color: var(--ink) !important; transition: transform .2s, box-shadow .2s; }
a.gw-ci:hover { transform: translateX(4px); box-shadow: 0 10px 24px rgba(46, 49, 146, .10); }
.gw-ci .gw-ci-ico { width: 48px; height: 48px; border-radius: 14px; flex: 0 0 48px; display: flex; align-items: center; justify-content: center; font-size: 21px; color: #fff; background: linear-gradient(135deg, var(--c1, var(--l1)), var(--c2, var(--l2))); }
.gw-ci small { display: block; color: var(--muted); font-weight: 600; text-transform: uppercase; font-size: 11px; letter-spacing: .6px; }
.gw-ci b { font-size: 16px; word-break: break-word; }

/* footer */
.gw-foot { background: #0f1424; color: #aab4cc; padding: 56px 0 24px; }
.gw-foot .gw-wrap { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 28px; }
.gw-foot img { height: 44px; filter: brightness(0) invert(1); margin-bottom: 14px; }
.gw-foot h4 { color: #fff; font-size: 15px; font-weight: 800; margin: 6px 0 14px; }
.gw-foot a { color: #aab4cc; display: block; padding: 4px 0; font-size: 14px; }
.gw-foot a:hover { color: #fff; }
.gw-foot p { font-size: 14px; }
.gw-foot-bottom { grid-column: 1 / -1; border-top: 1px solid rgba(255, 255, 255, .08); margin-top: 18px; padding-top: 18px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: 13px; }
.gw-foot-bottom a { display: inline; padding: 0; }

/* WhatsApp floating button */
.gw-wa-fab { position: fixed; right: 22px; bottom: 22px; z-index: 900; width: 58px; height: 58px; border-radius: 50%; background: var(--wa); color: #fff !important; display: flex; align-items: center; justify-content: center; font-size: 30px; box-shadow: 0 12px 26px rgba(37, 211, 102, .45); animation: gw-pulse-ring 2.4s infinite; }
@keyframes gw-pulse-ring { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .55), 0 12px 26px rgba(37, 211, 102, .45); } 70% { box-shadow: 0 0 0 16px rgba(37, 211, 102, 0), 0 12px 26px rgba(37, 211, 102, .45); } 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0), 0 12px 26px rgba(37, 211, 102, .45); } }

/* ---------- sign-in popup ---------- */
.gw-auth-modal .modal-dialog { width: 860px; max-width: calc(100% - 20px); margin: 6vh auto; }
.gw-auth-modal .modal-content { border: 0; border-radius: 22px; overflow: hidden; box-shadow: 0 40px 90px rgba(15, 20, 36, .35); }
.gw-auth-modal.fade .modal-dialog { transform: translateY(30px) scale(.96); opacity: 0; transition: transform .35s cubic-bezier(.2, .8, .2, 1), opacity .3s; }
.gw-auth-modal.in .modal-dialog { transform: none; opacity: 1; }
.modal-backdrop.in { opacity: .55; }
.gw-am { display: flex; min-height: 540px; }
.gw-am-side { flex: 0 0 40%; position: relative; overflow: hidden; color: #fff; padding: 34px 30px; display: flex; flex-direction: column; background: linear-gradient(150deg, var(--l1) 0%, #1b74c9 45%, var(--l2) 100%); background-size: 200% 200%; animation: gw-side-grad 10s ease infinite; }
@keyframes gw-side-grad { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
.gw-am-side:after { content: ""; position: absolute; width: 300px; height: 300px; border-radius: 50%; right: -120px; bottom: -120px; background: rgba(255, 255, 255, .09); }
.gw-am-side img { height: 44px; width: auto; align-self: flex-start; filter: brightness(0) invert(1); }
.gw-am-side h3 { font-size: 24px; font-weight: 800; margin: 26px 0 8px; transition: opacity .25s; }
.gw-am-side p { opacity: .9; font-size: 14px; transition: opacity .25s; }
.gw-am-side .gw-am-chat { margin-top: 18px; display: flex; flex-direction: column; gap: 8px; position: relative; z-index: 1; }
.gw-am-side .gw-am-chat div { max-width: 88%; padding: 8px 12px; border-radius: 12px; font-size: 12.5px; color: #1f2937; background: #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .12); opacity: 0; transform: translateY(8px); }
.gw-am-side .gw-am-chat div.o { align-self: flex-end; background: #d9fdd3; }
.gw-am-side .gw-am-chat div.o .fa { color: #53bdeb; font-size: 10px; }
.gw-auth-modal.in .gw-am-chat div { animation: gw-pop-in .45s cubic-bezier(.2, .9, .3, 1.3) forwards; }
.gw-auth-modal.in .gw-am-chat div:nth-child(1) { animation-delay: .35s; }
.gw-auth-modal.in .gw-am-chat div:nth-child(2) { animation-delay: .9s; }
.gw-auth-modal.in .gw-am-chat div:nth-child(3) { animation-delay: 1.45s; }
@keyframes gw-pop-in { to { opacity: 1; transform: none; } }
.gw-am-side .gw-am-foot { margin-top: auto; font-size: 12px; opacity: .85; position: relative; z-index: 1; }
.gw-am-side .gw-am-foot a { color: #fff; text-decoration: underline; }

.gw-am-main { flex: 1 1 auto; position: relative; padding: 26px 34px 26px; min-width: 0; }
.gw-am-close { position: absolute; right: 16px; top: 14px; width: 36px; height: 36px; border-radius: 10px; border: 0; background: var(--soft); color: var(--muted); font-size: 18px; transition: background .2s, color .2s, transform .2s; z-index: 2; }
.gw-am-close:hover { background: #e9edf8; color: var(--l2); transform: rotate(90deg); }
.gw-am-tabs { display: inline-flex; background: var(--soft); border-radius: 12px; padding: 4px; position: relative; margin-bottom: 22px; }
.gw-am-tabs button { position: relative; z-index: 1; border: 0; background: transparent; padding: 8px 18px; font-weight: 700; color: var(--muted); border-radius: 9px; transition: color .25s; }
.gw-am-tabs button.active { color: var(--l2); }
.gw-am-tabs .gw-am-ind { position: absolute; z-index: 0; top: 4px; bottom: 4px; left: 4px; border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(31, 36, 51, .10); transition: left .35s cubic-bezier(.65, 0, .35, 1), width .35s cubic-bezier(.65, 0, .35, 1), opacity .25s; }
.gw-am-view { overflow: hidden; }
.gw-am-track { display: flex; width: 300%; transition: transform .55s cubic-bezier(.65, 0, .35, 1); align-items: flex-start; }
.gw-am-pane { width: 33.3333%; padding: 2px 2px 4px; transition: opacity .35s; }
.gw-am[data-pane="register"] .gw-am-track { transform: translateX(-33.3333%); }
.gw-am[data-pane="forgot"] .gw-am-track { transform: translateX(-66.6666%); }
.gw-am:not([data-pane="signin"]) .gw-am-pane-signin,
.gw-am:not([data-pane="register"]) .gw-am-pane-register,
.gw-am:not([data-pane="forgot"]) .gw-am-pane-forgot { opacity: 0; visibility: hidden; transition: opacity .35s, visibility 0s .55s; }
.gw-am-pane h2 { font-size: 26px; font-weight: 800; margin: 0 0 4px; color: var(--ink); }
.gw-am-pane .gw-sub { color: var(--muted); margin-bottom: 20px; }
.gw-am-pane label { font-weight: 700; color: #374151; font-size: 13px; }
.gw-am-pane .form-control { height: 46px; padding-left: 42px; border-radius: 11px; border-color: #d8dee8; box-shadow: none; transition: border-color .2s, box-shadow .2s; }
.gw-am-pane .form-control:focus { border-color: var(--l1); box-shadow: 0 0 0 4px rgba(0, 174, 239, .15); }
.gw-am-pane label.error { color: #dc2626; font-weight: 500; font-size: 12px; margin: 4px 0 0; }
.gw-field { position: relative; margin-bottom: 15px; }
.gw-field > .fa { position: absolute; left: 15px; top: 36px; color: #9ca3af; transition: color .2s; }
.gw-field:focus-within > .fa { color: var(--l1); }
.gw-field .gw-eye { position: absolute; right: 8px; top: 30px; border: 0; background: transparent; color: #9ca3af; padding: 6px 8px; }
.gw-field .gw-eye:hover { color: var(--l2); }
.gw-am-row { display: flex; justify-content: space-between; align-items: center; margin: -4px 0 16px; font-size: 13px; }
.gw-am-pane .gw-btn { width: 100%; height: 48px; }
.gw-am-link { color: var(--l2) !important; font-weight: 700; cursor: pointer; }
.gw-am-alt { text-align: center; margin-top: 16px; color: var(--muted); font-size: 14px; }
.gw-am-legal { margin-top: 14px; font-size: 12px; color: var(--muted); text-align: center; }
.gw-am-legal a { color: var(--muted) !important; text-decoration: underline; }
.gw-am-main.gw-shake { animation: gw-shake .45s ease; }
@keyframes gw-shake { 20%, 60% { transform: translateX(-8px); } 40%, 80% { transform: translateX(8px); } }


/* pricing */
.gw-price-tabs { position: relative; display: flex; width: max-content; margin: -16px auto 34px; background: var(--soft); border-radius: 14px; padding: 5px; }
.gw-price-tabs button { position: relative; z-index: 1; border: 0; background: transparent; padding: 9px 26px; font-weight: 800; color: var(--muted); border-radius: 10px; transition: color .25s; }
.gw-price-tabs button.active { color: #fff; }
.gw-price-ind { position: absolute; z-index: 0; top: 5px; bottom: 5px; left: 5px; border-radius: 10px; background: linear-gradient(90deg, var(--l1), var(--l2)); box-shadow: 0 6px 16px rgba(46, 49, 146, .25); transition: left .35s cubic-bezier(.65, 0, .35, 1), width .35s cubic-bezier(.65, 0, .35, 1); }
.gw-price-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 340px)); justify-content: center; gap: 22px; align-items: stretch; max-width: 1100px; margin: 0 auto; }
.gw-price-grid[hidden] { display: none; }
.gw-price { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: 30px 26px 26px; transition: transform .25s ease, box-shadow .25s ease, border-color .25s; }
.gw-price:hover { transform: translateY(-6px); box-shadow: 0 24px 46px rgba(46, 49, 146, .14); border-color: transparent; }
.gw-price.is-featured { border: 0; color: #fff; background: linear-gradient(150deg, var(--l1) 0%, #1b74c9 45%, var(--l2) 100%); box-shadow: 0 26px 50px rgba(46, 49, 146, .30); transform: scale(1.03); }
.gw-price.is-featured:hover { transform: scale(1.03) translateY(-6px); }
.gw-price.gw-reveal.is-featured:not(.is-in) { transform: translateY(26px) scale(1.03); }
.gw-price-badge { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); background: #fff; color: var(--l2); font-weight: 800; font-size: 12px; padding: 5px 14px; border-radius: 20px; box-shadow: 0 6px 16px rgba(46, 49, 146, .2); white-space: nowrap; }
.gw-price-badge .fa { color: #f59e0b; }
.gw-price h3 { font-size: 18px; font-weight: 800; margin: 0 0 14px; }
.gw-price-amount { font-size: 38px; font-weight: 800; line-height: 1.1; margin-bottom: 18px; }
.gw-price-amount small { font-size: 16px; font-weight: 700; opacity: .75; }
.gw-price-amount span { display: block; font-size: 14px; font-weight: 600; color: var(--muted); margin-top: 4px; }
.gw-price.is-featured .gw-price-amount span { color: rgba(255, 255, 255, .8); }
.gw-price ul { list-style: none; padding: 0; margin: 0 0 24px; flex: 1 1 auto; }
.gw-price li { padding: 7px 0; border-top: 1px dashed var(--line); font-size: 15px; }
.gw-price li .fa { width: 22px; color: var(--l1); }
.gw-price.is-featured li { border-top-color: rgba(255, 255, 255, .22); }
.gw-price.is-featured li .fa { color: #fff; }
.gw-price .gw-btn { width: 100%; }
.gw-price.is-featured .gw-btn-main { background: #fff; color: var(--l2) !important; }
.gw-price-empty { max-width: 560px; margin: 0 auto; text-align: center; background: var(--soft); border-radius: 22px; padding: 36px 28px; }
.gw-price-empty .fa-tags { font-size: 34px; color: var(--l1); }
.gw-price-empty h3 { font-weight: 800; }
.gw-price-empty p { color: var(--muted); }
.gw-price-note { text-align: center; color: var(--muted); font-size: 13px; margin: 26px 0 0; }
@media (max-width: 600px) {
    .gw-price.is-featured, .gw-price.is-featured:hover { transform: none; }
    .gw-price-tabs button { padding: 8px 18px; }
}
/* ---------- phones / tablets ---------- */
@media (max-width: 991px) {
    .gw-nav-links, .gw-nav-actions .gw-btn-line { display: none; }
    .gw-burger { display: inline-flex; align-items: center; justify-content: center; }
    .gw-nav-actions { margin-left: auto; }
    .gw-burger { margin-left: 0; }
    .gw-nav.is-open .gw-nav-links { display: flex; position: absolute; top: 72px; left: 0; right: 0; flex-direction: column; gap: 0; background: #fff; padding: 8px 16px 16px; border-bottom: 1px solid var(--line); box-shadow: 0 14px 24px rgba(31, 36, 51, .08); }
    .gw-nav.is-open .gw-nav-links a { padding: 12px 4px; border-bottom: 1px solid var(--line); }
    .gw-hero .gw-wrap, .gw-api, .gw-contact { grid-template-columns: 1fr; }
    .gw-hero { padding: 44px 0 60px; }
    .gw-hero h1 { font-size: 36px; }
    .gw-hero-visual { margin-top: 10px; }
    .gw-grid-3, .gw-grid-4 { grid-template-columns: 1fr 1fr; }
    .gw-strip .gw-wrap { grid-template-columns: 1fr 1fr; }
    .gw-foot .gw-wrap { grid-template-columns: 1fr 1fr; }
    .gw-steps { grid-template-columns: 1fr; }
    .gw-step:not(:last-child):after { display: none; }
}
@media (max-width: 600px) {
    .gw-nav .gw-wrap { height: 64px; gap: 10px; }
    .gw-nav.is-open .gw-nav-links { top: 64px; }
    .gw-nav-logo img { height: 38px; }
    .gw-nav-actions .gw-btn { height: 40px; padding: 0 16px; }
    .gw-hero h1 { font-size: 30px; }
    .gw-hero p.lead { font-size: 16px; }
    .gw-sec { padding: 56px 0; }
    .gw-sec-head h2 { font-size: 27px; }
    .gw-grid-3, .gw-grid-4, .gw-strip .gw-wrap, .gw-foot .gw-wrap { grid-template-columns: 1fr; }
    .gw-phone { width: 260px; }
    .gw-phone-screen { height: 460px; }
    .gw-fc-1 { display: none; }
    .gw-fc-2 { right: -6px; top: auto; bottom: 64px; }
    .gw-contact-box { padding: 26px; }
    .gw-am-side { display: none; }
    .gw-am { min-height: 0; }
    .gw-am-main { padding: 22px 20px; }
    .gw-auth-modal .modal-dialog { margin: 12px auto; }
}
@media (prefers-reduced-motion: reduce) {
    /* Windows "animation effects" off: no endless movement; clicks still slide */
    .gw-hero:before, .gw-hero:after, .gw-phone, .gw-float-card, .gw-wa-fab, .gw-am-side { animation: none !important; }
    .gw-bubble { animation: none; opacity: 1; transform: none; }
    .gw-reveal { opacity: 1; transform: none; }
}