:root {
  color-scheme: dark;
  --navy-950: #040c16;
  --navy-900: #071524;
  --navy-850: #0a1c30;
  --navy-800: #102943;
  --gold-500: #dbaa3e;
  --gold-300: #f0d28a;
  --white: #f8fafc;
  --slate-100: #e9eef4;
  --slate-300: #b9c5d1;
  --slate-500: #7f91a4;
  --ink: #132237;
  --paper: #f6f7f8;
  --line-dark: rgba(255, 255, 255, .11);
  --line-light: #dfe4e9;
  --radius: 22px;
  --shadow: 0 28px 80px rgba(2, 12, 24, .24);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 108px; }
html { background: var(--paper); }
body { margin: 0; position: relative; z-index: 0; color: var(--ink); background: transparent; font-size: 17px; line-height: 1.65; }
img { max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
.skip-link { position: fixed; left: 16px; top: -70px; z-index: 1000; padding: 12px 18px; color: #071524; background: #fff; border-radius: 10px; font-weight: 800; }
.skip-link:focus { top: 14px; }
.section-shell { width: min(var(--site-width,1240px), 94vw); margin-inline: auto; }
@media (min-width: 1900px) {
  .section-shell { width: min(var(--site-width,1240px), 88vw); }
}
.section { padding-block: 104px; }
.soft-section { background: #edf0f3; border-block: 1px solid #e0e5e9; }
.dark-section, .product-section, .partner-section, .faq-section { color: var(--white); background: var(--navy-900); }
.eyebrow { margin: 0 0 14px; color: #a67815; font-size: 13px; font-weight: 900; letter-spacing: .16em; line-height: 1.35; text-transform: uppercase; }
.dark-section .eyebrow, .product-section .eyebrow, .partner-section .eyebrow, .faq-section .eyebrow, .hero .eyebrow { color: var(--gold-500); }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { margin-top: 0; line-height: 1.08; }
h1, h2 { font-family: Georgia, "Times New Roman", serif; }
.section-heading { margin-bottom: 44px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 20px; }
.section-heading > div { display: flex; flex-direction: column; align-items: center; }
.section-heading h2 { max-width: 760px; margin: 0; font-size: clamp(38px, 4.4vw, 62px); letter-spacing: -.035em; }
.section-heading > p { margin: 0 auto; max-width: 700px; color: #5e6c7d; font-size: 18px; line-height: 1.75; }
.section-heading.light > p { color: var(--slate-300); }
.lead { font-size: clamp(19px, 2vw, 23px); line-height: 1.7; }
.button { min-height: 54px; padding: 0 23px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 13px; font-size: 15px; font-weight: 850; text-align: center; text-decoration: none; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button.gold { color: #071524; background: linear-gradient(135deg, #f2d27f, #c88d23); box-shadow: 0 14px 30px rgba(219, 170, 62, .18); }
.button.outline { color: inherit; border-color: rgba(219, 170, 62, .48); background: rgba(219, 170, 62, .07); }
.button.disabled { color: #8996a3; border-color: #d7dde3; background: #eef1f3; pointer-events: none; }
.cta-actions { display: flex; flex-wrap: wrap; gap: 13px; }
.text-link { display: inline-flex; margin-top: 24px; color: #a7781a; font-weight: 850; text-decoration: none; }

.utility-bar { background: #05101d; border-bottom: 1px solid rgba(219, 170, 62, .18); }
.utility-bar-inner { min-height: 32px; padding: 6px max(24px, calc((100vw - 1240px) / 2)); margin: 0 auto; max-width: 1240px; display: flex; align-items: center; gap: 22px; }
.utility-bar a { display: inline-flex; align-items: center; gap: 6px; color: #9fb0c2; font-size: 12.5px; font-weight: 700; text-decoration: none; transition: color .2s ease; }
.utility-bar a:hover { color: var(--gold-300, #f0d28a); }
.utility-bar a span { color: var(--gold-500, #dbaa3e); font-size: 13px; }
@media(max-width: 820px) { .utility-bar { display: none; } }

.offer-bar { min-height: 38px; padding: 7px max(24px, calc((100vw - 1240px) / 2)); display: flex; justify-content: center; align-items: center; gap: 17px; color: #1b2736; background: linear-gradient(90deg, #f2d78f, #d8a83c); font-size: 13px; }
.offer-bar span { font-weight: 900; }
.offer-bar small { font-size: 12px; }
.offer-bar a { font-weight: 850; }
.site-header { min-height: 86px; padding: 0 max(24px, calc((100vw - 1240px) / 2)); position: sticky; top: 0; z-index: 80; display: flex; align-items: center; gap: 28px; color: var(--white); border-bottom: 1px solid var(--line-dark); background: rgba(5, 16, 29, .94); backdrop-filter: blur(18px); }
.company-brand { margin-right: auto; display: flex; align-items: center; gap: 13px; text-decoration: none; }
.company-brand img { width: 51px; height: 51px; display: block; object-fit: cover; border: 1px solid rgba(219, 170, 62, .52); border-radius: 14px; }
.company-brand span { display: grid; }
.company-brand b { color: var(--gold-500); font: 700 23px Georgia, serif; }
.company-brand small { margin-top: 3px; color: #8fa2b5; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.site-navigation { display: flex; align-items: center; gap: clamp(16px, 2vw, 29px); }
.site-navigation a { color: #c7d1db; font-size: 14px; font-weight: 700; text-decoration: none; }
.site-navigation a:hover { color: var(--gold-300); }
.header-cta { min-height: 46px; padding: 0 19px; display: inline-flex; align-items: center; border-radius: 12px; color: #071524; background: linear-gradient(135deg, #f0d17d, #c68b20); font-size: 14px; font-weight: 900; text-decoration: none; box-shadow: 0 0 0 rgba(219,170,62,0); transition: box-shadow .3s ease, transform .15s ease; }
.header-cta:hover { box-shadow: 0 0 22px rgba(219,170,62,.55); transform: translateY(-1px); }
.menu-toggle { display: none; }
.site-preferences { display: flex; gap: 6px; }
.site-preferences input { display: none; }
.site-preferences select { min-height: 38px; padding: 0 8px; color: #d8e0e8; border: 1px solid var(--line-dark); border-radius: 9px; background: #0a1b2e; font-size: 12px; font-weight: 800; }
.account-link { color: #f0d28a; font-size: 13px; font-weight: 850; text-decoration: none; white-space: nowrap; }
.nav-row-break { display: none; }
.offer-popup { width: min(420px,calc(100% - 30px)); padding: 29px; position: fixed; right: 20px; bottom: 20px; z-index: 120; color: #fff; border: 1px solid rgba(219,170,62,.48); border-radius: 22px; background: #091a2d; box-shadow: 0 25px 80px rgba(0,0,0,.35); }
.offer-popup>button { position: absolute; right: 12px; top: 10px; color: #fff; border: 0; background: transparent; font-size: 25px; cursor: pointer; }
.offer-popup h2 { margin: 8px 0 12px; font-size: 30px; }.offer-popup>p:not(.eyebrow){color:#b5c1cd}.offer-popup .button{margin-top:10px}

.hero { min-height: 760px; padding-block: 105px; position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr); gap: 78px; align-items: center; color: var(--white); }
.hero::before { content: ""; position: absolute; inset: 0 calc(50% - 50vw); z-index: -1; background: radial-gradient(circle at 80% 28%, rgba(26, 101, 146, .25), transparent 31rem), radial-gradient(circle at 12% 75%, rgba(219, 170, 62, .12), transparent 28rem), var(--navy-950); }
.hero h1, .hero h2 { margin: 0 0 28px; font-size: clamp(56px, 6.4vw, 88px); letter-spacing: -.055em; }
.hero h1 em, .hero h2 em { color: var(--gold-300); font-style: normal; }
.hero .lead { max-width: 760px; color: var(--slate-300); }
.hero .cta-actions { margin-top: 32px; }
.trust-row { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 18px; color: #aebcc9; font-size: 13px; }
.trust-row span::before { content: "✓"; margin-right: 8px; color: var(--gold-500); font-weight: 950; }
.hero-checklist { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 22px; color: #cdd8e3; font-size: 14px; }
.hero-checklist li { display: flex; align-items: center; }
.hero-checklist li::before { content: "✓"; margin-right: 8px; color: var(--gold-500); font-weight: 950; }
.featured-product { padding: 19px; border: 1px solid rgba(219, 170, 62, .27); border-radius: 27px; background: linear-gradient(145deg, rgba(16, 42, 68, .95), rgba(4, 14, 25, .97)); box-shadow: var(--shadow); }
.featured-banner { width: 100%; aspect-ratio: 16 / 9; display: block; object-fit: cover; border: 1px solid rgba(219, 170, 62, .3); border-radius: 18px; }
.product-brandline { display: flex; align-items: center; gap: 12px; }
.product-brandline img { width: 46px; height: 46px; display: block; object-fit: cover; border: 1px solid rgba(219, 170, 62, .56); border-radius: 50%; }
.product-brandline span { display: grid; }
.product-brandline b { color: inherit; font: 700 17px Georgia, serif; }
.product-brandline small { margin-top: 2px; color: #9dacba; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.featured-product > .product-brandline { margin: 20px 4px 0; }
.featured-product > p { margin: 16px 4px; color: var(--slate-300); font-size: 16px; }
.featured-product > a { margin: 0 4px 4px; display: flex; justify-content: space-between; color: var(--gold-300); font-size: 14px; font-weight: 850; text-decoration: none; }

.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.service-card { min-height: 265px; padding: 29px; border: 1px solid var(--line-light); border-radius: var(--radius); background: #fff; box-shadow: 0 12px 35px rgba(20, 35, 52, .04); }
.service-card > span { width: 49px; height: 49px; display: grid; place-items: center; color: #fff; border-radius: 14px; background: var(--navy-900); font-size: 13px; font-weight: 900; }
.service-card h3 { margin: 25px 0 12px; font-size: 23px; }
.service-card p { margin: 0; color: #677587; }

.dark-section { padding-block: 104px; }
.problem-grid { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line-dark); border-radius: 24px; overflow: hidden; }
.problem-grid article { min-height: 300px; padding: 27px 23px; border-right: 1px solid var(--line-dark); background: rgba(255, 255, 255, .025); }
.problem-grid article:last-child { border: 0; }
.problem-grid span { color: var(--gold-500); font: 700 14px Georgia, serif; }
.problem-grid h3 { margin: 74px 0 14px; font-size: 22px; }
.problem-grid p { margin: 0; color: #aebcca; font-size: 15px; }

.solution-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.solution-flow article { min-height: 330px; padding: 31px; border: 1px solid var(--line-light); border-radius: var(--radius); background: #fff; }
.solution-flow article > span { color: #c5942d; font: 700 38px Georgia, serif; }
.solution-flow small { margin-top: 43px; display: block; color: #a67815; font-size: 12px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.solution-flow h3 { margin: 10px 0 13px; font-size: 25px; }
.solution-flow p { margin: 0; color: #687688; }

.product-section { padding-block: 104px; background: radial-gradient(circle at 50% 0, rgba(30, 93, 130, .23), transparent 40rem), var(--navy-950); }
.product-showcase { display: grid; grid-template-columns: 1fr 1fr; gap: 23px; }
.product-card { padding: 32px; border: 1px solid rgba(219, 170, 62, .24); border-radius: 27px; background: linear-gradient(145deg, rgba(15, 42, 68, .94), rgba(5, 17, 29, .97)); box-shadow: 0 24px 70px rgba(0, 0, 0, .24); }
.product-card-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.product-card-top > em { padding: 7px 10px; color: var(--gold-300); border: 1px solid rgba(219, 170, 62, .28); border-radius: 999px; background: rgba(219, 170, 62, .07); font-size: 11px; font-style: normal; font-weight: 900; }
.product-card h3 { margin: 28px 0 14px; font-size: clamp(31px, 3vw, 43px); }
.product-card > p { color: #b5c2cf; font-size: 17px; }
.product-card ul, .catalog-card ul, .feature-list { margin: 23px 0; padding: 0; display: grid; gap: 10px; list-style: none; }
.product-card li, .catalog-card li, .feature-list li { display: flex; gap: 10px; }
.product-card li::before, .catalog-card li::before, .feature-list li::before { content: "✓"; color: var(--gold-500); font-weight: 950; }
.product-card dl { display: grid; gap: 11px; }
.product-card dl div { padding: 15px; border: 1px solid var(--line-dark); border-radius: 14px; background: rgba(255, 255, 255, .025); }
.product-card dt { color: var(--gold-300); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.product-card dd { margin: 5px 0 0; color: #b9c5d0; font-size: 14px; }
.product-price { margin: 23px 0; display: grid; }
.product-price span, .product-price small { color: #94a6b7; font-size: 12px; }
.product-price b { margin: 4px 0; color: var(--gold-300); font: 700 34px Georgia, serif; }
.demo-slot { margin-top: 23px; padding: 17px; display: grid; grid-template-columns: 43px 1fr; gap: 13px; border: 1px dashed rgba(255, 255, 255, .19); border-radius: 14px; }
.demo-slot > span { width: 43px; height: 43px; display: grid; place-items: center; color: #071524; border-radius: 50%; background: var(--gold-500); }
.demo-slot b { font-size: 14px; }
.demo-slot p { margin: 3px 0 0; color: #91a3b4; font-size: 12px; }

.trial-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 19px; }
.trial-grid article { padding: 34px; border: 1px solid var(--line-light); border-radius: 25px; background: #fff; }
.trial-grid .eyebrow { margin-top: 30px; }
.trial-grid h3 { font-size: 32px; }
.trial-grid article > p:not(.eyebrow) { color: #667586; }
.trial-grid strong { margin: 27px 0 22px; display: block; color: #956813; font: 700 40px Georgia, serif; }
.trial-grid strong small { margin-left: 9px; color: #7c8997; font: 600 13px Inter, sans-serif; }

.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; }
.steps-grid article { min-height: 230px; padding: 27px; border: 1px solid #dce2e7; border-radius: 20px; background: #fff; }
.steps-grid span { width: 45px; height: 45px; display: grid; place-items: center; color: #fff; border-radius: 13px; background: var(--navy-900); font-size: 13px; font-weight: 900; }
.steps-grid h3 { margin: 27px 0 11px; font-size: 22px; }
.steps-grid p { margin: 0; color: #6d7989; font-size: 15px; }
.why-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.why-grid article { padding: 25px; display: grid; grid-template-columns: 54px 1fr; gap: 18px; border: 1px solid var(--line-light); border-radius: 19px; background: #fff; }
.why-grid > article > span { width: 52px; height: 52px; display: grid; place-items: center; color: #946b17; border-radius: 15px; background: #f2e8d2; font: 700 14px Georgia, serif; }
.why-grid h3 { margin: 2px 0 7px; font-size: 21px; }
.why-grid p { margin: 0; color: #6a7787; font-size: 15px; }

.partner-section { padding-block: 104px; background: #091a2d; }
/* The real partner-card styling (columns, spacing, hover, responsive
   collapse) lives in the "#partners .partner-placeholder" rules further
   down this file — those are more specific and always win, so a plain
   ".partner-placeholder" rule here would never actually render. Removed
   rather than left as dead code that looks active but isn't. */
.partner-section .text-link { color: var(--gold-300); }
.referral-steps { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line-light); border-radius: 22px; overflow: hidden; background: #fff; }
.referral-steps article { min-height: 235px; padding: 25px 21px; border-right: 1px solid var(--line-light); }
.referral-steps article:last-child { border: 0; }
.referral-steps span { color: #a67815; font: 700 14px Georgia, serif; }
.referral-steps h3 { margin: 48px 0 10px; font-size: 20px; }
.referral-steps p { margin: 0; color: #6a7888; font-size: 14px; }
.info-banner { margin-top: 20px; padding: 23px 25px; display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; color: #f3f6f9; border-radius: 18px; background: var(--navy-900); }
.info-banner p { margin: 0; color: #abb9c7; font-size: 14px; }
.info-banner a { color: var(--gold-300); font-size: 14px; font-weight: 850; }
.two-column-content { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.two-column-content > article { padding: 38px; border: 1px solid var(--line-light); border-radius: 24px; background: #fff; }
.two-column-content h2 { font-size: 38px; }
.two-column-content > article > p:not(.eyebrow) { color: #657385; }
.empty-proof { margin-top: 25px; padding: 17px; display: flex; gap: 13px; border-radius: 14px; background: #edf6f1; }
.empty-proof > span { width: 39px; height: 39px; display: grid; place-items: center; color: #fff; border-radius: 50%; background: #3a966a; }
.empty-proof b, .empty-proof small { display: block; }
.empty-proof small { margin-top: 3px; color: #708076; }
.about-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; }
.about-grid h2 { font-size: clamp(38px, 4vw, 58px); }
.about-grid > div:last-child { color: #5f6e80; font-size: 19px; }
.faq-section { padding-block: 104px; position: relative; overflow: hidden; }
.faq-section .section-shell { position: relative; z-index: 1; }
.faq-grid-bg { position: absolute; inset: 0; opacity: .5; background-image: linear-gradient(rgba(219,170,62,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(219,170,62,.06) 1px,transparent 1px); background-size: 46px 46px; pointer-events: none; }
.faq-list { display: grid; gap: 11px; counter-reset: faqnum; }
.faq-list details { border: 1px solid var(--line-dark); border-radius: 16px; background: rgba(255, 255, 255, .025); }
.faq-list summary { min-height: 68px; padding: 17px 21px; display: flex; align-items: center; justify-content: flex-start; gap: 16px; font-size: 17px; font-weight: 800; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::before { counter-increment: faqnum; content: counter(faqnum, decimal-leading-zero); font-family: 'IBM Plex Mono', ui-monospace, monospace; font-weight: 700; font-size: 19px; color: var(--gold-500); flex-shrink: 0; }
.faq-list summary span { margin-left: auto; color: var(--gold-500); font-size: 23px; flex-shrink: 0; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { margin: 0; padding: 0 21px 21px 56px; color: #afbdca; }

.final-cta { margin-block: 66px; padding: 46px; display: grid; grid-template-columns: 1fr auto; gap: 35px; align-items: center; color: var(--white); border-radius: 27px; background: radial-gradient(circle at 80% 0, rgba(219, 170, 62, .18), transparent 22rem), var(--navy-900); }
.final-cta h2 { margin-bottom: 10px; font-size: 42px; }
.final-cta p:not(.eyebrow) { margin: 0; color: #b4c0cc; }
.compliance-strip { padding: 22px max(24px, calc((100vw - 1240px) / 2)); color: #544a39; border-block: 1px solid #ddc996; background: #f4ead1; }
.compliance-strip div { display: grid; grid-template-columns: 145px 1fr; gap: 20px; }
.compliance-strip p { margin: 0; font-size: 13px; }
.site-footer { padding: 64px max(24px, calc((100vw - 1240px) / 2)) 25px; color: #a9b7c4; background: var(--navy-950); }
.footer-main { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 50px; }
.footer-main.full { grid-template-columns: 1.5fr repeat(4, minmax(120px, 1fr)); gap: 34px; }
.footer-main > div:not(.footer-company) { display: grid; align-content: start; gap: 9px; }
.footer-main > div > b { margin-bottom: 7px; color: #fff; font-size: 15px; }
.footer-main a { color: #9eafbf; font-size: 14px; text-decoration: none; }
.footer-company { display: flex; align-items: flex-start; gap: 15px; }
.footer-social-icons { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 10px; }
.footer-social-icon { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; background: #1c2c3e; transition: transform .2s ease, filter .2s ease; }
.footer-social-icon:hover { transform: translateY(-3px); filter: brightness(1.15); }
.footer-social-whatsapp { background: #25D366; color: #06210f; }
.footer-social-telegram { background: #229ED9; }
.footer-social-youtube { background: #FF0000; }
.footer-social-instagram { background: linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4); }
.footer-social-facebook { background: #1877F2; }
.footer-social-twitter { background: #000; }
.footer-social-discord { background: #5865F2; }
.footer-social-other { background: #3e4c5e; }
.footer-col-wide { grid-column: 1 / -1; }
/* Below 1120px (tablet/mobile — unchanged from before): Legal keeps the
   full row width. Overrides .footer-main > div:last-child further down (an
   older rule that still matches Legal, since it's the last column here,
   and was fighting this at every width below 1120px). !important makes
   the winner explicit instead of depending on cascade order. */
@media (max-width: 1120px) {
  .footer-main.full .footer-col-wide { grid-column: 1 / -1 !important; }
}
.footer-col-split { column-count: 2; column-gap: 24px; }
.footer-col-split a { display: block; break-inside: avoid; margin-bottom: 9px; }
/* Desktop only (>=1121px): Legal sits under Company/Products/Customer/
   Connect instead of spanning the whole row including the brand column —
   the brand column has nothing below it in this row, so spanning under it
   just left a blank strip. Its own 4 links-columns use the same track
   count and gap as the row above so they line up with those 4 columns
   instead of an independent, unaligned 2-column text flow. */
@media (min-width: 1121px) {
  .footer-main.full .footer-col-wide { grid-column: 2 / -1; }
  .footer-col-split { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 34px; row-gap: 9px; column-count: unset; }
  .footer-col-split a { margin-bottom: 0; }
}
.footer-col-subhead { display: block; margin-top: 16px; }
.footer-company img { width: 56px; height: 56px; display: block; object-fit: cover; border: 1px solid rgba(219, 170, 62, .42); border-radius: 15px; }
.footer-company b { color: #fff; font: 700 25px Georgia, serif; }
.footer-company p { max-width: 300px; margin: 7px 0 0; font-size: 14px; }
.footer-bottom { margin-top: 49px; padding-top: 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; border-top: 1px solid var(--line-dark); font-size: 12px; }
/* Desktop-only compacting: the footer was measured at ~512px tall on a
   900px-tall viewport (mostly site-footer's own padding + the gap before
   the bottom bar) — trimmed here without touching the column layout, and
   left untouched below 1121px per instruction not to change mobile/tablet. */
@media (min-width: 1121px) {
  .site-footer { padding-top: 44px; padding-bottom: 18px; }
  .footer-bottom { margin-top: 32px; padding-top: 16px; }
}

.inner-hero { padding-block: 40px 24px !important; }
.inner-hero h1 { max-width: 720px; margin-bottom: 10px !important; color: #102137; font-size: clamp(28px, 3.6vw, 42px) !important; letter-spacing: -.03em; }
.inner-hero > p:last-child { max-width: 620px; color: #607083; font-size: 15px !important; line-height: 1.5; }
.inner-hero .eyebrow { margin-bottom: 8px !important; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.catalog-card { padding: 18px; display: flex; flex-direction: column; border: 1px solid var(--line-light); border-radius: 18px; background: #fff; }
.catalog-card > small { margin-top: 12px; color: #a37519; font-size: 10.5px; font-weight: 900; letter-spacing: .12em; }
.catalog-card h2 { margin: 4px 0 6px; font-size: 20px; }
.catalog-grid .catalog-card h2 { font-size: 20px !important; line-height: 1.25 !important; margin: 4px 0 6px !important; }
.catalog-card > p { color: #667587; font-size: 13.5px; margin: 0 0 4px; }
.catalog-card .product-brandline { gap: 8px; }
.catalog-card .product-brandline img { width: 28px; height: 28px; }
.catalog-card .product-brandline b { font-size: 13px; }
.catalog-card .product-brandline small { font-size: 9.5px; margin-top: 0; }
.catalog-card ul { margin: 12px 0 !important; gap: 6px !important; }
.catalog-card li { font-size: 13.5px; }
.catalog-price { margin-top: auto; padding-top: 12px; display: grid; }
.catalog-price b { color: #9a6c13; font: 700 22px Georgia, serif; }
.catalog-price span { color: #788695; font-size: 11px; }
.catalog-card .button { margin-top: 12px; min-height: 42px; font-size: 13.5px; }
.honest-empty { grid-column: 1 / -1; padding: 45px; text-align: center; border: 1px solid var(--line-light); border-radius: 22px; background: #fff; }
.product-detail-hero-shell { padding-block: 40px !important; }
.product-detail-heading { max-width: 640px; margin: 0 auto 20px !important; text-align: center; }
.product-detail-heading .product-brandline.large { justify-content: center; gap: 8px !important; }
.product-detail-heading .product-brandline.large img { width: 40px !important; height: 40px !important; }
.product-detail-heading .product-brandline.large b { font-size: 16px !important; }
.product-detail-heading .eyebrow { margin: 8px 0 6px !important; font-size: 11px !important; }
.product-detail-heading .lead { margin: 0 auto !important; font-size: 14px !important; line-height: 1.5 !important; }
.product-detail-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 0; align-items: stretch; border: 1px solid var(--line-light); border-radius: 24px; overflow: hidden; background: #fff; box-shadow: 0 22px 60px rgba(14, 31, 48, .1); }
.product-detail-formcol { padding: 26px; border-right: 1px solid var(--line-light); }
.product-detail-formcol .buy-box { margin-top: 20px; border: 0; box-shadow: none; padding: 0; }
.product-detail-formcol .cta-actions { margin-top: 24px; }
.buy-box { margin-top: 24px; padding: 22px; display: grid; gap: 12px; border: 1px solid var(--line-light); border-radius: 18px; background: #fff; box-shadow: 0 18px 45px rgba(14, 31, 48, .08); }
.buy-box > label { display: block; font-size: 13px; font-weight: 800; color: #132237; }
.buy-box > select { width: 100%; min-height: 46px; padding: 10px 14px; font-size: 14px; color: #132237; border: 1px solid #cad3db; border-radius: 10px; background: #fff; }
.plan-price-display { margin: 0; padding-bottom: 3px; border-bottom: 1px solid var(--line-light); font-size: 19px; color: #132237; font-weight: 800; }
.plan-price-display .strike { margin-right: 6px; font-size: 13px; font-weight: 400; text-decoration: line-through; color: #8a97a3; }
.plan-price-display .offer-badge { display: inline-block; margin-left: 6px; padding: 2px 10px; border-radius: 999px; background: #e5f7ef; color: #176347; font-weight: 700; font-size: 11px; vertical-align: middle; }
.guest-checkout-fields { display: grid; gap: 10px; padding-top: 2px; }
.guest-checkout-fields label { display: grid; gap: 5px; font-size: 12px; font-weight: 800; color: #132237; }
.guest-checkout-fields input { width: 100%; min-height: 44px; padding: 10px 14px; font-size: 14px; color: #132237; border: 1px solid #cad3db; border-radius: 10px; background: #fbfcfd; }
.guest-checkout-fields input:focus { outline: none; border-color: var(--gold-500, #dbaa3e); background: #fff; box-shadow: 0 0 0 3px rgba(219, 170, 62, .3); }
.guest-checkout-note { margin: 0; font-size: 12px; color: #788697; }
.guest-checkout-note a { color: var(--gold-500, #dbaa3e); font-weight: 700; }
.buy-box #payNowBtn { width: 100%; min-height: 48px; font-size: 15px; }
.payment-error { margin: 0; padding: 10px 12px; border-radius: 8px; background: #fdecea; color: #97281f; font-size: 12px; }
@media (max-width: 560px) {
  .buy-box { padding: 18px; }
}
.product-brandline.large img { width: 66px; height: 66px; }
.product-brandline.large b { color: #102137; font-size: 23px; }
.product-detail-heading h1 { margin: 0 0 6px !important; font-size: clamp(26px, 3vw, 36px) !important; letter-spacing: -.03em; }
.product-detail-heading .lead { color: #617184; }
.product-detail-hero aside { overflow: hidden; display: flex; flex-direction: column; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.product-detail-hero aside > img { width: 100%; display: block; }
.product-detail-hero aside > div { margin-top: auto; padding: 23px; display: grid; }
.product-detail-hero aside span, .product-detail-hero aside small { color: #788697; font-size: 12px; }
.product-detail-hero aside strong { color: #946713; font: 700 39px Georgia, serif; }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; }
.product-detail-hero .cta-actions { justify-content: center; margin-top: 26px; }
.product-detail-hero .cta-actions .button { min-height: 44px; padding: 0 18px; font-size: 13px; }
.detail-grid h2 { font-size: 46px; }
.feature-list { font-size: 17px; }
.detail-list { display: grid; gap: 13px; }
.detail-list div { padding: 22px; border: 1px solid var(--line-light); border-radius: 17px; background: #fff; }
.detail-list dt { color: #9b6f18; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.detail-list dd { margin: 7px 0 0; color: #617083; }
.demo-detail { display: grid; grid-template-columns: 1fr 100px; gap: 40px; align-items: center; }
.demo-detail h2 { font-size: 45px; }
.demo-detail > div > p:last-child { max-width: 760px; color: #647386; }
.demo-detail > span { width: 90px; height: 90px; display: grid; place-items: center; color: #fff; border-radius: 50%; background: var(--navy-900); font-size: 28px; }
.content-page-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 19px; }
.content-page-grid article { min-height: 250px; padding: 29px; border: 1px solid var(--line-light); border-radius: 21px; background: #fff; }
.content-page-grid article > span { color: #b17d16; }
.content-page-grid h2 { margin: 28px 0 12px; font-size: 29px; }
.content-page-grid p { color: #657486; }
.legal-notice { margin-top: 22px; padding: 23px; border: 1px solid #ddc994; border-radius: 16px; background: #f6ecd3; }
.legal-notice p { margin: 5px 0 0; color: #645943; }
.blog-grid, .pricing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.blog-card, .price-card { padding: 29px; border: 1px solid var(--line-light); border-radius: 22px; background: #fff; }
.blog-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 14px; }
.blog-card small, .price-card small { color: #a2761b; font-weight: 850; }
.blog-card h2, .price-card h2 { margin: 13px 0; font-size: 29px; }
.blog-card p, .price-card p { color: #667587; }
.price-card { display: flex; flex-direction: column; }
.price-card strong { margin: 24px 0; color: #956813; font: 700 39px Georgia,serif; }
.price-card ul { margin: 0 0 24px; padding-left: 21px; color: #617083; }
.price-card .button { margin-top: auto; }
.article-page { max-width: 920px; padding-block: 100px; }
.article-page header { text-align: center; }
.article-page h1 { margin: 15px 0 22px; font-size: clamp(50px,7vw,78px); line-height: 1.05; letter-spacing: -.05em; }
.article-page header > p:not(.eyebrow) { color: #607083; font-size: 21px; }
.article-cover { width: 100%; margin: 55px 0 35px; border-radius: 24px; }
.article-body { padding: 18px; color: #35475a; font-size: 19px; line-height: 1.9; white-space: normal; }
.account-shell { min-height: 70vh; padding: 80px 24px; display: grid; place-items: center; background: radial-gradient(circle at 70% 15%,rgba(219,170,62,.13),transparent 30rem),var(--navy-950); }
.account-auth-card { width: min(520px,100%); padding: 40px; color: #fff; border: 1px solid rgba(219,170,62,.25); border-radius: 25px; background: #0b1e32; box-shadow: var(--shadow); }
.account-auth-card.wide { width: min(760px,100%); }
.account-auth-card h1 { margin: 8px 0 12px; font-size: 46px; }
.account-auth-card > p:not(.eyebrow) { color: #aebdca; }
.account-form { display: grid; gap: 17px; }
.account-form.two { grid-template-columns: 1fr 1fr; }
.account-form label { display: grid; gap: 7px; }
.account-form label.full, .account-form div.full, .account-form fieldset.full, .account-form p.full { grid-column: 1/-1; }
.account-form label span { font-size: 14px; font-weight: 800; }
.account-form input,.account-form select,.account-form textarea { width: 100%; min-height: 52px; padding: 12px 14px; color: #132237; border: 1px solid #cad3db; border-radius: 11px; background: #fff; }
.account-form input[type=checkbox],.account-form input[type=radio] { width: 16px; min-height: 16px; flex: none; color-scheme: light; }
.account-form small { color: #8293a3; font-size: 11px; }
.account-form .consent { grid-template-columns: auto 1fr; align-items: center; }
.account-form .consent input { width: 20px; min-height: 20px; color-scheme: light; }
.auth-switch { margin: 23px 0 0; text-align: center; }
.auth-switch a { color: var(--gold-300); font-weight: 850; }
.coupon-row { display: flex; flex-wrap: wrap; gap: 8px; }
.coupon-row input { flex: 1 1 160px; min-width: 0; }
.coupon-row button { flex: 0 0 auto; }
.google-auth-button { min-height: 52px; margin: 4px 0 0; padding: 0 16px; display: flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid #dadce0; border-radius: 11px; background: #fff; color: #1f1f1f; font-weight: 700; font-size: 15px; text-decoration: none; }
.google-auth-button:hover { background: #f7f8f8; }
.auth-divider { margin: 18px 0; display: flex; align-items: center; gap: 12px; color: #8293a3; font-size: 12px; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: rgba(255,255,255,.14); }
.form-alert { margin: 18px 0; padding: 14px 17px; border-radius: 12px; background: #eaf5ef; color: #276347; }
.form-alert.danger { color: #842e35; background: #fae9eb; }
.public-flash { width:min(var(--site-width,1240px),calc(100% - 30px));margin:16px auto 0;padding:14px 17px;color:#276347;border:1px solid #b9dfcb;border-radius:12px;background:#eaf5ef}.public-flash.danger,.public-flash.error{color:#842e35;border-color:#efc5ca;background:#fae9eb}.public-flash.warning{color:#6e5515;border-color:#e4ce8b;background:#fff5d8}
.account-page { padding-block: 78px 110px; }
.account-page-head { display: flex; justify-content: space-between; gap: 30px; align-items: end; }
.account-page-head h1 { margin: 8px 0; font-size: clamp(48px,6vw,72px); }
.account-page-head p:not(.eyebrow) { margin: 0; color: #617184; font-size: 19px; }
.account-tabs { margin: 35px 0 25px; display: flex; gap: 8px; border-bottom: 1px solid var(--line-light); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.account-tabs a { padding: 13px 16px; color: #667587; font-weight: 800; text-decoration: none; white-space: nowrap; flex-shrink: 0; }
.account-tabs a.active { color: #956813; border-bottom: 3px solid #dbaa3e; }
.account-stat-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; }
.account-stat-grid article { min-height: 155px; padding: 22px; display: grid; align-content: start; border: 1px solid var(--line-light); border-radius: 19px; background: #fff; }
.account-stat-grid span,.account-stat-grid small { color: #718092; font-size: 12px; }
.account-stat-grid b { margin: 14px 0; font: 700 34px Georgia,serif; }
.account-grid { margin-top: 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.account-panel { padding: 28px; border: 1px solid var(--line-light); border-radius: 21px; background: #fff; }
.account-panel h2 { margin-top: 0; font-size: 27px; }
.account-panel > p { color: #667587; }
.account-panel code,.token-card code { padding: 13px; display: block; overflow-wrap: anywhere; color: #f0d28a; border-radius: 10px; background: #071524; }
.token-card { margin: 18px 0; padding: 22px; border: 1px solid #d8b251; border-radius: 17px; background: #fff6dc; }
.token-card code { margin: 10px 0; }
.connected-row,.ticket-row { padding: 15px 0; display: flex; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line-light); }
.connected-row div,.ticket-row div { display: grid; }
.connected-row small,.ticket-row small { color: #7c8a98; }
.connected-row form .button { padding: 8px 12px; font-size: .78rem; }
.connection { height: max-content; padding: 5px 9px; border-radius: 999px; background: #f5dfab; font-size: 11px; font-weight: 850; }
.connection.connected { color: #246448; background: #dff3e8; }
.connect-form { margin-top: 20px; }
.connect-form summary { padding: 12px 0; color: #946713; font-weight: 850; cursor: pointer; }
.trade-panel { margin-top: 18px; }
.panel-title { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.panel-title p { margin: 0; color: #748293; }
@media (max-width: 480px) { .panel-title { flex-direction: column; align-items: flex-start; } .panel-title .button { width: 100%; text-align: center; } }
.table-scroll { overflow-x: auto; }
.journal-table { width: 100%; margin-top: 20px; border-collapse: collapse; white-space: nowrap; }
.journal-table th,.journal-table td { padding: 13px 11px; text-align: left; border-bottom: 1px solid #e3e7eb; font-size: 13px; }
.journal-table th { color: #718092; font-size: 11px; text-transform: uppercase; }
.positive { color: #168157!important; }.negative { color: #c63f4b!important; }
.side { font-weight: 900; }.side.buy { color: #168157; }.side.sell { color: #c63f4b; }
.empty-cell { padding: 35px!important; text-align: center!important; color: #778697; }
.security-note { padding: 12px; border-radius: 10px; background: #f7ecd4; color: #66583e!important; }
.period-tabs{margin:18px 0;display:flex;gap:8px;flex-wrap:wrap}.period-tabs a{padding:9px 14px;color:#647487;border:1px solid #d9e0e5;border-radius:10px;background:#fff;font-size:13px;font-weight:850;text-decoration:none}.period-tabs a.active{color:#071524;border-color:#dbaa3e;background:#f1d485}.insight-panel{margin-top:18px;display:grid;grid-template-columns:.8fr 1.2fr;gap:25px;background:#0a1c30;color:#fff}.insight-panel p.eyebrow{color:#e7bc58}.insight-panel li{margin:9px 0;color:#b9c6d1}
.two-column-content blockquote { margin: 18px 0; padding: 17px; border-left: 4px solid #dbaa3e; background: #f8f2e6; }
.review-slider { position: relative; }
.review-slides { position: relative; min-height: 150px; }
.review-slide { display: none; margin: 18px 0 0; padding: 17px; border-left: 4px solid #dbaa3e; background: #f8f2e6; }
.review-slide.is-active { display: block; }
.review-slider-controls { margin-top: 14px; display: flex; align-items: center; justify-content: center; gap: 14px; }
.review-slider-arrow { width: 34px; height: 34px; border: 1px solid var(--line-light); border-radius: 50%; background: #fff; color: #132237; font-size: 15px; cursor: pointer; transition: background .2s ease, border-color .2s ease; }
.review-slider-arrow:hover { background: #f1d485; border-color: #dbaa3e; }
.review-slider-dots { display: flex; gap: 6px; }
.review-slider-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: #d9dee3; cursor: pointer; }
.review-slider-dot.is-active { width: 20px; border-radius: 4px; background: #dbaa3e; }
.review-stars { margin-bottom: 6px; color: #dbaa3e; font-size: 15px; letter-spacing: 2px; }
.two-column-content cite { color: #6b7786; font-size: 13px; }
.public-support { margin-top: 35px; padding: 34px; display: grid; grid-template-columns: .8fr 1.2fr; gap: 50px; color: #fff; border-radius: 24px; background: #091a2d; }.public-support h2{font-size:38px}.public-support>div>p:not(.eyebrow){color:#aebdca}.public-support .honey{position:absolute;left:-9999px}.public-support .account-form label span{color:#dce4eb}
.subscription-list{display:grid;grid-template-columns:1fr 1fr;gap:18px}.subscription-details{display:grid;grid-template-columns:1fr 1fr;gap:10px}.subscription-details div{padding:13px;border-radius:10px;background:#f3f5f7}.subscription-details dt{color:#7b8997;font-size:11px;text-transform:uppercase}.subscription-details dd{margin:5px 0 0;font-weight:800}

@media (max-width: 1120px) {
  .site-navigation { position: fixed; inset: 124px 18px 18px; padding: 20px; display: none; flex-direction: column; align-items: stretch; overflow-y: auto; border: 1px solid var(--line-dark); border-radius: 18px; background: #071524; box-shadow: var(--shadow); }
  .site-navigation.open { display: flex; }
  .site-navigation a { padding: 9px; font-size: 16px; }
  .site-preferences { margin-left: auto; }
  .menu-toggle { width: 48px; height: 48px; margin-left: auto; padding: 10px; display: grid; align-content: center; gap: 5px; color: #fff; border: 1px solid var(--line-dark); border-radius: 12px; background: transparent; }
  .menu-toggle span { height: 2px; display: block; background: #fff; }
  .menu-toggle b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  .company-brand { margin-right: 0; }
  .header-cta { margin-left: auto; }
  .hero { grid-template-columns: 1fr; }
  .featured-product { max-width: 760px; }
  .service-grid, .steps-grid, .catalog-grid, .content-page-grid, .blog-grid, .pricing-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-main.full { grid-template-columns: repeat(3,1fr); }
  .problem-grid { grid-template-columns: repeat(2, 1fr); }
  .problem-grid article { border-bottom: 1px solid var(--line-dark); }
  .problem-grid article:nth-child(2n) { border-right: 0; }
  .problem-grid article:last-child { border-bottom: 0; }
  .referral-steps { grid-template-columns: repeat(2, 1fr); }
  .referral-steps article { border-bottom: 1px solid var(--line-light); }
  .referral-steps article:nth-child(2n) { border-right: 0; }
  .footer-main { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-main > div:last-child { grid-column: 2; }
}
@media (max-width: 720px) {
  body { font-size: 16px; }
  .section-shell { width: min(100% - 30px,1240px); }
  .offer-bar small { display: none; }
  .site-header { min-height: 74px; padding-inline: 14px; gap: 9px; }
  .company-brand img { width: 44px; height: 44px; }
  .company-brand small { display: none; }
  .company-brand b { font-size: 19px; }
  .header-cta { display: none; }
  .site-preferences select { width: 55px; padding: 0 4px; }
  .account-link { display: none; }
  .site-navigation { inset: 112px 12px 12px; }
  .hero { min-height: auto; padding-block: 74px; grid-template-columns: 1fr; gap: 45px; }
  .hero h1, .hero h2 { font-size: clamp(43px,14vw,62px); }
  .section,.dark-section,.product-section,.partner-section,.faq-section { padding-block: 72px; }
  .service-grid,.steps-grid,.catalog-grid,.content-page-grid,.blog-grid,.pricing-grid,.product-showcase,.trial-grid,.solution-flow,.why-grid,.two-column-content,.about-grid,.detail-grid,.account-grid,.subscription-list,.public-support,.insight-panel { grid-template-columns: 1fr; }
  .problem-grid,.referral-steps { grid-template-columns: 1fr; }
  .problem-grid article,.referral-steps article { min-height: auto; border-right: 0; border-bottom: 1px solid var(--line-dark); }
  .account-stat-grid { grid-template-columns: 1fr 1fr; }
  .account-page-head { align-items: start; flex-direction: column; }
  .account-form.two { grid-template-columns: 1fr; }
  .account-form label.full, .account-form div.full, .account-form fieldset.full, .account-form p.full { grid-column: auto; }
  .account-auth-card { padding: 27px 21px; }
  .footer-main.full { grid-template-columns: 1fr 1fr; }
  .footer-company { grid-column: 1/-1; }
  .final-cta { padding: 29px; grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .section-shell { width: min(100% - 30px, 1240px); }
  .section { padding-block: 75px; }
  /* Below this width the announcement text is too long to fit one line
     next to the button, but laying span/link out as separate flex items
     (each forced onto its own row) pushed "Start trial" onto a 3rd line
     by itself and made the whole bar unnecessarily tall. Plain inline
     text flow instead lets the browser wrap only where it must — the
     price and "Start trial" end up sharing the same last line — and the
     bar ends up one line shorter, whatever the exact announcement text. */
  .offer-bar { display: block; text-align: center; overflow-x: visible; white-space: normal; padding-block: 9px; }
  .offer-bar span { display: inline; }
  .offer-bar a { display: inline-block; margin-left: 8px; white-space: nowrap; }
  .offer-bar small { display: none; }
  .site-header { padding-inline: 15px; }
  .header-cta { display: none; }
  .site-navigation { inset-block-start: 124px; }
  .hero { min-height: 0; padding-block: 76px; gap: 45px; }
  .hero h1, .hero h2 { font-size: clamp(50px, 13vw, 72px); }
  .section-heading, .about-grid, .product-detail-hero, .detail-grid { grid-template-columns: 1fr; gap: 24px; }
  .product-detail-formcol { border-right: 0; border-bottom: 1px solid var(--line-light); }
  .product-showcase, .trial-grid, .solution-flow, .two-column-content { grid-template-columns: 1fr; }
  .info-banner, .final-cta { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-company { grid-column: 1 / -1; }
  .footer-main > div:last-child { grid-column: auto; }
  .compliance-strip div { grid-template-columns: 1fr; gap: 4px; }
}

@media (max-width: 560px) {
  body { font-size: 16px; }
  .company-brand img { width: 46px; height: 46px; }
  .company-brand b { font-size: 20px; }
  .company-brand small { font-size: 9px; }
  .hero h1, .hero h2 { font-size: 47px; }
  .section-heading h2, .inner-hero h1 { font-size: 39px; }
  .section-heading > p, .inner-hero > p:last-child { font-size: 16px; }
  .service-grid, .steps-grid, .catalog-grid, .content-page-grid, .why-grid { grid-template-columns: 1fr; }
  .problem-grid, .referral-steps { display: grid; grid-template-columns: 1fr; }
  .account-stat-grid { grid-template-columns: 1fr; }
  .subscription-details { grid-template-columns: 1fr; }
  .problem-grid article, .referral-steps article { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line-dark); }
  .problem-grid h3, .referral-steps h3 { margin-top: 27px; }
  .product-card, .trial-grid article, .two-column-content > article { padding: 24px 20px; }
  .product-card-top { align-items: flex-start; flex-direction: column; }
  .final-cta { margin-block: 35px; padding: 30px 22px; }
  .final-cta h2 { font-size: 34px; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-main.full { grid-template-columns: 1fr 1fr !important; gap: 22px !important; }
  .footer-company { grid-column: 1/-1; }
  .footer-main.full .footer-company { grid-column: 1/-1 !important; }
  .footer-social-icons { margin-top: 12px; }
  .footer-main > div > b { font-size: 14px; }
  .footer-main a { font-size: 13px; }
  .footer-bottom { flex-direction: column; }
}

/* V5 responsive brand header and visual content system */
.site-header{min-height:82px;padding-inline:clamp(16px,3vw,58px);gap:clamp(11px,1.15vw,22px)}
.company-brand{min-width:180px;flex:0 0 auto;gap:12px}.company-brand img{width:56px;height:56px;border-radius:50%;background:#fff}.company-brand b{color:var(--gold-500)!important;font-size:clamp(22px,1.55vw,28px);line-height:1;white-space:nowrap}.company-brand small{display:block;margin-top:5px;font-size:10px;letter-spacing:.13em;white-space:nowrap}.site-navigation{flex:1 1 auto;justify-content:center;gap:clamp(12px,1.25vw,25px)}.site-navigation a,.account-link,.header-cta{white-space:nowrap}.site-navigation a{font-size:clamp(12px,.82vw,14px)}.site-preferences,.header-cta{flex:0 0 auto}
.site-visual-atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;opacity:.19;background-image:linear-gradient(rgba(91,137,184,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(91,137,184,.16) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,#000 0,transparent 82%)}
.site-visual-atmosphere span{width:6px;position:absolute;bottom:15%;border-radius:2px;background:linear-gradient(to top,rgba(219,170,62,.12),rgba(86,146,207,.85));animation:ambientBar 7s ease-in-out infinite}
.site-visual-atmosphere span::before,.site-visual-atmosphere span::after{content:"";width:1px;position:absolute;left:2.5px;background:#6ea5d2}
.site-visual-atmosphere span::before{height:22px;top:-22px}
.site-visual-atmosphere span::after{height:18px;bottom:-18px}
.site-visual-atmosphere span:nth-child(1){left:5%;height:66px;animation-delay:-1s}
.site-visual-atmosphere span:nth-child(2){left:14%;height:112px;animation-delay:-4.2s}
.site-visual-atmosphere span:nth-child(3){left:24%;height:44px;animation-delay:-2.1s}
.site-visual-atmosphere span:nth-child(4){left:34%;height:136px;animation-delay:-5.6s}
.site-visual-atmosphere span:nth-child(5){left:46%;height:80px;animation-delay:-.6s}
.site-visual-atmosphere span:nth-child(6){left:58%;height:150px;animation-delay:-3.4s}
.site-visual-atmosphere span:nth-child(7){left:69%;height:58px;animation-delay:-2.8s}
.site-visual-atmosphere span:nth-child(8){left:79%;height:128px;animation-delay:-6.2s}
.site-visual-atmosphere span:nth-child(9){left:89%;height:70px;animation-delay:-1.7s}
.site-visual-atmosphere span:nth-child(10){left:96%;height:104px;animation-delay:-4.9s}
.site-visual-atmosphere i{width:60%;height:1px;position:absolute;background:linear-gradient(90deg,transparent,#dbaa3e,transparent);box-shadow:0 0 18px #dbaa3e;animation:ambientLine 8s ease-in-out infinite}
.site-visual-atmosphere i:nth-of-type(1){left:12%;top:38%;transform:rotate(-9deg)}
.site-visual-atmosphere i:nth-of-type(2){left:22%;top:68%;transform:rotate(7deg);animation-delay:-4s;background:linear-gradient(90deg,transparent,#6ea5d2,transparent);box-shadow:0 0 18px #6ea5d2}
.site-visual-atmosphere em{position:absolute;font-style:normal;font-size:22px;line-height:1;filter:drop-shadow(0 0 8px rgba(240,210,138,.55));animation:ambientFloat 9s ease-in-out infinite}
.site-visual-atmosphere em::before{content:attr(data-icon)}
.site-visual-atmosphere em:nth-of-type(1){left:16%;top:20%;animation-delay:-1s}
.site-visual-atmosphere em:nth-of-type(2){left:41%;top:12%;animation-delay:-4.5s}
.site-visual-atmosphere em:nth-of-type(3){left:64%;top:24%;animation-delay:-2.3s}
.site-visual-atmosphere em:nth-of-type(4){left:83%;top:10%;animation-delay:-6.1s}
@keyframes ambientBar{0%,100%{transform:scaleY(.75);opacity:.38}50%{transform:scaleY(1.15);opacity:.85}}
@keyframes ambientLine{0%,100%{transform:translateY(22px);opacity:.22}50%{transform:translateY(-20px);opacity:.7}}
@keyframes ambientFloat{0%,100%{transform:translateY(0) rotate(-4deg);opacity:.4}50%{transform:translateY(-22px) rotate(4deg);opacity:.85}}
.managed-visual{--visual-overlay:.18;margin:0;position:relative;overflow:hidden;border:1px solid rgba(219,170,62,.28);border-radius:22px;background:#071524}.managed-visual::after{content:"";position:absolute;inset:0;pointer-events:none;background:rgba(1,12,24,var(--visual-overlay))}.managed-visual-media,.managed-visual picture,.managed-visual img,.managed-visual video{width:100%;height:100%;display:block}.managed-visual img,.managed-visual video{min-height:240px;object-fit:cover}.managed-visual figcaption{padding:9px 13px;position:absolute;left:12px;bottom:12px;z-index:2;color:#fff;border:1px solid rgba(255,255,255,.15);border-radius:999px;background:rgba(4,18,32,.78);font-size:12px;font-weight:800}.hero-managed-visual{aspect-ratio:16/9;border-radius:16px}.hero-managed-visual img,.hero-managed-visual video{min-height:0}.hero-managed-visual+.product-brandline{margin-top:20px}.page-visual-shell{padding-top:28px}.page-visual-band{max-height:410px}.page-visual-band img,.page-visual-band video{max-height:410px}.section-managed-visual{padding-top:34px}.section-visual{max-width:980px;margin-inline:auto;aspect-ratio:16/6}.section-visual img,.section-visual video{min-height:0}
.code-visual{min-height:300px;position:relative;overflow:hidden;background-color:#06111e;background-image:linear-gradient(rgba(91,137,184,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(91,137,184,.13) 1px,transparent 1px),radial-gradient(circle at 70% 28%,rgba(53,113,172,.35),transparent 36%);background-size:36px 36px,36px 36px,auto}.code-visual span{width:8px;position:absolute;bottom:18%;border-radius:2px;background:linear-gradient(#79b0df,#dbaa3e);animation:codeBar 4.8s ease-in-out infinite}.code-visual span:nth-child(1){left:12%;height:25%;animation-delay:-1s}.code-visual span:nth-child(2){left:24%;height:47%;animation-delay:-3s}.code-visual span:nth-child(3){left:37%;height:31%;animation-delay:-2s}.code-visual span:nth-child(4){left:50%;height:63%;animation-delay:-4s}.code-visual span:nth-child(5){left:64%;height:44%;animation-delay:-.5s}.code-visual span:nth-child(6){left:77%;height:72%;animation-delay:-2.7s}.code-visual span:nth-child(7){left:89%;height:56%;animation-delay:-1.5s}.code-visual i{width:11px;height:11px;position:absolute;border:2px solid #e6bd5c;border-radius:50%;box-shadow:0 0 16px rgba(230,189,92,.65);animation:codePoint 6s ease-in-out infinite}.code-visual i:nth-of-type(1){left:11%;top:69%}.code-visual i:nth-of-type(2){left:31%;top:55%;animation-delay:-1s}.code-visual i:nth-of-type(3){left:50%;top:42%;animation-delay:-2s}.code-visual i:nth-of-type(4){left:69%;top:30%;animation-delay:-3s}.code-visual i:nth-of-type(5){left:87%;top:19%;animation-delay:-4s}@keyframes codeBar{0%,100%{transform:scaleY(.82);filter:brightness(.8)}50%{transform:scaleY(1.09);filter:brightness(1.25)}}@keyframes codePoint{0%,100%{transform:translateY(7px);opacity:.5}50%{transform:translateY(-7px);opacity:1}}
.visual-js [data-visual-reveal]:not(.is-visible){opacity:0;transform:translateY(28px)}.visual-js [data-visual-reveal="fade-left"]:not(.is-visible){transform:translateX(34px)}.visual-js [data-visual-reveal="fade-right"]:not(.is-visible){transform:translateX(-34px)}[data-visual-reveal]{transition:opacity .72s ease,transform .72s cubic-bezier(.2,.75,.25,1)}[data-visual-reveal].is-visible{opacity:1;transform:none}[data-visual-reveal="float"].is-visible{animation:gentleFloat 6s ease-in-out infinite}[data-visual-reveal="pulse"].is-visible{animation:gentlePulse 5s ease-in-out infinite}@keyframes gentleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}@keyframes gentlePulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.12)}}
.cms-runtime-section{position:relative}.cms-bg-light{background:#f5f7f8}.cms-bg-gold-soft{background:#fbf4e3}.cms-bg-midnight{background:#020d18}.cms-bg-navy{background:#071524}.cms-layout-center>.section,.cms-layout-center>section{text-align:center}.hide-desktop{display:none!important}.card-media,.product-featured-media{width:100%;aspect-ratio:16/9;display:block;object-fit:cover;border-radius:14px}.service-card .card-media{margin-bottom:20px}.product-featured-media{margin:18px 0}.partner-logo{width:68px;height:68px;object-fit:contain;border-radius:14px;background:#fff}.empty-partner-state{padding:32px;margin-bottom:20px;border:1px dashed rgba(255,255,255,.25);border-radius:18px;color:#ccd7e1}.about-highlights{padding:0;display:grid;gap:12px;list-style:none}.about-highlights li{padding:14px;border-left:3px solid #dbaa3e;background:#f6f7f8}.about-highlights span{margin-top:4px;display:block;color:#647487}.compliance-section{padding:42px 0;color:#dfe8ef;background:#06121f}.compliance-section>.section-shell{display:grid;grid-template-columns:1.2fr 1fr;gap:38px}.compliance-section h2{margin:8px 0;font-size:32px}.compliance-section p{color:#9db0c0}.compliance-section ul{margin:0;padding:0;display:grid;gap:10px;list-style:none}.compliance-section li{padding:13px;border:1px solid rgba(255,255,255,.1);border-radius:12px}.compliance-section li span{display:block;color:#9db0c0;font-size:13px}.theme-clean-light .site-header{background:rgba(255,255,255,.96);color:#071524}.theme-clean-light .site-navigation a{color:#33475a}.theme-clean-light .company-brand b{color:#071524}.theme-clean-light .menu-toggle{color:#071524}.theme-clean-light .menu-toggle span{background:#071524}.cards-square article,.cards-square .panel{border-radius:4px!important}.cards-glass article{backdrop-filter:blur(14px)}
@media(max-width:920px){.site-navigation{position:fixed;inset:116px 18px auto;padding:20px;display:none;flex-direction:column;align-items:stretch;border:1px solid var(--line-dark);border-radius:18px;background:#071524;box-shadow:var(--shadow)}.site-navigation.open{display:flex}.site-navigation a{padding:9px;font-size:16px}.menu-toggle{width:48px;height:48px;margin-left:auto;padding:10px;display:grid;align-content:center;gap:5px;color:#fff;border:1px solid var(--line-dark);border-radius:12px;background:transparent}.menu-toggle span{height:2px;display:block;background:#fff}.menu-toggle b{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.site-preferences{margin-left:0}.header-cta{margin-left:0}}
@media(max-width:820px){.hide-desktop{display:block!important}.hide-tablet{display:none!important}.site-header{min-height:74px}.company-brand{min-width:0}.company-brand img{width:48px;height:48px}.company-brand b{font-size:21px}.company-brand small{display:block;font-size:10px}.site-preferences{display:none}.site-navigation{inset-block-start:112px}.compliance-section>.section-shell{grid-template-columns:1fr}.page-visual-shell{padding-top:18px}}
@media(max-width:560px){.hide-mobile{display:none!important}.company-brand{gap:9px}.company-brand img{width:44px;height:44px}.company-brand b{font-size:20px}.company-brand small{font-size:10px}.site-header{gap:8px}.managed-visual img,.managed-visual video{min-height:190px}.code-visual{min-height:220px}.section-visual{aspect-ratio:4/3}}
@media(min-width:821px) and (max-width:1120px){.hide-desktop{display:block!important}.hide-tablet{display:none!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.visual-js [data-visual-reveal]{opacity:1!important;transform:none!important}}.motion-off *,.motion-off *::before,.motion-off *::after{animation:none!important;transition:none!important}.motion-off [data-visual-reveal]{opacity:1!important;transform:none!important}

.managed-page-block{display:flex;flex-direction:column;gap:13px}.managed-page-block>p{white-space:normal}.managed-page-block .managed-visual{margin:-24px -24px 8px}.managed-page-block.cms-bg-navy,.managed-page-block.cms-bg-midnight{color:#fff;background:#071524}.managed-page-block.cms-bg-navy>p,.managed-page-block.cms-bg-midnight>p{color:#a9bbca}.managed-page-block.cms-bg-gold-soft{background:#fbf4e3}.public-partner-grid{margin-top:40px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.public-partner-grid article{padding:28px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 14px 34px rgba(6,21,36,.07)}.public-partner-grid h2{margin:7px 0 12px}.public-partner-grid h3{margin:18px 0 5px;font-size:16px}.public-partner-grid small{margin:15px 0;display:block;color:#6d7f90;line-height:1.55}.public-partner-grid .empty-partner-state{grid-column:1/-1;color:#536678;background:#f6f8fa}
html,body{overflow-x:hidden}@supports(overflow:clip){html,body{overflow-x:clip}}
@media(max-width:760px){.public-partner-grid{grid-template-columns:1fr}.managed-page-block .managed-visual{margin:-18px -18px 8px}}
.company-brand b,.theme-clean-light .company-brand b{color:var(--gold-500)!important}


/* Permanent golden Swarajya header name */
.company-brand b,
.theme-clean-light .company-brand b {
    color: var(--gold-500, #dbaa3e) !important;
}

/* Force full desktop navigation above 760px */
@media (min-width: 761px) {
    .site-header {
        gap: 14px;
    }

    .site-navigation {
        position: static !important;
        inset: auto !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: clamp(10px, 1vw, 20px) !important;
        row-gap: 8px !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .site-navigation a {
        padding: 0 !important;
        font-size: 13px !important;
        white-space: nowrap;
    }

    /* Forces the menu onto two centered rows (see header.php, which places
       this right after "Pricing") instead of squeezing every item onto one
       line — that single line was overflowing its own nav box on common
       laptop widths, clipping "About"/"Blog"/"Support" behind an invisible
       scroll area no one would think to look for. */
    .nav-row-break {
        display: block !important;
        flex-basis: 100% !important;
        width: 100% !important;
        height: 0 !important;
    }

    .menu-toggle {
        display: none !important;
    }
}

/* Compact and balanced Hero */
.hero {
    min-height: auto !important;
    padding-block: 48px !important;
    gap: 48px !important;
}

.hero h1, .hero h2 {
    max-width: 680px !important;
    margin-bottom: 20px !important;
    font-size: clamp(36px, 2.8vw, 48px) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em !important;
}

.hero .lead {
    max-width: 680px !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
}

.hero .cta-actions {
    margin-top: 22px !important;
}

.trust-row {
    margin-top: 20px !important;
}

@media (max-width: 820px) {
    .hero {
        padding-block: 38px !important;
        gap: 32px !important;
    }

    .hero h1, .hero h2 {
        font-size: clamp(34px, 7vw, 44px) !important;
    }
}

@media (max-width: 560px) {
    .hero {
        padding-block: 30px !important;
    }

    .hero h1, .hero h2 {
        font-size: clamp(31px, 9vw, 39px) !important;
    }
}


/* Equal-height Hero columns with smaller header gap */
.hero {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
    align-items: stretch !important;
    gap: 42px !important;
}

.hero > div:first-child {
    min-height: 100%;
    padding-block: 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hero > .featured-product {
    height: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.hero > .featured-product > a:last-child {
    margin-top: auto;
}

@media (max-width: 820px) {
    .hero {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
        gap: 28px !important;
    }

    .hero > div:first-child {
        padding-block: 0;
    }
}



/* Compact headings and spacing: Company, Problems, Solution */
#services.section,
#problems.section,
#solution.section {
    padding-block: 62px !important;
}

#services .section-heading,
#problems .section-heading,
#solution .section-heading {
    margin-bottom: 30px !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, .75fr) !important;
    gap: 38px !important;
    align-items: center !important;
}

#services .section-heading h2,
#problems .section-heading h2,
#solution .section-heading h2 {
    max-width: 650px !important;
    font-size: clamp(34px, 3.4vw, 48px) !important;
    line-height: 1.06 !important;
    letter-spacing: -.03em !important;
}

#services .section-heading > p,
#problems .section-heading > p,
#solution .section-heading > p {
    max-width: 500px !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

/* Mobile and tablet */
@media (max-width: 820px) {
    #services.section,
    #problems.section,
    #solution.section {
        padding-block: 44px !important;
    }

    #services .section-heading,
    #problems .section-heading,
    #solution .section-heading {
        margin-bottom: 24px !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    #services .section-heading h2,
    #problems .section-heading h2,
    #solution .section-heading h2 {
        font-size: clamp(31px, 9vw, 40px) !important;
    }

    #services .section-heading > p,
    #problems .section-heading > p,
    #solution .section-heading > p {
        font-size: 15px !important;
    }
}


/* More compact Our Company section */
#services.section {
    padding-block: 48px !important;
}

#services .section-heading {
    margin-bottom: 24px !important;
}

#services .service-grid {
    gap: 14px !important;
}

#services .service-card {
    min-height: 235px !important;
    padding: 22px !important;
    border-radius: 18px !important;
}

#services .service-card > span {
    width: 42px !important;
    height: 42px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
}

#services .service-card h3 {
    margin: 18px 0 9px !important;
    font-size: 20px !important;
    line-height: 1.12 !important;
}

#services .service-card p {
    font-size: 15px !important;
    line-height: 1.55 !important;
}

#services .service-card .text-link {
    margin-top: 16px !important;
    font-size: 14px !important;
}

@media (max-width: 820px) {
    #services.section {
        padding-block: 38px !important;
    }

    #services .service-card {
        min-height: auto !important;
        padding: 20px !important;
    }
}


/* Compact homepage product preview */
#products.product-section {
    padding-block: 58px !important;
}

#products .section-heading {
    margin-bottom: 28px !important;
    gap: 38px !important;
    align-items: center !important;
}

#products .section-heading h2 {
    max-width: 620px !important;
    font-size: clamp(34px, 3.4vw, 48px) !important;
    line-height: 1.07 !important;
}

#products .section-heading > p {
    max-width: 500px !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

#products .product-showcase {
    gap: 18px !important;
}

#products .product-card {
    padding: 24px !important;
    border-radius: 20px !important;
}

/* Homepage वर पहिले 3 features */
#products .product-card li:nth-child(n+4) {
    display: none !important;
}

#products .product-card h3 {
    margin: 20px 0 10px !important;
    font-size: clamp(27px, 2.4vw, 34px) !important;
    line-height: 1.08 !important;
}

#products .product-card > p {
    margin: 0 !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
}

#products .product-card ul {
    margin: 17px 0 !important;
    gap: 7px !important;
    font-size: 14px !important;
}

/* Full information product detail page वर राहील */
#products .product-card dl,
#products .product-card .demo-slot {
    display: none !important;
}

#products .product-price {
    margin: 17px 0 !important;
}

#products .product-price b {
    font-size: 28px !important;
}

#products .button {
    min-height: 46px !important;
    padding-inline: 18px !important;
    font-size: 14px !important;
}

@media (max-width: 820px) {
    #products.product-section {
        padding-block: 42px !important;
    }

    #products .section-heading {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-bottom: 23px !important;
    }

    #products .product-showcase {
        grid-template-columns: 1fr !important;
    }

    #products .product-card {
        padding: 20px !important;
    }
}


/* Restore all homepage product information */
#products .product-card li:nth-child(n+4) {
    display: flex !important;
}

#products .product-card dl {
    display: grid !important;
}

#products .product-card .demo-slot {
    display: grid !important;
}



/* Compact product cards without hiding any information */
#products .product-card {
    padding: 20px !important;
}

#products .product-card h3 {
    margin: 16px 0 8px !important;
    font-size: 28px !important;
    line-height: 1.08 !important;
}

#products .product-card > p {
    font-size: 14px !important;
    line-height: 1.48 !important;
}

#products .product-card ul {
    margin: 14px 0 !important;
    gap: 4px !important;
}

#products .product-card li {
    font-size: 14px !important;
    line-height: 1.4 !important;
}

/* Ideal for आणि Supported workflow बाजूबाजूला */
#products .product-card dl {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 9px !important;
}

#products .product-card dl div {
    padding: 11px !important;
    border-radius: 11px !important;
}

#products .product-card dt {
    font-size: 10px !important;
}

#products .product-card dd {
    margin-top: 3px !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

#products .product-price {
    margin: 13px 0 !important;
}

#products .product-price b {
    font-size: 26px !important;
}

#products .product-card .cta-actions {
    gap: 9px !important;
}

#products .product-card .button {
    min-height: 42px !important;
    padding-inline: 15px !important;
    font-size: 13px !important;
}

#products .product-card .demo-slot {
    margin-top: 14px !important;
    padding: 11px !important;
    grid-template-columns: 36px 1fr !important;
    gap: 10px !important;
}

#products .demo-slot > span {
    width: 36px !important;
    height: 36px !important;
}

/* Small screens */
@media (max-width: 900px) {
    #products .product-card dl {
        grid-template-columns: 1fr !important;
    }

    #products .product-card h3 {
        font-size: 25px !important;
    }
}



/* Trusted Partners — attractive homepage cards */
#partners .partner-placeholder{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:22px;
    margin-top:0;
}

#partners .partner-placeholder > article{
    min-height:300px;
    padding:30px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    border:1px solid rgba(219,170,62,.35);
    border-radius:22px;
    background:rgba(255,255,255,.045);
    box-shadow:0 18px 45px rgba(0,0,0,.18);
}

#partners .partner-placeholder > article > span{
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    flex:0 0 52px;
    color:#071524;
    border-radius:15px;
    background:var(--gold-500,#dbaa3e);
    font-weight:900;
}

#partners .partner-placeholder h3{
    margin:22px 0 10px;
    color:#fff;
    font-size:25px;
    line-height:1.2;
}

#partners .partner-placeholder article p{
    margin:0;
    color:#b5c3d0;
    font-size:16px;
    line-height:1.7;
}

#partners .partner-placeholder article > .text-link{
    margin-top:auto;
    padding-top:22px;
    color:var(--gold-300,#f1cf78);
    font-weight:800;
}

#partners .section-shell > .text-link{
    width:max-content;
    margin:28px auto 0;
    padding:12px 18px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(219,170,62,.4);
    border-radius:12px;
    color:var(--gold-300,#f1cf78);
}

/* This is the ONLY place partner cards collapse to a single column on
   mobile. Every other homepage grid (service-grid, problem-grid,
   solution-flow, steps-grid, why-grid, referral-steps) gets its 1-column
   collapse from the "final override" media blocks further down this file
   (@media max-width:920px / 620px) — partner-placeholder predates that
   pass and was never migrated into it, so it is NOT there. Do not delete
   this block assuming it's superseded by those — nothing else replaces it. */
@media(max-width:760px){
    #partners .partner-placeholder{
        grid-template-columns:1fr;
    }

    #partners .partner-placeholder > article{
        min-height:260px;
        padding:23px;
    }

    #partners .section-shell > .text-link{
        width:100%;
    }
}


/* =========================================================
   YASHDHAN HOMEPAGE — FINAL COMPACT & BALANCED OVERRIDE
   ========================================================= */

/* Common section balance */
body .section,
body .dark-section,
body .product-section,
body .partner-section,
body .faq-section {
    padding-block: 58px !important;
}

body .section-heading {
    margin-bottom: 26px !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, .75fr) !important;
    gap: 34px !important;
    align-items: center !important;
}

body .section-heading h2 {
    max-width: 680px !important;
    font-size: clamp(34px, 3.25vw, 48px) !important;
    line-height: 1.06 !important;
    letter-spacing: -.03em !important;
}

body .section-heading > p {
    max-width: 520px !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

body .eyebrow {
    margin-bottom: 10px !important;
}

/* Hero */
body .hero {
    min-height: auto !important;
    padding-block: 34px !important;
    grid-template-columns: minmax(0, 1fr) minmax(390px, .86fr) !important;
    gap: 40px !important;
    align-items: stretch !important;
}

body .hero-copy {
    padding-block: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

body .hero h1, body .hero h2 {
    max-width: 680px !important;
    margin-bottom: 16px !important;
    font-size: clamp(38px, 3.7vw, 54px) !important;
    line-height: 1.06 !important;
    letter-spacing: -.035em !important;
}

body .hero .lead {
    margin-block: 0 !important;
    max-width: 680px !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

body .hero .cta-actions {
    margin-top: 20px !important;
}

body .trust-row {
    margin-top: 17px !important;
    gap: 13px !important;
}

body .featured-product {
    height: 100% !important;
    min-height: 0 !important;
    padding: 16px !important;
    border-radius: 21px !important;
}

body .featured-product > .product-brandline {
    margin-top: 15px !important;
}

body .featured-product > p {
    margin-block: 12px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

/* Company service cards */
body .service-grid {
    gap: 14px !important;
}

body .service-card {
    min-height: 225px !important;
    padding: 21px !important;
    border-radius: 18px !important;
}

body .service-card > span {
    width: 42px !important;
    height: 42px !important;
}

body .service-card h3 {
    margin: 17px 0 8px !important;
    font-size: 20px !important;
}

body .service-card p {
    font-size: 14px !important;
    line-height: 1.52 !important;
}

body .service-card .text-link {
    margin-top: 14px !important;
    font-size: 13px !important;
}

/* Trader problems */
body .problem-grid article {
    min-height: 245px !important;
    padding: 22px 18px !important;
}

body .problem-grid h3 {
    margin: 38px 0 10px !important;
    font-size: 19px !important;
}

body .problem-grid p {
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* Solution cards */
body .solution-flow {
    gap: 14px !important;
}

body .solution-flow article {
    min-height: 260px !important;
    padding: 23px !important;
}

body .solution-flow article > span {
    font-size: 31px !important;
}

body .solution-flow small {
    margin-top: 25px !important;
}

body .solution-flow h3 {
    margin: 8px 0 10px !important;
    font-size: 22px !important;
}

body .solution-flow p {
    font-size: 14px !important;
    line-height: 1.52 !important;
}

/* Trial cards */
body .trial-grid {
    gap: 16px !important;
}

body .trial-grid article {
    padding: 25px !important;
    border-radius: 20px !important;
}

body .trial-grid .eyebrow {
    margin-top: 20px !important;
}

body .trial-grid h3 {
    margin-bottom: 10px !important;
    font-size: 27px !important;
}

body .trial-grid article > p:not(.eyebrow) {
    font-size: 14px !important;
    line-height: 1.55 !important;
}

body .trial-grid strong {
    margin: 18px 0 16px !important;
    font-size: 32px !important;
}

/* Main product cards — keep every point visible */
body #products .product-showcase {
    gap: 17px !important;
    align-items: stretch !important;
}

body #products .product-card {
    height: 100% !important;
    padding: 21px !important;
    border-radius: 20px !important;
}

body #products .product-card h3 {
    margin: 16px 0 8px !important;
    font-size: clamp(25px, 2.2vw, 31px) !important;
}

body #products .product-card > p {
    margin-block: 0 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

body #products .product-card ul {
    margin: 14px 0 !important;
    gap: 5px !important;
}

body #products .product-card li {
    display: flex !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
}

body #products .product-card dl {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
}

body #products .product-card dl div {
    padding: 10px !important;
}

body #products .product-card dd {
    font-size: 12px !important;
    line-height: 1.4 !important;
}

body #products .product-price {
    margin: 12px 0 !important;
}

body #products .product-price b {
    font-size: 26px !important;
}

body #products .demo-slot {
    display: grid !important;
    margin-top: 13px !important;
    padding: 10px !important;
}

/* Homepage product cards — tighter, unified checklist + centered price/CTA */
body #products .product-card {
    display: flex !important;
    flex-direction: column !important;
    padding: 20px !important;
}

body #products .product-card ul {
    margin: 10px 0 !important;
    padding: 12px 14px !important;
    gap: 6px !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .035) !important;
}

body #products .product-card li {
    font-size: 12.5px !important;
    line-height: 1.35 !important;
}

body #products .product-card dl {
    gap: 6px !important;
}

body #products .product-card dl div {
    padding: 9px !important;
}

body #products .product-card dt {
    font-size: 9px !important;
}

body #products .product-card dd {
    font-size: 11px !important;
    line-height: 1.35 !important;
}

body #products .product-card > * {
    margin-top: 0;
}

body #products .price-actions-row {
    margin-top: auto !important;
    padding-top: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

body #products .product-price {
    margin: 0 !important;
    text-align: left !important;
}

body #products .product-card .cta-actions {
    margin-top: 0 !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

@media (max-width: 480px) {
    body #products .price-actions-row {
        justify-content: center !important;
    }
    body #products .product-price {
        text-align: center !important;
    }
    body #products .product-card .cta-actions {
        justify-content: center !important;
        width: 100% !important;
    }
}

body #products .product-card .button {
    min-height: 40px !important;
    padding-inline: 14px !important;
    font-size: 12.5px !important;
}

/* How it works */
body .steps-grid {
    gap: 14px !important;
}

body .steps-grid article {
    min-height: 195px !important;
    padding: 21px !important;
}

body .steps-grid h3 {
    margin: 18px 0 8px !important;
    font-size: 20px !important;
}

body .steps-grid p {
    font-size: 14px !important;
    line-height: 1.5 !important;
}

/* Why Yashdhan */
body .why-grid {
    gap: 13px !important;
}

body .why-grid article {
    padding: 20px !important;
    gap: 15px !important;
}

body .why-grid h3 {
    font-size: 19px !important;
}

body .why-grid p {
    font-size: 14px !important;
    line-height: 1.5 !important;
}

/* Partners */
body #partners .partner-placeholder {
    gap: 17px !important;
}

body #partners .partner-placeholder > article {
    min-height: 245px !important;
    padding: 23px !important;
}

body #partners .partner-placeholder h3 {
    margin: 17px 0 8px !important;
    font-size: 22px !important;
}

body #partners .partner-placeholder article p {
    font-size: 14px !important;
    line-height: 1.58 !important;
}

body #partners .partner-placeholder article > .text-link {
    padding-top: 15px !important;
}

body #partners .section-shell > .text-link {
    margin-top: 20px !important;
}

/* Refer & Earn */
body .referral-steps article {
    min-height: 205px !important;
    padding: 21px 17px !important;
}

body .referral-steps h3 {
    margin: 30px 0 8px !important;
    font-size: 18px !important;
}

body .referral-steps p {
    font-size: 13px !important;
    line-height: 1.48 !important;
}

body .info-banner {
    margin-top: 16px !important;
    padding: 18px 21px !important;
}

/* Reviews and offers */
body .two-column-content {
    gap: 16px !important;
    align-items: stretch !important;
}

body .two-column-content > article {
    padding: 27px !important;
    border-radius: 20px !important;
}

body .two-column-content h2 {
    font-size: 31px !important;
}

body .empty-proof {
    margin-top: 18px !important;
}

/* About */
body .about-grid {
    gap: 50px !important;
    align-items: start !important;
}

body .about-grid h2 {
    font-size: clamp(34px, 3.3vw, 47px) !important;
}

body .about-grid > div:last-child {
    font-size: 16px !important;
    line-height: 1.6 !important;
}

body .about-highlights {
    gap: 9px !important;
}

body .about-highlights li {
    padding: 11px 13px !important;
}

/* FAQ */
body .faq-list {
    gap: 8px !important;
}

body .faq-list details {
    border-radius: 13px !important;
}

body .faq-list summary {
    min-height: 58px !important;
    padding: 14px 18px !important;
    font-size: 15px !important;
}

body .faq-list details p {
    padding: 0 18px 17px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

/* Final CTA */
body .final-cta {
    margin-block: 42px !important;
    padding: 32px !important;
    gap: 25px !important;
    border-radius: 21px !important;
}

body .final-cta h2 {
    font-size: clamp(30px, 3vw, 39px) !important;
}

body .final-cta p:not(.eyebrow) {
    font-size: 15px !important;
    line-height: 1.55 !important;
}

/* Risk disclosure */
body .compliance-section {
    padding-block: 30px !important;
}

body .compliance-section > .section-shell {
    gap: 27px !important;
}

body .compliance-section h2 {
    font-size: 28px !important;
}

body .compliance-section p,
body .compliance-section li {
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* Tablet and mobile */
@media (max-width: 920px) {
    body .section,
    body .dark-section,
    body .product-section,
    body .partner-section,
    body .faq-section {
        padding-block: 43px !important;
    }

    body .section-heading {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        margin-bottom: 22px !important;
    }

    body .section-heading h2 {
        font-size: clamp(31px, 7vw, 41px) !important;
    }

    body .hero {
        padding-block: 30px !important;
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }

    body .hero h1, body .hero h2 {
        font-size: clamp(35px, 7vw, 46px) !important;
    }

    body .service-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body .problem-grid,
    body .referral-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        border: 0 !important;
        gap: 12px !important;
        background: transparent !important;
    }

    body .problem-grid article,
    body .referral-steps article {
        min-height: auto !important;
        border: 1px solid var(--line-dark) !important;
        border-radius: 16px !important;
    }

    body .referral-steps article {
        border-color: var(--line-light) !important;
    }

    body .solution-flow,
    body .steps-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body #products .product-showcase,
    body .trial-grid,
    body .two-column-content,
    body .about-grid {
        grid-template-columns: 1fr !important;
    }

    body .about-grid {
        gap: 20px !important;
    }
}

@media (max-width: 620px) {
    body .section-shell {
        width: min(100% - 28px, var(--site-width, 1240px)) !important;
    }

    body .section,
    body .dark-section,
    body .product-section,
    body .partner-section,
    body .faq-section {
        padding-block: 35px !important;
    }

    body .section-heading h2 {
        font-size: clamp(29px, 9vw, 37px) !important;
    }

    body .section-heading > p {
        font-size: 14px !important;
    }

    body .service-grid,
    body .problem-grid,
    body .solution-flow,
    body .steps-grid,
    body .why-grid,
    body .referral-steps {
        grid-template-columns: 1fr !important;
    }

    body .service-card,
    body .solution-flow article,
    body .steps-grid article {
        min-height: auto !important;
    }

    body #products .product-card dl {
        grid-template-columns: 1fr !important;
    }

    body .info-banner {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    body .final-cta {
        margin-block: 28px !important;
        padding: 24px !important;
        grid-template-columns: 1fr !important;
    }

    body .final-cta .cta-actions,
    body .final-cta .button {
        width: 100% !important;
    }

    body .compliance-section > .section-shell {
        grid-template-columns: 1fr !important;
    }
}

/* Display complete TradingView and MT5 screenshots */
.product-featured-media {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: contain !important;
    object-position: center !important;
    background: #ffffff;
}

/* Compact preview thumbnail inside homepage/catalog cards — keeps card size in check */
#products .product-card .product-featured-media,
.catalog-card .product-featured-media {
    aspect-ratio: auto !important;
    height: 100px !important;
    margin: 12px 0 !important;
    border-radius: 12px !important;
    object-fit: cover !important;
}

.catalog-card .product-featured-placeholder {
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #f3f6fa, #e8edf3);
}
.catalog-card .product-featured-placeholder span {
    color: #9aa7b5;
    font-weight: 900;
    font-size: 22px;
    letter-spacing: .08em;
}

/*
|--------------------------------------------------------------------------
| Landing-page polish — hover effects, card lift, image zoom, button glow
|--------------------------------------------------------------------------
| Purely additive. Adds transitions/hover states only — does not change
| any existing layout, spacing, or override rules above.
*/

.product-card,
.trial-grid article,
.catalog-card,
.service-card,
.solution-flow article,
.steps-grid article,
.why-grid article,
.partner-placeholder > article,
.two-column-content > article,
.faq-list details,
.content-page-grid article,
.blog-card,
.price-card,
.problem-grid article,
.referral-steps article,
.ys-service-card,
.ys-problem-card {
    transition: transform .35s cubic-bezier(.2,.8,.25,1),
                box-shadow .35s ease,
                border-color .35s ease;
}

.product-card:hover,
.trial-grid article:hover,
.catalog-card:hover,
.service-card:hover,
.solution-flow article:hover,
.steps-grid article:hover,
.why-grid article:hover,
.partner-placeholder > article:hover,
.two-column-content > article:hover,
.content-page-grid article:hover,
.blog-card:hover,
.price-card:hover,
.problem-grid article:hover,
.referral-steps article:hover,
.ys-service-card:hover,
.ys-problem-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(0, 0, 0, .12), 0 0 28px rgba(219, 170, 62, .18);
    border-color: rgba(219, 170, 62, .5);
}

/* problem-grid/referral-steps sit flush against each other with shared
   borders (no radius, no gap) — a lift there would visually tear the strip
   apart, so they keep the glow without the translateY the others get. */
.problem-grid article:hover,
.referral-steps article:hover {
    transform: none;
}

.faq-list details {
    transition: border-color .3s ease, background .3s ease;
}

.faq-list details:hover {
    border-color: rgba(219, 170, 62, .4);
}

/* Gentle zoom on hero/banner/product images inside a bounded wrapper */
.featured-product,
.product-detail-hero aside,
.demo-detail,
.blog-card,
.managed-visual {
    overflow: hidden;
}

.featured-banner,
.product-detail-hero aside > img,
.blog-card img {
    transition: transform .6s cubic-bezier(.2,.8,.25,1);
}

.featured-product:hover .featured-banner,
.product-detail-hero aside:hover > img,
.blog-card:hover img {
    transform: scale(1.045);
}

/* Buttons — stronger, more tactile hover/press feedback */
.button.gold {
    transition: transform .2s ease, box-shadow .25s ease, filter .25s ease;
}

.button.gold:hover {
    box-shadow: 0 18px 38px rgba(219, 170, 62, .3);
    filter: brightness(1.04);
}

.button.gold:active,
.button.outline:active {
    transform: translateY(0) scale(.98);
}

.button.outline {
    transition: transform .2s ease, background .25s ease, border-color .25s ease;
}

.button.outline:hover {
    background: rgba(219, 170, 62, .14);
    border-color: rgba(219, 170, 62, .7);
}

/* Nav links — subtle underline sweep on hover */
.site-navigation a {
    position: relative;
    transition: color .25s ease;
}

.site-navigation a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 0;
    height: 2px;
    background: var(--gold-500, #dbaa3e);
    transition: width .3s ease;
}

.site-navigation a:hover::after {
    width: 100%;
}

/* Footer link hover */
.site-footer a {
    transition: color .2s ease, opacity .2s ease;
}

.site-footer a:hover {
    opacity: .78;
}

@media (prefers-reduced-motion: reduce) {
    .product-card,
    .trial-grid article,
    .catalog-card,
    .service-card,
    .solution-flow article,
    .steps-grid article,
    .why-grid article,
    .partner-placeholder > article,
    .two-column-content > article,
    .faq-list details,
    .content-page-grid article,
    .blog-card,
    .price-card,
    .featured-banner,
    .product-detail-hero aside > img,
    .blog-card img,
    .button.gold,
    .button.outline {
        transition: none !important;
        transform: none !important;
    }
}

/* =========================================================
   ADMIN-TOGGLEABLE COMPACT LAYOUT
   Controlled from Website → Appearance → "Layout density".
   Turning this OFF in admin removes every rule below and the
   site returns to its original, larger spacing.
   ========================================================= */
body.density-compact .pricing-group-heading { margin-bottom: 18px !important; text-align: left !important; }
body.density-compact .pricing-group-heading h2 { font-size: clamp(24px, 2.6vw, 32px) !important; margin: 4px 0 6px !important; }
body.density-compact .pricing-group-heading p:not(.eyebrow) { font-size: 14px !important; }
body.density-compact .pricing-product-group { margin-bottom: 34px !important; }
body.density-compact .pricing-grid { gap: 14px !important; }
body.density-compact .price-card { padding: 20px !important; border-radius: 16px !important; }
body.density-compact .price-card h3 { font-size: 20px !important; margin: 8px 0 !important; }
body.density-compact .price-card > div > small { font-size: 11px !important; }
body.density-compact .price-card > div > p { font-size: 13px !important; margin: 0 !important; }
body.density-compact .price-card strong { margin: 14px 0 !important; font-size: 28px !important; }
body.density-compact .price-card ul { margin: 0 0 14px !important; font-size: 13px !important; }

body.density-compact h1 { font-size: clamp(28px, 3.4vw, 44px) !important; }
body.density-compact h2 { font-size: clamp(24px, 2.8vw, 36px) !important; }
body.density-compact h3 { font-size: clamp(18px, 1.8vw, 24px) !important; }
body.density-compact .section,
body.density-compact .dark-section,
body.density-compact .product-section,
body.density-compact .partner-section,
body.density-compact .faq-section { padding-block: 40px !important; }
body.density-compact .why-grid article,
body.density-compact .service-card,
body.density-compact .solution-flow article,
body.density-compact .steps-grid article,
body.density-compact .catalog-card,
body.density-compact .content-page-grid article { padding: 18px !important; }
body.density-compact .final-cta { padding: 26px !important; margin-block: 26px !important; }
body.density-compact .final-cta h2 { font-size: clamp(24px, 2.6vw, 32px) !important; }
body.density-compact .final-cta p:not(.eyebrow) { font-size: 14px !important; }

/* =========================================================
   HERO SLIDER — admin-managed slides (1 static + up to 4 more)
   ========================================================= */
.hero-slider { display: block !important; position: relative; }
/* The base .hero rule above was sized for the old single-slide layout
   (min-height:760px, padding-block:105px) so its banner image would have
   room to breathe. Each .hero-slide now controls its own fixed height —
   this leftover min-height/padding on the outer section just adds a big
   empty gap above and below the slider box on every slide. */
.hero.hero-slider { min-height: 0 !important; padding-block: 28px 18px !important; }
/* Beats the legacy ".hero > div:first-child" rule above, which otherwise
   matches this viewport (now the hero's first child div) and forces it
   into a vertical flex column with padding/min-height it doesn't need. */
.hero.hero-slider > .hero-slider-viewport {
    display: block !important;
    min-height: 0 !important;
    padding-block: 0 !important;
    overflow: hidden;
}
/* Descendant selector (not ">") so this still wins now that the track
   sits one level deeper, inside .hero-slider-viewport — it forces a
   horizontal row so slides sit side-by-side instead of stacking. */
.hero.hero-slider .hero-slider-track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    min-height: 0 !important;
    padding-block: 0 !important;
    justify-content: flex-start !important;
    transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.hero-slide {
    flex: 0 0 100%;
    width: 100%;
    height: 360px;
    box-sizing: border-box;
    padding-inline: 32px;
    display: grid !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr) !important;
    align-items: stretch !important;
    gap: 42px !important;
}
.hero-slide > .hero-copy {
    min-height: 100%;
    padding-block: 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.hero-slide > .featured-product {
    height: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
}
.hero-slide > .featured-product > a:last-child { margin-top: auto; }

/* Custom-HTML slides (Admin → Hero → Manage cards → "Custom HTML" field)
   get full creative control — no forced 2-column grid — but still sit in
   the same fixed-height slot as every other slide, so the slider never
   jumps in size when it reaches one. */
.hero-slide.hero-slide-custom {
    display: block !important;
    overflow: hidden;
}

/* Compacts every "Custom HTML" hero slide at once, since they all reuse
   the same ch-* class names — so the whole thing fits in one glance
   inside the fixed 440px box, no top/bottom clipping. Edit here instead
   of re-pasting each slide's Custom HTML. */
.hero-slide-custom .ch-badge { margin-bottom: 10px !important; padding: 5px 12px !important; font-size: 10px !important; }
.hero-slide-custom h1 { font-size: clamp(21px, 2.1vw, 30px) !important; margin-bottom: 8px !important; line-height: 1.12 !important; }
.hero-slide-custom p.ch-lead { font-size: 13px !important; line-height: 1.5 !important; margin-bottom: 14px !important; }
.hero-slide-custom .ch-stats { margin-bottom: 16px !important; gap: 20px !important; }
.hero-slide-custom .ch-stat b { font-size: 17px !important; }
.hero-slide-custom .ch-stat span { font-size: 9.5px !important; }
.hero-slide-custom .ch-cta,
.hero-slide-custom .ch-cta-outline { padding: 10px 20px !important; font-size: 13px !important; }
.hero-slide-custom .ch-panel { padding: 14px !important; }
.hero-slide-custom .ch-panel-head { margin-bottom: 10px !important; padding-bottom: 8px !important; }
.hero-slide-custom .ch-mrow { padding: 7px 10px !important; }
.hero-slide-custom .ch-mrow span { font-size: 12px !important; }
.hero-slide-custom .ch-mrow small { font-size: 9.5px !important; }

/* Blend every custom slide's right-side visual panel into the hero's own
   background instead of sitting in a separately-colored box, so there's
   no visible vertical seam between the left copy and the right visual. */
.hero-slide-custom .ch-panel {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.hero-slider-controls { position: relative; margin-top: 16px; display: flex; align-items: center; justify-content: center; gap: 16px; }
.hero-slider-arrow { width: 38px; height: 38px; border: 1px solid rgba(219,170,62,.35); border-radius: 50%; background: rgba(255,255,255,.06); color: #fff; font-size: 15px; cursor: pointer; transition: background .2s ease, border-color .2s ease; }
.hero-slider-arrow:hover { background: rgba(219,170,62,.18); border-color: var(--gold-500); }
.hero-slider-dots { display: flex; gap: 7px; }
.hero-slider-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.25); cursor: pointer; }
.hero-slider-dot.is-active { width: 22px; border-radius: 4px; background: var(--gold-500); }

@media (max-width: 820px) {
    .hero-slide { grid-template-columns: 1fr !important; gap: 28px !important; height: auto !important; padding-inline: 24px; }
    .hero-slide > .hero-copy { padding-block: 0; }
    .hero-slide.hero-slide-custom { height: auto !important; overflow: visible; }
    /* Safety net: every admin-pasted Custom HTML slide reuses a ch-xx
       wrapper div with its own inline <style>. If that inline style is
       ever missing, incomplete, or corrupted (e.g. a slide got cut off
       mid-save in the admin panel), this generic rule still forces the
       slide into a readable single-column, centered mobile layout
       instead of squashing two flex columns into a narrow, broken row. */
    .hero-slide-custom > div[class^="ch-"],
    .hero-slide-custom > div[class*=" ch-"] {
        flex-direction: column !important;
        height: auto !important;
        overflow: visible !important;
        text-align: center;
    }
    /* Every ch-xx wrapper's two children (copy + visual) use flex-grow
       ratios like flex:1.05 / flex:.95 that were written for the desktop
       side-by-side row. Stacking to a column above reassigns that same
       flex-basis:0 growth to the VERTICAL axis instead, so the two
       children fight over whatever height the wrapper happens to have —
       starving the second child down to a sliver and clipping it via the
       wrapper's own overflow:hidden. Resetting to flex:none here makes
       each child size to its own natural content height and simply
       stack, which is what "column" is supposed to mean. */
    .hero-slide-custom > div[class^="ch-"] > *,
    .hero-slide-custom > div[class*=" ch-"] > * {
        flex: none !important;
        width: 100% !important;
        min-height: 0;
    }
    /* The slider track stretches every slide to match the tallest one
       (flexbox default cross-axis stretch), which is what makes the
       whole hero look oversized on mobile even while showing a short
       slide. flex-start stops that forced stretch; the JS in hero.php
       then sets the viewport's own height to match only the slide
       that's actually visible, animated by the transition below. */
    .hero.hero-slider .hero-slider-track { align-items: flex-start; }
    .hero.hero-slider > .hero-slider-viewport { transition: height .3s ease; }
    /* Slides built on the "product menu" pattern (a .ch-panel wrapping a
       .ch-menu list of .ch-mrow rows, e.g. the main hero slide) hard-code
       the panel's desktop height/max-height and overflow:hidden, sized
       for however many rows existed when it was written. On mobile that
       silently clips the last row whenever the true row count needs more
       room. Scoped to :has(.ch-menu) so it doesn't touch the OTHER kind
       of visual (a chart/graphic panel with position:absolute decoration
       and no flow content) — those are fixed-height by design and
       collapse to near-nothing if forced to height:auto instead. */
    .hero-slide-custom .ch-panel:has(.ch-menu) {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
    .hero-slide-custom .ch-menu { flex: none !important; min-height: 0; }
    .hero-slide-custom img,
    .hero-slide-custom svg { max-width: 100%; height: auto; }
    .hero-slide-custom * { word-break: break-word; overflow-wrap: break-word; }
}

@media (max-width: 480px) {
    .hero-slide { padding-inline: 16px; gap: 22px !important; }
    .hero-slider-controls { margin-top: 24px; gap: 12px; }
}

/* Slide with its own full-bleed background image */
.hero-slide.has-bg-image {
    position: relative;
    background-color: var(--navy-950);
    background-size: cover;
    background-position: center;
    border-radius: 24px;
    overflow: hidden;
    padding: 48px 40px;
    transition: background-image .3s ease;
}
.hero-slide.has-bg-image::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, rgba(4,12,22,.92) 0%, rgba(4,12,22,.72) 45%, rgba(4,12,22,.35) 100%);
    z-index: 0;
}
.hero-slide.has-bg-image.is-active { grid-template-columns: 1fr !important; }
.hero-slide.has-bg-image > .hero-copy { position: relative; z-index: 1; max-width: 640px; padding-block: 0 !important; }
@media (max-width: 820px) {
    .hero-slide.has-bg-image { padding: 32px 22px; }
}

/* Background-image slides match the original slide's height, so the
   slider doesn't visibly grow/shrink as it moves between slides. */
@media (min-width: 821px) {
    .hero-slide.has-bg-image { min-height: 590px; display: flex; align-items: center; }
}

/* Homepage "Our Company" services grid (used by the section's Custom HTML) */
.ys-service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:8px}
.ys-service-card{display:flex;flex-direction:column;align-items:center;text-align:center;min-height:0;padding:22px 18px;border:1px solid var(--line-light);border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(20,35,52,.05)}
.ys-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;color:#fff;margin-bottom:14px}
.ys-icon-navy{background:linear-gradient(135deg,#0a1b30,#173a5e)}
.ys-icon-gold{background:linear-gradient(135deg,#dbaa3e,#b9812a)}
.ys-icon-blue{background:linear-gradient(135deg,#2f6fed,#1c4fb0)}
.ys-icon-teal{background:linear-gradient(135deg,#17a589,#0e7a63)}
.ys-service-card h3{margin:0 0 8px;font-size:17px;line-height:1.25}
.ys-service-card p{margin:0 0 14px;color:#677587;font-size:13.5px;line-height:1.5}
.ys-card-btn{margin-top:auto;padding:8px 16px;border-radius:999px;background:var(--navy-900);color:#fff;font-size:12.5px;font-weight:800;text-decoration:none}
.ys-card-btn:hover{background:var(--gold-500);color:var(--navy-900)}
@media (max-width:1050px){.ys-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.ys-service-grid{grid-template-columns:1fr}}

/* Homepage "Trader Problems" grid — light-on-dark card variant */
.ys-problem-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:8px}
.ys-problem-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 18px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(255,255,255,.04);backdrop-filter:blur(2px)}
.ys-problem-card:hover{background:rgba(255,255,255,.07)}
.ys-problem-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;color:var(--navy-900);background:var(--gold-500);margin-bottom:14px}
.ys-problem-card h3{margin:0 0 8px;font-size:16.5px;line-height:1.3;color:#fff}
.ys-problem-card p{margin:0;color:#aab8c6;font-size:13.5px;line-height:1.55}
@media (max-width:1050px){.ys-problem-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.ys-problem-grid{grid-template-columns:1fr}}
.ys-problem-icon.ys-icon-red{background:#e0453f;color:#fff}
.ys-problem-icon.ys-icon-navy{background:#173a5e;color:#fff}
.ys-problem-icon.ys-icon-gold{background:var(--gold-500);color:var(--navy-900)}
.ys-problem-icon.ys-icon-blue{background:#2f6fed;color:#fff}
.ys-icon{font-size:15px;font-weight:900;font-family:Georgia,serif}
.ys-note-banner{max-width:820px;margin:26px auto 0;padding:20px 24px;border:1px solid #e0d5bd;border-radius:14px;background:#fbf8f1;text-align:center;color:#615744}
.ys-note-banner b{display:block;margin-bottom:8px;color:#3a3226;font-size:15px}
.ys-note-banner p{margin:0 0 12px;font-size:13.5px;line-height:1.6}
.ys-note-banner a{color:#8e6c2a;font-weight:800;font-size:13px;text-decoration:none}
.ys-note-banner a:hover{text-decoration:underline}
.ys-about-list{display:grid;gap:16px}
.ys-about-item{display:flex;gap:14px;align-items:flex-start;padding:16px;border:1px solid var(--line-light);border-radius:14px;background:#fff;box-shadow:0 8px 22px rgba(20,35,52,.04)}
.ys-about-item .ys-icon{flex-shrink:0;width:40px;height:40px;border-radius:11px}
.ys-about-item b{display:block;margin-bottom:4px;font-size:15px}
.ys-about-item p{margin:0;color:#677587;font-size:13.5px;line-height:1.55}
.ys-eyebrow-plain{text-transform:none;letter-spacing:normal}
.ys-legal{max-width:760px;color:#334155;line-height:1.7}
.ys-legal-updated{color:#5b6b7d;font-size:13px;margin-bottom:20px}
.ys-legal h2{margin:28px 0 10px;font-size:20px;color:#0a1b30}
.ys-legal h2:first-of-type{margin-top:0}
.ys-legal p{margin:0 0 4px}
.ys-legal a{color:#b8863a;font-weight:700}
.ys-legal-intro{max-width:900px;margin:0 0 28px;padding:18px 22px;border-left:4px solid #d7ab54;background:#faf7f0;color:#4a4030;font-style:italic;line-height:1.7;border-radius:0 10px 10px 0}
.ys-legal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;grid-column:1/-1;width:100%}
.ys-legal-card{padding:22px;border:1px solid var(--line-light);border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(20,35,52,.05)}
.ys-legal-card-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.ys-legal-badge{flex-shrink:0;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#1d6fd6;color:#fff;font-weight:800;font-size:14px}
.ys-legal-card h3{margin:0;padding-bottom:10px;border-bottom:2px solid #e7ecf1;flex:1;font-size:17px;color:#0a1b30}
.ys-legal-card ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.ys-legal-card li{position:relative;padding-left:22px;color:#4b5768;font-size:13.5px;line-height:1.5}
.ys-legal-card li::before{content:"✓";position:absolute;left:0;top:0;color:#1a9e5c;font-weight:900}
.ys-legal-card li b{color:#1a2b3d}
@media (max-width:960px){.ys-legal-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.ys-legal-grid{grid-template-columns:1fr}}
body .ys-hero-copy h1{font-size:clamp(26px,2.6vw,36px) !important;line-height:1.25 !important;letter-spacing:normal !important;margin:8px 0 14px !important;max-width:none !important}
.ys-hero-row{display:flex;gap:32px;align-items:flex-start;height:100%;padding-top:6px;box-sizing:border-box;position:relative}
.ys-hero-row>.ys-hero-copy,.ys-hero-row>.ys-hero-visual{position:relative;z-index:1}
.ys-hero-candles{position:absolute;inset:0;width:100%;height:100%;opacity:.22;pointer-events:none;z-index:0}
@media (max-width:820px){.ys-hero-candles{display:none}}
.ys-hero-compact-banner{aspect-ratio:auto;max-height:320px;width:100%;height:auto;object-fit:contain}
.ys-hero-chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ys-hero-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#e8edf2;font-size:11.5px;font-weight:600;white-space:nowrap}
.ys-hero-row>.ys-hero-copy{flex:1.05;min-width:0}
.ys-hero-row>.ys-hero-visual{flex:.95;min-width:0}
@media (max-width:820px){.ys-hero-row{flex-direction:column;height:auto}.ys-hero-row>.ys-hero-copy,.ys-hero-row>.ys-hero-visual{flex:none;width:100%}}
.ys-hero-panel{display:grid;gap:10px;padding:20px;border-radius:24px;background:linear-gradient(160deg,rgba(215,171,84,.12),rgba(10,27,48,.6));border:1px solid rgba(215,171,84,.35);box-shadow:0 30px 70px rgba(4,14,25,.35);box-sizing:border-box}
.ys-hero-stat{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);transition:transform .25s ease,background .25s ease,box-shadow .25s ease,border-color .25s ease}
.ys-hero-stat:hover{transform:translateY(-3px);background:rgba(255,255,255,.1);border-color:rgba(219,170,62,.55);box-shadow:0 10px 26px rgba(219,170,62,.18)}
.ys-hero-emoji{font-size:26px;line-height:1}
.ys-hero-stat b{display:block;color:#fff;font-size:14.5px}
.ys-hero-stat small{display:block;margin-top:2px;color:#c7d2dc;font-size:11.5px}

/* Homepage "Trading Products" cards — 2-column checklist + small demo button
   sitting between price and CTA buttons, replacing the old full-width demo
   slot so the card is shorter and there's no dead space beside the list. */
body #products .product-card ul{grid-template-columns:repeat(2,1fr)!important}
body #products .product-card li:only-child{grid-column:1/-1}
body #products .price-actions-row{justify-content:space-between!important}
.ys-demo-mini-btn{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;padding:8px 12px;border-radius:999px;background:#e0201b;color:#fff;font-size:11.5px;font-weight:800;text-decoration:none;white-space:nowrap;transition:transform .2s ease,background .2s ease}
.ys-demo-mini-btn:hover{transform:translateY(-1px);background:#c81b16}
@media (max-width:480px){body #products .product-card ul{grid-template-columns:1fr!important}}

/* Mobile off-canvas menu — full-screen overlay, deliberately independent
   of the header's height. Earlier versions tried to start the panel right
   below the header, but that height depends on the promo bar above it,
   which wraps differently by screen width/system font size and can keep
   settling for a moment after the page paints — every attempt to measure
   and match it broke on some real phone in a new way. Covering the whole
   viewport from inset:0 sidesteps that entirely; the panel's own close
   button (top-right, see .nav-close) replaces the header's hamburger
   button while open, since the overlay now sits visually above it. */
@media (max-width:1120px){
  .site-navigation.open{position:fixed!important;inset:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;z-index:95!important;padding:70px 20px calc(24px + env(safe-area-inset-bottom))!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;border:0!important;border-radius:0!important}
  .nav-close{display:flex!important}
  /* site-v3.js moves .site-preferences and .account-link into the panel
     while it's open (they normally live outside the nav for the desktop
     layout) — both are display:none at this width by default, so they
     need an explicit override here or the mobile menu would still be
     missing the currency/language switcher and the Login/My Account link. */
  .site-navigation.open .site-preferences{display:flex!important;margin:18px 0 0!important;padding-top:18px!important;border-top:1px solid rgba(255,255,255,.14)!important;justify-content:center!important}
  .site-navigation.open .site-preferences select{flex:1 1 0;min-height:44px}
  .site-navigation.open .account-link{display:block!important;margin-top:10px!important;padding:9px!important;font-size:16px!important;text-align:center!important}
}
/* Fixed (not sticky) and taken out of the item list's flow entirely, so it
   floats in the corner without pushing "Home" down or leaving a gap. */
.nav-close{display:none;position:fixed;top:20px;right:20px;width:40px;height:40px;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;font-size:24px;line-height:1;cursor:pointer;z-index:1}
.nav-close:hover{background:rgba(255,255,255,.14)}
.hero .trust-row span{display:inline-flex;align-items:center;gap:5px}