/* feature-page-v3 · the /features/* CMS template in the new theme (12 Oct 2026). v3: section heading rules no longer reach Footer v2's column headings. v2: footer keeps ab-chrome's own layout; the hero shot reserves a 2:1 frame (no layout shift).
   Loaded only on the staging host until the swap (see the template's head code), so production keeps the old look.
   Restyles the template in place; every CMS binding and link stays server-rendered. Tokens follow features-v3. */

@font-face{font-family:'Doppio';src:url('https://cdn.prod.website-files.com/671c75aea252ba8250473e86/6ab8d2b7beb80ce976446dd1_cs-Doppio-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Doppio';src:url('https://cdn.prod.website-files.com/671c75aea252ba8250473e86/6ab8d2b7d25a5ffe5e060f88_cs-Doppio-Medium.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --fx-cream:#FAF8F5; --fx-canvas:#F0EBE2; --fx-paper:#FFFFFF; --fx-ink:#231B10;
  --fx-ink-74:rgba(35,27,16,.74); --fx-ink-60:rgba(35,27,16,.68); --fx-ink-45:rgba(35,27,16,.5);
  --fx-rule:rgba(35,27,16,.12); --fx-blue:#0033A0;
  --fx-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --fx-dop:'Doppio','Inter',system-ui,sans-serif;
  --fx-ease:cubic-bezier(.16,1,.3,1);
  --fx-col:1200px; --fx-gutter:40px; --fx-nav:88px; --fx-sec:136px;
  --fx-shadow:0 1px 2px rgba(35,27,16,.05),0 8px 28px rgba(35,27,16,.07);
  --fx-shadow-up:0 2px 4px rgba(35,27,16,.06),0 18px 44px rgba(35,27,16,.12);
}
@media (max-width:767px){:root{--fx-gutter:20px;--fx-nav:76px;--fx-sec:88px}}

body{background:var(--fx-cream)!important;color:var(--fx-ink)}
body .page-wrapper,body .main-wrapper{background:var(--fx-cream)!important}
body .main-wrapper{font-family:var(--fx-sans)}
body footer.footer_component,body .exit_intent-popup,.feature_modal-wrap{display:none!important}
html.fx-stg footer.abf{display:flex!important}

/* shared shell */
body .main-wrapper>section:not(.section_feature-hero){background:var(--fx-cream)!important;color:var(--fx-ink)}
body .main-wrapper>section:not(.section_feature-hero) .padding-global{padding:var(--fx-sec) var(--fx-gutter) 0!important}
body .main-wrapper>section .container-large{max-width:var(--fx-col);margin:0 auto}
body .main-wrapper>section:not(.section_feature-hero) .padding-section-small:not(.padding-global){padding:0!important}
body .main-wrapper>section h2{margin:0;max-width:16em;font:500 clamp(34px,3.8vw,54px)/1.08 var(--fx-dop)!important;letter-spacing:-.022em;color:var(--fx-ink)!important;
  background:none!important;-webkit-text-fill-color:currentColor;text-wrap:balance;opacity:1!important;transform:none!important}
body .main-wrapper>section h2 span{font-style:normal!important;color:inherit!important;-webkit-text-fill-color:currentColor}
body .main-wrapper>section h2 span:first-child{color:var(--fx-blue)!important}
body .main-wrapper .w-richtext{max-width:none}
body .main-wrapper a.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;min-height:0;padding:0 24px;border-radius:12px;
  background:var(--fx-blue);color:#fff;border:0;box-shadow:none;font:500 16px/1 var(--fx-sans);text-decoration:none;transition:transform .2s var(--fx-ease),background-color .2s var(--fx-ease)}
body .main-wrapper a.button:hover{transform:translateY(-1px);background:#002a85}
body .main-wrapper a.button:focus-visible{outline:2px solid var(--fx-blue);outline-offset:3px}
body .main-wrapper a.button .button_content{display:flex;align-items:center;gap:8px;padding:0;font:inherit;color:inherit}
body .main-wrapper a.button .button_glow-wrapper{display:none}
.fx-eyebrow,body .section_feature-hero .feature-hero_text-wrap::before{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 20px;
  font:500 13px/1.4 var(--fx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--fx-blue)}

/* ── 1 · hero: copy on the meadow, the product shot on a paper frame below ───────────────── */
body .section_feature-hero{position:relative;overflow:hidden;isolation:isolate;
  background:#DFE9F2 url('https://cdn.prod.website-files.com/671c75aea252ba8250473e86/6accca8a647b5c62903851c0_features-tpl-meadow-desktop.avif') 50% 100%/cover no-repeat!important}
body .section_feature-hero::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(250,248,245,.9) 0,rgba(250,248,245,.55) 30%,rgba(250,248,245,.12) 52%,rgba(250,248,245,0) 64%)}
body .section_feature-hero::after{content:'';position:absolute;left:0;right:0;bottom:0;height:34%;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(250,248,245,0),var(--fx-cream) 82%)}
body .section_feature-hero img.feature-hero_bg{display:none}
body .section_feature-hero .padding-global.padding-section-large{padding:calc(var(--fx-nav) + 56px) var(--fx-gutter) 96px!important}
body .section_feature-hero .spacer-xlarge{display:none}
body .section_feature-hero .container-large{max-width:var(--fx-col);margin:0 auto}
body .section_feature-hero .feature-hero_component{display:flex;flex-direction:column;align-items:center;text-align:center}
body .section_feature-hero .feature-hero_text-wrap{display:flex;flex-direction:column;align-items:center;max-width:860px;margin:0 auto}
body .section_feature-hero .feature-hero_text-wrap::before{content:'Appbrew features'}
body .section_feature-hero h1{margin:0;font:500 clamp(42px,5.2vw,74px)/1.05 var(--fx-dop)!important;letter-spacing:-.025em;color:var(--fx-ink)!important;
  background:none!important;-webkit-text-fill-color:currentColor;text-wrap:balance;text-align:center}
body .section_feature-hero h1 .feature-hero_highlite{display:inline;color:var(--fx-blue)!important;background:none!important;-webkit-text-fill-color:currentColor;font:inherit}
body .section_feature-hero p.text-size-large{max-width:34em;margin:22px auto 0;font:400 clamp(17px,1.35vw,19px)/1.6 var(--fx-sans)!important;color:var(--fx-ink-74)!important;text-align:center}
body .section_feature-hero .margin-top.margin-xsmall,body .section_feature-hero .margin-top.margin-small{margin-top:0;padding:0}
body .section_feature-hero .btn-wrap_flex{display:flex;justify-content:center;margin:32px 0 0}
body .section_feature-hero .margin-top.margin-large{width:100%;margin:56px 0 0;padding:0}
body .section_feature-hero img.feature-hero_img{display:block;width:100%;max-width:1100px;height:auto;aspect-ratio:2/1;object-fit:contain;margin:0 auto;padding:clamp(10px,1.4vw,18px);
  border-radius:24px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),0 30px 70px rgba(35,27,16,.16)}

