/* =====================================================================
   VannaWebsite-2 theme for the inner pages.
   Loaded after the version 1 styles: white pages, black and Vanna-blue
   blocks, sharp corners, and illustrations recolored for white.
   ===================================================================== */

/* --- sharp corners everywhere on the page content --- */
#page-main *,#page-main *::before,#page-main *::after{border-radius:0 !important;}
#page-main .avatar{border-radius:50% !important;}

/* --- page heroes: white, below the menu --- */
.app-view > .pe-hero:first-child{margin-top:0 !important;padding-top:clamp(3rem,6vw,5rem) !important;}
.pe-hero{background:var(--bg) !important;color:var(--ink) !important;}
.pe-hero::before{display:none !important;}
.pe-hero h1{color:var(--ink);}
.pe-hero .pe-eyebrow{color:var(--blue) !important;}
.pe-hero .pe-dek{color:var(--muted) !important;}
.pe-facts{border-top:1px solid var(--ink) !important;}
.pe-facts div{border-left-color:var(--rule) !important;}
.pe-facts div:nth-child(n+3){border-top-color:var(--rule) !important;}
.pe-facts dt{color:var(--ink) !important;}
.pe-facts dd{color:var(--muted) !important;}
.pp-jump a{color:var(--ink) !important;border-color:var(--rule-strong) !important;}
.pp-jump a:hover{color:var(--blue) !important;border-color:var(--blue) !important;}
.ins-hero .filter-chip{background:transparent !important;color:var(--ink) !important;border-color:var(--rule-strong) !important;}
.ins-hero .filter-chip:hover{border-color:var(--blue) !important;color:var(--blue) !important;}
.ins-hero .filter-chip.active{background:var(--btn) !important;border-color:var(--btn) !important;color:var(--btn-text) !important;}
.pp-tile{box-shadow:0 0 0 1px var(--rule) !important;}

