/* BuildEcoGroup V22.3 — clean editorial skin for every public React page */
@font-face{font-family:'Zodiak';src:url('/fonts/zodiak-300.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Zodiak';src:url('/fonts/zodiak-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Satoshi';src:url('/fonts/satoshi-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Satoshi';src:url('/fonts/satoshi-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Satoshi';src:url('/fonts/satoshi-700.woff2') format('woff2');font-weight:700 900;font-display:swap}

/* ---- design tokens (win over every earlier :root theme layer) ---- */
html:root{
  --font-sans:'Satoshi','Noto Sans Devanagari',-apple-system,'Segoe UI',sans-serif;
  --font-serif:'Satoshi','Noto Sans Devanagari',-apple-system,'Segoe UI',sans-serif;
  --color-background:#FFFFFF;--color-surface:#FFFFFF;--color-surface-muted:#F5F5F2;--color-surface-subtle:#EEEEEC;
  --color-surface-overlay:rgba(0,0,0,.84);
  --color-primary:#111111;--color-primary-hover:#292929;--color-primary-active:#000000;--color-primary-subtle:#F1F1EF;
  --color-primary-border:#D0D0CC;--color-primary-light:#333333;
  --color-accent-warm:#315B40;--color-accent-warm-hover:#254A32;--color-accent-warm-subtle:#E6EEE8;--color-accent-warm-ink:#244A31;
  --color-cta-on:#FFFFFF;
  --color-brand-navy:#111111;--color-brand-navy-deep:#080808;--color-brand-navy-panel:#1D1D1D;--color-brand-navy-border:#404040;
  --color-brand-brown:#315B40;--color-brand-brown-hover:#254A32;--color-brand-brown-dark:#193322;--color-brand-brown-subtle:#E6EEE8;--color-brand-brown-border:#CAD8CE;
  --color-arch-accent-light:#BFD1C4;--color-arch-muted-on-navy:#DDDDDD;--color-arch-grid:rgba(0,0,0,.04);
  --color-text:#111111;--color-text-secondary:#414141;--color-text-muted:#6A6A6A;--color-text-subtle:#858585;--color-text-inverse:#FFFFFF;
  --color-border:#E1E1DE;--color-border-subtle:#ECECEA;--color-border-strong:#C9C9C5;--color-border-focus:#315B40;
  --color-success:#28613D;--color-success-subtle:#E6EEE8;--color-info:#315B40;--color-info-subtle:#E6EEE8;
  --color-warning:#8A5A12;--color-warning-subtle:#F7EBD3;
  --color-service-construction:#F2F2EF;--color-service-property:#E8EEE9;--color-service-solar:#F3F4F1;--color-service-retail:#EFF2EF;
  --premium-paper:#FFFFFF;--premium-forest:#111111;--premium-brown:#315B40;--premium-line:#E1E1DE;--premium-focus:#315B40;
  --shadow-sm:0 1px 2px rgba(0,0,0,.03),0 6px 18px -10px rgba(0,0,0,.08);
  --shadow-md:0 14px 34px -18px rgba(0,0,0,.14);
  --shadow-lg:0 26px 60px -26px rgba(0,0,0,.18);
  --shadow-xl:0 34px 80px -30px rgba(0,0,0,.2);
  --radius-sm:3px;--radius-md:4px;--radius-lg:6px;--radius-xl:8px;
  accent-color:#111111;
}
html body{background:#FFFFFF;color:#111111}
::selection{background:#D8E5DB;color:#111111}

/* ---- typography ---- */
html,body,.font-sans-main,.green-clarity{font-family:var(--font-sans)}
h1,h2,.beg-editorial-title,.beg-premium-heading,.arch-public-shell h1,.arch-public-shell h2{font-family:var(--font-sans)!important;font-weight:700!important;letter-spacing:-.045em!important;color:inherit}
.arch-public-shell h1{line-height:1.06!important;text-wrap:balance}
.arch-public-shell h2{line-height:1.12!important;text-wrap:balance}
h3,h4,h5,h6,.arch-public-shell h3,.arch-public-shell h4{font-family:var(--font-sans);letter-spacing:-.005em}
.arch-public-shell p{text-wrap:pretty}

/* ---- premium chrome replaces the old app header/footer on public pages ---- */
html.bec-has-chrome .arch-public-shell>.fresh-mobile-header,
html.bec-has-chrome .arch-public-shell>.fresh-desktop-header,
html.bec-has-chrome .arch-public-shell>.eco-footer,
html.bec-has-chrome .solar-studio .sol-mall-bar,
html.bec-has-chrome .solar-studio .sol-footer{display:none!important}
html.bec-has-chrome .arch-public-shell{min-height:0!important}
/* homepage-style sticky header + solar studio sub-nav sits under it */
html.bec-has-chrome .solar-studio .sol-header{top:var(--hdr-h,76px)!important}
html.bec-has-chrome .arch-public-shell .sticky.top-0:not(header){top:var(--hdr-h,76px)}

/* "No login needed" strip — quiet editorial note */
.arch-public-shell nav.guest-access{background:#F5F5F2!important;border:0!important;border-bottom:1px solid #E1E1DE!important;border-radius:0!important;box-shadow:none!important;margin:0!important;color:#6A6A6A;font-size:13px;letter-spacing:.01em}
.arch-public-shell nav.guest-access a{color:#111111!important;text-decoration-color:#315B40!important;text-underline-offset:4px}

/* ---- surfaces, cards, inputs ---- */
.arch-public-shell main{background:transparent}
.arch-public-shell .bg-white{background-color:#FFFFFF}
.arch-public-shell .shadow,.arch-public-shell .shadow-sm{box-shadow:var(--shadow-sm)!important}
.arch-public-shell .shadow-md,.arch-public-shell .shadow-lg{box-shadow:var(--shadow-md)!important}
.arch-public-shell .shadow-xl,.arch-public-shell .shadow-2xl{box-shadow:var(--shadow-lg)!important}
.arch-public-shell input:not([type=checkbox]):not([type=radio]):not([type=range]),.arch-public-shell select,.arch-public-shell textarea{background-color:#FFFFFF;border-color:#D1D1CD;color:#111111}
.arch-public-shell input:focus,.arch-public-shell select:focus,.arch-public-shell textarea:focus{border-color:#315B40!important;box-shadow:0 0 0 3px rgba(49,91,64,.14)!important;outline:0!important}
.arch-public-shell ::placeholder{color:#8A8F86}
.arch-public-shell :focus-visible{outline:2px solid #315B40;outline-offset:2px}

/* ---- buttons: forest pills with brass accents ---- */
.arch-public-shell :is(button,a)[class*="bg-[var(--color-primary)]"],
.arch-public-shell :is(button,a).bg-primary{border-radius:4px!important;letter-spacing:0}
.arch-public-shell :is(button,a)[class*="bg-[var(--color-accent-warm)]"]{color:#FFFFFF!important;border-radius:4px!important}

/* ---- dark bands become deep forest with warm ivory type ---- */
.arch-public-shell [class*="bg-[var(--color-brand-navy"],.arch-public-shell [class*="bg-[var(--color-primary)]"]:not(button):not(a){background-color:#111111}

/* ---- mobile app bar ---- */
.arch-public-shell nav.fixed.bottom-0{background:#111111!important;border-top:1px solid rgba(255,255,255,.2)!important}

/* ---- Property hub ---- */
.property-hub{--ph-green:#111111;--ph-brown:#315B40}

/* ---- Sani assistant launcher: warmer frame ---- */
#beSaniLauncher,#be-sani-root [class*="launcher"]{border-color:rgba(49,91,64,.55)!important}
#beSaniLauncher{width:58px!important;height:58px!important;padding:5px!important;justify-content:center!important;border-radius:4px!important;box-shadow:0 3px 12px rgba(0,0,0,.16)!important}
#beSaniLauncher>div:not(.be-sani-launcher-av){display:none!important}
#beSaniLauncher .be-sani-launcher-av{width:44px!important;height:44px!important}

/* sign-in / app screens: let the JPG logo sit on ivory without a white box */
html:not(.bec-has-chrome) .min-h-screen>header img[src*="logo"],html:not(.bec-has-chrome) a>img[src$="/logo.png"]{mix-blend-mode:multiply}

/* small quick-link chips under the services grid */
.arch-public-shell .simple-home a[href="/maintenance-amc"],.arch-public-shell .simple-home a[href="/workers"],.arch-public-shell .simple-home a[href="/equipment"]{background:transparent!important}

/* Property hub: intent chips scroll in one line on phones (was wrapping letter by letter) */
.property-hub .ph-intents{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;gap:8px}
.property-hub .ph-intents::-webkit-scrollbar{display:none}
.property-hub .ph-intents button{flex:0 0 auto!important;white-space:nowrap;border-radius:999px!important;min-height:40px;padding:8px 16px}
.property-hub .ph-primary{border-radius:999px!important}