/* ── 2 · why it matters: three numbered notes (the old icons were three different styles) ─ */
body .section_feature-adv .text-align-center{text-align:left}
body .section_feature-adv .feature-adv_component>.text-align-center::before{content:'Why it matters';display:flex;align-items:center;gap:10px;margin:0 0 20px;
  font:500 13px/1.4 var(--fx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--fx-blue)}
body .section_feature-adv .margin-top.margin-xlarge{margin-top:48px}
body .feature-adv_grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;counter-reset:fxadv}
body .feature-adv_grid>.w-dyn-item{display:flex;counter-increment:fxadv}
body .feature-adv_grid-item{display:flex;flex-direction:column;align-items:flex-start;width:100%;margin:0;padding:30px 28px 32px;border:1px solid var(--fx-rule)!important;border-radius:18px;
  background:var(--fx-paper)!important;box-shadow:var(--fx-shadow);text-align:left}
body .feature-adv_grid-item::before{content:'0' counter(fxadv);margin:0 0 28px;font:500 15px/1 var(--fx-sans);letter-spacing:.06em;color:var(--fx-blue);
  padding:0 0 14px;border-bottom:1px solid var(--fx-rule);width:100%}
body .feature-adv_grid-item img.feature-adv_icon{display:none}
body .feature-adv_grid-item h3{margin:0;font:500 23px/1.22 var(--fx-dop)!important;letter-spacing:-.012em;color:var(--fx-ink)!important;text-align:left}
body .feature-adv_grid-item .margin-top{margin-top:12px}
body .feature-adv_grid-item p{margin:0;font:400 15.5px/1.6 var(--fx-sans)!important;color:var(--fx-ink-74)!important;text-align:left}