/* --- buttons --- */
#page-main .btn{border-radius:0 !important;}
.btn-gold{background:var(--btn) !important;border:1px solid var(--btn) !important;color:var(--btn-text) !important;}
.btn-gold:hover{background:var(--btn-hover) !important;border-color:var(--btn-hover) !important;color:#fff !important;}
.btn-ghost,.btn-line{background:transparent !important;color:var(--ink) !important;border:1px solid var(--rule-strong) !important;}
.btn-ghost:hover,.btn-line:hover{background:var(--btn) !important;border-color:var(--btn) !important;color:var(--btn-text) !important;}
/* on black blocks */
.pe-ai .btn-gold,.pp-why .btn-gold,.or-qr .btn-gold,.os-why .btn-gold,.cl-band .btn-gold,.model-feature .btn-gold,.dm-report .btn-gold,.story-dark .btn-gold{background:var(--deep-btn) !important;border-color:var(--deep-btn) !important;color:var(--deep-btn-text) !important;}
.pe-ai .btn-gold:hover,.pp-why .btn-gold:hover,.or-qr .btn-gold:hover,.os-why .btn-gold:hover,.model-feature .btn-gold:hover{background:transparent !important;border-color:#fff !important;color:#fff !important;}
.model-feature .btn-ghost,.model-feature .btn-line,.pe-ai .btn-line,.or-qr .btn-line{color:#fff !important;border-color:rgba(255,255,255,.45) !important;}

/* --- black blocks: crisp white text --- */
.pe-ai,.pp-why,.or-qr,.os-why,.cl-band,.model-feature,.dm-report,.story-dark,.pe-close{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;}
.pe-ai,.pp-why,.or-qr,.cl-band{background:var(--deep) !important;}
.cl-band::before,.or-qr::before{display:none !important;}
.or-free{border-color:rgba(255,255,255,.35) !important;background:rgba(255,255,255,.04) !important;}
.story-tag,.model-for{color:var(--blue) !important;}
.story-dark .story-tag,.model-feature .model-for,.os-why .model-for{color:#8CC4F2 !important;}
.story-dark .text-link.on-dark,.story-dark .story-link{color:#8CC4F2 !important;}

/* --- closing band on every page: Vanna blue --- */
.pe-close{background:#1B75BC !important;color:#fff !important;}
.pe-close::before{display:none !important;}
.pe-close h2{color:#fff !important;}
.pe-close .pp-close-sub{color:rgba(255,255,255,.88) !important;}
.pe-close .btn-gold{background:#fff !important;border-color:#fff !important;color:#0E3F66 !important;}
.pe-close .btn-gold:hover{background:transparent !important;color:#fff !important;}
.pe-close .btn-line,.pe-close .btn-ghost{background:transparent !important;color:#fff !important;border-color:rgba(255,255,255,.6) !important;}
.pe-close .btn-line:hover{background:#fff !important;color:#0E3F66 !important;}
:root[data-theme="dark"] .pe-close{background:#123E63 !important;}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .pe-close{background:#123E63 !important;} }

/* --- small accents that used orange in version 1 --- */
.pe-get strong,.am-list li::before,.ab-kicker,.ab-princ li::before,.ct-info h3,.pe-wk,.pe-kind,.pp-kind,.or-sub{color:var(--blue) !important;}
.pe-trig li,.or-groups article{border-top-color:var(--blue) !important;}
.pe-ic{background:var(--icon) !important;} .pe-ic svg{stroke:#fff !important;}
.ct-steps li::before,.dm-steps li::before,.ostart li::before{background:var(--icon) !important;color:#fff !important;}
.or-pack li::before{background:#1B75BC !important;color:#fff !important;}
.ab-do strong::after{color:var(--blue) !important;}
.os-list li::before,.pp-points li::before{border-color:var(--blue) !important;}
.dm-link:hover,.ab-do a:hover{border-color:var(--blue) !important;}
.text-link{color:var(--blue);}
.back-link{color:var(--muted) !important;}

/* --- articles and light pages --- */
.article-hero img{display:block;width:100%;height:auto;}
.thumb img{display:block;width:100%;height:100%;object-fit:cover;}
.view-hero .eyebrow-line .tick{background:var(--ink) !important;}
.eyebrow-line{color:var(--blue) !important;}

/* --- hero illustrations recolored for white (light mode only) --- */
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [fill="#EEF2FA"]{fill:var(--ink) !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) g[fill="#EEF2FA"]{fill:var(--ink) !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [fill="#A3AECB"]{fill:var(--muted) !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) g[fill="#A3AECB"]{fill:var(--muted) !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [stroke^="rgba(238,242,250"]{stroke:rgba(20,20,20,.28) !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [fill^="rgba(238,242,250"]{fill:rgba(20,20,20,.06) !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [fill="#0F1B3D"]{fill:#FFFFFF !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [fill="#0A1330"]{fill:#FFFFFF !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [stroke="#EEF2FA"]{stroke:var(--ink) !important;}
:root[data-theme="light"] .pe-hero-visual svg:not(.pp-tile svg) [stroke="rgba(163,174,203,.35)"]{stroke:rgba(20,20,20,.25) !important;}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [fill="#EEF2FA"]{fill:var(--ink) !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) g[fill="#EEF2FA"]{fill:var(--ink) !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [fill="#A3AECB"]{fill:var(--muted) !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) g[fill="#A3AECB"]{fill:var(--muted) !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [stroke^="rgba(238,242,250"]{stroke:rgba(20,20,20,.28) !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [fill^="rgba(238,242,250"]{fill:rgba(20,20,20,.06) !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [fill="#0F1B3D"]{fill:#FFFFFF !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [fill="#0A1330"]{fill:#FFFFFF !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [stroke="#EEF2FA"]{stroke:var(--ink) !important;}
  :root:not([data-theme="dark"]) .pe-hero-visual svg:not(.pp-tile svg) [stroke="rgba(163,174,203,.35)"]{stroke:rgba(20,20,20,.25) !important;}
}

/* --- headings on black blocks stay white in light mode too --- */
.pe-ai :is(h1,h2,h3),.pp-why :is(h1,h2,h3),.or-qr :is(h1,h2,h3),.os-why :is(h2,h3),.cl-band :is(h2,h3),
.model-feature :is(h2,h3),.story-dark :is(h2,h3),.dm-report figcaption span,.pe-close :is(h2,h3){color:#fff !important;}
.pe-ai-list strong,.os-why strong,.cl-caps strong,.cl-tiles strong,.or-pack h3,.or-free strong{color:#fff !important;}
/* --- closing band: Mist blue with burnt orange buttons --- */
html body .pe-close{background:var(--surface) !important;color:var(--text) !important;border-top:1px solid var(--rule);}
html body .pe-close h2{color:var(--ink) !important;}
html body .pe-close .pp-close-sub,html body .pe-close p{color:var(--muted) !important;}
html body .pe-close .btn-gold,html body .pe-close .btn-primary{background:var(--btn) !important;border-color:var(--btn) !important;color:var(--btn-text) !important;}
html body .pe-close .btn-gold:hover,html body .pe-close .btn-primary:hover{background:var(--btn-hover) !important;border-color:var(--btn-hover) !important;color:#fff !important;}
html body .pe-close .btn-line,html body .pe-close .btn-ghost{background:transparent !important;color:var(--ink) !important;border-color:var(--rule-strong) !important;}
html body .pe-close .btn-line:hover,html body .pe-close .btn-ghost:hover{background:var(--btn) !important;border-color:var(--btn) !important;color:#fff !important;}
:root[data-theme="dark"] body .pe-close{background:var(--surface) !important;}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) body .pe-close{background:var(--surface) !important;} }
.pe-parent{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;}
.pe-parent:hover{color:var(--accent-text);}
/* Contact: ways to start */
.ct-ways-sub{color:var(--muted);font-size:.92rem;margin:.35rem 0 .9rem;}
.ct-ways ul{list-style:none;margin:0;padding:0;}
.ct-ways li a{display:flex;justify-content:space-between;gap:1rem;padding:.65rem 0;border-top:1px solid var(--rule);text-decoration:none;}
.ct-ways li strong{color:var(--ink);font-weight:600;font-size:.95rem;}
.ct-ways li span{color:var(--muted);font-size:.88rem;white-space:nowrap;}
.ct-ways li a:hover strong{color:var(--accent-text);}
/* Product engineering: single proof story full width */
.pe-proof-grid:has(> :only-child){grid-template-columns:1fr !important;}
