/* ============================================================
   AIWAS 2026 design system — WordPress pages, posts and archives
   Matches the static homepage at /home-static/index.html
   Loaded by mu-plugins/aiwas-design-2026.php
   ============================================================ */

:root{
  --ground:#060F1E; --surface:#0A1830; --navy:#0D1F3C;
  --cyan:#17C3E0; --cyan-deep:#00B4D8; --cyan-tint:#7FE9F7;
  --text:#EAF4F8; --muted:#A9C4D6; --muted-2:#93AEC4; --faint:#6E8CA6;
  --line:rgba(23,195,224,.16); --line-2:rgba(23,195,224,.28);
  --display:"Space Grotesk",system-ui,-apple-system,sans-serif;
  --body-font:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  --wrap:1280px; --prose:860px; --gut:clamp(16px,4vw,64px);
}

/* ---- kill the old Pagelayer chrome and theme sidebar ---- */
header.pagelayer-header,
footer.pagelayer-footer,
#masthead,
#secondary,
.widget-area{ display:none !important; }

html{ background:var(--ground); }
body.popularfx-body,
body{
  background:var(--ground) !important;
  color:var(--text);
  font-family:var(--body-font);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body *::selection{ background:var(--cyan); color:#05111F; }
img{ max-width:100%; height:auto; }
:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; border-radius:4px; }

/* ================= shared header ================= */
.aiwas-hd{position:sticky;top:0;z-index:9000;background:rgba(6,15,30,.9);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.aiwas-hd .in{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gut);
  display:flex;align-items:center;gap:16px;min-height:74px}
.aiwas-hd .brand{flex:1 0 auto;display:flex;align-items:center;gap:10px;color:var(--text);
  font-family:var(--display);font-size:21px;font-weight:700;letter-spacing:-.02em;text-decoration:none}
.aiwas-hd .brand:hover{color:var(--text)}
.aiwas-mark{width:26px;height:26px;border-radius:7px;flex-shrink:0;
  background:linear-gradient(135deg,var(--cyan),var(--cyan-deep));
  display:inline-flex;align-items:center;justify-content:center}
.aiwas-hd nav.links{flex-shrink:0;display:flex;align-items:center;gap:30px;font-size:14.5px;font-weight:500}
.aiwas-hd nav.links a{color:#C2D6E4;text-decoration:none}
.aiwas-hd nav.links a:hover,.aiwas-hd nav.links a[aria-current]{color:var(--cyan-tint)}
.aiwas-hd .acts{flex:1 0 auto;display:flex;align-items:center;justify-content:flex-end;gap:10px}
.aiwas-ico{width:40px;height:40px;border-radius:9px;border:1px solid rgba(23,195,224,.22);
  display:inline-flex;align-items:center;justify-content:center;color:#C2D6E4;flex-shrink:0}
.aiwas-ico:hover{color:var(--cyan-tint)}
.aiwas-burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;
  background:none;border:none;color:var(--text);cursor:pointer;padding:0}
.aiwas-mob{display:none;border-top:1px solid var(--line);background:var(--ground);padding:14px var(--gut) 24px}
.aiwas-mob.open{display:block}
.aiwas-mob a{display:block;padding:13px 0;color:#C2D6E4;font-size:16px;text-decoration:none;
  border-bottom:1px solid rgba(23,195,224,.09)}
@media (max-width:1080px){
  .aiwas-hd nav.links,.aiwas-hd .acts .btn{display:none}
  .aiwas-burger{display:inline-flex}
  .aiwas-hd .brand,.aiwas-hd .acts{flex:0 0 auto}
  .aiwas-hd .in{justify-content:space-between}
  .aiwas-hd .acts{margin-left:auto}
}

/* ================= buttons ================= */
.aiwas-scope .btn,.aiwas-hd .btn,.aiwas-ft .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 24px;border-radius:10px;font-size:15px;font-weight:600;
  font-family:var(--body-font);border:1px solid transparent;text-decoration:none;
  min-height:46px;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.btn-primary{background:#fff;color:var(--navy)}
.btn-primary:hover{background:#DFF6FC;color:var(--navy)}
.btn-secondary{background:var(--navy);border-color:rgba(23,195,224,.5);color:var(--text)}
.btn-secondary:hover{background:#12294B;color:var(--text)}
.aiwas-hd .acts .btn{padding:10px 18px;font-size:14.5px;min-height:42px;white-space:nowrap}

/* ================= page shell ================= */
#primary.site-main{
  max-width:var(--wrap);margin:0 auto;padding:clamp(34px,6vw,64px) var(--gut) clamp(48px,8vw,90px);
}
.entry-header{
  max-width:var(--prose);margin:0 auto clamp(24px,4vw,40px);
  padding-bottom:26px;border-bottom:1px solid var(--line);
}
/* the theme emits an empty .entry-header on pages — don't draw a stray rule for it */
.entry-header:empty{display:none;margin:0;padding:0;border:none}
h1.aiwas-page-title{
  font-family:var(--display);font-size:clamp(30px,5.4vw,52px);font-weight:700;
  letter-spacing:-.025em;line-height:1.08;color:#fff;
  margin:0 0 .6em;padding-bottom:26px;border-bottom:1px solid var(--line);
}
.entry-header .entry-title,
.entry-header h1{
  font-family:var(--display);font-size:clamp(30px,5.4vw,52px);font-weight:700;
  letter-spacing:-.025em;line-height:1.08;color:#fff;margin:0;
}
.entry-content{ max-width:var(--prose); margin:0 auto; }

/* ---- prose ---- */
.entry-content > *{ margin-block:0 1.15em; }
.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4{
  font-family:var(--display);color:#fff;letter-spacing:-.022em;line-height:1.15;
  margin-top:1.9em;margin-bottom:.5em;
}
.entry-content h2{font-size:clamp(24px,3.6vw,33px);font-weight:700}
.entry-content h3{font-size:clamp(19px,2.6vw,23px);font-weight:600;color:var(--cyan)}
.entry-content h4{font-size:18px;font-weight:600}
.entry-content h2:first-child,.entry-content h3:first-child{margin-top:0}
.entry-content p{color:var(--muted);font-size:17px;line-height:1.7}
.entry-content strong{color:var(--text);font-weight:600}
.entry-content em{color:var(--muted-2)}
.entry-content a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:rgba(23,195,224,.45)}
.entry-content a:hover{color:var(--cyan-tint);text-decoration-color:var(--cyan-tint)}
.entry-content ul,.entry-content ol{padding-left:1.35em;color:var(--muted)}
.entry-content li{margin-bottom:.5em;line-height:1.65}
.entry-content li::marker{color:var(--cyan)}
.entry-content blockquote{
  margin:1.6em 0;padding:18px 24px;border-left:3px solid var(--cyan);
  background:var(--surface);border-radius:0 12px 12px 0;color:var(--text)}
.entry-content blockquote p{color:var(--text)}
.entry-content hr{border:none;height:1px;background:var(--line);margin:2.4em 0}
.entry-content code{background:var(--surface);border:1px solid var(--line);
  padding:2px 6px;border-radius:5px;font-size:.9em;color:var(--cyan-tint)}
.entry-content pre{background:var(--surface);border:1px solid var(--line);
  padding:18px;border-radius:12px;overflow:auto}
.entry-content img{border-radius:14px}
.entry-content table{width:100%;border-collapse:collapse;font-size:15.5px}
.entry-content th,.entry-content td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left}
.entry-content th{color:#fff;font-weight:600;background:var(--surface)}
.entry-content td{color:var(--muted)}

/* ---- forms ---- */
input[type=text],input[type=email],input[type=url],input[type=tel],input[type=search],textarea,select{
  background:var(--surface);border:1px solid var(--line-2);color:var(--text);
  border-radius:10px;padding:12px 14px;font-family:var(--body-font);font-size:15.5px;width:100%;
  min-height:46px;box-sizing:border-box}
input::placeholder,textarea::placeholder{color:var(--faint)}
input:focus,textarea:focus,select:focus{border-color:var(--cyan);outline:none}
button[type=submit],input[type=submit]{
  background:#fff;color:var(--navy);border:none;border-radius:10px;padding:13px 26px;
  font-family:var(--body-font);font-size:15px;font-weight:600;cursor:pointer;min-height:46px}
button[type=submit]:hover,input[type=submit]:hover{background:#DFF6FC}
label{color:var(--muted-2);font-size:14.5px;font-weight:500}

/* ================= blog archive + posts ================= */
body.blog #primary.site-main,
body.archive #primary.site-main,
body.search #primary.site-main{max-width:var(--wrap)}
body.blog .site-main > article,
body.archive .site-main > article{
  background:var(--surface);border:1px solid var(--line);border-radius:18px;
  padding:clamp(22px,3vw,32px);margin-bottom:24px;max-width:none}
body.blog .site-main > article .entry-header,
body.archive .site-main > article .entry-header{
  max-width:none;margin:0 0 12px;padding-bottom:0;border-bottom:none}
body.blog .site-main > article .entry-title,
body.archive .site-main > article .entry-title{font-size:clamp(21px,3vw,27px)}
body.blog .site-main > article .entry-title a,
body.archive .site-main > article .entry-title a{color:#fff;text-decoration:none}
body.blog .site-main > article .entry-title a:hover,
body.archive .site-main > article .entry-title a:hover{color:var(--cyan)}
body.blog .site-main > article .entry-content,
body.archive .site-main > article .entry-content{max-width:none}
.entry-meta,.entry-footer,.posted-on,.byline,.cat-links,.tags-links{
  font-size:13.5px;color:var(--faint)}
.entry-meta a,.entry-footer a{color:var(--muted-2);text-decoration:none}
.entry-meta a:hover,.entry-footer a:hover{color:var(--cyan)}
.page-header .page-title{font-family:var(--display);color:#fff;font-size:clamp(28px,4.6vw,42px)}
.nav-links,.pagination,.post-navigation,.posts-navigation{margin-top:34px}
.nav-links a,.pagination a,.page-numbers{color:var(--cyan);text-decoration:none;
  border:1px solid var(--line-2);border-radius:9px;padding:9px 15px;display:inline-block;margin-right:8px}
.nav-links a:hover,.page-numbers:hover{background:rgba(23,195,224,.1)}
.page-numbers.current{background:var(--cyan);color:#05111F;border-color:var(--cyan)}

/* ================= footer ================= */
.aiwas-ft{border-top:1px solid var(--line);background:var(--ground);
  padding:clamp(46px,7vw,70px) 0 34px;margin-top:clamp(40px,6vw,70px)}
.aiwas-ft .in{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gut)}
.aiwas-ft .grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:clamp(26px,4vw,48px)}
@media (max-width:900px){.aiwas-ft .grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.aiwas-ft .grid{grid-template-columns:1fr}}
.aiwas-ft .col{display:flex;flex-direction:column;gap:11px;align-items:flex-start}
.aiwas-ft h4{font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:#fff;margin:0}
.aiwas-ft a{font-size:14px;color:var(--muted-2);text-decoration:none}
.aiwas-ft a:hover{color:var(--cyan-tint)}
.aiwas-ft .about{font-size:14px;color:#7E9AB2;line-height:1.6;max-width:290px;margin:0}
.aiwas-ft .xlink{display:inline-flex;align-items:center;gap:9px;margin-top:4px}
.aiwas-ft .xbox{width:34px;height:34px;border-radius:9px;border:1px solid rgba(23,195,224,.22);
  display:inline-flex;align-items:center;justify-content:center;color:var(--text)}
.aiwas-ft .bot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-top:clamp(26px,4vw,38px);padding-top:24px;border-top:1px solid var(--line);
  font-size:13.5px;color:var(--faint)}

/* ---- leave builder-composed sections alone inside content ---- */
.entry-content .pagelayer-row,
.entry-content [class*="pagelayer-"]{ color:inherit; }

/* heading injected into builder-composed pages that render none of their own */
h1.aiwas-h1-fallback{max-width:var(--wrap);margin:0 auto;padding:clamp(28px,5vw,48px) var(--gut) 0;border:none}

/* ============================================================
   Builder sections that still carry a light background.
   These were composed for a light page, so the background flip
   has to bring the text colours with it or the copy disappears.
   ============================================================ */
.p-pricrow2{background:var(--ground) !important}
.p-pricrow2 > .pagelayer-row-holder,
.p-pricrow2 .pagelayer-col{background:transparent !important}
/* section intro copy sitting directly on the band (not inside a card) */
.p-pricrow2 > .pagelayer-row-holder > .pagelayer-col > .pagelayer-heading-holder .pagelayer-heading,
.p-pricrow2 > .pagelayer-row-holder > .pagelayer-col > .pagelayer-text-holder,
.p-pricrow2 > .pagelayer-row-holder > .pagelayer-col > .pagelayer-text-holder p{color:var(--muted) !important}
.p-pricrow2 > .pagelayer-row-holder > .pagelayer-col > .pagelayer-heading-holder h1,
.p-pricrow2 > .pagelayer-row-holder > .pagelayer-col > .pagelayer-heading-holder h2,
.p-pricrow2 > .pagelayer-row-holder > .pagelayer-col > .pagelayer-heading-holder h3{color:#fff !important}

/* the blog/archive grid is floated; without this the footer wraps up beside it */
.aiwas-ft{clear:both}

/* heading present for assistive tech where the template already shows a visual title */
.aiwas-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* the theme reserves ~21% of the row for the sidebar we hide, leaving dead space
   on blog, archive and single-post templates — take the full width back */
.pagelayer-content{width:100% !important;max-width:100% !important;float:none !important}

/* the Single Template colours the post title with the navy global, which was chosen
   for a light page and is nearly invisible on the dark ground */
.pagelayer-content h1,
.pagelayer-post-title,
.pagelayer-post-title a{color:#fff !important}
.pagelayer-content h1{font-family:var(--display);letter-spacing:-.025em;line-height:1.08}