/* ── 3 · capabilities: alternating rows, screenshots in dark frames ──────────────────────── */
body .feature-list_title-wrap{text-align:left}
body .feature-list_title-wrap::before{content:'Capabilities';display:flex;align-items:center;gap:10px;margin:0 0 20px;
  font:500 13px/1.4 var(--fx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--fx-blue)}
body .section_feature-list .margin-top.margin-xlarge{margin-top:40px}
body .feature-list_wrap.w-dyn-items{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--fx-rule)}
body .feature-list_wrap>.w-dyn-item{padding:48px 0;border-bottom:1px solid var(--fx-rule)}
body .feature-list_grid,body .feature-list_grid.v2{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:center;margin:0;padding:0;background:none;border:0}
body .feature-list_grid.v2{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
body .feature-list_grid-item.pad-right,body .feature-list_grid-item.pad-left{padding:0!important}
body .feature-list_grid h3{margin:0;font:500 clamp(26px,2.4vw,34px)/1.15 var(--fx-dop)!important;letter-spacing:-.015em;color:var(--fx-ink)!important;text-wrap:balance}
body .feature-list_grid .margin-top{margin-top:16px}
body .feature-list_grid p{margin:0;max-width:32em;font:400 16.5px/1.65 var(--fx-sans)!important;color:var(--fx-ink-74)!important}
body .feature-list_img{display:block;width:100%;height:auto;border-radius:20px;background:#0f0c08;box-shadow:var(--fx-shadow-up)}

/* ── 4 · questions ───────────────────────────────────────────────────────────────────────── */
body .section_faq11 .faq11_component{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}
body .section_faq11 .margin-bottom.margin-xxlarge{margin:0}
body .section_faq11 .text-align-center{text-align:left}
body .section_faq11 .max-width-large{max-width:none;margin:0}
body .section_faq11 .max-width-large::before{content:'Questions';display:flex;align-items:center;gap:10px;margin:0 0 20px;
  font:500 13px/1.4 var(--fx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--fx-blue)}
body .section_faq11 h2{max-width:8em}
body .faq11_list{display:flex;flex-direction:column;border-top:1px solid var(--fx-rule)}
body .faq11_accordion-wrap{margin:0;padding:0;border:0}
body .faq11_accordion{margin:0;padding:0;border:0;border-bottom:1px solid var(--fx-rule)!important;border-radius:0;background:none!important;box-shadow:none}
body .faq11_question{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;cursor:pointer;background:none}
body .faq11_question .text-size-medium{font:500 18px/1.4 var(--fx-sans)!important;color:var(--fx-ink)!important}
body .faq11_question:hover .text-size-medium{color:var(--fx-blue)!important}
body .faq11_icon-wrapper{flex:0 0 32px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--fx-rule);color:var(--fx-ink);background:var(--fx-paper)}
body .faq11_icon-wrapper svg{width:14px;height:14px}
body .faq11_answer{background:none}
body .faq11_answer p,body .faq11_answer li{font:400 16px/1.65 var(--fx-sans)!important;color:var(--fx-ink-74)!important}
body .faq11_answer a{color:var(--fx-blue)}

/* ── 5 · closing call to action (same plate as the hub) ──────────────────────────────────── */
body .section_cta{padding:var(--fx-sec) var(--fx-gutter) 120px!important}
body .section_cta .padding-global{padding:0!important}
body .section_cta .padding-section-large{padding:0}
body .section_cta .cta_component{margin:0;padding:0;background:none;border:0;box-shadow:none;transform:none!important;opacity:1!important}
body .section_cta .cta_card{position:relative;overflow:hidden;isolation:isolate;display:flex;justify-content:center;margin:0;padding:112px 32px 120px;min-height:0;border:0;border-radius:24px;box-shadow:none!important;
  background:#DCE6EE url('https://cdn.prod.website-files.com/671c75aea252ba8250473e86/6acca3561c25ab471a47b104_blogs-close-field.avif') 50% 70%/cover no-repeat}
body .section_cta .cta_card::before{content:'';position:absolute;inset:0;z-index:-1;
  background:radial-gradient(ellipse 62% 58% at 50% 46%,rgba(250,248,245,.9) 0,rgba(250,248,245,.72) 45%,rgba(250,248,245,0) 78%),linear-gradient(180deg,rgba(250,248,245,.35),rgba(250,248,245,0) 50%)}
body .section_cta .cta_background-image-wrapper,body .section_cta img.cta_image{display:none!important}
body .section_cta .cta_card-content{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:none;padding:0;margin:0;color:var(--fx-ink)}
body .section_cta .subheading_wrapper{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin:0;font:500 13px/1.4 var(--fx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--fx-blue)}
body .section_cta .subheading_logo{height:22px;width:auto;border-radius:5px}
body .section_cta .spacer-xlarge{padding-top:24px}
body .section_cta .max-width-medium{display:flex;flex-direction:column;align-items:center;max-width:none}
body .section_cta h2{max-width:14em;text-align:center}
body .section_cta h2 em{font-style:normal;color:var(--fx-blue)}
body .section_cta .spacer-xsmall{padding-top:0}
body .section_cta p.text-size-large{max-width:34em;margin:20px 0 0;font:400 18px/1.6 var(--fx-sans)!important;color:var(--fx-ink-74)!important;text-align:center}
body .section_cta .cta_button-group{display:flex;justify-content:center;gap:12px;margin:12px 0 0}

/* ── 6 · tablet and phone ────────────────────────────────────────────────────────────────── */
@media (max-width:991px){
  body .feature-adv_grid{grid-template-columns:1fr;gap:12px}
  body .feature-list_grid,body .feature-list_grid.v2{grid-template-columns:1fr;gap:28px}
  body .feature-list_grid.v2>.feature-list_grid-item:not(.pad-left):not(.pad-right){order:2}
  body .section_faq11 .faq11_component{grid-template-columns:1fr;gap:32px}
}
@media (max-width:767px){
  body .section_feature-hero{background-image:url('https://cdn.prod.website-files.com/671c75aea252ba8250473e86/6accca8b9fe92d9288ed5e45_features-tpl-meadow-mobile.avif')!important;background-position:50% 100%!important}
  body .section_feature-hero .padding-global.padding-section-large{padding:calc(var(--fx-nav) + 32px) var(--fx-gutter) 64px!important}
  body .section_feature-hero::before{background:linear-gradient(180deg,rgba(250,248,245,.94) 0,rgba(250,248,245,.88) 52%,rgba(250,248,245,.3) 72%,rgba(250,248,245,0) 84%)}
  body .section_feature-hero h1{font-size:clamp(34px,9.6vw,44px)!important;line-height:1.08}
  body .section_feature-hero .margin-top.margin-large{margin-top:36px}
  body .section_feature-hero img.feature-hero_img{border-radius:16px;padding:8px}
  body .feature-adv_grid-item{padding:24px 22px 26px}
  body .feature-adv_grid-item::before{margin-bottom:20px}
  body .feature-list_wrap>.w-dyn-item{padding:36px 0}
  body .faq11_question .text-size-medium{font-size:16.5px!important}
  body .section_cta{padding-bottom:88px!important}
  body .section_cta .cta_card{padding:80px 22px 88px;border-radius:20px}
}

/* ── 7 · the template uses the black Navbar variant: make it sit on cream like the hub's (staging only) ── */
html body .navbar_component.is-black,html body .navbar_container.is-black{background:transparent!important;box-shadow:none!important;border:0!important}
html body .navbar_component.is-black .navbar_link,html body .navbar_component.is-black .navbar_dropdown-toggle{color:var(--fx-ink-74)!important}
html body .navbar_component.is-black .navbar_link:hover,html body .navbar_component.is-black .navbar_dropdown-toggle:hover{color:var(--fx-ink)!important}
html body .navbar_component.is-black .navbar_menu-button{color:var(--fx-ink)}
html body .navbar_component.is-black .navbar_logo{filter:brightness(0) saturate(100%) invert(9%) sepia(19%) saturate(1300%) hue-rotate(353deg)}
html body .navbar_component.is-black .navbar_menu-button .menu-icon,html body .navbar_component.is-black .navbar_menu-button img{filter:invert(1)}