:root {
    --brand: #07966f;
    --brand-dark: #057858;
    --brand-deep: #045c47;
    --brand-soft: #eef9f5;
    --brand-soft-2: #f5fbf8;
    --navy: #102c3c;
    --text: #173746;
    --muted: #687e89;
    --muted-2: #8798a1;
    --line: #e1e9ec;
    --line-soft: #edf2f3;
    --surface: #ffffff;
    --surface-alt: #f7faf9;
    --footer: #0b2c2a;
    --container: 1220px;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --shadow-sm: 0 8px 24px rgba(16, 44, 60, .06);
    --shadow-md: 0 20px 55px rgba(16, 44, 60, .10);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
    margin: 0;
    background: var(--surface);
    color: var(--text);
    font-family: "Vazirmatn", Tahoma, sans-serif;
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input { font: inherit; }
button { color: inherit; }
.ui-icon { display: block; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.page-container { width: min(var(--container), calc(100% - 72px)); margin-inline: auto; }

/* Header */
.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    height: 76px;
    border-bottom: 1px solid rgba(225, 233, 236, .85);
    background: rgba(255, 255, 255, .96);
    transition: box-shadow .2s ease, border-color .2s ease;
}
.site-header.is-scrolled { box-shadow: 0 10px 32px rgba(16, 44, 60, .07); border-color: transparent; }
.header-inner { height: 100%; display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; flex-shrink: 0; }
.site-brand-logo { width: 132px; height: auto; object-fit: contain; }
.main-nav { display: flex; align-items: center; gap: 30px; margin-inline-start: 42px; }
.main-nav a { position: relative; color: #49636f; font-size: 13px; font-weight: 700; transition: color .2s ease; }
.main-nav a::after { content: ""; position: absolute; right: 0; bottom: -8px; width: 0; height: 2px; border-radius: 2px; background: var(--brand); transition: width .2s ease; }
.main-nav a:hover { color: var(--brand-dark); }
.main-nav a:hover::after { width: 100%; }
.header-actions { margin-inline-start: auto; display: flex; align-items: center; gap: 8px; }
.header-login, .header-start { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; padding: 0 17px; border-radius: 10px; font-size: 13px; font-weight: 800; }
.header-login { color: #36515f; }
.header-login:hover { background: #f4f8f7; }
.header-start { background: var(--brand); color: #fff; box-shadow: 0 7px 18px rgba(7, 150, 111, .18); }
.header-start:hover { background: var(--brand-dark); }
.landing-mobile-menu-button { display: none; width: 42px; height: 42px; margin-inline-start: auto; place-items: center; border: 1px solid var(--line); border-radius: 11px; background: #fff; cursor: pointer; }
.landing-mobile-menu-button .ui-icon { width: 20px; height: 20px; }
.landing-mobile-nav { position: absolute; top: 67px; right: 16px; left: 16px; z-index: 40; padding: 9px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow-md); }
.landing-mobile-nav[hidden] { display: none; }
.landing-mobile-nav > a { display: block; padding: 10px 11px; border-radius: 9px; color: #405b68; font-size: 13px; font-weight: 750; }
.landing-mobile-nav > a:hover { background: var(--brand-soft); color: var(--brand-dark); }
.landing-mobile-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 7px; padding-top: 8px; border-top: 1px solid var(--line-soft); }
.landing-mobile-actions a { min-height: 39px; display: flex; align-items: center; justify-content: center; border-radius: 9px; font-size: 12px; font-weight: 800; }

/* Common */
.section-badge, .section-kicker { color: var(--brand-dark); font-weight: 850; }
.section-badge { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 12px; border: 1px solid #d4ebe3; border-radius: 999px; background: var(--brand-soft); font-size: 11px; }
.section-badge .ui-icon { width: 15px; height: 15px; }
.section-kicker { display: inline-block; margin-bottom: 10px; font-size: 12px; }
.section-heading { max-width: 720px; margin-bottom: 38px; }
.section-heading-centered { margin-inline: auto; text-align: center; }
.section-heading h2 { margin: 0; color: var(--navy); font-size: clamp(28px, 3.2vw, 39px); line-height: 1.48; font-weight: 950; letter-spacing: -.45px; }
.section-heading p { margin: 10px auto 0; max-width: 680px; color: var(--muted); font-size: 14px; line-height: 2; }
.button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0 20px; border: 1px solid transparent; border-radius: 11px; font-size: 13px; font-weight: 850; transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { background: var(--brand); color: #fff; box-shadow: 0 10px 22px rgba(7, 150, 111, .18); }
.button-primary:hover { background: var(--brand-dark); }
.button-secondary { border-color: #dbe5e8; background: #fff; color: #31515f; }
.button-secondary:hover { border-color: #c7dad4; background: var(--brand-soft-2); }
.text-link { display: inline-flex; align-items: center; gap: 7px; margin-top: 22px; color: var(--brand-dark); font-size: 13px; font-weight: 850; }

/* Hero */
.hero-section { position: relative; overflow: hidden; padding: 76px 0 68px; background: #fff; }
.hero-section::before { content: ""; position: absolute; width: 520px; height: 520px; left: -260px; top: 30px; border-radius: 50%; background: #f4fbf8; z-index: 0; }
.hero-layout { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .92fr) minmax(480px, 1.08fr); align-items: center; gap: 70px; }
.hero-content { max-width: 600px; }
.hero-content h1 { margin: 18px 0 16px; color: var(--navy); font-size: clamp(42px, 4.6vw, 61px); line-height: 1.38; letter-spacing: -1px; font-weight: 950; }
.hero-content h1 span { display: block; color: var(--brand); }
.hero-lead { margin: 0; max-width: 590px; color: var(--muted); font-size: 15px; line-height: 2.1; }
.hero-actions { display: flex; gap: 9px; margin-top: 25px; }
.hero-primary { min-width: 126px; }
.hero-checks { display: flex; flex-wrap: wrap; gap: 9px 17px; margin-top: 24px; color: #6d818a; font-size: 10px; font-weight: 750; }
.hero-checks span { display: inline-flex; align-items: center; gap: 5px; }
.hero-checks .ui-icon { width: 13px; height: 13px; color: var(--brand); }
.hero-visual { position: relative; min-width: 0; padding: 24px 18px 30px 34px; }
.hero-visual::before { content: ""; position: absolute; inset: 0 18px 10px 0; border-radius: 28px; background: var(--brand-soft); }
.product-window { position: relative; z-index: 2; overflow: hidden; border: 1px solid #dae5e8; border-radius: 20px; background: #fff; box-shadow: var(--shadow-md); }
.product-window-bar { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 15px; border-bottom: 1px solid var(--line-soft); color: #738790; font-size: 10px; font-weight: 800; }
.window-title { color: #3d5966; }
.window-status { display: inline-flex; align-items: center; gap: 6px; }
.window-status i { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); }
.product-window-media { padding: 8px; background: #f7faf9; }
.hero-image { width: 100%; height: auto; border-radius: 13px; }
.hero-float-card { position: absolute; z-index: 3; min-width: 165px; display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid #dce7e9; border-radius: 13px; background: rgba(255,255,255,.98); box-shadow: var(--shadow-sm); }
.hero-float-card .ui-icon { width: 19px; height: 19px; color: var(--brand); flex: 0 0 auto; }
.hero-float-card strong, .hero-float-card span { display: block; }
.hero-float-card strong { color: #294957; font-size: 10px; line-height: 1.55; }
.hero-float-card span { margin-top: 1px; color: #89989f; font-size: 8px; }
.hero-float-card-top { top: 6px; left: 0; }
.hero-float-card-bottom { right: 0; bottom: 3px; }

/* Trust strip */
.trust-strip { position: relative; z-index: 3; padding: 0 0 42px; background: #fff; }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 12px 35px rgba(16, 44, 60, .045); }
.trust-item { min-height: 92px; display: flex; align-items: center; gap: 10px; padding: 16px 20px; }
.trust-item + .trust-item { border-right: 1px solid var(--line-soft); }
.trust-icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; background: var(--brand-soft); color: var(--brand); }
.trust-icon .ui-icon { width: 18px; height: 18px; }
.trust-item strong, .trust-item span { display: block; }
.trust-item strong { color: #2f4c59; font-size: 11px; }
.trust-item span { margin-top: 2px; color: #85959c; font-size: 9px; }

/* Overview */
.overview-section { padding: 92px 0; background: var(--surface-alt); }
.overview-layout { display: grid; grid-template-columns: minmax(320px, .74fr) minmax(0, 1.26fr); align-items: center; gap: 58px; }
.overview-copy h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 3.2vw, 41px); line-height: 1.55; font-weight: 950; letter-spacing: -.5px; }
.overview-copy h2 span { color: var(--brand); }
.overview-copy > p { margin: 13px 0 0; color: var(--muted); font-size: 14px; line-height: 2.05; }
.overview-list { display: grid; gap: 9px; margin-top: 23px; }
.overview-list article { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: center; gap: 10px; padding: 9px 10px; border: 1px solid #e2e9eb; border-radius: 12px; background: #fff; }
.overview-check { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: var(--brand-soft); color: var(--brand); }
.overview-check .ui-icon { width: 14px; height: 14px; }
.overview-list strong, .overview-list span { display: block; }
.overview-list strong { color: #32505d; font-size: 11px; }
.overview-list article div span { margin-top: 1px; color: #84959c; font-size: 9px; line-height: 1.7; }
.overview-visual { min-width: 0; padding: 11px; overflow: hidden; border: 1px solid #dbe5e8; border-radius: 20px; background: #fff; box-shadow: var(--shadow-md); }
.overview-window-head { min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 4px 8px; color: #7e8e95; font-size: 9px; }
.overview-window-head div { display: inline-flex; align-items: center; gap: 6px; }
.overview-window-head i { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); }
.overview-window-head strong { color: #3b5966; font-size: 9px; }
.overview-visual img { width: 100%; border-radius: 12px; }

/* Products */
.products-section { padding: 96px 0; background: #fff; }
.products-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.product-card { overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) 42%; min-height: 238px; border: 1px solid var(--line); border-radius: 20px; background: #fff; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.product-card:hover { transform: translateY(-3px); border-color: #ccded8; box-shadow: var(--shadow-sm); }
.product-card-active { border-color: #cfe8df; background: #fbfefd; }
.product-image { order: 2; min-width: 0; background: #f5f8f8; overflow: hidden; }
.product-image img { width: 100%; height: 100%; object-fit: cover; }
.product-content { order: 1; display: flex; flex-direction: column; justify-content: center; padding: 25px 25px 23px; }
.product-title-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.product-title-row h3 { margin: 0; color: #1d3b49; font-size: 17px; font-weight: 900; }
.product-tag { flex: 0 0 auto; padding: 3px 8px; border-radius: 999px; background: #f0f3f4; color: #7b8c93; font-size: 8px; font-weight: 850; }
.product-tag-active { background: #e8f7f1; color: var(--brand-dark); }
.product-content p { margin: 10px 0 0; color: #70838c; font-size: 11px; line-height: 1.9; }
.product-meta { margin-top: auto; padding-top: 18px; color: var(--brand-dark); font-size: 9px; font-weight: 800; }

/* Advantages */
.advantages-section { padding: 94px 0; background: #f7faf9; }
.advantages-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.advantage-card { min-height: 150px; display: grid; grid-template-columns: 42px minmax(0, 1fr); align-content: center; gap: 13px; padding: 20px; border: 1px solid #e0e8ea; border-radius: 16px; background: #fff; }
.advantage-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: var(--brand-soft); color: var(--brand); }
.advantage-icon .ui-icon { width: 19px; height: 19px; }
.advantage-card h3 { margin: 0; color: #294856; font-size: 13px; font-weight: 900; }
.advantage-card p { margin: 5px 0 0; color: #7a8d95; font-size: 10px; line-height: 1.85; }

/* Steps */
.steps-section { padding: 94px 0; background: #fff; }
.steps-grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 950px; margin-inline: auto; }
.steps-grid::before { content: ""; position: absolute; top: 35px; right: 16.66%; left: 16.66%; border-top: 1px dashed #cddbd7; z-index: 0; }
.step-card { position: relative; z-index: 1; padding: 0 18px; text-align: center; }
.step-number { position: absolute; top: -7px; right: calc(50% + 21px); min-width: 27px; padding: 2px 5px; border-radius: 999px; background: #fff; color: var(--brand-dark); font-size: 9px; font-weight: 900; }
.step-icon { width: 70px; height: 70px; display: grid; place-items: center; margin: 0 auto 14px; border: 1px solid #d5e7e1; border-radius: 50%; background: var(--brand-soft); color: var(--brand); box-shadow: 0 0 0 8px #fff; }
.step-icon .ui-icon { width: 24px; height: 24px; }
.step-card h3 { margin: 0; color: #294956; font-size: 13px; font-weight: 900; }
.step-card p { margin: 6px auto 0; max-width: 220px; color: #809199; font-size: 10px; line-height: 1.85; }

/* Security */
.security-section { padding: 88px 0; background: #f1f8f5; }
.security-shell { display: grid; grid-template-columns: .86fr 1.14fr; gap: 54px; align-items: center; }
.security-copy h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 3.2vw, 40px); line-height: 1.55; font-weight: 950; }
.security-copy h2 span { color: var(--brand); }
.security-copy p { margin: 12px 0 0; max-width: 500px; color: #688089; font-size: 13px; line-height: 2; }
.security-button { margin-top: 20px; background: #fff; }
.security-points { display: grid; gap: 10px; }
.security-points article { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; padding: 15px; border: 1px solid #dce9e4; border-radius: 15px; background: rgba(255,255,255,.88); }
.security-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: #e8f7f1; color: var(--brand); }
.security-icon .ui-icon { width: 20px; height: 20px; }
.security-points strong, .security-points span { display: block; }
.security-points strong { color: #2c4c58; font-size: 12px; }
.security-points span { margin-top: 2px; color: #7c9098; font-size: 10px; line-height: 1.8; }

/* CTA */
.cta-section { padding: 72px 0 84px; background: #fff; }
.cta-box { position: relative; overflow: hidden; min-height: 240px; display: flex; align-items: center; justify-content: space-between; gap: 36px; padding: 46px 52px; border-radius: 26px; background: var(--footer); color: #fff; }
.cta-box::after { content: ""; position: absolute; width: 300px; height: 300px; left: -100px; bottom: -170px; border-radius: 50%; border: 48px solid rgba(255,255,255,.035); }
.cta-copy { position: relative; z-index: 1; max-width: 700px; }
.cta-eyebrow { color: #7fd6b9; font-size: 10px; font-weight: 850; }
.cta-copy h2 { margin: 7px 0 0; max-width: 650px; font-size: clamp(27px, 3vw, 38px); line-height: 1.55; font-weight: 950; }
.cta-copy p { margin: 8px 0 0; color: #b7cbc7; font-size: 12px; }
.cta-actions { position: relative; z-index: 1; display: flex; flex: 0 0 auto; gap: 8px; }
.cta-primary { background: #fff; color: var(--brand-deep); }
.cta-primary:hover { background: #f3faf7; }
.cta-secondary { border-color: rgba(255,255,255,.2); color: #fff; background: rgba(255,255,255,.04); }
.cta-secondary:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.35); }

/* Footer */
.site-footer { background: #082421; color: #d7e3e0; }
.footer-grid { display: grid; grid-template-columns: 1.45fr repeat(4, 1fr); gap: 34px; padding-top: 54px; padding-bottom: 44px; }
.brand-footer .site-brand-logo { width: 138px; filter: brightness(0) invert(1); opacity: .95; }
.footer-brand p { max-width: 270px; margin: 15px 0 0; color: #9fb7b2; font-size: 11px; line-height: 1.9; }
.footer-trust-seal { width: 74px; min-height: 74px; display: grid; place-items: center; margin-top: 18px; padding: 5px; border-radius: 12px; background: #fff; }
.footer-trust-seal img { max-width: 64px; max-height: 64px; object-fit: contain; }
.footer-column h4 { margin: 0 0 13px; color: #fff; font-size: 12px; font-weight: 900; }
.footer-column a, .footer-link-disabled { display: block; width: fit-content; padding: 4px 0; color: #9fb7b2; font-size: 10px; line-height: 1.7; }
.footer-column a:hover { color: #fff; }
.footer-link-disabled { color: #708985; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.08); }
.footer-bottom-inner { min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #829b96; font-size: 9px; }
.footer-social { display: flex; align-items: center; gap: 8px; }
.footer-social span { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.09); border-radius: 8px; color: #9db5b0; }
.footer-social .ui-icon { width: 13px; height: 13px; }

/* Interaction safety */
.hero-content, .hero-actions, .header-actions, .cta-actions { position: relative; z-index: 10; pointer-events: auto; }
.hero-image, .overview-visual img, .product-image img { pointer-events: none; }

/* Tablet */
@media (max-width: 1080px) {
    .page-container { width: min(var(--container), calc(100% - 48px)); }
    .main-nav { gap: 20px; margin-inline-start: 24px; }
    .hero-layout { grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr); gap: 38px; }
    .hero-content h1 { font-size: 43px; }
    .hero-visual { padding-left: 14px; }
    .products-grid { gap: 14px; }
    .footer-grid { grid-template-columns: 1.4fr repeat(2, 1fr); }
    .footer-column:nth-of-type(4), .footer-column:nth-of-type(5) { margin-top: 10px; }
}

@media (max-width: 860px) {
    .site-header { height: 66px; }
    .main-nav, .header-actions { display: none; }
    .landing-mobile-menu-button { display: grid; }
    .site-brand-logo { width: 122px; }
    .hero-section { padding: 52px 0 48px; }
    .hero-layout, .overview-layout, .security-shell { grid-template-columns: 1fr; }
    .hero-layout { gap: 34px; }
    .hero-content { max-width: 680px; margin-inline: auto; text-align: center; }
    .hero-lead { margin-inline: auto; }
    .hero-actions, .hero-checks { justify-content: center; }
    .hero-visual { width: min(720px, 100%); margin-inline: auto; padding: 18px 16px 27px 28px; }
    .trust-grid { grid-template-columns: repeat(2, 1fr); }
    .trust-item:nth-child(3) { border-top: 1px solid var(--line-soft); }
    .trust-item:nth-child(3) { border-right: none; }
    .trust-item:nth-child(4) { border-top: 1px solid var(--line-soft); }
    .overview-section, .products-section, .advantages-section, .steps-section, .security-section { padding: 72px 0; }
    .overview-layout { gap: 34px; }
    .overview-copy { max-width: 680px; }
    .products-grid { grid-template-columns: 1fr; }
    .product-card { min-height: 220px; }
    .advantages-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .security-shell { gap: 28px; }
    .cta-box { align-items: flex-start; flex-direction: column; min-height: 0; padding: 38px; }
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-brand { grid-column: 1 / -1; }
}

/* Mobile */
@media (max-width: 640px) {
    .page-container { width: calc(100% - 30px); }
    html { scroll-padding-top: 74px; }
    .hero-section::before { width: 320px; height: 320px; left: -210px; }
    .hero-content h1 { margin-top: 15px; font-size: 34px; line-height: 1.5; letter-spacing: -.5px; }
    .hero-lead { font-size: 13px; line-height: 2; }
    .section-badge { min-height: 31px; font-size: 9px; }
    .hero-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .hero-actions .button { width: 100%; padding-inline: 10px; font-size: 11px; }
    .hero-checks { display: grid; grid-template-columns: 1fr; width: fit-content; margin: 18px auto 0; justify-items: start; gap: 6px; }
    .hero-visual { padding: 12px 7px 24px 20px; }
    .hero-visual::before { inset: 0 10px 8px 0; border-radius: 20px; }
    .product-window { border-radius: 14px; }
    .product-window-bar { min-height: 36px; font-size: 8px; }
    .product-window-media { padding: 5px; }
    .hero-image { border-radius: 9px; }
    .hero-float-card { min-width: 132px; padding: 7px 9px; border-radius: 10px; }
    .hero-float-card .ui-icon { width: 15px; height: 15px; }
    .hero-float-card strong { font-size: 8px; }
    .hero-float-card span { font-size: 7px; }
    .hero-float-card-top { top: 0; }
    .hero-float-card-bottom { right: -3px; }
    .trust-strip { padding-bottom: 28px; }
    .trust-grid { grid-template-columns: 1fr; border-radius: 14px; }
    .trust-item { min-height: 74px; padding: 12px 14px; }
    .trust-item + .trust-item { border-right: none; border-top: 1px solid var(--line-soft); }
    .trust-icon { width: 34px; height: 34px; }
    .section-heading { margin-bottom: 28px; }
    .section-heading h2, .overview-copy h2, .security-copy h2 { font-size: 27px; }
    .section-heading p, .overview-copy > p, .security-copy p { font-size: 12px; }
    .overview-list article { grid-template-columns: 30px minmax(0, 1fr); }
    .overview-visual { padding: 7px; border-radius: 14px; }
    .overview-window-head { min-height: 31px; font-size: 8px; }
    .products-grid { gap: 12px; }
    .product-card { display: flex; flex-direction: column; min-height: 0; border-radius: 16px; }
    .product-image { order: 1; height: 154px; }
    .product-content { order: 2; padding: 18px; }
    .product-title-row h3 { font-size: 15px; }
    .product-content p { font-size: 10px; }
    .product-meta { padding-top: 12px; }
    .advantages-grid { grid-template-columns: 1fr; gap: 9px; }
    .advantage-card { min-height: 116px; grid-template-columns: 38px minmax(0, 1fr); padding: 16px; }
    .advantage-icon { width: 38px; height: 38px; }
    .steps-grid { grid-template-columns: 1fr; gap: 25px; }
    .steps-grid::before { top: 28px; bottom: 28px; right: 50%; left: auto; height: auto; border-top: 0; border-right: 1px dashed #cddbd7; }
    .step-card { padding: 0 10px 4px; background: #fff; }
    .step-number { right: calc(50% + 20px); }
    .step-icon { width: 62px; height: 62px; }
    .security-points article { grid-template-columns: 39px minmax(0, 1fr); padding: 12px; }
    .security-icon { width: 39px; height: 39px; }
    .cta-section { padding: 48px 0 58px; }
    .cta-box { gap: 24px; padding: 28px 22px; border-radius: 20px; }
    .cta-copy h2 { font-size: 25px; }
    .cta-copy p { font-size: 10px; }
    .cta-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
    .cta-actions .button { padding-inline: 8px; font-size: 10px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px 18px; padding-top: 42px; }
    .footer-brand { grid-column: 1 / -1; }
    .footer-bottom-inner { flex-direction: column; justify-content: center; padding: 14px 0; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* =========================================================
   LANDING MODERN V2 — VISUAL POLISH
   Compact rhythm, stronger hierarchy, larger product visuals
   ========================================================= */

@media (min-width: 861px) {
    .section-heading { margin-bottom: 30px; }
    .section-heading h2 { font-size: clamp(30px, 3vw, 40px); }

    /* Hero: less empty space, stronger product presence */
    .hero-section { padding: 50px 0 36px; }
    .hero-layout {
        grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr);
        gap: 44px;
    }
    .hero-content { max-width: 570px; }
    .hero-content h1 {
        margin: 15px 0 12px;
        font-size: clamp(44px, 4.45vw, 59px);
        line-height: 1.34;
    }
    .hero-lead { font-size: 14px; line-height: 2; }
    .hero-actions { margin-top: 20px; }
    .hero-checks { margin-top: 17px; }
    .hero-visual { padding: 13px 10px 20px 24px; }
    .hero-visual::before { inset: 0 10px 7px 0; border-radius: 24px; }
    .product-window { border-radius: 18px; }
    .product-window-bar { min-height: 39px; }
    .product-window-media { padding: 6px; }
    .hero-float-card { padding: 9px 11px; }
    .hero-float-card-top { top: -6px; }
    .hero-float-card-bottom { bottom: -2px; }

    /* Trust strip */
    .trust-strip { padding-bottom: 26px; }
    .trust-grid { border-radius: 16px; }
    .trust-item { min-height: 76px; padding: 12px 18px; }
    .trust-icon { width: 36px; height: 36px; }
    .trust-item strong { font-size: 11.5px; }
    .trust-item span { font-size: 9.5px; }

    /* Product overview */
    .overview-section { padding: 64px 0; }
    .overview-layout {
        grid-template-columns: minmax(300px, .66fr) minmax(0, 1.34fr);
        gap: 42px;
    }
    .overview-copy h2 { font-size: clamp(30px, 3vw, 39px); line-height: 1.48; }
    .overview-copy > p { margin-top: 10px; font-size: 13px; line-height: 1.95; }
    .overview-list { gap: 7px; margin-top: 17px; }
    .overview-list article { padding: 8px 9px; }
    .text-link { margin-top: 15px; }
    .overview-visual { padding: 8px; border-radius: 18px; box-shadow: 0 16px 42px rgba(16,44,60,.085); }
    .overview-window-head { min-height: 31px; padding-bottom: 6px; }
    .overview-visual img { border-radius: 10px; }

    /* Specialist systems */
    .products-section { padding: 70px 0; }
    .products-grid { gap: 16px; }
    .product-card {
        grid-template-columns: minmax(0, 1fr) 46%;
        min-height: 250px;
        border-radius: 18px;
    }
    .product-content { padding: 24px 23px 21px; }
    .product-title-row h3 { font-size: 18px; }
    .product-content p { font-size: 11.5px; line-height: 1.85; }
    .product-meta { padding-top: 14px; font-size: 9.5px; }

    /* Features */
    .advantages-section { padding: 66px 0; }
    .advantages-grid { gap: 12px; }
    .advantage-card {
        min-height: 132px;
        padding: 18px;
        border-radius: 15px;
        transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    }
    .advantage-card:hover {
        transform: translateY(-2px);
        border-color: #cfe1db;
        box-shadow: 0 10px 28px rgba(16,44,60,.055);
    }
    .advantage-card h3 { font-size: 13.5px; }
    .advantage-card p { font-size: 10.5px; }

    /* Start steps: much less vertical whitespace */
    .steps-section { padding: 58px 0 62px; }
    .steps-section .section-heading { margin-bottom: 26px; }
    .steps-grid { max-width: 900px; gap: 12px; }
    .steps-grid::before { top: 30px; }
    .step-icon {
        width: 60px;
        height: 60px;
        margin-bottom: 11px;
        box-shadow: 0 0 0 6px #fff;
    }
    .step-icon .ui-icon { width: 21px; height: 21px; }
    .step-number { top: -6px; right: calc(50% + 16px); }
    .step-card h3 { font-size: 13.5px; }
    .step-card p { margin-top: 4px; }

    /* Security: turn the loose area into one premium panel */
    .security-section { padding: 62px 0; background: #f2f8f5; }
    .security-shell {
        grid-template-columns: .9fr 1.1fr;
        gap: 38px;
        padding: 32px;
        border: 1px solid #dce9e4;
        border-radius: 24px;
        background: #fff;
        box-shadow: 0 18px 48px rgba(16,44,60,.055);
    }
    .security-copy h2 { font-size: clamp(29px, 3vw, 38px); line-height: 1.48; }
    .security-copy p { margin-top: 9px; font-size: 12.5px; }
    .security-button { margin-top: 16px; }
    .security-points { gap: 8px; }
    .security-points article { padding: 12px 13px; border-radius: 13px; background: #f9fcfb; }
    .security-icon { width: 40px; height: 40px; }

    /* Final CTA */
    .cta-section { padding: 52px 0 64px; }
    .cta-box {
        min-height: 216px;
        padding: 38px 46px;
        border-radius: 24px;
        box-shadow: 0 18px 44px rgba(8,36,33,.10);
    }
    .cta-copy h2 { font-size: clamp(29px, 3vw, 39px); }
    .cta-copy p { font-size: 12.5px; }
}

@media (max-width: 1080px) and (min-width: 861px) {
    .hero-layout { grid-template-columns: minmax(0, .88fr) minmax(430px, 1.12fr); gap: 30px; }
    .hero-content h1 { font-size: 42px; }
    .overview-layout { grid-template-columns: minmax(290px, .72fr) minmax(0, 1.28fr); gap: 30px; }
    .product-card { grid-template-columns: minmax(0, 1fr) 43%; }
}

@media (max-width: 860px) {
    .hero-section { padding: 44px 0 34px; }
    .hero-layout { gap: 27px; }
    .hero-content h1 { margin: 14px 0 11px; }
    .hero-actions { margin-top: 19px; }
    .hero-checks { margin-top: 16px; }
    .hero-visual { padding: 10px 8px 21px 18px; }

    .trust-strip { padding-bottom: 22px; }
    .trust-item { min-height: 72px; padding: 11px 14px; }

    .overview-section,
    .products-section,
    .advantages-section,
    .security-section { padding: 58px 0; }
    .overview-layout { gap: 27px; }

    .products-grid { gap: 12px; }
    .product-card { min-height: 210px; }

    .advantages-grid { gap: 10px; }
    .advantage-card { min-height: 124px; }

    .steps-section { padding: 54px 0 58px; }
    .steps-section .section-heading { margin-bottom: 24px; }

    .security-shell {
        gap: 24px;
        padding: 24px;
        border: 1px solid #dce9e4;
        border-radius: 20px;
        background: #fff;
        box-shadow: 0 14px 38px rgba(16,44,60,.05);
    }

    .cta-section { padding: 44px 0 54px; }
    .cta-box { padding: 32px; }
}

@media (max-width: 640px) {
    .hero-section { padding: 36px 0 30px; }
    .hero-content h1 { font-size: 32px; line-height: 1.43; }
    .hero-lead { font-size: 12.5px; line-height: 1.95; }
    .hero-checks { margin-top: 14px; }
    .hero-visual { padding: 8px 5px 18px 14px; }

    /* 2×2 instead of a tall 4-row strip */
    .trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .trust-item { min-height: 76px; padding: 10px 11px; }
    .trust-item + .trust-item { border-top: 0; }
    .trust-item:nth-child(even) { border-right: 1px solid var(--line-soft); }
    .trust-item:nth-child(3),
    .trust-item:nth-child(4) { border-top: 1px solid var(--line-soft); }
    .trust-item:nth-child(3) { border-right: 0; }
    .trust-icon { width: 32px; height: 32px; }
    .trust-item strong { font-size: 10px; }
    .trust-item span { font-size: 8px; }

    .section-heading { margin-bottom: 23px; }
    .overview-section,
    .products-section,
    .advantages-section,
    .security-section { padding: 48px 0; }

    .overview-copy h2,
    .section-heading h2,
    .security-copy h2 { font-size: 26px; line-height: 1.5; }
    .overview-list { margin-top: 15px; gap: 7px; }
    .text-link { margin-top: 15px; }

    .product-image { height: 170px; }
    .product-content { padding: 17px; }
    .product-content p { font-size: 10.5px; }

    .advantage-card { min-height: 106px; padding: 14px; }
    .advantage-card h3 { font-size: 12.5px; }

    .steps-section { padding: 46px 0 50px; }
    .steps-grid { gap: 18px; }
    .step-icon { width: 56px; height: 56px; margin-bottom: 8px; }
    .step-card p { margin-top: 3px; }

    .security-shell { padding: 18px; border-radius: 17px; }
    .security-points { gap: 7px; }
    .security-points article { padding: 10px; }

    .cta-section { padding: 40px 0 48px; }
    .cta-box { gap: 20px; padding: 25px 20px; border-radius: 18px; }
    .cta-copy h2 { font-size: 24px; }
}

/* LANDING MODERN V3 — REAL PRODUCT SCREENS */
.hero-visual {
    padding: 18px 12px 18px 26px;
}
.hero-visual::before {
    inset: 0 16px 8px 0;
}
.product-window-media {
    padding: 5px;
    background: #f7faf9;
}
.hero-image {
    display: block;
    aspect-ratio: 17 / 10;
    object-fit: cover;
    object-position: top center;
    background: #f4f7f8;
}
.hero-float-card {
    display: none !important;
}
.overview-visual img {
    display: block;
    aspect-ratio: 1.62 / 1;
    object-fit: cover;
    object-position: top center;
    background: #f4f7f8;
}
.overview-window-head strong {
    direction: ltr;
}
@media (max-width: 860px) {
    .hero-visual { padding: 12px 8px 14px 18px; }
    .hero-image { aspect-ratio: 16 / 10; }
}
@media (max-width: 640px) {
    .hero-visual { padding: 9px 4px 12px 12px; }
    .product-window-media { padding: 3px; }
    .hero-image { aspect-ratio: 16 / 10; border-radius: 8px; }
    .overview-visual img { aspect-ratio: 1.62 / 1; }
}

/* =========================================================
   LANDING MODERN V4 — FINAL DESKTOP POLISH
   Desktop hierarchy only; mobile layout intentionally unchanged
   ========================================================= */
@media (min-width: 861px) {
    /* Header readability */
    .site-header { height: 80px; }
    html { scroll-padding-top: 92px; }
    .header-inner { gap: 30px; }
    .site-brand-logo { width: 138px; }
    .main-nav { gap: 29px; margin-inline-start: 38px; }
    .main-nav a { font-size: 14px; font-weight: 780; }
    .header-login,
    .header-start { min-height: 42px; padding-inline: 18px; font-size: 13.5px; }

    /* Hero: slightly larger real product screen and tighter composition */
    .hero-section { padding: 47px 0 34px; }
    .hero-layout {
        grid-template-columns: minmax(0, .78fr) minmax(550px, 1.22fr);
        gap: 34px;
    }
    .hero-content { max-width: 560px; }
    .hero-content h1 { margin-top: 13px; }
    .hero-visual { padding: 8px 5px 13px 14px; }
    .hero-visual::before { inset: 0 8px 5px 0; border-radius: 22px; }
    .product-window { border-radius: 17px; }
    .product-window-bar { min-height: 36px; }
    .product-window-media { padding: 4px; }
    .hero-image { border-radius: 10px; }

    /* Trust strip stays close to hero */
    .trust-strip { padding-bottom: 24px; }

    /* Financial health: larger screenshot, closer copy */
    .overview-section { padding: 58px 0; }
    .overview-layout {
        grid-template-columns: minmax(285px, .60fr) minmax(0, 1.40fr);
        gap: 30px;
    }
    .overview-copy > p { font-size: 13.5px; }
    .overview-list article { padding-block: 8px; }
    .overview-visual {
        padding: 7px;
        border-radius: 17px;
        box-shadow: 0 15px 38px rgba(16,44,60,.08);
    }
    .overview-window-head { min-height: 29px; padding-bottom: 5px; }
    .overview-visual img { border-radius: 9px; }

    /* Specialist systems: improve small-copy legibility */
    .products-section { padding: 66px 0; }
    .product-title-row h3 { font-size: 19px; }
    .product-content p { font-size: 12.5px; line-height: 1.82; }
    .product-meta { font-size: 10.5px; }
    .product-tag { font-size: 9px; }

    /* Features: stronger hierarchy without larger cards */
    .advantages-section { padding: 62px 0; }
    .advantage-icon { width: 44px; height: 44px; }
    .advantage-icon .ui-icon { width: 20px; height: 20px; }
    .advantage-card h3 { font-size: 14.5px; }
    .advantage-card p { font-size: 11.5px; line-height: 1.8; }

    /* Steps: remove excess vertical whitespace */
    .steps-section { padding: 46px 0 48px; }
    .steps-section .section-heading { margin-bottom: 20px; }
    .steps-grid { max-width: 860px; gap: 10px; }
    .steps-grid::before { top: 28px; }
    .step-card { padding-inline: 14px; }
    .step-icon {
        width: 56px;
        height: 56px;
        margin-bottom: 9px;
        box-shadow: 0 0 0 5px #fff;
    }
    .step-icon .ui-icon { width: 20px; height: 20px; }
    .step-number { top: -6px; right: calc(50% + 14px); }
    .step-card h3 { font-size: 14px; }
    .step-card p { margin-top: 3px; font-size: 10.5px; }

    /* Security: keep structure, slightly denser */
    .security-section { padding: 58px 0; }
    .security-shell { gap: 32px; padding: 30px 32px; }

    /* CTA: clearer terminal action */
    .cta-section { padding: 48px 0 60px; }
    .cta-box { min-height: 210px; padding: 36px 44px; }
    .cta-actions { gap: 10px; }
    .cta-actions .button { min-height: 48px; padding-inline: 23px; font-size: 13.5px; }
}

@media (max-width: 1080px) and (min-width: 861px) {
    .site-brand-logo { width: 130px; }
    .main-nav { gap: 20px; margin-inline-start: 20px; }
    .main-nav a { font-size: 13px; }
    .hero-layout { grid-template-columns: minmax(0, .82fr) minmax(455px, 1.18fr); gap: 26px; }
    .overview-layout { grid-template-columns: minmax(280px, .66fr) minmax(0, 1.34fr); gap: 26px; }
}

/* =========================================================
   LANDING MODERN V5 — SINGLE PRODUCT FRAME
   Remove decorative back-card and keep real screenshots in one clear frame
   ========================================================= */
.hero-visual {
    padding: 0;
}
.hero-visual::before {
    display: none;
    content: none;
}
.product-window {
    border: 1px solid #d8e4e7;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(16, 44, 60, .10);
}
.product-window-bar {
    min-height: 40px;
    padding-inline: 14px;
    background: #fff;
}
.product-window-media {
    padding: 6px;
    background: #f7faf9;
}
.hero-image {
    border-radius: 11px;
}

/* Financial Health uses the same visual language: one frame, no rear layer */
.overview-visual {
    padding: 0;
    border: 1px solid #d8e4e7;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(16, 44, 60, .085);
}
.overview-window-head {
    min-height: 40px;
    padding: 0 14px;
    border-bottom: 1px solid var(--line-soft);
    background: #fff;
}
.overview-visual img {
    display: block;
    width: calc(100% - 12px);
    margin: 6px;
    border-radius: 11px;
}

@media (max-width: 860px) {
    .hero-visual { padding: 0; }
    .product-window,
    .overview-visual { border-radius: 16px; }
}

@media (max-width: 640px) {
    .hero-visual { padding: 0; }
    .product-window,
    .overview-visual { border-radius: 13px; }
    .product-window-bar,
    .overview-window-head {
        min-height: 36px;
        padding-inline: 10px;
    }
    .product-window-media { padding: 4px; }
    .hero-image { border-radius: 8px; }
    .overview-visual img {
        width: calc(100% - 8px);
        margin: 4px;
        border-radius: 8px;
    }
}


/* LANDING MOBILE V6 — FINAL RESPONSIVE POLISH */
@media (max-width: 640px) {

    /* ---------- HERO ---------- */

    .hero-section {
        padding: 30px 0 26px;
    }

    .hero-layout {
        gap: 24px;
    }

    .hero-content h1 {
        font-size: 31px;
        line-height: 1.45;
    }

    .hero-lead {
        font-size: 12px;
        line-height: 1.9;
    }

    /*
       نمایش نزدیک‌تر از محیط واقعی سیستم.
       تصویر دسکتاپ دیگر به‌صورت خیلی ریز کامل نمایش داده نمی‌شود.
    */
    .product-window-media {
        overflow: hidden;
        padding: 4px;
    }

    .hero-image {
        width: 100%;
        aspect-ratio: 4 / 3;
        object-fit: cover;
        object-position: top right;
        border-radius: 8px;
    }

    .product-window-bar {
        min-height: 34px;
        padding-inline: 9px;
    }

    .window-title {
        font-size: 8px;
    }


    /* ---------- TRUST ---------- */

    .trust-strip {
        padding-bottom: 22px;
    }

    .trust-item {
        min-height: 68px;
        padding: 9px 10px;
    }

    .trust-icon {
        width: 30px;
        height: 30px;
    }


    /* ---------- FINANCIAL HEALTH ---------- */

    .overview-section {
        padding: 40px 0;
    }

    .overview-layout {
        gap: 22px;
    }

    .overview-copy h2 {
        font-size: 25px;
    }

    .overview-copy > p {
        font-size: 11.5px;
        line-height: 1.9;
    }

    .overview-list {
        gap: 6px;
        margin-top: 13px;
    }

    .overview-list article {
        padding: 8px 9px;
    }

    .overview-window-head {
        min-height: 34px;
        padding-inline: 9px;
    }

    .overview-window-head strong {
        display: none;
    }

    .overview-visual {
        overflow: hidden;
    }

    .overview-visual img {
        width: calc(100% - 8px);
        margin: 4px;
        aspect-ratio: 4 / 3;
        object-fit: cover;
        object-position: top right;
        border-radius: 8px;
    }


    /* ---------- SPECIALIST SYSTEMS ---------- */

    .products-section {
        padding: 42px 0;
    }

    .products-grid {
        gap: 11px;
    }

    .product-card {
        border-radius: 15px;
    }

    .product-image {
        height: 150px;
    }

    .product-content {
        padding: 15px 15px 16px;
    }

    .product-title-row {
        align-items: flex-start;
        gap: 8px;
    }

    .product-title-row h3 {
        font-size: 14px;
        line-height: 1.65;
    }

    .product-tag {
        flex: 0 0 auto;
        margin-top: 2px;
        font-size: 7.5px;
    }

    .product-content p {
        margin-top: 7px;
        font-size: 10px;
        line-height: 1.85;
    }

    .product-meta {
        padding-top: 10px;
        font-size: 9px;
    }


    /* ---------- FEATURES ---------- */

    .advantages-section {
        padding: 40px 0;
    }

    .advantages-grid {
        gap: 8px;
    }

    .advantage-card {
        min-height: 90px;
        grid-template-columns: 35px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
        border-radius: 13px;
    }

    .advantage-icon {
        width: 35px;
        height: 35px;
        border-radius: 10px;
    }

    .advantage-icon .ui-icon {
        width: 16px;
        height: 16px;
    }

    .advantage-card h3 {
        font-size: 12px;
    }

    .advantage-card p {
        margin-top: 3px;
        font-size: 9px;
        line-height: 1.75;
    }


    /* ---------- STEPS ---------- */

    .steps-section {
        padding: 34px 0 38px;
    }

    .steps-section .section-heading {
        margin-bottom: 16px;
    }

    .steps-grid {
        gap: 12px;
    }

    .steps-grid::before {
        top: 23px;
        bottom: 23px;
    }

    .step-card {
        padding: 0 8px 2px;
    }

    .step-icon {
        width: 50px;
        height: 50px;
        margin-bottom: 6px;
        box-shadow: 0 0 0 5px #fff;
    }

    .step-icon .ui-icon {
        width: 18px;
        height: 18px;
    }

    .step-number {
        top: -5px;
        right: calc(50% + 16px);
        font-size: 8px;
    }

    .step-card h3 {
        font-size: 11.5px;
    }

    .step-card p {
        max-width: 250px;
        margin-top: 2px;
        font-size: 9px;
        line-height: 1.7;
    }


    /* ---------- SECURITY ---------- */

    .security-section {
        padding: 40px 0;
    }

    .security-shell {
        gap: 18px;
        padding: 16px;
    }

    .security-copy h2 {
        font-size: 24px;
    }

    .security-points {
        gap: 6px;
    }

    .security-points article {
        padding: 9px;
    }


    /* ---------- CTA ---------- */

    .cta-section {
        padding: 34px 0 40px;
    }

    .cta-box {
        gap: 17px;
        padding: 22px 18px;
    }

    .cta-copy h2 {
        font-size: 22px;
        line-height: 1.55;
    }

    .cta-actions {
        gap: 7px;
    }

    .cta-actions .button {
        min-height: 44px;
        padding-inline: 8px;
        font-size: 11px;
        font-weight: 850;
    }


    /* ---------- FOOTER ---------- */

    .footer-grid {
        gap: 22px 14px;
        padding-top: 34px;
        padding-bottom: 32px;
    }

    .footer-column h4 {
        margin-bottom: 8px;
    }

    .footer-column a,
    .footer-link-disabled {
        padding-block: 3px;
    }
}

/* MOBILE HERO CHECKS CLEANUP */
@media (max-width: 640px) {
    .hero-checks {
        display: none !important;
    }

    .hero-actions {
        margin-bottom: 0;
    }

    .hero-visual {
        margin-top: 2px;
    }
}

/* SEABUP_LOGO_ASSETS_V1 */
.site-brand-picture { display: inline-flex; align-items: center; }
.site-header .site-brand-logo { width: auto !important; height: 32px !important; object-fit: contain; }
.brand-footer .site-brand-logo,
.site-footer-brand-logo { width: auto !important; height: 26px !important; filter: none !important; opacity: 1 !important; }
@media (max-width: 640px) {
    .site-header .site-brand-logo { height: 28px !important; }
}

/* =========================================================
   LANDING_DYNAMIC_PRODUCTS_V1
   Products + plans come from the public Admin catalog.
   ========================================================= */

.products-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

.product-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 310px;
    padding: 24px;
    overflow: hidden;
    border: 1px solid #dde7e5;
    border-radius: 18px;
    background: #fff;
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.product-card:hover {
    transform: translateY(-3px);
    border-color: #c8ded7;
    box-shadow: 0 14px 36px rgba(16, 44, 60, .07);
}

.product-card-active {
    background: #fff;
    border-color: #d1e7df;
}

.product-card-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 28px;
}

.product-card h3 {
    margin: 15px 0 0;
    color: #243f4b;
    font-size: 18px;
    line-height: 1.75;
    font-weight: 900;
}

.product-card-description {
    margin: 10px 0 0;
    color: #71848c;
    font-size: 11px;
    line-height: 1.95;
}

.product-card .product-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 25px;
    padding: 3px 9px;
    border-radius: 999px;
    background: #f1f4f4;
    color: #7b8c93;
    font-size: 9px;
    font-weight: 850;
}

.product-card .product-tag-active {
    background: #e8f7f1;
    color: var(--brand-dark);
}

.product-price-box {
    margin-top: auto;
    padding-top: 25px;
}

.product-price-label {
    display: block;
    color: #7a8d94;
    font-size: 9px;
    font-weight: 700;
}

.product-price-value {
    display: block;
    margin-top: 3px;
    color: #1f3f4c;
    font-size: 17px;
    line-height: 1.65;
    font-weight: 950;
}

.product-price-value.is-coming-soon {
    color: #83939a;
    font-size: 14px;
}

.product-buy-button {
    width: 100%;
    min-height: 44px;
    margin-top: 18px;
    border: 0;
    border-radius: 11px;
    background: #e7f4ef;
    color: var(--brand-dark);
    font: inherit;
    font-size: 11px;
    font-weight: 900;
    cursor: pointer;
    transition:
        background .18s ease,
        color .18s ease,
        transform .18s ease;
}

.product-buy-button:hover {
    background: var(--brand);
    color: #fff;
}

.product-buy-button:active {
    transform: translateY(1px);
}

.product-plans {
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px solid #e7ecec;
}

.product-plans[hidden] {
    display: none;
}

.product-plan-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 10px 0;
}

.product-plan-row + .product-plan-row {
    border-top: 1px solid #edf1f1;
}

.product-plan-info {
    min-width: 0;
}

.product-plan-info strong,
.product-plan-info span {
    display: block;
}

.product-plan-info strong {
    color: #35515d;
    font-size: 10px;
    font-weight: 900;
}

.product-plan-info span {
    margin-top: 3px;
    color: #7e9097;
    font-size: 9px;
}

.product-plan-select {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid #d2e4de;
    border-radius: 9px;
    color: var(--brand-dark);
    background: #fff;
    font-size: 9px;
    font-weight: 850;
    white-space: nowrap;
}

.product-plan-select:hover {
    border-color: var(--brand);
    background: #f3faf7;
}

.product-card-coming-soon .product-buy-button {
    cursor: default;
    background: #f2f4f4;
    color: #83939a;
}

.products-loading,
.products-message {
    grid-column: 1 / -1;
    margin: 0;
    padding: 24px;
    border: 1px solid #e2e9e8;
    border-radius: 16px;
    background: #fafcfc;
    color: #75878e;
    font-size: 11px;
    text-align: center;
}

.products-message.error {
    color: #9a4e4e;
    background: #fffafa;
    border-color: #f0dede;
}

@media (max-width: 1080px) {
    .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .products-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .product-card {
        min-height: 0;
        padding: 20px;
        border-radius: 16px;
    }

    .product-card h3 {
        font-size: 16px;
    }

    .product-card-description {
        font-size: 10.5px;
    }

    .product-price-box {
        padding-top: 20px;
    }
}

/* LANDING_PRODUCTS_CENTER_V1 removed by specialized systems layout v2 */

/* LANDING_PRODUCTS_GRID_V2 removed by specialized systems layout v2 */

/* =========================================================
   LANDING PRODUCT CARDS V3
   ========================================================= */

.products-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: start;
    gap: 16px;
}

.product-card {
    position: relative;
    overflow: visible;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 430px;
    padding: 22px;
    border: 1px solid #dde8e5;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(16, 44, 60, .035);
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.product-card:hover {
    transform: translateY(-3px);
    border-color: #bcded3;
    box-shadow: 0 16px 38px rgba(16, 44, 60, .075);
}

.product-card-active {
    border-color: #bfe2d7;
    background:
        linear-gradient(
            180deg,
            rgba(7, 150, 111, .035),
            #fff 38%
        );
}

.product-card-coming-soon {
    background: #fbfcfc;
}

.product-card-head {
    min-height: 27px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.product-tag,
.product-offer-badge {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 850;
    line-height: 1;
}

.product-tag {
    background: #f0f3f4;
    color: #7b8c93;
}

.product-tag-active {
    background: #e7f7f1;
    color: #067a5c;
}

.product-offer-badge {
    background: #fff4df;
    color: #9b6500;
}

.product-card-main {
    margin-top: 22px;
}

.product-card-main h3 {
    margin: 0;
    color: #173744;
    font-size: 18px;
    line-height: 1.75;
    font-weight: 950;
}

.product-card-description {
    min-height: 46px;
    margin: 8px 0 0;
    color: #74868e;
    font-size: 10.5px;
    line-height: 2;
}

.product-features {
    margin-top: 20px;
    padding-top: 17px;
    border-top: 1px solid #edf2f1;
}

.product-features-title {
    display: block;
    margin-bottom: 10px;
    color: #526a73;
    font-size: 9px;
    font-weight: 900;
}

.product-features ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.product-features li {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 7px;
    color: #526a73;
    font-size: 9.5px;
    line-height: 1.7;
}

.product-feature-check {
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e8f7f1;
    color: #07966f;
    font-size: 10px;
    font-weight: 950;
}

.product-card-footer {
    margin-top: auto;
    padding-top: 22px;
}

.product-price-box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 82px;
}

.product-price-label {
    color: #819198;
    font-size: 9px;
    font-weight: 750;
}

.product-old-price {
    margin-top: 5px;
    color: #9ca9ae;
    font-size: 9px;
}

.product-price-value {
    margin-top: 3px;
    color: #153b46;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 950;
}

.product-price-value.is-coming-soon {
    color: #87969c;
}

.product-offer-title {
    margin-top: 3px;
    color: #078765;
    font-size: 8.5px;
    font-weight: 800;
}

.product-buy-button {
    width: 100%;
    min-height: 48px;
    margin-top: 13px;
    border: 1px solid #07966f;
    border-radius: 13px;
    background: #07966f;
    color: #fff;
    font: inherit;
    font-size: 10.5px;
    font-weight: 900;
    cursor: pointer;
    transition:
        background .18s ease,
        border-color .18s ease,
        transform .18s ease;
}

.product-buy-button:hover:not(:disabled) {
    background: #067e5e;
    border-color: #067e5e;
}

.product-buy-button:active:not(:disabled) {
    transform: translateY(1px);
}

.product-buy-button:disabled {
    border-color: #e5e9ea;
    background: #f0f2f3;
    color: #8a989e;
    cursor: default;
}

.product-plans {
    margin-top: 10px;
    overflow: hidden;
    border: 1px solid #e4ece9;
    border-radius: 13px;
    background: #fff;
}

.product-plan-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px;
}

.product-plan-row + .product-plan-row {
    border-top: 1px solid #edf2f1;
}

.product-plan-info {
    min-width: 0;
}

.product-plan-info > strong,
.product-plan-info > span {
    display: block;
}

.product-plan-info > strong {
    color: #294955;
    font-size: 10px;
}

.product-plan-info > span {
    margin-top: 2px;
    color: #84949a;
    font-size: 8px;
}

.product-plan-price {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 5px;
}

.product-plan-price del {
    color: #a0abad;
    font-size: 7.5px;
}

.product-plan-price b {
    color: #087b5e;
    font-size: 8.5px;
}

.product-plan-select {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 5px 10px;
    border-radius: 9px;
    background: #e9f7f2;
    color: #067a5c;
    font-size: 8.5px;
    font-weight: 900;
}

@media (max-width: 1180px) {
    .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .product-card {
        min-height: 390px;
    }
}

@media (max-width: 640px) {
    .products-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .product-card {
        min-height: 0;
        padding: 19px;
        border-radius: 17px;
    }

    .product-card-main {
        margin-top: 17px;
    }

    .product-card-description {
        min-height: 0;
    }

    .product-price-box {
        min-height: 0;
    }

    .product-card-footer {
        padding-top: 18px;
    }
}

/* SeaBup hero title desktop size adjustment v1 */
@media (min-width: 769px) {
    .hero-content h1 {
        font-size: clamp(36px, 3.2vw, 46px);
        line-height: 1.45;
        letter-spacing: -.6px;
    }
}

/* SeaBup hero keyword highlights v1 */
.hero-content h1 .hero-highlight {
    color: var(--brand);
    font: inherit;
}

/* SeaBup dual hero product preview v1 */

.hero-showcase {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(150px, .34fr);

    align-items: stretch;
    gap: 14px;
}

/* Both visual cards share exactly the same grid-row height. */
.hero-showcase .hero-desktop-preview,
.hero-mobile-preview {
    height: 100%;
}

.hero-mobile-preview {
    position: relative;
    min-width: 0;
    overflow: hidden;

    border: 1px solid #dae5e8;
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--shadow-md);
}

.hero-mobile-preview img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    display: block;
    object-fit: cover;
    object-position: top center;
}

/* Tablet */
@media (max-width: 1080px) {
    .hero-showcase {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(135px, .34fr);
        gap: 11px;
    }
}

/* Mobile landing */
@media (max-width: 640px) {
    .hero-showcase {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(88px, 30%);
        gap: 6px;
    }

    .hero-mobile-preview {
        border-radius: 14px;
    }
}

/* SeaBup dual hero layout v2 */

/*
 * HTML order:
 * 1. desktop
 * 2. mobile
 *
 * Landing is RTL, so the grid previously rendered them visually reversed.
 * LTR is applied only to the showcase layout and RTL is restored inside cards.
 */
.hero-showcase {
    direction: ltr;
    overflow: visible;
}

.hero-desktop-preview,
.hero-mobile-preview {
    direction: rtl;
}

/*
 * Desktop:
 * Keep the bottom edge exactly where it is and extend both previews upward.
 */
@media (min-width: 861px) {
    .hero-desktop-preview,
    .hero-mobile-preview {
        transform: scaleY(1.12);
        transform-origin: center bottom;
    }
}

/*
 * Don't vertically stretch the previews on tablet/mobile.
 */
@media (max-width: 860px) {
    .hero-desktop-preview,
    .hero-mobile-preview {
        transform: none;
    }
}


/* SeaBup specialized systems approved design v1 */

#products.products-section {
    position: relative;
    overflow: hidden;
    padding: 78px 0 88px;
    background:
        radial-gradient(
            70% 36% at 9% 100%,
            rgba(7,150,111,.055),
            transparent 72%
        ),
        radial-gradient(
            70% 34% at 92% 100%,
            rgba(7,150,111,.045),
            transparent 72%
        ),
        #fff;
}

#products .page-container {
    position: relative;
    z-index: 1;
    width: min(
        1480px,
        calc(100% - 64px)
    );
}

#products .section-heading {
    max-width: 920px;
    margin: 0 auto 34px;
}

#products .section-kicker {
    color: #078866;
    font-size: 12px;
    font-weight: 900;
}

#products .section-heading h2 {
    margin-top: 8px;
    color: #071c36;
    font-size: clamp(
        34px,
        3.4vw,
        48px
    );
    line-height: 1.4;
    font-weight: 950;
}

#products .section-heading p {
    max-width: 840px;
    margin: 7px auto 0;
    color: #6b7c91;
    font-size: 13px;
    line-height: 2;
}


#landingProductsGrid.products-grid {
    display: grid;
    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );
    align-items: stretch;
    gap: 18px;
}


#landingProductsGrid .product-card {

    --card-accent: #74869a;
    --card-soft: #f1f4f7;
    --card-strip: #d5dde5;

    position: relative;
    overflow: hidden;

    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 640px;

    padding:
        0
        24px
        22px;

    border:
        1px solid
        #dce5e9;

    border-radius: 19px;

    background:
        rgba(
            255,
            255,
            255,
            .98
        );

    box-shadow:
        0 10px 30px
        rgba(
            18,
            42,
            58,
            .035
        );

    transition:
        transform 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease;
}


#landingProductsGrid
.product-card::before {

    content: "";

    position: absolute;

    top: 0;
    right: 0;
    left: 0;

    height: 7px;

    background:
        var(--card-strip);
}


#landingProductsGrid
.product-theme-net {

    --card-accent: #6848e7;
    --card-soft: #f1edff;
    --card-strip: #b29cff;
}


#landingProductsGrid
.product-theme-fuel {

    --card-accent: #e96c18;
    --card-soft: #fff1e5;
    --card-strip: #ffc18c;
}


#landingProductsGrid
.product-theme-cargo {

    --card-accent: #2582df;
    --card-soft: #ecf5ff;
    --card-strip: #9bcdf9;
}


#landingProductsGrid
.product-theme-fishing {

    --card-accent: #07966f;
    --card-soft: #e8f8f1;
    --card-strip: #82d9bc;
}


#landingProductsGrid
.product-card-active {

    border:
        2px solid
        #0aa677;

    background:
        linear-gradient(
            180deg,
            rgba(
                232,
                248,
                241,
                .72
            ) 0,
            rgba(
                255,
                255,
                255,
                .98
            ) 34%
        );

    box-shadow:
        0 16px 36px
        rgba(
            7,
            150,
            111,
            .075
        );
}


#landingProductsGrid
.product-card:hover {

    transform:
        translateY(-3px);

    border-color:
        var(--card-accent);

    box-shadow:
        0 18px 40px
        rgba(
            18,
            42,
            58,
            .07
        );
}


#landingProductsGrid
.product-card-head {

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 8px;

    min-height: 58px;

    padding-top: 15px;
}


#landingProductsGrid
.product-tag {

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;

    padding:
        0 12px;

    border-radius:
        999px;

    background:
        #f1f4f7;

    color:
        #6d7f92;

    font-size:
        10px;

    font-weight:
        900;
}


#landingProductsGrid
.product-tag::after {

    content: "";

    width: 7px;
    height: 7px;

    margin-right:
        7px;

    border:
        2px solid
        currentColor;

    border-radius:
        50%;

    opacity:
        .8;
}


#landingProductsGrid
.product-tag-active {

    background:
        #dff6ed;

    color:
        #078560;
}


#landingProductsGrid
.product-tag-active::after {

    border: 0;

    background:
        currentColor;
}


#landingProductsGrid
.product-offer-badge {

    display:
        inline-flex;

    align-items:
        center;

    min-height:
        28px;

    padding:
        0 9px;

    border-radius:
        999px;

    background:
        #fff2e8;

    color:
        #d95c0a;

    font-size:
        9px;

    font-weight:
        900;
}


#landingProductsGrid
.product-visual {

    height:
        160px;

    display:
        grid;

    place-items:
        center;

    margin:
        0 -10px 4px;

    overflow:
        hidden;
}


#landingProductsGrid
.product-visual img {

    width:
        100%;

    height:
        100%;

    display:
        block;

    object-fit:
        contain;

    object-position:
        center;

    pointer-events:
        none;
}


#landingProductsGrid
.product-card-main {

    padding:
        4px 0 0;

    text-align:
        center;
}


#landingProductsGrid
.product-card-main h3 {

    margin:
        0;

    color:
        #071c36;

    font-size:
        18px;

    line-height:
        1.65;

    font-weight:
        950;
}


#landingProductsGrid
.product-card-description {

    min-height:
        70px;

    margin:
        9px 0 0;

    color:
        #728198;

    font-size:
        11px;

    line-height:
        2;
}


#landingProductsGrid
.product-features {

    margin-top:
        17px;

    padding-top:
        18px;

    border-top:
        1px solid
        #e4e9ec;
}


#landingProductsGrid
.product-features-title {

    display:
        block;

    margin-bottom:
        10px;

    color:
        var(--card-accent);

    font-size:
        11px;

    font-weight:
        950;
}


#landingProductsGrid
.product-features ul {

    display:
        grid;

    gap:
        8px;

    margin:
        0;

    padding:
        0;

    list-style:
        none;
}


#landingProductsGrid
.product-features li {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    color:
        #69798f;

    font-size:
        10px;

    line-height:
        1.7;
}


#landingProductsGrid
.product-feature-check {

    width:
        22px;

    height:
        22px;

    flex:
        0 0 22px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        var(--card-soft);

    color:
        var(--card-accent);

    font-size:
        11px;

    font-weight:
        950;
}


#landingProductsGrid
.product-card-footer {

    display:
        grid;

    gap:
        12px;

    margin-top:
        auto;

    padding-top:
        18px;

    border-top:
        1px solid
        #e4e9ec;
}


#landingProductsGrid
.product-card-footer.is-coming-soon {

    border-top:
        0;
}


#landingProductsGrid
.product-price-box {

    display:
        grid;

    gap:
        3px;

    min-height:
        0;
}


#landingProductsGrid
.product-price-label {

    color:
        #768599;

    font-size:
        10px;

    font-weight:
        700;
}


#landingProductsGrid
.product-old-price {

    color:
        #9ba7b4;

    font-size:
        10px;
}


#landingProductsGrid
.product-price-value {

    color:
        #078560;

    font-size:
        22px;

    line-height:
        1.5;

    font-weight:
        950;
}


#landingProductsGrid
.product-offer-title {

    color:
        #d95c0a;

    font-size:
        9px;

    font-weight:
        850;
}


#landingProductsGrid
.product-buy-button {

    width:
        100%;

    min-height:
        54px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        12px;

    padding:
        0 17px;

    border:
        0;

    border-radius:
        12px;

    background:
        #07966f;

    color:
        #fff;

    font:
        inherit;

    font-size:
        11px;

    font-weight:
        950;

    cursor:
        pointer;
}


#landingProductsGrid
.product-buy-button:hover:not(:disabled) {

    background:
        #07845f;

    transform:
        translateY(-1px);
}


#landingProductsGrid
.product-buy-button:disabled {

    border:
        1px solid
        #dbe3e7;

    background:
        linear-gradient(
            180deg,
            #f5f7f8,
            #edf1f3
        );

    color:
        #738398;

    cursor:
        default;
}


#landingProductsGrid
.product-button-arrow {

    font-size:
        18px;

    line-height:
        1;
}


#landingProductsGrid
.product-coming-clock {

    position:
        relative;

    width:
        17px;

    height:
        17px;

    border:
        1.7px solid
        currentColor;

    border-radius:
        50%;
}


#landingProductsGrid
.product-coming-clock::before {

    content: "";

    position:
        absolute;

    top:
        3px;

    right:
        7px;

    width:
        1.5px;

    height:
        5px;

    border-radius:
        2px;

    background:
        currentColor;
}


#landingProductsGrid
.product-coming-clock::after {

    content: "";

    position:
        absolute;

    top:
        8px;

    right:
        4px;

    width:
        4px;

    height:
        1.5px;

    border-radius:
        2px;

    background:
        currentColor;

    transform:
        rotate(20deg);

    transform-origin:
        right center;
}


#landingProductsGrid
.product-plans {

    display:
        grid;

    gap:
        8px;

    padding-top:
        2px;
}


#landingProductsGrid
.product-plans[hidden] {

    display:
        none;
}


#landingProductsGrid
.product-plan-row {

    display:
        grid;

    grid-template-columns:
        minmax(0,1fr)
        auto;

    align-items:
        center;

    gap:
        10px;

    padding:
        11px;

    border:
        1px solid
        #e3e9ec;

    border-radius:
        10px;

    background:
        #f9fbfb;
}


#landingProductsGrid
.product-plan-info {

    min-width:
        0;

    display:
        grid;

    gap:
        3px;
}


#landingProductsGrid
.product-plan-info strong {

    color:
        #18354a;

    font-size:
        10px;
}


#landingProductsGrid
.product-plan-info > span {

    color:
        #7a8998;

    font-size:
        9px;
}


#landingProductsGrid
.product-plan-price {

    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        5px;
}


#landingProductsGrid
.product-plan-price del {

    color:
        #9ba7b4;

    font-size:
        8px;
}


#landingProductsGrid
.product-plan-price b {

    color:
        #078560;

    font-size:
        10px;
}


#landingProductsGrid
.product-plan-select {

    min-height:
        34px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0 11px;

    border-radius:
        8px;

    background:
        #e8f7f1;

    color:
        #078560;

    font-size:
        9px;

    font-weight:
        900;
}


@media (max-width:1180px) {

    #products .page-container {

        width:
            min(
                1040px,
                calc(100% - 48px)
            );
    }


    #landingProductsGrid.products-grid {

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    #landingProductsGrid
    .product-card {

        min-height:
            610px;
    }
}


@media (max-width:700px) {

    #products.products-section {

        padding:
            52px 0 58px;
    }


    #products .page-container {

        width:
            calc(100% - 30px);
    }


    #products .section-heading {

        margin-bottom:
            24px;
    }


    #products .section-heading h2 {

        font-size:
            27px;
    }


    #products .section-heading p {

        font-size:
            11px;
    }


    #landingProductsGrid.products-grid {

        grid-template-columns:
            1fr;

        gap:
            13px;
    }


    #landingProductsGrid
    .product-card {

        min-height:
            0;

        padding:
            0 18px 18px;

        border-radius:
            16px;
    }


    #landingProductsGrid
    .product-card-head {

        min-height:
            52px;
    }


    #landingProductsGrid
    .product-visual {

        height:
            155px;

        margin-inline:
            -6px;
    }


    #landingProductsGrid
    .product-card-description {

        min-height:
            0;
    }


    #landingProductsGrid
    .product-card-main h3 {

        font-size:
            16px;
    }
}


@media (prefers-reduced-motion: reduce) {

    #landingProductsGrid
    .product-card,

    #landingProductsGrid
    .product-buy-button {

        transition:
            none;
    }
}


/* SeaBup specialized systems layout fix v2 */

/*
 * Legacy product-grid rules previously assigned an explicit
 * width/max-width to every card. The approved design uses
 * native CSS Grid sizing instead.
 */

#landingProductsGrid.products-grid {
    display: grid;
    width: 100%;
    margin-inline: auto;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    align-items: stretch;
    justify-content: stretch;

    gap: 18px;
}

#landingProductsGrid.products-grid
> .product-card {
    width: auto;
    max-width: none;
    min-width: 0;

    flex: none;

    justify-self: stretch;
    align-self: stretch;
}


/* Large desktop */
@media (min-width: 1181px) {

    #products .page-container {
        width: min(
            1480px,
            calc(100% - 64px)
        );
    }

    #landingProductsGrid.products-grid {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

}


/* Tablet / small desktop */
@media (min-width: 701px) and (max-width: 1180px) {

    #landingProductsGrid.products-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* Mobile */
@media (max-width: 700px) {

    #landingProductsGrid.products-grid {
        grid-template-columns: 1fr;
    }

    #landingProductsGrid.products-grid
    > .product-card {
        width: 100%;
        max-width: none;
    }

}


/* SeaBup specialized systems container v3 */

/*
 * Keep the specialized-systems section aligned with
 * the main landing-page content column.
 */

#products .page-container {
    width: min(
        var(--container),
        calc(100% - 64px)
    );
}

@media (min-width: 1181px) {

    #products .page-container {
        width: min(
            var(--container),
            calc(100% - 64px)
        );
    }

    #landingProductsGrid.products-grid {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
        gap: 18px;
    }
}

@media (max-width: 1180px) and (min-width: 701px) {

    #products .page-container {
        width: min(
            var(--container),
            calc(100% - 48px)
        );
    }
}

@media (max-width: 700px) {

    #products .page-container {
        width: calc(100% - 30px);
    }
}


/* SeaBup specialized systems compact height v4 */

@media (min-width: 1181px) {

    #landingProductsGrid .product-card {
        min-height: 520px;
        padding-bottom: 18px;
    }

    #landingProductsGrid .product-card-head {
        min-height: 48px;
        padding-top: 11px;
    }

    #landingProductsGrid .product-visual {
        height: 132px;
        margin-bottom: 2px;
    }

    #landingProductsGrid .product-card-main {
        padding-top: 1px;
    }

    #landingProductsGrid .product-card-main h3 {
        font-size: 17px;
        line-height: 1.55;
    }

    #landingProductsGrid .product-card-description {
        min-height: 52px;
        margin-top: 6px;
        line-height: 1.85;
    }

    #landingProductsGrid .product-features {
        margin-top: 12px;
        padding-top: 13px;
    }

    #landingProductsGrid .product-features-title {
        margin-bottom: 7px;
    }

    #landingProductsGrid .product-features ul {
        gap: 6px;
    }

    #landingProductsGrid .product-feature-check {
        width: 19px;
        height: 19px;
        flex-basis: 19px;
    }

    #landingProductsGrid .product-card-footer {
        gap: 8px;
        padding-top: 13px;
    }

    #landingProductsGrid .product-price-value {
        font-size: 19px;
    }

    #landingProductsGrid .product-buy-button {
        min-height: 46px;
    }
}



/* SeaBup product content order v5 */

#landingProductsGrid
.product-card-description-bottom {
    min-height: 0;
    margin: 14px 0 0;
    padding-top: 12px;
    border-top: 1px solid #edf1f3;
    color: #728198;
    font-size: 10.5px;
    line-height: 1.9;
}

#landingProductsGrid
.product-features {
    margin-top: 14px;
}

@media (min-width: 1181px) {

    #landingProductsGrid
    .product-card-description-bottom {
        margin-top: 11px;
        padding-top: 10px;
    }
}



/* SeaBup remove product footer separator v6 */

#landingProductsGrid .product-card-footer {
    border-top: 0;
}



/* SeaBup modern feature icons v7 */

#landingProductsGrid
.product-feature-check {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 0;
    border-radius: 0;

    background: transparent;
    color: var(--card-accent);

    font-size: 0;
}

#landingProductsGrid
.product-feature-check .ui-icon {
    width: 18px;
    height: 18px;
    display: block;
}

#landingProductsGrid
.product-features li {
    gap: 7px;
}



/* SeaBup landing color balance v8 */


/* =========================================================
   1) PRODUCT ACCENTS — SAME VISUAL WEIGHT
   ========================================================= */

#landingProductsGrid .product-theme-net {
    --card-accent: #735bd6;
    --card-soft: #f2effc;
    --card-strip: #b5a7ec;
}

#landingProductsGrid .product-theme-fuel {
    --card-accent: #d8782d;
    --card-soft: #fff3e9;
    --card-strip: #efbd94;
}

#landingProductsGrid .product-theme-cargo {
    --card-accent: #3b82c4;
    --card-soft: #eef6fc;
    --card-strip: #a7cdea;
}

/*
 * Fishing remains intentionally stronger because it is
 * the active / primary product.
 */


/* =========================================================
   2) KEY FEATURES — SLIGHTLY STRONGER GREEN
   ========================================================= */

.advantages-section .advantage-icon {
    background: #e3f5ef;
    border: 1px solid #d0eae1;
    color: #078b67;
}

.advantages-section .advantage-icon .ui-icon {
    opacity: 1;
}


/* =========================================================
   3) START STEPS — MORE VISIBLE ICONS
   ========================================================= */

.steps-section .step-icon {
    border-color: #c7e5da;
    background: #e3f5ef;
    color: #078b67;
}

.steps-section .step-icon .ui-icon {
    opacity: 1;
}



/* SeaBup remove product top strips v9 */

#landingProductsGrid .product-card::before {
    content: none;
    display: none;
}



/* SeaBup product CTA blue hover v10 */

#landingProductsGrid
.product-buy-button {
    transition:
        background-color 170ms ease,
        border-color 170ms ease,
        box-shadow 170ms ease,
        transform 170ms ease;
}

#landingProductsGrid
.product-buy-button:hover:not(:disabled) {
    background: #2f80d0;
    border-color: #2f80d0;
    box-shadow: 0 8px 20px rgba(47, 128, 208, .18);
    transform: translateY(-1px);
}

#landingProductsGrid
.product-buy-button:active:not(:disabled) {
    background: #256bb0;
    border-color: #256bb0;
    box-shadow: none;
    transform: translateY(0);
}



/* SeaBup product card blue hover v10 */

#landingProductsGrid .product-card {
    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

#landingProductsGrid .product-card:hover {
    --card-accent: #2f80d0;
    --card-soft: #edf6ff;

    border-color: #2f80d0;

    background:
        linear-gradient(
            180deg,
            rgba(237, 246, 255, .82) 0%,
            rgba(255, 255, 255, .98) 38%
        );

    box-shadow:
        0 16px 34px
        rgba(47, 128, 208, .13);

    transform: translateY(-3px);
}

/* CTA remains SeaBup green */
#landingProductsGrid
.product-buy-button:hover:not(:disabled) {
    background: #07845f;
    border-color: #07845f;
    box-shadow: none;
}



/* SeaBup per-product theme hover v11 */


/* =========================================================
   HOVER COLOR BY PRODUCT
   ========================================================= */

#landingProductsGrid
.product-card.product-theme-fishing:hover {
    --hover-accent: #07966f;
    --hover-soft: #eef9f5;
    --hover-rgb: 7, 150, 111;

    --card-accent: #07966f;
    --card-soft: #eef9f5;
}

#landingProductsGrid
.product-card.product-theme-cargo:hover {
    --hover-accent: #3b82c4;
    --hover-soft: #eef6fc;
    --hover-rgb: 59, 130, 196;

    --card-accent: #3b82c4;
    --card-soft: #eef6fc;
}

#landingProductsGrid
.product-card.product-theme-fuel:hover {
    --hover-accent: #d8782d;
    --hover-soft: #fff3e9;
    --hover-rgb: 216, 120, 45;

    --card-accent: #d8782d;
    --card-soft: #fff3e9;
}

#landingProductsGrid
.product-card.product-theme-net:hover {
    --hover-accent: #735bd6;
    --hover-soft: #f2effc;
    --hover-rgb: 115, 91, 214;

    --card-accent: #735bd6;
    --card-soft: #f2effc;
}


/* =========================================================
   CARD
   ========================================================= */

#landingProductsGrid
.product-card.product-theme-fishing:hover,

#landingProductsGrid
.product-card.product-theme-cargo:hover,

#landingProductsGrid
.product-card.product-theme-fuel:hover,

#landingProductsGrid
.product-card.product-theme-net:hover {
    border-color: var(--hover-accent);

    background:
        linear-gradient(
            180deg,
            var(--hover-soft) 0%,
            #ffffff 34%
        );

    box-shadow:
        0 16px 34px
        rgba(var(--hover-rgb), .14);

    transform: translateY(-3px);
}


/* =========================================================
   FEATURE ACCENTS
   ========================================================= */

#landingProductsGrid
.product-card:hover
.product-feature-check {
    color: var(--hover-accent);
}

#landingProductsGrid
.product-card:hover
.product-features-title,

#landingProductsGrid
.product-card:hover
.product-card-features-title {
    color: var(--hover-accent);
}


/* =========================================================
   PRICE
   ========================================================= */

#landingProductsGrid
.product-card:hover
.product-price,

#landingProductsGrid
.product-card:hover
.product-price-value,

#landingProductsGrid
.product-card:hover
.product-card-price,

#landingProductsGrid
.product-card:hover
.product-card-price-value {
    color: var(--hover-accent);
}


/* =========================================================
   STATUS BADGE
   ========================================================= */

#landingProductsGrid
.product-card:hover
.product-status-badge,

#landingProductsGrid
.product-card:hover
.product-card-status,

#landingProductsGrid
.product-card:hover
.product-badge {
    color: var(--hover-accent);
    background: var(--hover-soft);
}


/* =========================================================
   ACTIVE CTA
   ========================================================= */

#landingProductsGrid
.product-card:hover
.product-buy-button:not(:disabled) {
    background: var(--hover-accent);
    border-color: var(--hover-accent);
    color: #fff;

    box-shadow:
        0 7px 18px
        rgba(var(--hover-rgb), .16);
}


/* Disabled / coming soon stays disabled */

#landingProductsGrid
.product-card:hover
.product-buy-button:disabled {
    box-shadow: none;
    transform: none;
}


/* Smooth color change */

#landingProductsGrid .product-feature-check,
#landingProductsGrid .product-buy-button,
#landingProductsGrid .product-status-badge,
#landingProductsGrid .product-card-status,
#landingProductsGrid .product-badge,
#landingProductsGrid .product-price,
#landingProductsGrid .product-price-value,
#landingProductsGrid .product-card-price,
#landingProductsGrid .product-card-price-value {
    transition:
        color 180ms ease,
        background-color 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease;
}



/* SeaBup product sales emphasis v12 */


/* =========================================================
   MAIN FEATURES TITLE
   ========================================================= */

#landingProductsGrid .product-features-title,
#landingProductsGrid .product-card-features-title {
    font-size: 16px;
    font-weight: 800;
    line-height: 1.7;
    letter-spacing: -0.15px;
    margin-bottom: 10px;
}


/* =========================================================
   DISCOUNT / OFFER BADGE
   ========================================================= */

#landingProductsGrid .product-offer-badge,
#landingProductsGrid .product-card-offer-badge,
#landingProductsGrid .offer-badge,
#landingProductsGrid .product-discount-badge,
#landingProductsGrid .product-card-discount {
    min-height: 38px;
    padding: 7px 14px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #fecaca;
    border-radius: 999px;

    background: #fff1f2;
    color: #dc2626;

    font-size: 14px;
    font-weight: 800;
    line-height: 1;

    box-shadow:
        0 3px 10px rgba(220, 38, 38, .08);

    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}


/* Discount stays red even when the product card is hovered */

#landingProductsGrid .product-card:hover .product-offer-badge,
#landingProductsGrid .product-card:hover .product-card-offer-badge,
#landingProductsGrid .product-card:hover .offer-badge,
#landingProductsGrid .product-card:hover .product-discount-badge,
#landingProductsGrid .product-card:hover .product-card-discount {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;

    box-shadow:
        0 5px 14px rgba(220, 38, 38, .13);

    transform: translateY(-1px);
}


/* Mobile */

@media (max-width: 768px) {
    #landingProductsGrid .product-features-title,
    #landingProductsGrid .product-card-features-title {
        font-size: 15px;
    }

    #landingProductsGrid .product-offer-badge,
    #landingProductsGrid .product-card-offer-badge,
    #landingProductsGrid .offer-badge,
    #landingProductsGrid .product-discount-badge,
    #landingProductsGrid .product-card-discount {
        min-height: 36px;
        padding: 7px 12px;
        font-size: 13px;
    }
}



/* SeaBup old price emphasis v13 */


/* =========================================================
   DISCOUNT BADGE — BACK TO SUBTLE STYLE
   ========================================================= */

#landingProductsGrid .product-offer-badge,
#landingProductsGrid .product-card-offer-badge,
#landingProductsGrid .offer-badge,
#landingProductsGrid .product-discount-badge,
#landingProductsGrid .product-card-discount,
#landingProductsGrid .product-card:hover .product-offer-badge,
#landingProductsGrid .product-card:hover .product-card-offer-badge,
#landingProductsGrid .product-card:hover .offer-badge,
#landingProductsGrid .product-card:hover .product-discount-badge,
#landingProductsGrid .product-card:hover .product-card-discount {
    min-height: 30px;
    padding: 5px 10px;

    background: #fff7ed;
    border-color: #fed7aa;
    color: #ea580c;

    font-size: 12px;
    font-weight: 700;

    box-shadow: none;
    transform: none;
}


/* =========================================================
   ORIGINAL / BEFORE-DISCOUNT PRICE
   ========================================================= */

#landingProductsGrid .product-card del,
#landingProductsGrid .product-original-price,
#landingProductsGrid .product-price-original,
#landingProductsGrid .product-old-price,
#landingProductsGrid .original-price {
    display: inline-block;

    color: #dc2626 !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.6;

    text-decoration-color: #dc2626;
    text-decoration-thickness: 1.5px;

    opacity: 1 !important;
}


/* A little stronger on desktop */

@media (min-width: 769px) {
    #landingProductsGrid .product-card del,
    #landingProductsGrid .product-original-price,
    #landingProductsGrid .product-price-original,
    #landingProductsGrid .product-old-price,
    #landingProductsGrid .original-price {
        font-size: 16px !important;
    }
}



/* SeaBup product card height v14 */

@media (min-width: 769px) {
    #landingProductsGrid .product-card {
        min-height: 480px !important;
    }
}



