/* Strada's emerald connects actions and outcomes across different materials.
   --green and --green-deep remain the original brand colors from site.css. */
.home-refresh{
  --accent:var(--green);
  --accent-ink:var(--green-deep);
  --accent-soft:#eef3ef;
  --accent-on-dark:#8fe3c6;
  --detail-ink:#7a7a7a;
  --detail-rule:#0f4a381a;
}


/* Primary, text and inverse actions have distinct, repeatable treatments. */
.home-refresh .btn,
.home-refresh .footer__cta{border-radius:2px!important}
.home-refresh .nav .btn,
.home-refresh .noapi__copy>.btn,
.home-refresh .footer__cta{background:var(--accent)!important;color:#ffffff!important}
.home-refresh .nav .btn:hover,
.home-refresh .noapi__copy>.btn:hover,
.home-refresh .footer__cta:hover{background:var(--accent-ink)!important}
.home-refresh .linkarrow,
.home-refresh .results__link,
.home-refresh .tcard__cta{color:var(--accent-ink)!important}
.home-refresh .linkarrow:hover,
.home-refresh .results__link:hover,
.home-refresh .tcard__cta:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.home-refresh .nav__links>a:hover,
.home-refresh .footer__col a:hover{color:var(--accent-ink)!important}
.home-refresh :is(a,button,[role="button"]):focus-visible{outline:2px solid var(--accent);outline-offset:5px}
/* The selected segment and open controls carry the same small emerald signal. */
.home-refresh .tabs__bar{display:flex;width:fit-content;max-width:100%;gap:36px;padding:0;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0}
.home-refresh .tabs__tab{flex:0 0 auto;min-width:0;min-height:44px;padding:12px 0;font-size:16px;line-height:20px;border-radius:0;letter-spacing:0}
.home-refresh .tabs__ink{left:0;top:auto;bottom:0;height:2px!important;background:var(--accent)!important;border:0!important;box-shadow:none!important;border-radius:0}
.home-refresh .tabs__tab[aria-selected="true"]{color:var(--accent-ink)!important}
.home-refresh .tabs__tab:hover{color:var(--accent-ink)}
.home-refresh .stk__row button:hover{opacity:1}
.home-refresh .cap__ico,
.home-refresh .feature-copy .tile__title::before{color:var(--accent-ink)!important}
.home-refresh .kicker i,
.home-refresh .tcard__kicker i{background:var(--accent)!important}
.home-refresh #platform .seg__kicker,
.home-refresh #platform .noapi .t-eyebrow{color:var(--accent-ink)!important}
.home-refresh #platform .stk__row.is-open button b,
.home-refresh #platform .stk__row.is-open button::before,
.home-refresh .acc__head[aria-expanded="true"]{color:var(--accent-ink)!important}
.home-refresh #enterprise .seg__kicker{color:var(--accent-on-dark)!important}
.home-refresh #enterprise .stk__row button::before{color:#8fe3c6}
.home-refresh #enterprise .stk__row.is-open button::before,
.home-refresh #enterprise .stk__row.is-open button u{color:var(--accent-on-dark)}
.home-refresh #enterprise .stk__body li::before{background:var(--accent-on-dark)}
.home-refresh #enterprise .tline__bar i{background:var(--accent)}
.home-refresh #enterprise .tline__steps b,
.home-refresh #enterprise .tline__top b,
.home-refresh #enterprise .aud__list li span{color:var(--accent-on-dark)}

/* A lighter use-case frame leaves more emphasis on the content. */
.home-refresh .seg{border-color:var(--detail-rule)}
.home-refresh .tabs__panel .caps{border-top-color:var(--detail-rule)!important}
.home-refresh .tabs__panel .caps li{border-color:var(--detail-rule)!important;border-right-style:solid;border-bottom-style:solid}
.home-refresh .segrow--stat{background:#eef3ef!important}
.home-refresh .segrow--stat .segrow__label{display:flex;align-items:center;gap:8px}
.home-refresh .segrow--stat .segrow__label::before{content:"";width:5px;height:5px;flex:0 0 5px;background:var(--accent)}
.home-refresh .seg__lines-label{font-size:12px;color:var(--detail-ink)}
.home-refresh .fig__index{font-size:12px;color:var(--accent-ink)}

/* Large product windows: let the content breathe inside the intentional crop. */
.home-refresh .platform .tile--conv .live{left:0;top:0;padding:24px!important;min-height:390px;border-radius:2px!important}
.home-refresh .platform .tile--conv .viz{padding:48px 0 0 48px!important}
.home-refresh .platform .live__tabs{margin-bottom:16px}
.home-refresh .platform .live__tabs>span{font-size:14px;min-height:40px}
.home-refresh .platform .live__ink{background:var(--accent)!important}
.home-refresh .platform .live__viz{background:#f7f6f2;max-height:none;height:240px;min-height:240px;border:0;border-radius:2px}
.home-refresh .platform .live__viz .lv{inset:24px}
.home-refresh .platform .live__viz .lv,
.home-refresh .platform .live__say span{animation-name:brandChannel;animation-timing-function:linear;transform:none}
.home-refresh .platform .live__viz .lv>*{animation:none!important;opacity:1;transform:none}
/* One timeline owns panel visibility, so content never fades out ahead of it. */
@keyframes brandChannel{0%,24.999%{opacity:1;visibility:visible}25%,100%{opacity:0;visibility:hidden}}
.home-refresh .platform .live__say{margin:16px 0 0!important;min-height:22px;flex:0 0 22px;font-size:13px;line-height:22px;color:var(--detail-ink)}
.home-refresh .platform .lv__bub{font-size:14px;line-height:21px;padding:12px 14px;border-radius:2px;max-width:88%}
.home-refresh .platform .lv__bub--in{background:#ffffff;border:1px solid var(--detail-rule);color:#06251c}
.home-refresh .platform .lv__bub--out{background:var(--accent-soft)!important;color:#0f4a38!important;border:1px solid #007a5720}
.home-refresh .platform .lv__line{font-size:15px;line-height:23px}
.home-refresh .platform .lv__subj{font-size:15px;line-height:22px}
.home-refresh .platform .lv__prev{font-size:13px;line-height:20px;color:var(--detail-ink)}
.home-refresh .platform .lv__att{background:var(--accent-soft)!important;color:var(--accent-ink)!important;border:1px solid #007a571c}
.home-refresh .platform .agraph__trig{font-size:12px;padding:9px 13px}
.home-refresh .platform .agraph__lead{border-radius:2px!important;border-top:2px solid var(--accent)!important}
.home-refresh .platform .agraph__lead b{font-size:15px;line-height:21px}
.home-refresh .platform .agraph__lead em{font-size:12px;line-height:17px;color:var(--detail-ink)}
.home-refresh .platform .agraph__subs>div{padding:18px 12px;border-radius:2px!important}
.home-refresh .platform .agraph__subs b{font-size:13px;line-height:19px}
.home-refresh .platform .agraph__subs em{font-size:12px;line-height:17px;color:var(--detail-ink)}
.home-refresh .platform .agraph__dot{background:var(--accent)!important}
.home-refresh .platform .agraph__io{gap:8px;margin-top:22px}
.home-refresh .platform .agraph__io span{font-size:12px;line-height:17px;width:auto;min-width:0;padding:5px 10px;border:0!important;background:#ffffff0d!important;color:#dce7e0!important;border-radius:2px}

/* Control is a complete interface on a material field, with balanced insets. */
.home-refresh #platform .tile--wide.stk{border-top:0!important}
.home-refresh #platform .stk__rows{border:0}
.home-refresh #platform .stk__row{border:0}
.home-refresh #platform .stk__row+.stk__row{border-top:1px solid var(--detail-rule)}
.home-refresh #platform .stk__row button{padding-top:20px!important;padding-bottom:20px!important}
.home-refresh #platform .stk__row button b{color:#4a4842}
.home-refresh #platform .stk__row button:hover b{color:var(--accent-ink)}
.home-refresh #platform .stk__body ul{padding:0 0 26px;gap:10px}
.home-refresh #platform .stk__body li{padding-left:32px;line-height:24px;color:var(--detail-ink)}
.home-refresh #platform .stk__body li::before{left:3px;top:5px;width:14px;height:14px}
.home-refresh #platform .tile--wide.stk .stk__stage{align-self:center;min-height:440px;padding:32px!important;border-radius:2px!important}
.home-refresh #platform .tile--wide.stk .stk__panel{align-items:center!important;justify-content:center;min-width:0}
.home-refresh #platform .tile--wide.stk .stk__panel>*{left:0;top:0;max-width:100%;border-radius:2px!important}
.home-refresh #platform .stk__panel .gap,
.home-refresh #platform .stk__panel .aud{min-height:310px;padding:26px!important;display:flex;flex-direction:column}
.home-refresh #platform .gap__top{padding-bottom:18px}
.home-refresh #platform .gap__q{font-size:21px;line-height:1.4;margin-top:24px;max-width:34ch}
.home-refresh #platform .gap__a{font-size:14px;line-height:1.55;margin:14px 0 24px}
.home-refresh #platform .gap__fix{margin-top:auto;padding-top:18px;align-items:baseline;flex-wrap:wrap;gap:8px 16px}
.home-refresh #platform .aud__foot{margin-top:auto}


/* On stacked layouts, keep the shared example beside its own accordion text.
   Flatten only the layout wrappers, preserving the original content and IDs. */
@media(max-width:1199.98px){
  .home-refresh #platform .tile--wide.stk{display:flex!important;flex-direction:column!important;gap:0!important}
  .home-refresh #platform .tile--wide.stk .stk__copy,
  .home-refresh #platform .tile--wide.stk .stk__rows{display:contents}
  .home-refresh #platform .stk__row[data-stage="aud"]{order:10}
  .home-refresh #platform .stk__row[data-stage="trace"]{order:20}
  .home-refresh #platform .stk__row[data-stage="gap"]{order:30}
  .home-refresh #platform .tile--wide.stk .stk__stage{order:11;align-self:flex-start;width:100%;max-width:650px;min-height:0;margin:0 0 24px;padding:24px!important}
  .home-refresh #platform .tile--wide.stk:has(.stk__row[data-stage="trace"].is-open) .stk__stage{order:21}
  .home-refresh #platform .tile--wide.stk:has(.stk__row[data-stage="gap"].is-open) .stk__stage{order:31}
  .home-refresh #platform .tile--wide.stk .stk__panel{display:none!important}
  .home-refresh #platform .tile--wide.stk .stk__panel.is-on{display:flex!important}
}

@media(max-width:999px){
  .home-refresh .platform .tile--conv .viz{padding:24px 0 0 24px!important}
  .home-refresh .platform .tile--conv .live{padding:20px!important}
  .home-refresh .platform .agraph__subs>div{padding:14px 9px}
}
@media(max-width:809px){
  .home-refresh .quotes__head{align-items:flex-start}
}
@media(max-width:599px){
  .home-refresh .tabs__bar{width:100%;justify-content:space-between;gap:24px}
  .home-refresh .tabs__tab{font-size:15px}
  .home-refresh .platform .tile--conv .viz{padding:22px 0 0 18px!important;min-height:370px}
  .home-refresh .platform .tile--conv .live{padding:18px 16px!important;min-height:350px}
  .home-refresh .platform .live__viz{height:230px;min-height:230px}
  .home-refresh .platform .live__viz .lv{inset:18px 14px}
  .home-refresh .platform .live__tabs>span{font-size:12px}
  .home-refresh .platform .lv__bub{font-size:13px;line-height:19px;padding:10px 12px}
  .home-refresh .platform .lv__subj{font-size:14px;line-height:20px}
  .home-refresh .platform .agraph__subs{gap:6px}
  .home-refresh .platform .agraph__subs>div{padding:14px 8px}
  .home-refresh .platform .agraph__subs b{font-size:12px;line-height:17px}
  .home-refresh .platform .agraph__subs em{font-size:10px;line-height:15px}
  .home-refresh .platform .agraph__io{gap:6px}
  .home-refresh .platform .agraph__io span{font-size:10px;padding:5px 8px}
  .home-refresh #platform .tile--wide.stk .stk__stage{width:100%;min-height:0;padding:20px 16px!important}
  .home-refresh #platform .stk__panel .gap,
  .home-refresh #platform .stk__panel .aud{padding:20px 16px!important;min-height:300px}
  .home-refresh #platform .gap__q{font-size:19px;line-height:1.4}
  .home-refresh #platform .gap__top{gap:8px}
  .home-refresh #platform .gap__flag{font-size:10px;padding:5px 8px}
}
@media(prefers-reduced-motion:reduce){
  .home-refresh :is(.btn,.tabs__tab,.linkarrow,.footer__cta){transition:none}
  .home-refresh .ctacard__btn::after{transition:none}
  .home-refresh .platform .live__say span{animation:none!important;opacity:0;visibility:hidden}
  .home-refresh .platform .live__say span:first-child{opacity:1;visibility:visible}
}
