/* ============================================================
   B3X GRAPHICS — the plain WordPress pages (b3x-core assets/pages/pages.css)

   Loaded ONLY on the chrome pages (inc/shop.php b3x_pages_enqueue: the privacy page and
   /for-clients/), after fonts.css, chrome.css, shop/footer.css and shop/shop.css. Those already
   give these pages the global header + footer, the shell (room under the fixed header, no
   sideways pull, admin bar offset), the site fonts on everything inside .site-main (Palma Heavy
   headings, Aileron body) and the site button (shop.js turns the Elementor button inside
   .site-main into it). This file only sets the PAGE CONTENT's look:
     1. the canvas: the site's deep navy with a soft sky glow, instead of the old white page
     2. long-form text (the privacy policy): one glass panel, comfortable measure (about 70
        characters), Palma section headings, Aileron body, sky links with a visible hover and
        keyboard focus. Same type as the footer's policy pop-up, a little larger for a full page.
     3. /for-clients/: heading in Palma at the site's page-title size, lede in Aileron, the
        Elementor form as the contact page's glass card with site fields; Send is the site button
   Content and Elementor templates are untouched: CSS only.

   Scope: body.b3x-wp-page (+ --privacy / --for-clients), set by inc/shop.php. Rules carry one id's
   weight with :not(#b3x) (an id that never exists) to beat Elementor's per-element class chains
   (up to 0,5,1 here) without !important, as shop.css does.

   Colours (all measured, tools/pages-contrast.cjs, WCAG AA):
     body text #d6e2f5, headings #fff, links #04b5ff, link hover/focus #7fd8ff, focus ring #7fd8ff,
     form labels rgba(255,255,255,.82), field text #fff, placeholder rgba(255,255,255,.66),
     field edge rgba(255,255,255,.46) (3:1 boundary), field focus ring #04b5ff.
   ============================================================ */