/* SeaBup product card compact v15 */

@media (min-width: 769px) {

    /* Let real content define the card height */
    #landingProductsGrid .product-card {
        min-height: 0 !important;
        padding-bottom: 16px;
    }

    /* Title area */
    #landingProductsGrid .product-card-main {
        margin-top: 14px;
        padding-top: 2px;
    }

    /* Features */
    #landingProductsGrid .product-features {
        margin-top: 14px;
        padding-top: 12px;
    }

    #landingProductsGrid .product-features-title,
    #landingProductsGrid .product-card-features-title {
        margin-bottom: 6px;
    }

    #landingProductsGrid .product-features ul {
        gap: 6px;
    }

    /* Description */
    #landingProductsGrid .product-card-description {
        min-height: 38px;
        margin-top: 6px;
        line-height: 1.85;
    }

    /* Price / CTA */
    #landingProductsGrid .product-card-footer {
        padding-top: 10px;
    }

    #landingProductsGrid .product-price-box {
        min-height: 64px;
    }
}


/* SeaBup product plans in-card styles v19 */

#landingProductsGrid .product-card {
    position: relative;
    overflow: hidden;
}


/* =========================================================
   PANEL INSIDE THE CARD
   ========================================================= */

#landingProductsGrid
.product-card-plans-layer[hidden] {
    display: none !important;
}

