/* GANREACH_PUBLIC_VISUAL_POLISH_V4_0_0_20260916
   Visual refinement only. V3 remains the structural public-shell authority. */
:root{
  --gr4-max:1240px;
  --gr4-ink:#0f172a;
  --gr4-muted:#5f718a;
  --gr4-line:#d9e4f0;
  --gr4-soft:#f5f8fc;
  --gr4-navy:#071426;
  --gr4-navy2:#102d57;
  --gr4-blue:#2563eb;
  --gr4-gold:#f2b536;
  --gr4-gold2:#ffd56f;
  --gr4-green:#20c98a;
  --gr4-radius:18px;
  --gr4-shadow:0 14px 38px rgba(7,20,38,.075);
  --gr4-shadow-strong:0 26px 70px rgba(7,20,38,.16);
}
body.grb-brand-page{
  font-size:15px;
  line-height:1.65;
  background:
    radial-gradient(circle at 8% 30%,rgba(37,99,235,.025),transparent 28%),
    #f7f9fc;
}
body.grb-brand-page main{min-width:0}
body.grb-brand-page .wrap,
body.grb-brand-page .container{width:min(var(--gr4-max),calc(100% - 48px));max-width:var(--gr4-max);margin-left:auto;margin-right:auto}

/* Header: same shell everywhere, but with clearer hierarchy and breathing room. */
header.grb-header{min-height:76px!important;background:linear-gradient(118deg,#050e1b 0%,#071426 50%,#102d57 100%)!important}
.grb-header-inner{min-height:76px;gap:25px}
.grb-brand img{width:190px;max-width:30vw}
.grb-nav{gap:7px;font-size:14px;font-weight:760}
.grb-nav-link,.grb-nav-item>a{min-height:42px;padding:10px 10px;border-radius:11px}
.grb-menu-toggle{height:38px;width:30px}
.grb-menu{top:calc(100% + 11px);min-width:258px;padding:9px;border-radius:15px;box-shadow:0 24px 60px rgba(7,20,38,.28)}
.grb-menu a{padding:11px 12px!important;font-size:13px!important}
.grb-action{min-height:42px!important;padding:10px 15px!important}
.grb-action-gold{box-shadow:0 10px 26px rgba(242,181,54,.21)}
.grb-mobile-toggle{border-radius:11px}

/* Shared marketing-page hero. */
body.grb-brand-page main>.hero,
body.grb-brand-page .hero:not(.hero-copy){
  isolation:isolate;
}
body.grb-brand-page main>.hero{
  overflow:hidden;
  padding:76px 0 72px;
  background:
    radial-gradient(circle at 82% 18%,rgba(117,93,255,.21),transparent 31%),
    radial-gradient(circle at 17% 12%,rgba(242,181,54,.13),transparent 27%),
    linear-gradient(132deg,#050e1b 0%,#071426 48%,#13386a 100%);
}
body.grb-brand-page main>.hero:after{
  content:"";position:absolute;z-index:-1;right:-7%;top:8%;
  width:420px;height:420px;border-radius:50%;
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 0 0 48px rgba(255,255,255,.018),0 0 0 96px rgba(255,255,255,.012);
}
body.grb-brand-page main>.hero .wrap{position:relative}
body.grb-brand-page main>.hero .wrap:before{
  content:"";position:absolute;left:0;top:-28px;width:58px;height:4px;border-radius:999px;
  background:linear-gradient(90deg,var(--gr4-gold),var(--grb-purple));
}
body.grb-brand-page main>.hero h1{
  max-width:1000px;
  margin:18px 0 18px;
  font-size:clamp(42px,5vw,62px);
  line-height:1.035;
  letter-spacing:-.045em;
}
body.grb-brand-page main>.hero p{max-width:840px;font-size:18px;line-height:1.65;color:#cad8ea}
body.grb-brand-page .eyebrow{
  padding:7px 11px;border-radius:999px;
  font-size:11.5px;letter-spacing:.075em;
  background:rgba(255,213,111,.08);
}
body.grb-brand-page .hero-actions{margin-top:30px;gap:11px}
body.grb-brand-page .hero-actions .btn{min-height:45px;padding:12px 18px}

/* Shared section system: less template-like, stronger hierarchy. */
body.grb-brand-page .section{padding:72px 0}
body.grb-brand-page .section.white{background:#fff}
body.grb-brand-page .section:not(.white){
  background:linear-gradient(180deg,#f7f9fc 0%,#f3f7fb 100%);
}
body.grb-brand-page .section h2{
  max-width:930px;
  margin-bottom:13px;
  font-size:clamp(30px,3.6vw,44px);
  line-height:1.08;
  letter-spacing:-.035em;
}
body.grb-brand-page .lead{max-width:880px;margin-bottom:30px;color:var(--gr4-muted);font-size:17px;line-height:1.7}
body.grb-brand-page .grid{gap:20px;align-items:stretch}
body.grb-brand-page .card{
  position:relative;overflow:hidden;
  min-width:0;
  padding:24px;
  border:1px solid var(--gr4-line);
  border-radius:var(--gr4-radius);
  background:#fff;
  box-shadow:var(--gr4-shadow);
}
body.grb-brand-page .white .card{background:#f9fbfe}
body.grb-brand-page .card:before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--gr4-blue),#755dff,var(--gr4-gold));
  opacity:.72;
}
body.grb-brand-page .card h3{margin:15px 0 9px;font-size:20px;line-height:1.24;letter-spacing:-.018em}
body.grb-brand-page .card p{color:var(--gr4-muted);line-height:1.62}
body.grb-brand-page .tag{
  padding:6px 9px;
  background:#edf4ff;
  color:#1e57b7;
  border:1px solid #dbe8fb;
  font-size:10.5px;
  letter-spacing:.055em;
}
body.grb-brand-page .card a.more{
  position:relative;
  margin-top:18px;
  color:#174d91;
  font-weight:850;
}
body.grb-brand-page .card a.more:after{
  content:"";position:absolute;left:0;bottom:-3px;width:0;height:1px;background:#174d91;transition:width .18s ease
}
@media(hover:hover){body.grb-brand-page .card a.more:hover:after{width:100%}}
body.grb-brand-page .notice{
  border-color:#c9dcf6;
  border-radius:16px;
  background:linear-gradient(135deg,#f1f7ff,#f8fbff);
  box-shadow:0 9px 24px rgba(37,99,235,.045);
}

/* Flow pattern inspired by the strongest role creative references. */
body.grb-brand-page .steps{position:relative;gap:17px}
body.grb-brand-page .steps:before{
  content:"";position:absolute;left:7%;right:7%;top:21px;height:2px;
  background:linear-gradient(90deg,#dbe7f6,#bcd4f3,#dbe7f6);
}
body.grb-brand-page .step{
  position:relative;z-index:1;
  padding:21px;
  border-radius:16px;
  background:#fff;
  box-shadow:0 9px 25px rgba(15,23,42,.045);
}
body.grb-brand-page .step b{
  display:grid;place-items:center;
  width:42px;height:42px;margin:-1px 0 14px;
  border-radius:50%;
  background:linear-gradient(135deg,#eaf2ff,#fff6de);
  border:1px solid #d8e5f4;
  color:#174d91;
  font-size:12px;
}
body.grb-brand-page .step h3{font-size:18px;letter-spacing:-.015em}
body.grb-brand-page .step p{line-height:1.55}
body.grb-brand-page .cta{
  position:relative;overflow:hidden;
  padding:36px 38px;
  border-radius:22px;
  background:
    radial-gradient(circle at 88% 20%,rgba(117,93,255,.24),transparent 30%),
    linear-gradient(130deg,#071426,#174d91);
  box-shadow:var(--gr4-shadow-strong);
}
body.grb-brand-page .cta:after{
  content:"";position:absolute;right:-45px;bottom:-70px;width:180px;height:180px;border-radius:50%;
  border:1px solid rgba(255,255,255,.11);box-shadow:0 0 0 34px rgba(255,255,255,.025);
}
body.grb-brand-page .cta>*{position:relative;z-index:1}
body.grb-brand-page .cta h2{font-size:clamp(28px,3vw,38px)}
body.grb-brand-page .btn{
  min-height:42px;
  font-weight:850;
  letter-spacing:-.005em;
  box-shadow:none;
}
body.grb-brand-page .btn.gold{box-shadow:0 10px 24px rgba(242,181,54,.17)}

/* Homepage: keep real coded product screens prominent and visually aligned with V4. */
body.grb-brand-page .gr-hero-shell{
  min-height:700px;
  background:
    radial-gradient(circle at 84% 13%,rgba(71,128,231,.30),transparent 32%),
    radial-gradient(circle at 17% 90%,rgba(242,181,54,.13),transparent 26%),
    linear-gradient(135deg,#040a14 0%,#071426 52%,#0d2b55 100%);
}
body.grb-brand-page #grSlider{min-height:640px}
body.grb-brand-page #grSlider .gr-slide{
  grid-template-columns:.82fr 1.18fr!important;
  gap:34px!important;
  min-height:610px!important;
  padding:28px 0 64px!important;
}
body.grb-brand-page #grSlider .gr-copy h1,
body.grb-brand-page #grSlider .gr-copy h2.gr-slide-title{
  max-width:610px;
  font-size:clamp(43px,4.4vw,62px)!important;
  line-height:1.025!important;
}
body.grb-brand-page #grSlider .gr-copy p{max-width:590px;font-size:16.5px!important}
body.grb-brand-page #grSlider .gr-visual-wrap{padding-right:36px!important}
body.grb-brand-page #grSlider .gr-window{
  border-radius:20px!important;
  box-shadow:0 34px 90px rgba(0,0,0,.42)!important;
}
body.grb-brand-page #grSlider .gr-window-inner{margin:10px!important;border-radius:16px!important}
body.grb-brand-page #grSlider .gr-panel{border-radius:14px!important}
body.grb-brand-page #grSlider .gr-sdots{bottom:12px!important}
body.grb-brand-page #grSlider .gr-sdot{width:26px!important;height:7px!important;border-radius:999px!important}
body.grb-brand-page .gr-workflow{padding-top:72px!important;padding-bottom:68px!important}
body.grb-brand-page .gr-overview{border-radius:20px;box-shadow:var(--gr4-shadow-strong)}
body.grb-brand-page .gr-card{
  border-radius:17px!important;
  border-color:var(--gr4-line)!important;
  box-shadow:var(--gr4-shadow)!important;
}
body.grb-brand-page .gr-card:before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,#2563eb,#755dff,#f2b536);
  opacity:.78;
}
body.grb-brand-page .gr-card.active:before{opacity:1}
body.grb-brand-page .gr-why-inner{border-radius:22px!important;box-shadow:var(--gr4-shadow-strong)}
body.grb-brand-page .gr-assist summary{border:1px solid #dfe7f1}

/* Pricing: retain all pricing-engine data and behaviour, change only presentation. */
body.grb-route-pricing>section.hero{
  padding:62px 0 54px!important;
  background:
    radial-gradient(circle at 84% 18%,rgba(117,93,255,.2),transparent 31%),
    linear-gradient(132deg,#050e1b,#071426 52%,#13386a)!important;
  color:#fff!important;
}
body.grb-route-pricing>section.hero h1{
  max-width:920px!important;
  margin:0 0 14px!important;
  color:#fff!important;
  font-size:clamp(42px,5vw,60px)!important;
}
body.grb-route-pricing>section.hero h1 span{color:var(--gr4-gold2)!important}
body.grb-route-pricing>section.hero> .container>p{max-width:830px;color:#cad8ea!important;font-size:17px!important}
body.grb-route-pricing .choice-stack{
  max-width:860px;margin-top:26px!important;border-radius:17px!important;
  border-color:rgba(255,255,255,.16)!important;background:rgba(255,255,255,.07)!important;
  box-shadow:none!important;backdrop-filter:blur(10px);
}
body.grb-route-pricing .choice-label{color:#dce8f7!important}
body.grb-route-pricing .choice-option{background:rgba(255,255,255,.94)!important}
body.grb-route-pricing .pricing{padding-top:38px!important}
body.grb-route-pricing .cards{gap:15px!important;align-items:stretch!important}
body.grb-route-pricing .cards .card{
  border-radius:18px!important;
  border:1px solid var(--gr4-line)!important;
  box-shadow:var(--gr4-shadow)!important;
  transform:none!important;
}
body.grb-route-pricing .cards .card.popular{
  border-color:#9fb8f4!important;
  box-shadow:0 20px 48px rgba(37,99,235,.14)!important;
}
body.grb-route-pricing .card-cta{min-height:42px!important;display:flex!important;align-items:center!important;justify-content:center!important}
body.grb-route-pricing .comparison{
  overflow:auto!important;border-radius:16px!important;box-shadow:var(--gr4-shadow)!important
}
body.grb-route-pricing .comparison table{min-width:760px}
body.grb-route-pricing .comparison-footer{display:none!important}
body.grb-route-pricing .benefit-band{
  border-radius:18px!important;overflow:hidden!important;box-shadow:0 10px 28px rgba(15,23,42,.05)!important
}

/* Contact: same brand hero, better form hierarchy. */
body.grb-route-contact .gr-hero{
  background:
    radial-gradient(circle at 82% 12%,rgba(117,93,255,.19),transparent 30%),
    linear-gradient(132deg,#050e1b,#071426 50%,#13386a)!important;
}
body.grb-route-contact .gr-hero-inner{width:min(var(--gr4-max),calc(100% - 48px));max-width:var(--gr4-max);padding:66px 0 58px!important;gap:36px!important}
body.grb-route-contact .gr-hero h1{font-size:clamp(42px,5vw,60px)!important;letter-spacing:-.045em!important}
body.grb-route-contact .gr-route-card{
  border-radius:20px!important;
  background:rgba(255,255,255,.075)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.16)!important;
}
body.grb-route-contact .gr-route-item{border-radius:13px!important;background:rgba(255,255,255,.055)!important}
body.grb-route-contact .gr-wrap{width:min(var(--gr4-max),calc(100% - 48px));max-width:var(--gr4-max);padding:36px 0 62px!important;gap:22px!important}
body.grb-route-contact .gr-info,
body.grb-route-contact .gr-form{border-radius:18px!important;box-shadow:var(--gr4-shadow)!important}
body.grb-route-contact .gr-form{padding:24px!important}
body.grb-route-contact .gr-field input,
body.grb-route-contact .gr-field select,
body.grb-route-contact .gr-field textarea{
  min-height:43px;border-color:#c9d6e6!important;border-radius:10px!important
}
body.grb-route-contact .gr-submit{
  min-height:44px;border-radius:10px!important;padding:11px 18px!important;
  background:linear-gradient(135deg,#174d91,#2563eb)!important
}
body.grb-route-contact .gr-ai-panel{border-radius:14px!important;background:linear-gradient(135deg,#071426,#174d91)!important}

/* Enterprise: preserve quotation workflow; align visual system with public brand. */
body.grb-route-enterprise main{padding-top:0!important}
body.grb-route-enterprise main>.hero{padding:44px 0 16px!important;background:linear-gradient(180deg,#f5f8fc,#eef4fb)!important;color:var(--gr4-ink)!important}
body.grb-route-enterprise .hero-grid{gap:20px!important}
body.grb-route-enterprise .hero-copy{
  position:relative;overflow:hidden;
  border:0!important;border-radius:22px!important;
  background:
    radial-gradient(circle at 90% 10%,rgba(117,93,255,.22),transparent 32%),
    linear-gradient(135deg,#071426,#174d91)!important;
  color:#fff!important;box-shadow:var(--gr4-shadow-strong)!important;
}
body.grb-route-enterprise .hero-copy h1{color:#fff!important}
body.grb-route-enterprise .hero-copy>p{color:#dbe7f5!important}
body.grb-route-enterprise .hero-copy .benefit{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.13)!important}
body.grb-route-enterprise .hero-copy .benefit strong{color:#fff!important}
body.grb-route-enterprise .hero-copy .benefit span{color:#cbd8ea!important}
body.grb-route-enterprise .form-card,
body.grb-route-enterprise .panel{border-radius:18px!important;border-color:var(--gr4-line)!important;box-shadow:var(--gr4-shadow)!important}
body.grb-route-enterprise .submit{border-radius:10px!important;background:linear-gradient(135deg,#174d91,#2563eb)!important}
body.grb-route-enterprise .after{padding-top:8px!important}

/* Legal pages: readable content measure without changing legal text. */
body.grb-route-privacy main,
body.grb-route-terms main,
body.grb-route-extension-privacy main,
body.grb-route-extension-terms main{width:min(980px,calc(100% - 48px));margin:38px auto 58px}
body.grb-route-privacy main h1,
body.grb-route-terms main h1,
body.grb-route-extension-privacy main h1,
body.grb-route-extension-terms main h1{font-size:clamp(34px,4vw,48px);letter-spacing:-.035em}
body.grb-route-privacy main h2,
body.grb-route-terms main h2,
body.grb-route-extension-privacy main h2,
body.grb-route-extension-terms main h2{margin-top:30px;letter-spacing:-.02em}

/* Footer: constant across pages, no overlay, easier to read. */
footer.grb-footer{background:linear-gradient(180deg,#071426,#050e1b)!important}
.grb-footer-grid{
  grid-template-columns:1.55fr repeat(5,minmax(125px,1fr));
  gap:30px;padding:46px 0 36px;
}
.grb-footer-brand img{width:196px}
.grb-footer-brand p{max-width:320px;font-size:13px!important;line-height:1.65!important}
.grb-footer section h2{font-size:11.5px!important;letter-spacing:.085em!important}
.grb-footer section>a{margin:9px 0!important;font-size:12.5px!important;line-height:1.45!important}
.grb-footer-legal{padding:17px 0 22px;font-size:12px}

/* Responsive polish. */
@media(max-width:1180px){
  .grb-nav{gap:3px;font-size:13px}.grb-nav-link,.grb-nav-item>a{padding-left:7px;padding-right:7px}
  body.grb-brand-page #grSlider .gr-slide{grid-template-columns:1fr!important;min-height:1070px!important}
  body.grb-brand-page #grSlider{min-height:1110px!important}
  body.grb-brand-page #grSlider .gr-visual-wrap{padding-right:0!important;max-width:820px}
  .grb-footer-grid{grid-template-columns:1.4fr repeat(3,1fr)}
}
@media(max-width:980px){
  header.grb-header,.grb-header-inner{min-height:70px!important}
  .grb-nav{top:70px}
  body.grb-brand-page .steps:before{display:none}
  body.grb-route-contact .gr-hero-inner,
  body.grb-route-contact .gr-wrap{width:min(100% - 32px,var(--gr4-max))}
}
@media(max-width:720px){
  body.grb-brand-page .wrap,
  body.grb-brand-page .container{width:min(100% - 30px,var(--gr4-max))}
  body.grb-brand-page main>.hero{padding:54px 0 50px}
  body.grb-brand-page main>.hero h1{font-size:clamp(35px,10vw,48px)}
  body.grb-brand-page .section{padding:52px 0}
  body.grb-brand-page .card{padding:20px}
  body.grb-brand-page .cta{padding:28px 24px}
  body.grb-brand-page #grSlider{min-height:1320px!important}
  body.grb-brand-page #grSlider .gr-slide{min-height:1280px!important;gap:24px!important}
  body.grb-brand-page #grSlider .gr-copy h1,
  body.grb-brand-page #grSlider .gr-copy h2.gr-slide-title{font-size:clamp(36px,10vw,48px)!important}
  .grb-footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .grb-brand img{width:164px}
  .grb-footer-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  body.grb-brand-page .card a.more:after{transition:none}
}


/* GANREACH_PUBLIC_RESPONSIVE_ALIGNMENT_V4_2_0_20260916
   Alignment correction derived from the 2026-09-16 user recording.
   Purpose: fluid laptop/tablet/mobile layout without hard-coded viewport-height blocks. */
html,body{max-width:100%;overflow-x:hidden}
body.grb-brand-page img,
body.grb-brand-page video,
body.grb-brand-page canvas{max-width:100%;height:auto}
body.grb-brand-page main,
body.grb-brand-page section,
body.grb-brand-page aside,
body.grb-brand-page .grid>*,
body.grb-brand-page .cards>*,
body.grb-brand-page .gr-form-grid>*{min-width:0}

/* Common alignment rails. */
body.grb-brand-page .grb-shell,
body.grb-brand-page .wrap,
body.grb-brand-page .container{
  width:min(1240px,calc(100% - 48px))!important;
  max-width:1240px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
body.grb-brand-page .grb-header-inner{width:min(1240px,calc(100% - 48px));max-width:1240px;margin-inline:auto}
body.grb-brand-page .grb-footer-grid,
body.grb-brand-page .grb-footer-legal{width:min(1240px,calc(100% - 48px));max-width:1240px;margin-inline:auto}

/* Contact root cause from the recording:
   main.gr-wrap contains a second .gr-wrap. The nested wrapper must span BOTH main columns. */
body.grb-brand-page main.gr-wrap{
  width:min(1180px,calc(100% - 48px))!important;
  max-width:1180px!important;
  margin:0 auto!important;
  padding:32px 0 54px!important;
  display:grid!important;
  grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr)!important;
  gap:22px!important;
  align-items:start!important;
}
body.grb-brand-page main.gr-wrap>.gr-info,
body.grb-brand-page main.gr-wrap>.gr-form{width:100%!important;max-width:none!important}
body.grb-brand-page main.gr-wrap>section.gr-wrap{
  grid-column:1/-1!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0 0 8px!important;
}
body.grb-brand-page main.gr-wrap>section.gr-wrap>.gr-info{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}
body.grb-brand-page main.gr-wrap .gr-form-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:14px!important;
}
body.grb-brand-page main.gr-wrap .gr-field.full{grid-column:1/-1!important}

/* Homepage slider: the active slide now owns height.
   This overrides old 760/1180/1420px fixed-height rules, removing huge blank areas. */
body.grb-brand-page .gr-hero-shell{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
}
body.grb-brand-page #grSlider,
body.grb-brand-page .gr-slider{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
}
body.grb-brand-page #grSlider .gr-slide{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr)!important;
  gap:34px!important;
  padding:34px 0 64px!important;
  align-items:center!important;
}
body.grb-brand-page #grSlider .gr-slide.active{
  position:relative!important;
  inset:auto!important;
}
body.grb-brand-page #grSlider .gr-slide.leaving{
  position:absolute!important;
  inset:0!important;
}
body.grb-brand-page #grSlider .gr-copy,
body.grb-brand-page #grSlider .gr-visual-wrap{min-width:0!important}
body.grb-brand-page #grSlider .gr-visual-wrap{
  width:100%!important;
  max-width:none!important;
  padding-right:0!important;
}
body.grb-brand-page #grSlider .gr-window{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
body.grb-brand-page #grSlider .gr-window-inner{max-width:100%!important;overflow:hidden!important}
body.grb-brand-page #grSlider .gr-grid2,
body.grb-brand-page #grSlider .gr-two,
body.grb-brand-page #grSlider .gr-chartgrid,
body.grb-brand-page #grSlider .gr-statgrid{min-width:0!important}
body.grb-brand-page #grSlider .gr-sdots{bottom:12px!important}

/* Shared page grids cannot force horizontal overflow. */
body.grb-brand-page .grid,
body.grb-brand-page .cards,
body.grb-brand-page .steps,
body.grb-brand-page .gr-cards,
body.grb-brand-page .gr-steps,
body.grb-brand-page .gr-why-inner,
body.grb-brand-page .gr-footer-inner{min-width:0!important}
body.grb-brand-page .card,
body.grb-brand-page .step,
body.grb-brand-page .gr-card{min-width:0!important;max-width:100%}

/* Pricing keeps its engine but gets fluid cards and a scroll-safe comparison. */
body.grb-brand-page.grb-route-pricing .cards{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(245px,100%),1fr))!important;
  gap:16px!important;
}
body.grb-brand-page.grb-route-pricing .comparison{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch;
}
body.grb-brand-page.grb-route-pricing .comparison table{width:100%!important;min-width:760px!important}

/* Enterprise and Contact use minmax grids rather than intrinsic-content columns. */
body.grb-brand-page.grb-route-enterprise .hero-grid{
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
}
body.grb-brand-page.grb-route-enterprise .after{
  grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))!important;
}

/* Header alignment: desktop until 1100px, then the existing accessible mobile menu.
   This avoids crushed laptop navigation around 1024px. */
@media(max-width:1100px){
  body.grb-brand-page .grb-header-inner{min-height:70px!important}
  body.grb-brand-page .grb-mobile-toggle{display:inline-flex!important;margin-left:auto}
  body.grb-brand-page .grb-nav{
    display:none!important;
    position:absolute!important;
    left:0!important;right:0!important;top:70px!important;
    margin:0!important;padding:12px 20px 18px!important;
    background:#071426!important;
    border-top:1px solid rgba(255,255,255,.09)!important;
    box-shadow:0 18px 34px rgba(0,0,0,.24)!important;
    flex-direction:column!important;
    align-items:stretch!important;
    max-height:calc(100vh - 70px)!important;
    overflow:auto!important;
  }
  body.grb-brand-page .grb-header.is-mobile-open .grb-nav{display:flex!important}
  body.grb-brand-page .grb-nav-link,
  body.grb-brand-page .grb-nav-item{width:100%!important}
  body.grb-brand-page .grb-nav-item{display:grid!important;grid-template-columns:minmax(0,1fr) 42px!important}
  body.grb-brand-page .grb-nav-link,
  body.grb-brand-page .grb-nav-item>a{width:100%!important;min-height:42px!important}
  body.grb-brand-page .grb-menu{
    position:static!important;
    grid-column:1/-1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    display:none!important;
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;
    transform:none!important;box-shadow:none!important;margin:3px 0 7px!important;
  }
  body.grb-brand-page .grb-has-menu.is-open>.grb-menu{display:block!important}

  body.grb-brand-page #grSlider .gr-slide{
    grid-template-columns:1fr!important;
    gap:26px!important;
    padding:30px 0 58px!important;
  }
  body.grb-brand-page #grSlider .gr-copy{max-width:760px}
  body.grb-brand-page #grSlider .gr-visual-wrap{max-width:820px;margin-inline:auto!important}

  body.grb-brand-page.grb-route-enterprise .hero-grid{grid-template-columns:1fr!important}
  body.grb-brand-page main.gr-wrap{grid-template-columns:1fr!important}
  body.grb-brand-page main.gr-wrap>section.gr-wrap{grid-column:1!important}
}

/* Tablet portrait. */
@media(max-width:768px){
  body.grb-brand-page .grb-shell,
  body.grb-brand-page .wrap,
  body.grb-brand-page .container,
  body.grb-brand-page .grb-header-inner,
  body.grb-brand-page .grb-footer-grid,
  body.grb-brand-page .grb-footer-legal{
    width:min(100% - 30px,1240px)!important;
  }
  body.grb-brand-page main.gr-wrap{
    width:min(100% - 30px,1180px)!important;
    padding:24px 0 42px!important;
  }
  body.grb-brand-page main.gr-wrap .gr-form-grid{grid-template-columns:1fr!important}
  body.grb-brand-page main.gr-wrap .gr-field.full{grid-column:auto!important}

  body.grb-brand-page #grSlider .gr-slide{padding:24px 0 52px!important;gap:20px!important}
  body.grb-brand-page #grSlider .gr-copy h1,
  body.grb-brand-page #grSlider .gr-copy h2.gr-slide-title{
    font-size:clamp(34px,9.6vw,48px)!important;
    line-height:1.04!important;
  }
  body.grb-brand-page #grSlider .gr-copy p{font-size:15px!important}
  body.grb-brand-page #grSlider .gr-proof{gap:14px!important;margin-top:24px!important}
  body.grb-brand-page #grSlider .gr-window{border-radius:15px!important}
  body.grb-brand-page #grSlider .gr-window-inner{margin:7px!important;border-radius:11px!important}
  body.grb-brand-page #grSlider .gr-grid2,
  body.grb-brand-page #grSlider .gr-two,
  body.grb-brand-page #grSlider .gr-chartgrid,
  body.grb-brand-page #grSlider .gr-statgrid{grid-template-columns:1fr!important}

  body.grb-brand-page .grb-footer-grid{grid-template-columns:1fr 1fr!important;gap:22px!important}
  body.grb-brand-page .grb-footer-brand{grid-column:1/-1!important}
  body.grb-brand-page .cta{padding:26px 22px!important}
}

/* Mobile. */
@media(max-width:480px){
  body.grb-brand-page .grb-shell,
  body.grb-brand-page .wrap,
  body.grb-brand-page .container,
  body.grb-brand-page .grb-header-inner,
  body.grb-brand-page .grb-footer-grid,
  body.grb-brand-page .grb-footer-legal,
  body.grb-brand-page main.gr-wrap{
    width:min(100% - 24px,1240px)!important;
  }
  body.grb-brand-page .grb-brand img{width:156px!important;max-width:58vw!important}
  body.grb-brand-page #grSlider .gr-slide{padding-top:20px!important;padding-bottom:46px!important}
  body.grb-brand-page #grSlider .gr-cta{gap:9px!important}
  body.grb-brand-page #grSlider .gr-cta .gr-btn{width:100%!important}
  body.grb-brand-page #grSlider .gr-proof{grid-template-columns:1fr!important}
  body.grb-brand-page .grb-footer-grid{grid-template-columns:1fr!important}
  body.grb-brand-page .grb-footer-brand{grid-column:auto!important}
  body.grb-brand-page.grb-route-pricing .comparison table{min-width:680px!important}
}


/* GANREACH_PUBLIC_CONTRAST_DROPDOWN_V4_3_0_20260916
   One-pass readability + reliable dropdown selection correction.
   Keeps v4.2 responsive alignment intact. */

/* ---------- Contrast governance ---------- */
/* Light surfaces: force readable dark typography. */
body.grb-brand-page .section.white,
body.grb-brand-page .card,
body.grb-brand-page .step,
body.grb-brand-page .gr-card,
body.grb-brand-page .gr-info,
body.grb-brand-page .gr-form,
body.grb-brand-page .form-card,
body.grb-brand-page .panel,
body.grb-brand-page .comparison,
body.grb-brand-page .choice-option{
  color:#10233d;
}
body.grb-brand-page .section.white > .wrap > h1,
body.grb-brand-page .section.white > .wrap > h2,
body.grb-brand-page .section.white > .wrap > h3,
body.grb-brand-page .card h1,
body.grb-brand-page .card h2,
body.grb-brand-page .card h3,
body.grb-brand-page .step h1,
body.grb-brand-page .step h2,
body.grb-brand-page .step h3,
body.grb-brand-page .gr-card h1,
body.grb-brand-page .gr-card h2,
body.grb-brand-page .gr-card h3,
body.grb-brand-page .gr-info h1,
body.grb-brand-page .gr-info h2,
body.grb-brand-page .gr-info h3,
body.grb-brand-page .gr-form h1,
body.grb-brand-page .gr-form h2,
body.grb-brand-page .gr-form h3,
body.grb-brand-page .form-card h1,
body.grb-brand-page .form-card h2,
body.grb-brand-page .form-card h3,
body.grb-brand-page .panel h1,
body.grb-brand-page .panel h2,
body.grb-brand-page .panel h3{
  color:#0f172a!important;
}
body.grb-brand-page .section.white > .wrap > p,
body.grb-brand-page .card p,
body.grb-brand-page .step p,
body.grb-brand-page .gr-card p,
body.grb-brand-page .gr-info p,
body.grb-brand-page .gr-form p,
body.grb-brand-page .form-card p,
body.grb-brand-page .panel p{
  color:#52657d!important;
}

/* Dark/gradient surfaces: headings and supporting copy must stay readable. */
body.grb-brand-page .cta,
body.grb-brand-page main>.hero,
body.grb-brand-page .gr-hero,
body.grb-brand-page .hero-copy,
body.grb-brand-page .gr-why-inner,
body.grb-brand-page .gr-ai-panel,
body.grb-brand-page .gr-route-card{
  color:#f8fbff!important;
}
body.grb-brand-page .cta h1,
body.grb-brand-page .cta h2,
body.grb-brand-page .cta h3,
body.grb-brand-page .cta h4,
body.grb-brand-page main>.hero h1,
body.grb-brand-page main>.hero h2,
body.grb-brand-page main>.hero h3,
body.grb-brand-page .gr-hero h1,
body.grb-brand-page .gr-hero h2,
body.grb-brand-page .gr-hero h3,
body.grb-brand-page .hero-copy h1,
body.grb-brand-page .hero-copy h2,
body.grb-brand-page .hero-copy h3,
body.grb-brand-page .gr-why-inner h1,
body.grb-brand-page .gr-why-inner h2,
body.grb-brand-page .gr-why-inner h3,
body.grb-brand-page .gr-ai-panel h1,
body.grb-brand-page .gr-ai-panel h2,
body.grb-brand-page .gr-ai-panel h3,
body.grb-brand-page .gr-route-card h1,
body.grb-brand-page .gr-route-card h2,
body.grb-brand-page .gr-route-card h3{
  color:#ffffff!important;
  text-shadow:0 1px 0 rgba(0,0,0,.08);
}
body.grb-brand-page .cta p,
body.grb-brand-page .cta li,
body.grb-brand-page .cta small,
body.grb-brand-page main>.hero p,
body.grb-brand-page main>.hero li,
body.grb-brand-page .gr-hero p,
body.grb-brand-page .gr-hero li,
body.grb-brand-page .hero-copy p,
body.grb-brand-page .hero-copy li,
body.grb-brand-page .gr-why-inner p,
body.grb-brand-page .gr-why-inner li,
body.grb-brand-page .gr-ai-panel p,
body.grb-brand-page .gr-route-card p{
  color:#dbe8f7!important;
}
/* Explicit screenshot case: white section containing a dark CTA. */
body.grb-brand-page .section.white .cta h1,
body.grb-brand-page .section.white .cta h2,
body.grb-brand-page .section.white .cta h3{
  color:#ffffff!important;
}
body.grb-brand-page .section.white .cta p{
  color:#e6f0fb!important;
}

/* CTA/button contrast must not inherit dark-surface text. */
body.grb-brand-page .cta .btn.gold,
body.grb-brand-page .cta .gr-btn.gold,
body.grb-brand-page .gr-action-gold,
body.grb-brand-page .grb-action-gold{
  color:#071426!important;
}
body.grb-brand-page .cta .btn:not(.gold),
body.grb-brand-page main>.hero .btn:not(.gold){
  color:#10233d!important;
  background:#ffffff!important;
  border-color:#ffffff!important;
}
body.grb-brand-page .cta .btn:not(.gold):hover,
body.grb-brand-page main>.hero .btn:not(.gold):hover{
  color:#071426!important;
  background:#eef5ff!important;
}

/* Footer contrast. */
body.grb-brand-page footer.grb-footer,
body.grb-brand-page footer.grb-footer p,
body.grb-brand-page footer.grb-footer li{
  color:#bfcde0!important;
}
body.grb-brand-page footer.grb-footer h1,
body.grb-brand-page footer.grb-footer h2,
body.grb-brand-page footer.grb-footer h3{
  color:#ffffff!important;
}
body.grb-brand-page footer.grb-footer a{
  color:#dce8f7!important;
}
body.grb-brand-page footer.grb-footer a:hover,
body.grb-brand-page footer.grb-footer a:focus-visible{
  color:#ffd56f!important;
}

/* ---------- Desktop dropdown stability ---------- */
/* The old menu sat below the trigger with an empty pointer gap.
   This transparent bridge keeps :hover active while the pointer moves
   from the nav item into the dropdown, so menu links can actually be selected. */
@media (min-width:1101px) and (hover:hover) and (pointer:fine){
  body.grb-brand-page .grb-has-menu{
    isolation:isolate;
  }
  body.grb-brand-page .grb-has-menu::after{
    content:"";
    position:absolute;
    z-index:1099;
    left:-10px;
    right:-150px;
    top:100%;
    height:12px;
    display:none;
    background:transparent;
  }
  body.grb-brand-page .grb-has-menu:hover::after,
  body.grb-brand-page .grb-has-menu:focus-within::after,
  body.grb-brand-page .grb-has-menu.is-open::after{
    display:block;
  }
  body.grb-brand-page .grb-menu{
    top:calc(100% + 7px)!important;
    transition:opacity .12s ease,transform .12s ease,visibility .12s ease!important;
  }
  body.grb-brand-page .grb-has-menu:hover>.grb-menu,
  body.grb-brand-page .grb-has-menu:focus-within>.grb-menu,
  body.grb-brand-page .grb-has-menu.is-open>.grb-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
  }
  body.grb-brand-page .grb-menu a{
    position:relative;
    z-index:1101;
    min-height:38px;
    display:flex!important;
    align-items:center;
    cursor:pointer;
  }
}

/* On touch/mobile widths, menus are click-controlled only.
   Remove desktop hover/pointer geometry so tapping is deterministic. */
@media (max-width:1100px), (hover:none), (pointer:coarse){
  body.grb-brand-page .grb-has-menu::after{display:none!important}
  body.grb-brand-page .grb-menu{top:auto!important}
  body.grb-brand-page .grb-menu a{
    min-height:42px!important;
    display:flex!important;
    align-items:center!important;
  }
}

/* Keyboard focus must be visible on both light and dark surfaces. */
body.grb-brand-page a:focus-visible,
body.grb-brand-page button:focus-visible,
body.grb-brand-page select:focus-visible,
body.grb-brand-page input:focus-visible,
body.grb-brand-page textarea:focus-visible{
  outline:3px solid rgba(242,181,54,.78)!important;
  outline-offset:2px!important;
}


/* GANREACH_PRICING_FIRST_PAGE_FIX_V4_4_0_20260916
   Targeted correction from the first-page recording:
   1) restore sticky header runtime behaviour
   2) fix light-on-light pricing selection labels. */

/* overflow-x:hidden can establish a scroll container and break sticky positioning.
   clip prevents horizontal bleed without changing the vertical sticky scroll context. */
html,
body.grb-brand-page{
  overflow-x:clip!important;
}
body.grb-brand-page .grb-header{
  position:sticky!important;
  top:0!important;
  z-index:1400!important;
}

/* Pricing selection labels are light surfaces and must use dark text,
   even though they sit inside the dark pricing hero. */
body.grb-brand-page.grb-route-pricing .choice-label{
  color:#334a67!important;
  background:#f7f9fc!important;
  border-color:#d4dfeb!important;
  text-shadow:none!important;
}
body.grb-brand-page.grb-route-pricing .choice-label,
body.grb-brand-page.grb-route-pricing .choice-label *{
  opacity:1!important;
}

/* Strengthen secondary pricing text without changing the layout. */
body.grb-brand-page.grb-route-pricing .cards .subtitle,
body.grb-brand-page.grb-route-pricing .period,
body.grb-brand-page.grb-route-pricing .old-price{
  color:#55677f!important;
}
body.grb-brand-page.grb-route-pricing .benefit-item span,
body.grb-brand-page.grb-route-pricing .terms-line{
  color:#4e6078!important;
}