/* ---------------------------------------------------------------- 1. canvas */
body.b3x-wp-page:not(#b3x){
  --b3x-wp-txt:#d6e2f5;--b3x-wp-link:#04b5ff;--b3x-wp-link-hi:#7fd8ff;
  background-color:#02132c;
  background-image:radial-gradient(110% 70% at 100% 0%,rgba(4,116,255,.30) 0%,rgba(4,116,255,0) 58%),
    radial-gradient(80% 60% at 0% 100%,rgba(4,181,255,.14) 0%,rgba(4,181,255,0) 62%);
  background-attachment:fixed;background-repeat:no-repeat;color:#eaf2ff;}
body.b3x-wp-page .site-main:not(#b3x){color:var(--b3x-wp-txt);}
/* Hello prints the page title h1 (hidden by the kit's --page-title-display) in .page-header: unchanged */

/* text links in the page content (never the site buttons) */
body.b3x-wp-page .site-main a:not(.elementor-button):not(.b3x-wbtn):not(#b3x),
body.b3x-wp-page .site-main a:not(.elementor-button):not(.b3x-wbtn):not(#b3x):visited{
  color:var(--b3x-wp-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;
  transition:color .2s ease,text-decoration-color .2s ease;}
body.b3x-wp-page .site-main a:not(.elementor-button):not(.b3x-wbtn):not(#b3x):is(:hover,:focus,:active){
  color:var(--b3x-wp-link-hi);text-decoration-thickness:2px;}
body.b3x-wp-page .site-main a:not(.elementor-button):not(.b3x-wbtn):not(#b3x):focus-visible{
  outline:2px solid var(--b3x-wp-link-hi);outline-offset:3px;border-radius:4px;}

/* ---------------------------------------------------------------- 2. long-form (privacy policy) */
.b3x-wp-page--privacy .site-main .elementor-top-section:not(#b3x){
  padding:clamp(24px,4.5vw,64px) 0 clamp(64px,8vw,120px);}
.b3x-wp-page--privacy .site-main .elementor-top-section > .elementor-container:not(#b3x){
  max-width:900px;padding-inline:var(--side,20px);box-sizing:content-box;}
.b3x-wp-page--privacy .site-main .elementor-top-section > .elementor-container > .elementor-column > .elementor-widget-wrap:not(#b3x){padding:0;}
/* the page title (the Elementor heading widget) */
.b3x-wp-page--privacy .site-main .elementor-widget-heading .elementor-heading-title:not(#b3x){
  margin:0;font-family:'Palma Heavy',sans-serif;font-weight:400;font-style:normal;
  font-size:clamp(40px,6vw,76px);line-height:1.06;letter-spacing:normal;text-transform:none;color:#fff;}
.b3x-wp-page--privacy .site-main .elementor-widget-heading:not(#b3x){margin-bottom:clamp(22px,3vw,36px);}
/* the text: one glass panel */
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor:not(#b3x){
  margin:0;padding:clamp(24px,4vw,52px);border-radius:24px;border:1px solid var(--line,rgba(255,255,255,.14));
  background:linear-gradient(155deg,rgba(12,34,68,.74) 0%,rgba(3,13,30,.82) 100%);
  box-shadow:0 18px 48px rgba(0,6,20,.34),inset 0 1px 0 rgba(255,255,255,.10);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  color:var(--b3x-wp-txt);font-family:'Aileron',sans-serif;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(p,li):not(#b3x){
  max-width:70ch;margin:0 0 1em;font-family:'Aileron',sans-serif;font-weight:400;font-style:normal;
  font-size:clamp(16px,1.15vw,17.5px);line-height:1.7;letter-spacing:normal;color:var(--b3x-wp-txt);
  overflow-wrap:anywhere;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(h2,h3,h4,h5,h6):not(#b3x){
  max-width:30ch;margin:1.7em 0 .55em;font-family:'Palma Heavy',sans-serif;font-weight:400;font-style:normal;
  font-size:clamp(22px,2.2vw,28px);line-height:1.2;letter-spacing:normal;text-transform:none;color:#fff;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(h3,h4,h5,h6):not(#b3x){font-size:clamp(19px,1.7vw,22px);}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor .elementor-widget-container > :first-child:not(#b3x){margin-top:0;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor .elementor-widget-container > :last-child:not(#b3x){margin-bottom:0;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(ul,ol):not(#b3x){max-width:70ch;margin:0 0 1em;padding-left:1.35em;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(ul):not(#b3x){list-style:disc;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(ol):not(#b3x){list-style:decimal;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor li:not(#b3x){margin:0 0 .45em;padding-left:.2em;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor li::marker{color:var(--b3x-wp-link);}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(strong,b):not(#b3x){font-family:'Aileron',sans-serif;font-weight:700;color:#fff;}
.b3x-wp-page--privacy .site-main .elementor-widget-text-editor :where(em,i):not(#b3x){font-family:'Aileron',sans-serif;}

/* ---------------------------------------------------------------- 3. /for-clients/ */
/* the page title: Palma at the site's page-title size (the about / contact h1), Elementor's capitals kept */
.b3x-wp-page--for-clients .site-main .elementor-widget-heading .elementor-heading-title:not(#b3x){
  font-family:'Palma Heavy',sans-serif;font-weight:400;font-style:normal;letter-spacing:normal;
  font-size:clamp(44px,7vw,104px);line-height:.98;color:#fff;overflow-wrap:break-word;}
/* the lede */
.b3x-wp-page--for-clients .site-main .elementor-widget-text-editor:not(#b3x){
  font-family:'Aileron',sans-serif;font-size:clamp(17px,1.5vw,22px);line-height:1.6;color:#fff;}
.b3x-wp-page--for-clients .site-main .elementor-widget-text-editor p:not(#b3x){margin:0;font-size:inherit;line-height:inherit;color:inherit;}
/* phones: Elementor's container keeps 50px sides; line the content up with the header's gutter instead */
@media (max-width:767px){
  .b3x-wp-page--for-clients .site-main .e-con.e-parent:not(#b3x){--padding-left:var(--side,20px);--padding-right:var(--side,20px);}
}

/* the sign-up form = the contact page's glass card + site fields */
body.b3x-wp-page .site-main .elementor-widget-form:not(#b3x){width:100%;max-width:640px;margin-top:clamp(18px,2.4vw,30px);}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-form:not(#b3x){
  padding:clamp(22px,3vw,40px);border-radius:24px;border:1px solid var(--line,rgba(255,255,255,.14));
  background:linear-gradient(155deg,rgba(12,34,68,.78) 0%,rgba(3,13,30,.86) 100%);
  box-shadow:0 18px 48px rgba(0,6,20,.34),inset 0 1px 0 rgba(255,255,255,.10);
  -webkit-backdrop-filter:blur(10px) saturate(1.3);backdrop-filter:blur(10px) saturate(1.3);}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-form-fields-wrapper:not(#b3x){margin:0;row-gap:0;}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-group:not(#b3x){margin:0 0 18px;padding:0;}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-group.e-form__buttons:not(#b3x){margin:6px 0 0;}
/* labels */
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-group > label:not(#b3x),
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-label:not(#b3x){
  display:block;margin:0;padding:0 0 8px;font-family:'Aileron',sans-serif;font-weight:700;font-style:normal;
  font-size:13px;line-height:1.3;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.82);}
/* fields */
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-group .elementor-field:not(.elementor-select-wrapper):not(#b3x),
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-group .elementor-select-wrapper select:not(#b3x){
  width:100%;min-height:50px;margin:0;padding:13px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.46);
  background-color:rgba(255,255,255,.05);color:#fff;font-family:'Aileron',sans-serif;font-weight:400;font-style:normal;
  font-size:16px;line-height:1.4;letter-spacing:normal;box-shadow:none;outline:2px solid transparent;outline-offset:2px;
  -webkit-appearance:none;appearance:none;transition:border-color .25s ease,background-color .25s ease,outline-color .2s ease;}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-group .elementor-field:not(.elementor-select-wrapper):not(#b3x):hover{
  border-color:rgba(255,255,255,.7);background-color:rgba(255,255,255,.08);}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-group .elementor-field:not(.elementor-select-wrapper):not(#b3x):focus{
  border-color:var(--sky,#04b5ff);background-color:rgba(4,181,255,.08);color:#fff;outline:2px solid var(--sky,#04b5ff);outline-offset:2px;}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field:not(#b3x)::placeholder{color:rgba(255,255,255,.66);opacity:1;}
/* the browser's autofill paints its own light fill: keep the text readable on it */
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field:not(#b3x):-webkit-autofill{
  -webkit-text-fill-color:#fff;-webkit-box-shadow:0 0 0 40px #0b2347 inset;caret-color:#fff;}
/* the note under the fields (an Elementor HTML field) */
body.b3x-wp-page .site-main .elementor-widget-form .elementor-field-type-html:not(#b3x){
  padding:0;margin:2px 0 20px;font-family:'Aileron',sans-serif;font-weight:400;font-size:15px;line-height:1.55;color:var(--b3x-wp-txt);}
/* Send: the site button (shop.js adds .b3x-wbtn .b3xr-gbtn + the arrow); Elementor's centring kept */
body.b3x-wp-page .site-main .elementor-widget-form .e-form__buttons .b3x-wbtn:not(#b3x){flex:0 0 auto;width:auto;min-width:160px;}
/* Elementor fills every svg shape inside a submit button (".elementor-button[type=submit] svg *{fill:
   primary navy}", white on hover). That would paint the draw-around line's rect solid over the label and
   fill the arrow, so: no fill, as everywhere else on the site */
body.b3x-wp-page .site-main .elementor-widget-form .b3x-wbtn:not(#b3x) svg *,
body.b3x-wp-page .site-main .elementor-widget-form .b3x-wbtn:not(#b3x):is(:hover,:focus,:active) svg *{fill:none;}
/* the label is the site button's own type (Safiro Bold), not the body font the content rules give spans */
body.b3x-wp-page .site-main .b3x-wbtn:not(#b3x) :is(.elementor-button-content-wrapper,.elementor-button-text){
  font-family:inherit;font-weight:inherit;font-size:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;}
/* Elementor's after-submit messages + the per-field error line */
body.b3x-wp-page .site-main .elementor-widget-form .elementor-message:not(#b3x){
  margin:14px 0 0;font-family:'Aileron',sans-serif;font-weight:700;font-size:15px;line-height:1.5;color:#eaf2ff;}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-message.elementor-message-success:not(#b3x){color:#6ee7a8;}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-message.elementor-message-danger:not(#b3x),
body.b3x-wp-page .site-main .elementor-widget-form .elementor-error .elementor-message:not(#b3x){color:#ffc2c2;}
body.b3x-wp-page .site-main .elementor-widget-form .elementor-error .elementor-field:not(#b3x){border-color:#ff8f8f;}

/* ---------------------------------------------------------------- 4. 404 + search (9 Oct)
   The two views the theme renders with no page behind them (inc/shop.php b3x_pages_system_view).
   They arrive here with the global header, footer, fonts and canvas already on, so this file only
   lays the content out: Hello's own markup, which is plain .page-header + .page-content, not
   Elementor widgets, so the selectors are shorter than the ones above.

   The Elementor kit hides every page title with --page-title-display:none. On these two views the
   title IS the content ("The page can't be found.", "Search results for: kit"), so it comes back. */

.b3x-wp-page--404:not(#b3x),
.b3x-wp-page--search:not(#b3x){--page-title-display:block;}

.b3x-wp-page--404 .site-main:not(#b3x),
.b3x-wp-page--search .site-main:not(#b3x){
  display:block;max-width:900px;margin:0 auto;box-sizing:content-box;
  padding:clamp(28px,5vw,72px) var(--side,20px) clamp(28px,4vw,56px);}

.b3x-wp-page--404 .site-main .page-header:not(#b3x),
.b3x-wp-page--search .site-main .page-header:not(#b3x){display:block;margin:0 0 clamp(16px,2.2vw,26px);padding:0;}
.b3x-wp-page--404 .site-main .entry-title:not(#b3x),
.b3x-wp-page--search .site-main .entry-title:not(#b3x){
  margin:0;font-family:'Palma Heavy',sans-serif;font-weight:400;font-style:normal;
  font-size:clamp(34px,5vw,64px);line-height:1.06;letter-spacing:normal;text-transform:none;color:#fff;
  overflow-wrap:break-word;}
.b3x-wp-page--search .site-main .entry-title span:not(#b3x){color:var(--b3x-wp-link);}

/* ---- 404: the theme's one line goes, inc/shop.php prints the block below instead */
.b3x-wp-page--404 .site-main .page-content:not(#b3x){display:none;}
.b3x-nf:not(#b3x){display:block;padding:0 0 clamp(64px,8vw,120px);}
.b3x-nf-in:not(#b3x){max-width:900px;margin:0 auto;padding-inline:var(--side,20px);box-sizing:content-box;}
.b3x-nf-p:not(#b3x){
  max-width:52ch;margin:0 0 clamp(22px,3vw,32px);font-family:'Aileron',sans-serif;font-weight:400;
  font-size:clamp(17px,1.5vw,22px);line-height:1.6;color:#eaf2ff;}
.b3x-nf-btns:not(#b3x){display:flex;flex-wrap:wrap;gap:14px;margin:0;}
/* the pill itself comes from shop/footer.css (.b3x-shop-page .b3x-wbtn), as on every other page */

/* ---- search: Hello prints the whole post body per result. One card each, title, picture, opening
   line. A product search (?s=...&post_type=product) never lands here: that is a shop request and
   keeps the WooCommerce grid. */
.b3x-wp-page--search .site-main .page-content:not(#b3x){display:block;padding:0 0 clamp(64px,8vw,120px);}
.b3x-wp-page--search .site-main article.post:not(#b3x){
  display:block;margin:0 0 18px;padding:clamp(18px,2.4vw,28px);border-radius:24px;
  border:1px solid var(--line,rgba(255,255,255,.14));
  background:linear-gradient(155deg,rgba(12,34,68,.74) 0%,rgba(3,13,30,.82) 100%);
  box-shadow:0 18px 48px rgba(0,6,20,.34),inset 0 1px 0 rgba(255,255,255,.10);}
.b3x-wp-page--search .site-main article.post .entry-title:not(#b3x){
  margin:0 0 12px;font-size:clamp(20px,2vw,26px);line-height:1.2;}
.b3x-wp-page--search .site-main article.post .entry-title a:not(#b3x),
.b3x-wp-page--search .site-main article.post .entry-title a:not(#b3x):visited{
  color:#fff;text-decoration:none;}
.b3x-wp-page--search .site-main article.post .entry-title a:not(#b3x):is(:hover,:focus){
  color:var(--b3x-wp-link-hi);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;}
.b3x-wp-page--search .site-main article.post img:not(#b3x){
  display:block;width:100%;max-width:220px;height:auto;margin:0 0 14px;border-radius:var(--b3x-r-img,16px);}
.b3x-wp-page--search .site-main article.post p:not(#b3x){
  max-width:70ch;margin:0;font-family:'Aileron',sans-serif;font-size:clamp(16px,1.15vw,17.5px);
  line-height:1.7;color:var(--b3x-wp-txt);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
/* one opening line is the point of a result: everything after the first paragraph stays out */
.b3x-wp-page--search .site-main article.post p ~ :where(p,ul,ol,blockquote,table,h2,h3,h4):not(#b3x){display:none;}