#landingProductsGrid
.product-card-plans-layer {
    --plan-accent: #07966f;

    position: absolute;

    top: auto;
    right: 0;
    bottom: 0;
    left: 0;

    width: 100%;
    height: auto;
    max-height: 100%;

    z-index: 40;

    display: flex;
    flex-direction: column;

    overflow: hidden;

    border-radius: inherit;

    background:
        rgba(255,255,255,.985);

    box-shadow:
        inset 0 3px 0
        var(--plan-accent);

    opacity: 0;

    transform:
        translateY(100%);

    pointer-events: none;

    transition:
        transform 220ms
            cubic-bezier(.2,.75,.25,1),
        opacity 160ms ease;
}

#landingProductsGrid
.product-card-plans-layer.is-open {
    opacity: 1;

    transform:
        translateY(0);

    pointer-events: auto;
}


/* =========================================================
   PANEL HEADER
   ========================================================= */

#landingProductsGrid
.product-card-plans-head {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;

    gap: 14px;

    padding:
        20px 18px 14px;

    border-bottom:
        1px solid #edf2f1;

    text-align: right;

    flex: 0 0 auto;
}

#landingProductsGrid
.product-card-plans-kicker {
    display: block;

    margin-bottom: 4px;

    color:
        var(--plan-accent);

    font-size: 10px;
    font-weight: 900;
}

