:root{
--_🎨-color--base---base--light-0: #0a0a0a00;
--_🎨-color--base---base--dark-0: #f2f2f300;
--_🎨-color--base---base--light-4: #0a0a0a0a;
--_🎨-color--base---base--dark-4: #f2f2f30a;
--_🎨-color--base---base--light-8: #0a0a0a14;
--_🎨-color--base---base--dark-8: #f2f2f314;
--_🎨-color--base---base--light-16: #0a0a0a29;
--_🎨-color--base---base--dark-16: #f2f2f329;
--_🎨-color--base---base--light-32: #0a0a0a52;
--_🎨-color--base---base--dark-32: #f2f2f352;
--_🎨-color--base---base--light-48: #0a0a0a7a;
--_🎨-color--base---base--dark-48: #f2f2f37a;
--_🎨-color--base---base--light-64: #0a0a0aa3;
--_🎨-color--base---base--dark-64: #f2f2f3a3;
--_🎨-color--base---base--light-88: #0a0a0ae0;
--_🎨-color--base---base--dark-88: #f2f2f3e0;
--_🎨-color--base---base--light-100: #0a0a0a;
--_🎨-color--base---base--dark-100: #f2f2f3;
--_🎨-color--base---depth--light: #101114;
--_🎨-color--base---lift--light: #1c1c21;
--_🎨-color--base---depth--dark: #0e0f11;
--_🎨-color--base---lift--dark: #26262b;
--_🎨-color--base---accent--primary: #2BB5CB;
--_🎨-color--base---colors--nssyntaxmint: #0F4C44;
--_🎨-color--base---colors--nspacketsky: #14395C;
--_🎨-color--base---colors--nsqubitorchid: #0C4D5C;
--_🎨-color--base---colors--nslatencypeach: #12424B;
--_🎨-color--base---colors--nscachesand: #0B3B44;
--_🎨-color--base---colors--nscorecoral: #d95a56;
--_🎨-color--base---ui--success: #1AE299;
}
.cookies{display:none!important}
[class*="cta_sales"],[class*="sales-"],[class*="ultra-small"]{display:none!important}
.w-webflow-badge{display:none!important}
.section_testimonials .image_cover{display:none!important}
.nav-cta_desktop{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.right_profile{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.right_profile.create{background-image:url(/assets/nd/waves-teal-1x1.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.right_profile.reset{background-image:url(/assets/nd/glow-sunset.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.left_book{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.card-plan_top-tile.pro{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.card-plan_top-tile.max{background-image:url(/assets/nd/waves-teal-1x1.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.video_about{background-image:url(/assets/nd/glow-sunset.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.right_product-a{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.right_column.data-stack{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.card_impact-left{background-image:url(/assets/nd/waves-teal-1x1.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
/* Footer left column: stack the logo above the ServiceNow partner badges (template ships it as a row → badges overlapped the wordmark) */
.footer .left-footer{flex-direction:column!important;align-items:flex-start!important}
/* Footer legal links hovered to a template brown (#381d0f) — use our brand teal */
.link_footer-legal:hover{color:#2bb5cb!important}
/* Contact B form: template input tokens render near-black text on near-black fields — make it all legible */
.section_hero-contact-b .text-field{background:#141418!important;border:1px solid #33333b!important;color:#f2f2f3!important;transition:border-color .15s ease}
.section_hero-contact-b .text-field::placeholder{color:#8a8b91!important;opacity:1}
.section_hero-contact-b .text-field:focus,.section_hero-contact-b .text-field:hover{border-color:#2bb5cb!important;outline:none}
/* field labels (NAME / WORK EMAIL / …) shipped near-black — lighten them */
.section_hero-contact-b form .label-large{color:#c3c4ca!important;opacity:1!important}
/* Footer: template's even 1fr column spread, just with a 4th column. Logo keeps its natural
   width (template's 1fr 1fr split left the right half too narrow for 4 columns → overflow). */
.footer_top-tile{grid-template-columns:auto 1fr!important}
.footer_columns{display:flex!important;flex-direction:row!important;justify-content:flex-end!important;width:100%!important;flex:1 1 auto!important;gap:72px!important}
.footer_columns>*{flex:0 0 auto!important}
.footer_columns .footer-column{white-space:nowrap!important}
@media(max-width:991px){.footer_columns{flex-wrap:wrap!important;justify-content:flex-start!important;gap:32px 48px!important}.footer_columns>*{flex:0 0 44%!important}}
@media(max-width:479px){.footer_columns>*{flex:0 0 100%!important}}
@media(max-width:991px){.footer_columns{grid-template-columns:1fr 1fr!important;justify-content:start!important}}
@media(max-width:479px){.footer_columns{grid-template-columns:1fr!important}}
.footer-partner-badges{margin-top:28px!important}
.master_product-b-marquee{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
/* Solutions hero: widen the headline column (was 6-col / 42.5rem) and give the lede a comfortable, prominent width */
.section_hero-product-b .headline_product-b{max-width:64rem!important}
.section_hero-product-b .subtext_4-columns{max-width:52rem!important;margin-left:auto!important;margin-right:auto!important}
.section_hero-product-b .subtext_4-columns p{max-width:none!important}
/* Solutions hero marquee: reuse the homepage card_product, sized for the scrolling band */
.master_product-b-marquee .card_product{width:340px!important;min-height:auto!important;padding:26px!important;grid-row-gap:20px!important;grid-column-gap:20px!important}
.master_product-b-marquee .card_product .heading-style-h5{font-size:1.5rem}
/* section_documents is a light band — force accordion titles/text dark (template default is white, for a dark bg) */
.section_documents .accordion-title h3,.section_documents .acordion-text{color:#1c1c21!important}
.image-wrap_product-c-tabs{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.image-wrap_scroll-card{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.image-wrap_scroll-card.second{background-image:url(/assets/nd/waves-teal-1x1.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.image-wrap_scroll-card.third{background-image:url(/assets/nd/glow-sunset.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.card_bento-left{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.card_bento-middle-top{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.card_bento-right{background-image:url(/assets/nd/waves-teal-1x1.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.right_home-b{background-image:url(/assets/nd/glow-sunset.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.left_tab-home{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.left_tab-home.second{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.left_tab-home.third{background-image:url(/assets/nd/waves-teal-1x1.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.left_tab-home.fourth{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.left_tab-home.fifth{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.image-wrap_scroll{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.image-wrap_scroll.second{background-image:url(/assets/nd/waves-teal-1x1.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.image-wrap_scroll.third{background-image:url(/assets/nd/glow-sunset.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.image-wrap_scroll.third.desktop{background-image:url(/assets/nd/waves-teal-16x9.png)!important;background-size:cover!important;background-position:50% 100%!important;background-repeat:no-repeat!important;background-color:#050708!important}
.cta_mobile-menu{background-image:url(/assets/nd/glow-teal.png)!important;background-size:cover!important;background-position:50% 60%!important;background-repeat:no-repeat!important;background-color:#050708!important}
/* contrast fixes — sections that were dark-on-light inversions in the
   template end up dark-text-on-dark after the token flip. Force light type. */
.section_investors :where(h1,h2,h3,h4,h5,h6,.heading-style-h0,.heading-style-h2,.heading-style-h5){color:#f2f2f3!important}
.section_investors .tone-medium,.section_investors p{color:#a3a3a9!important}
.section_investors .label-large{color:#8a8a90!important}
.section_cta :where(h1,h2,h3){color:#f2f2f3!important}
/* hero tabs — inactive labels flipped dark-on-dark; force readable states */
.w-tab-link{color:#a8a8ae!important}
.w-tab-link.w--current{color:#0b0c0e!important}
/* case-slider: hide the template's fictional client wordmarks (claims stay) */
[class*="logo_case"]{display:none!important}
/* team: only the real founder card renders */
.card_team{display:none!important}
.card_team--keep{display:flex!important;flex-direction:column}
/* active tab pill: white pill, dark label (background token flipped dark) */
.w-tab-link.w--current{background:#f2f2f3!important;color:#0b0c0e!important;border-radius:8px}

[class*="ultra-bar"],[class*="ultra_"],[class*="ultra-label"]{display:none!important}
[class*="ultra-pop"]{display:none!important}
[class*="dropdown"] [class*="ultra"] *{color:#f2f2f3!important}
[class*="dropdown"] img[src*="BYQ"],[class*="dropdown"] svg[class*="byq"]{display:none!important}
.w-dropdown-list .heading-style-h5,nav .heading-style-h5{color:#f2f2f3!important}
[class*="section_cta"]{background:var(--_🎨-color--tokens---background--base)!important}
/* product accordion: active card stays light — force dark text inside it */
.accordion_top-tile,.accordion-title,.acordion-text,.accordion-bottom-tile{color:#1c1c21}
.acordion-text,.accordion-bottom-tile .tone-medium{color:#4a4a52!important}
/* case slider card: brand aurora + light text instead of gray template art */

.case_large *,.case-large_quote{color:#f2f2f3!important}
/* footer logo: render the wordmark at proper size regardless of wrapper */
[class*="footer"] img[alt="phyllis"]{height:44px!important;width:auto!important;max-width:none!important}
/* Feature tabs: inactive labels sit on the dark section — make them readable; keep dark text only on the active light card */
.tab_accordion{color:rgba(255,255,255,.92)}
.tab_accordion .accordion-title,.tab_accordion .acordion-text,.tab_accordion .accordion-bottom-tile{color:rgba(255,255,255,.92)}
.tab_accordion .acordion-text,.tab_accordion .accordion-bottom-tile .tone-medium{color:rgba(255,255,255,.58)!important}
.tab_accordion.w--current .accordion-title,.tab_accordion.w--current .acordion-text,.tab_accordion.w--current .accordion-bottom-tile{color:#1c1c21}
.tab_accordion.w--current .acordion-text,.tab_accordion.w--current .accordion-bottom-tile .tone-medium{color:#4a4a52!important}
/* "Works with the stack" — 3 static B&W logo tiles with a soft fade-in */
.phx-stack-tiles{display:flex;justify-content:center;width:100%;gap:18px;animation:phxtilesfade 1.1s ease both}
/* Brand pink -> teal, app-wide. Darker teal into electric on the glows. */
:root{--_🎨-color--base---colors--nscorecoral:#2bb5cb}
.cta_bg{background-image:radial-gradient(ellipse 85% 80% at 50% 55%,#4fdcd6 0%,#0a6270 46%,transparent 78%)!important}
.phx-tile{width:104px;height:104px;box-sizing:border-box;padding:26px;display:flex;align-items:center;justify-content:center;background:#141518;border:1px solid rgba(255,255,255,.06);border-radius:22px}
.phx-tile img{width:100%;height:100%;object-fit:contain;opacity:.92}
@keyframes phxtilesfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.phx-stack-tiles{animation:none}}
/* Rounded, inset hero — black bars run up the sides, corners curve up into the next section */
.uc-hero-rounded{margin:10px 14px 0;border-radius:32px;background:linear-gradient(180deg,#0e1013 0%,#08090b 70%);overflow:hidden;position:relative}
/* "What Phyllis can do" cards — a real Phyllis composer per capability */
.phx-cmd{width:100%;box-sizing:border-box;margin-top:16px;display:flex;flex-direction:column;gap:14px;min-height:150px;background:#0e0f11;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:14px 14px 11px}
.phx-cmd-body{min-height:56px}
.phx-cmd-body{flex:1;color:#8a8a90;font-size:14px;line-height:1.45;min-height:54px}
.phx-cmd-text{white-space:pre-wrap}
.phx-cmd-caret{display:inline-block;width:2px;height:1.05em;background:#5FE6D0;border-radius:1px;margin-left:1px;transform:translateY(2px);animation:phxcmdcaret 1.1s steps(1) infinite}
.phx-cmd-bar{display:flex;align-items:center;justify-content:space-between;gap:8px}
.phx-cm-left{display:flex;align-items:center;gap:12px;min-width:0}
.phx-cm-model{display:inline-flex;align-items:center;gap:4px;padding:4px 7px;border:1px solid rgba(255,255,255,.14);border-radius:8px;color:#8a8a90}
.phx-cm-opt{display:inline-flex;align-items:center;gap:4px;color:#8a8a90;font-size:13px;white-space:nowrap}
.phx-cm-opt .cmi,.phx-cm-model .cmi{opacity:.6}
.phx-cm-right{display:flex;align-items:center;gap:8px;flex:none}
.phx-cm-clip{color:#8a8a90;display:inline-flex}
.phx-cm-send{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid rgba(255,255,255,.14);border-radius:8px;color:#d6d6da}
@keyframes phxcmdcaret{0%,49%{opacity:1}50%,100%{opacity:0}}
/* Seamless marquee of "what Phyllis can do" capability cards */
.phx-marquee{overflow-x:auto;overflow-y:hidden;padding:6px 0;cursor:grab;scrollbar-width:none;-ms-overflow-style:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.phx-marquee::-webkit-scrollbar{display:none}
.phx-marquee.dragging{cursor:grabbing}
.phx-track{display:flex;width:max-content}
.phx-card{flex:0 0 auto;width:360px;margin-right:20px;box-sizing:border-box;background:#0d0e10;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:20px 20px 18px}
.phx-card-icon{width:44px;height:44px;border:1px solid rgba(255,255,255,.1);border-radius:11px;display:flex;align-items:center;justify-content:center;color:#e6e6ea;margin-bottom:16px}
.phx-card-icon svg{width:23px;height:23px}
.phx-card-title{font-size:18px;font-weight:600;color:#f7f6f5;margin:0}
/* Capability icon draws itself once on load (staggered via --phxd), then holds */
.phx-card-icon svg path{stroke-dasharray:1;stroke-dashoffset:1;animation:phxdraw 1.5s ease forwards;animation-delay:var(--phxd,0s)}
@keyframes phxdraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.phx-track{animation:none}.phx-card-icon svg path{animation:none;stroke-dashoffset:0}.phx-cmd-caret{animation:none}}

/* Products mega-menu: Products + 3 use-case columns as a flex row, with a
   featured picture card on the right. Desktop only; mobile stays stacked. */
@media screen and (min-width:992px){
  .nav-menu .dropdown_inner{gap:var(--spacing--40)!important;align-items:stretch}
  .nav-menu .left_nav-menu{display:flex!important;flex-flow:row!important;gap:var(--spacing--32)!important;grid-template-columns:none!important;align-items:flex-start;flex:1 1 auto;min-width:0}
  .nav-menu .left_nav-menu .nav_column{flex:1 1 0;min-width:0;max-width:none}
  .nav-menu .nav_feature{display:flex!important;flex-direction:column;justify-content:flex-end;width:21rem;flex:0 0 21rem;align-self:stretch;min-height:19rem;padding:1.4rem;border-radius:1.1rem;overflow:hidden;position:relative;text-decoration:none;background-size:cover;background-position:center}
  .nav-menu .nav_feature::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,15,.15) 0%,rgba(8,9,11,.55) 55%,rgba(6,7,9,.9) 100%)}
  .nav-menu .nav_feature>*{position:relative;z-index:1}
  .nav-menu .nav_feature .nf-kicker{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#9fe9df;margin-bottom:.5rem}
  .nav-menu .nav_feature .nf-title{color:#fff;margin:0 0 .35rem;font-weight:600}
  .nav-menu .nav_feature .nf-link{color:#e7e7ea;opacity:.85;font-size:.9rem}
}

/* Roles section (home) — force readable light text + dark cards on the dark section */
.section_home-a-features h2{color:#f2f2f3!important}
.section_home-a-features .card_product{background:#0d0f13!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:16px;padding:24px;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;gap:0!important;height:100%!important;min-height:0!important}
.section_home-a-features .grid_features{grid-auto-rows:1fr!important;align-items:stretch!important}
.section_home-a-features .card_product .label-large{color:#c9ccd3!important}
.section_home-a-features .card_product .heading-style-h5{color:#f2f2f3!important;margin-top:6px!important}
.section_home-a-features .card_product img{margin-top:16px!important}
.section_home-a-features .card_product p,.section_home-a-features .card_product .tone-medium{color:#9a9ea7!important;margin-top:14px!important}
.section_home-a-features .card_product .icon-wrap_tag{color:#5FE6D0}

/* Case-slider — fix washed-out overlay: dark gradient for readable titles */
.card_case{background-color:#101114!important}
.overlay_card-case{background-image:linear-gradient(180deg,rgba(8,9,11,0) 0%,rgba(8,9,11,.55) 55%,rgba(8,9,11,.95) 100%)!important;height:80%!important}
.overlay_card-case-top{background-image:linear-gradient(180deg,rgba(8,9,11,.7) 0%,rgba(8,9,11,0) 100%)!important;height:30%!important}

/* Use-cases carousel (home Products section) */
.uc-carousel-wrap{position:relative}
.uc-carousel{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px;scroll-behavior:smooth;-webkit-mask-image:linear-gradient(90deg,transparent,#000 1.5%,#000 97%,transparent)}
.uc-carousel::-webkit-scrollbar{display:none}
.uc-card{flex:0 0 300px;scroll-snap-align:start;background:#0d0f13;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:24px;text-decoration:none;display:flex;flex-direction:column;min-height:210px;transition:border-color .2s,transform .2s}
.uc-card:hover{border-color:rgba(43,181,203,.45);transform:translateY(-2px)}
.uc-card-tag{font:600 11px/1 ui-monospace,Menlo,monospace;letter-spacing:.09em;text-transform:uppercase;color:#7fd9cf;margin-bottom:16px}
.uc-card-name{color:#f2f2f3;font-weight:600;font-size:18px;letter-spacing:-.01em;margin-bottom:8px}
.uc-card-dek{color:#9a9ea7;font-size:14px;line-height:1.5;flex:1}
.uc-card-arrow{color:#5FE6D0;margin-top:16px;display:flex}
.uc-arrows{display:flex;gap:8px;justify-content:flex-end;margin-top:22px}
.uc-arrow-btn{width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.15);background:transparent;color:#e7e7ea;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}
.uc-arrow-btn:hover{background:rgba(255,255,255,.07)}

/* Use native card_product inside the carousel */
.uc-carousel .card_product{flex:0 0 372px;scroll-snap-align:start;min-height:200px}

/* The-loop section (rebuilt, robust) */
.section_home-a-scroll .loop-head{text-align:center;max-width:44rem;margin:0 auto 3rem}
.section_home-a-scroll .loop-head h2{color:#f2f2f3;margin:.6rem 0 .8rem}
.section_home-a-scroll .loop-head p{color:#9a9ea7}
.section_home-a-scroll .loop-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.section_home-a-scroll .card_product{background:#0d0f13!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:16px!important;padding:22px!important;min-height:210px}
.section_home-a-scroll .card_product:hover{border-color:rgba(43,181,203,.45)!important}
.section_home-a-scroll .card_product .label-large{color:#c9ccd3!important}
.section_home-a-scroll .card_product .heading-style-h5{color:#f2f2f3!important}
.section_home-a-scroll .card_product p,.section_home-a-scroll .card_product .tone-medium{color:#9a9ea7!important}
.section_home-a-scroll .loop-num{font:600 12px/1 ui-monospace,Menlo,monospace;color:#5FE6D0;letter-spacing:.05em}
.section_home-a-scroll .loop-arrow{color:#5FE6D0;margin-top:16px;display:flex}
@media(max-width:1100px){.section_home-a-scroll .loop-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.section_home-a-scroll .loop-grid{grid-template-columns:1fr}}

/* Scroll-reveal for added loop items (Deploy/Test) */
.phx-reveal{transition:opacity .55s cubic-bezier(.22,.8,.2,1),transform .55s cubic-bezier(.22,.8,.2,1)}
.phx-reveal.in{opacity:1!important;transform:none!important}

/* Robust sticky cross-fade for the loop section's right-side mockups */
.section_home-a-scroll .right_scroll{position:sticky}
.section_home-a-scroll .image-wrap_scroll{position:absolute!important;inset:0;opacity:0!important;transition:opacity .5s ease;display:flex!important;align-items:center;justify-content:center}
.section_home-a-scroll .image-wrap_scroll.sx-active{opacity:1!important}
.sx-mock{width:100%;max-width:26rem;background:#0d0f13;border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:22px;box-shadow:0 30px 70px -30px rgba(0,0,0,.7);font-family:Geist,ui-sans-serif,system-ui}
.sx-mock .sx-h{display:flex;align-items:center;gap:8px;color:#eef0f4;font-weight:600;font-size:14px;margin-bottom:16px}
.sx-row{display:flex;align-items:center;gap:10px;padding:7px 0;color:#c9ccd3;font-size:13px}
.sx-row .sx-ck{color:#5FE6D0}
.sx-bar{height:8px;border-radius:4px;background:rgba(255,255,255,.08);flex:1;overflow:hidden}
.sx-bar>span{display:block;height:100%;background:#2bb5cb}
.sx-foot{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.07);color:#8b8f98;font-size:12px}
.sx-chip{font:600 11px ui-monospace,Menlo,monospace;color:#7fd9cf;background:rgba(43,181,203,.12);border:1px solid rgba(43,181,203,.3);border-radius:6px;padding:3px 7px}

/* Product pages — kill the giant vertical gaps in the alternating columns.
   Template forces .right_column{min-height:42.5rem} and card_product{min-height:584px};
   let the media/card side hug its content so sections aren't 840px of mostly-empty. */
.section_column .right_column{min-height:0!important}
.section_column{padding-top:64px!important;padding-bottom:64px!important}
/* Explore-more-products: 4 sibling products in one clean, EVEN row (no lonely 2nd row).
   Cards keep their original template height — only the column count changes. */
.section_more-products .grid_more-products{grid-template-columns:repeat(4,1fr)!important;grid-template-rows:auto!important}
/* Some more-products cards + the "Explore more products" heading have an unwired Webflow ix2 reveal id and stay stuck at opacity:0. Force visible. */
.section_more-products .card_product,.section_more-products .headline_more-products,.section_more-products .headline_more-products *{opacity:1!important;transform:none!important}
.section_more-products{padding-top:72px!important;padding-bottom:72px!important}

/* Book-a-demo: cap the cal.com embed height so the page doesn't grow to the
   full month grid. !important beats cal.com's dynamically-set inline height. */
.demo-cal-embed{min-height:640px;border-radius:14px}

/* Blog section was the only non-black band on the homepage — flatten to black */
.section_home-a-blog,.section_home-a-blog .card_blog,.section_home-a-blog [class*="card"]{background-color:#0a0a0b!important;background-image:none!important}

/* Roles section carried a template bg token — flatten to black to match the page */
.section_home-a-features{background-color:#0a0a0b!important;background-image:none!important}

/* Roles section: template gives the headline a 200px bottom margin — tighten to match other sections */
.section_home-a-features .headline_home-a-features{margin-bottom:56px!important}
/* keep the person images a consistent height so cards read uniform */
.section_home-a-features .card_product img{height:170px!important;object-fit:cover!important;width:100%!important;border-radius:12px!important}

/* Reveal real headshots inside kept team cards (Zach, Regan) and lay the
   two founder cards out as a centered 2-up instead of the 3-col grid. */
.card_team--keep .image_cover{display:block!important;object-position:center 18%}
.secion_team .grid_team{grid-template-columns:1fr 1fr!important;max-width:820px;margin-inline:auto}
@media (max-width:640px){.secion_team .grid_team{grid-template-columns:1fr!important}}

/* ---- phv: card visuals (product pages) — black back card, white front -- */
.right_column:has(.phv) .widget-list_outer,.widget-list_outer:has(.phv){background:#0a0a0a;border:1px solid rgba(247,246,245,.16);border-radius:18px}
.widget-list_outer:has(.phv) .widget-list_bottom-tile,.widget-list_outer:has(.phv) .text_body-bold{color:#f7f6f5}
.phv{width:100%;box-sizing:border-box;background:#f7f6f5;border:none;border-radius:12px;color:#0a0a0a;font-family:'StackSans text Variable',sans-serif;overflow:hidden}
.phv-cap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid rgba(10,10,10,.14);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(10,10,10,.55)}
.phv-cap b{color:#0a0a0a;font-weight:600}
.phv-body{padding:20px 22px}
.phv-q{font-size:13.5px;font-weight:500;color:#f7f6f5;background:#0a0a0a;border-radius:6px;padding:10px 14px;margin-bottom:16px;overflow-wrap:anywhere}
.phv-row{display:flex;align-items:baseline;gap:12px;padding:9px 0}
.phv-row+.phv-row{border-top:1px solid rgba(10,10,10,.09)}
.phv-mark{flex:0 0 9px;width:9px;height:9px;background:#0a0a0a;align-self:center}
.phv-mark.off{background:none;border:1px solid rgba(10,10,10,.45)}
.phv-mark.warn{background:none;border:1.5px solid #0a0a0a}
.phv-name{font-size:14.5px;color:#0a0a0a;white-space:nowrap}
.phv-name small{display:block;font-size:12px;font-weight:400;color:rgba(10,10,10,.55);white-space:normal}
.phv-lead{flex:1 1 auto;border-bottom:1px dotted rgba(10,10,10,.3);min-width:24px;transform:translateY(-4px)}
.phv-val{font-size:12px;color:rgba(10,10,10,.6);text-align:right;white-space:nowrap}
.phv-chip,.phv-chip.mint,.phv-chip.sand{font-size:11.5px;font-weight:500;background:#0a0a0a;color:#f7f6f5;border-radius:4px;padding:3px 8px;white-space:nowrap}
.phv-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(10,10,10,.14);font-size:12.5px;color:rgba(10,10,10,.6)}
.phv-stamp{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#0a0a0a;border:1.5px solid #0a0a0a;border-radius:3px;padding:5px 9px;transform:rotate(-2deg);white-space:nowrap}
.phv-stamp.hollow{color:rgba(10,10,10,.5);border-color:rgba(10,10,10,.35)}
.phv-group{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(10,10,10,.45);padding:14px 0 4px}
.phv-spine{border-left:1px solid rgba(10,10,10,.25);margin-left:4px;padding-left:16px}
.phv-step{position:relative;padding:10px 0}
.phv-step:before{content:"";position:absolute;left:-20.5px;top:16px;width:9px;height:9px;background:#0a0a0a}
.phv-step.gate:before{background:#f7f6f5;border:1.5px solid #0a0a0a;left:-21.5px}
.phv-step.dim:before{background:none;border:1px solid rgba(10,10,10,.45)}
.phv-step-k{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(10,10,10,.5);margin-bottom:2px}
.phv-step-t{font-size:14.5px}
.phv-step-t small{display:block;font-size:12px;color:rgba(10,10,10,.55)}
.phv-big{font-family:'StackSans headline Variable',sans-serif;font-size:44px;line-height:1;letter-spacing:-.01em;padding:6px 0 2px}
.phv-bar{height:10px;background:#0a0a0a;margin:14px 0 8px}
.phv-num{font-size:10.5px;font-weight:600;color:rgba(10,10,10,.45);flex:0 0 22px;align-self:center}
@media(max-width:479px){.phv-val{white-space:normal}.phv-name{white-space:normal}}

/* footer: single LinkedIn icon, brand hover to match link_footer-legal */
.link-socials:hover{color:#2bb5cb!important;opacity:1!important}