#landingProductsGrid
.product-card-plans-title {
    margin: 0;

    color: #102e3b;

    font-size: 17px;
    line-height: 1.65;
    font-weight: 950;
}

#landingProductsGrid
.product-card-plans-head p {
    margin: 3px 0 0;

    color: #819198;

    font-size: 9px;
    line-height: 1.8;
}

#landingProductsGrid
.product-card-plans-close {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    display: grid;
    place-items: center;

    padding: 0;

    border:
        1px solid #dce6e4;

    border-radius: 10px;

    background: #f7faf9;

    color: #667a82;

    font-family: inherit;
    font-size: 20px;

    cursor: pointer;
}

#landingProductsGrid
.product-card-plans-close:hover {
    border-color:
        var(--plan-accent);

    background: #fff;

    color:
        var(--plan-accent);
}


/* =========================================================
   PLAN LIST
   ========================================================= */

#landingProductsGrid
.product-card-plans-list {
    display: grid;
    min-height: 0;
    gap: 9px;

    padding:
        14px 16px 18px;

    overflow-y: auto;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-row {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 12px;

    padding: 12px;

    border:
        1px solid #e2ebe8 !important;

    border-radius: 12px;

    background: #fff;

    transition:
        border-color 160ms ease,
        box-shadow 160ms ease;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-row:hover {
    border-color:
        var(--plan-accent) !important;

    box-shadow:
        0 5px 15px
        rgba(16,44,60,.06);
}

#landingProductsGrid
.product-card-plans-list
.product-plan-info {
    min-width: 0;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-info > strong {
    display: block;

    color: #284955;

    font-size: 11px;
    font-weight: 900;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-info > span {
    display: block;

    margin-top: 2px;

    color: #83949a;

    font-size: 8.5px;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-price {
    display: flex;

    align-items: center;
    flex-wrap: wrap;

    gap: 6px;

    margin-top: 5px;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-price del {
    color: #dc2626;

    font-size: 9px;
    font-weight: 700;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-price b {
    color:
        var(--plan-accent);

    font-size: 11px;
    font-weight: 950;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-select {
    min-height: 34px;

    padding:
        6px 11px;

    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid
        var(--plan-accent);

    border-radius: 9px;

    background: #fff;

    color:
        var(--plan-accent);

    font-size: 9px;
    font-weight: 900;
}

#landingProductsGrid
.product-card-plans-list
.product-plan-select:hover {
    background:
        var(--plan-accent);

    color: #fff;
}


/* Mobile remains inside its own card */

@media (max-width: 768px) {

    #landingProductsGrid
    .product-card-plans-head {
        padding:
            17px 15px 12px;
    }

    #landingProductsGrid
    .product-card-plans-list {
        padding:
            12px 13px 15px;
    }
}

/* =========================================================
   MOBILE PRODUCT CAROUSEL V2
   Balanced cards + horizontal swipe
   ========================================================= */

@media (max-width: 700px) {

    #landingProductsGrid.products-grid {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: stretch !important;

        width: 100% !important;

        gap: 10px !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        scroll-snap-type: x mandatory;
        scroll-padding-inline: 0;

        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;

        scrollbar-width: none;
    }

    #landingProductsGrid.products-grid::-webkit-scrollbar {
        display: none;
    }

    #landingProductsGrid.products-grid
    > .product-card {
        flex: 0 0 86% !important;

        width: 86% !important;
        min-width: 86% !important;
        max-width: 86% !important;

        height: auto !important;
        min-height: 0 !important;

        align-self: stretch !important;

        display: flex !important;
        flex-direction: column !important;

        padding:
            0 14px 14px !important;

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    #landingProductsGrid
    .product-visual {
        height: 138px !important;

        margin-inline:
            -4px !important;
    }

    #landingProductsGrid
    .product-card-head {
        min-height: 48px !important;
    }

    #landingProductsGrid
    .product-card-main {
        flex: 1 1 auto !important;

        display: flex !important;
        flex-direction: column !important;
    }

    #landingProductsGrid
    .product-card-description {
        min-height: 0 !important;
    }

    #landingProductsGrid
    .product-card-footer {
        margin-top: auto !important;

        padding-top: 14px !important;
    }

    #landingProductsGrid
    .product-buy-button {
        min-height: 46px !important;
    }
}

/* =========================================================
   MOBILE PRODUCT CARD — NO VERTICAL HOVER SHIFT
   Prevent top border clipping after touch/tap
   ========================================================= */

@media (max-width: 700px) {

    #landingProductsGrid.products-grid
    > .product-card:hover,

    #landingProductsGrid.products-grid
    > .product-card:active,

    #landingProductsGrid.products-grid
    > .product-card:focus-within {
        transform: none !important;
    }
}

/* =========================================================
   SEABUP MOBILE HEADER ACTIONS V1
   Hamburger -> Login + Free Start
   ========================================================= */

@media (max-width: 860px) {

    .header-inner {
        gap: 10px;
    }

    .main-nav {
        display: none !important;
    }

    .header-actions {
        margin-inline-start: auto;
        display: flex !important;
        align-items: center;
        gap: 7px;
    }

    .header-login,
    .header-start {
        min-height: 36px;
        padding-inline: 12px;
        border-radius: 9px;
        font-size: 11px;
        font-weight: 850;
        white-space: nowrap;
    }

    .header-login {
        border: 1px solid #d9e5e1;
        background: #fff;
        color: #284955;
    }

    .header-start {
        border: 1px solid #07966f;
        background: #07966f;
        color: #fff;
        box-shadow: none;
    }

    .landing-mobile-menu-button,
    .landing-mobile-nav {
        display: none !important;
    }
}

@media (max-width: 390px) {

    .header-inner {
        gap: 7px;
    }

    .header-login,
    .header-start {
        min-height: 34px;
        padding-inline: 10px;
        font-size: 10.5px;
    }
}


/* =========================================================
   SEABUP MOBILE HEADER ACTIONS V2
   Balance login / start buttons
   ========================================================= */

@media (max-width: 860px) {

    .header-login,
    .header-start {
        min-height: 36px !important;
        padding-inline: 14px !important;
        font-size: 11px !important;
        border-radius: 9px !important;
    }

    .header-login {
        min-width: 64px;
        border: 1px solid #cfded9 !important;
        background: #ffffff !important;
        color: #284955 !important;
    }

    .header-start {
        min-width: 88px;
    }
}

@media (max-width: 390px) {

    .header-login,
    .header-start {
        min-height: 34px !important;
        padding-inline: 11px !important;
        font-size: 10.5px !important;
    }

    .header-login {
        min-width: 58px;
    }

    .header-start {
        min-width: 82px;
    }
}