/* ============================================================
   ACTIVELAYER HOMEPAGE · v1 preview
   Each section below is a self-contained pattern (al-*) that
   ports to a WP block pattern independently. Flat selectors,
   no deep descendant chains.
   ============================================================ */

/* ---------- base ---------- */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--white); color:var(--ink-900);
  font-family:var(--font-sans); font-size:var(--text-body); line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img { max-width:100%; height:auto; }
a { color:var(--emerald-800); }
h1,h2,h3,h4 { margin:0; text-wrap:balance; }
p { margin:0; }
button { font-family:var(--font-sans); }
.icon { width:1em; height:1em; fill:currentColor; display:inline-block; vertical-align:-0.125em; flex:none; }
:focus-visible { outline:none; box-shadow:var(--focus-ring); border-radius:4px; }

.al-container { max-width:var(--container); margin:0 auto; padding:0 var(--gutter); }
@media (min-width:768px){ .al-container { padding:0 32px; } }

/* section header lockup */
.al-sechead { text-align:center; max-width:980px; margin:0 auto var(--sp-16); }
.al-eyebrow {
  font-family:var(--font-mono); font-size:12px; font-weight:600;
  letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  color:var(--ink-600); display:block; margin-bottom:var(--sp-4);
}
.al-h2 { font-size:var(--text-h2); font-weight:800; letter-spacing:var(--track-h2); line-height:1.12; }
.al-sub { font-size:var(--text-lead); color:var(--ink-600); margin-top:var(--sp-4); line-height:1.55; }

/* buttons */
.al-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-weight:600; cursor:pointer; text-decoration:none;
  border-radius:var(--r-control); border:2px solid transparent;
  transition:background var(--dur-base) var(--ease-out),
             border-color var(--dur-base) var(--ease-out),
             color var(--dur-base) var(--ease-out),
             box-shadow var(--dur-base) var(--ease-out),
             transform var(--dur-fast) var(--ease-out);
}
.al-btn:active { transform:translateY(1px); }
.al-btn .icon { transition:transform var(--dur-base) var(--ease-out); }
.al-btn:hover .icon { transform:translateX(3px); }
.al-btn--xl { font-size:17px; height:60px; padding:0 34px; }
.al-btn--lg { font-size:16px; height:52px; padding:0 26px; }
.al-btn--md { font-size:15px; height:44px; padding:0 20px; }
.al-btn--sm { font-size:14px; height:38px; padding:0 16px; }
.al-btn--xs { font-size:13.5px; height:34px; padding:0 14px; }
.al-btn--primary { background:var(--yellow-500); color:var(--ink-900); border-color:transparent; box-shadow:var(--shadow-1); font-weight:700; }
.al-btn--navy { background:var(--ink-900); color:var(--white); border-color:transparent; font-weight:600; }
.al-btn--navy:hover { background:transparent; border-color:var(--ink-900); color:var(--ink-900); }
.al-btn--primary:hover { background:transparent; border-color:var(--yellow-500); box-shadow:none; }
.al-btn--on-dark { border-color:transparent; box-shadow:none; }
.al-btn--secondary { background:var(--white); color:var(--ink-900); border-color:var(--ink-200); }
.al-btn--secondary:hover { border-color:var(--ink-900); }

/* chips */
.al-chip {
  display:inline-flex; align-items:center; gap:6px;
  font-size:13px; font-weight:700; border-radius:var(--r-pill); padding:4px 12px;
}
.al-chip .icon { width:12px; height:12px; }
.al-chip--safe { background:var(--safe-bg); color:var(--safe-text); }
.al-chip--spam { background:var(--spam-bg); color:var(--spam-text); }
.al-latency {
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--font-mono); font-size:12.5px; font-weight:600;
  color:var(--yellow-900); background:var(--yellow-100);
  border-radius:var(--r-pill); padding:5px 13px;
}
.al-latency i { width:7px; height:7px; border-radius:50%; background:var(--yellow-600); }
@keyframes al-pulse { 0%,100%{opacity:1} 50%{opacity:.35} }
.al-latency i { animation:al-pulse 2s var(--ease-inout) infinite; }

/* scroll reveal */
.al-reveal { opacity:0; transform:translateY(12px); transition:opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out); }
.al-reveal.is-in { opacity:1; transform:none; }

/* browser frame — shared mockup chrome */
.al-browser { border-radius:var(--r-media); overflow:hidden; border:1px solid var(--ink-100); box-shadow:var(--shadow-2); background:var(--white); }
.al-browser__bar { display:flex; align-items:center; gap:6px; background:var(--ink-50); border-bottom:1px solid var(--ink-100); padding:10px 14px; }
.al-browser__bar i { width:9px; height:9px; border-radius:50%; background:var(--ink-200); }
.al-browser__url {
  flex:1; margin-left:10px; background:var(--white); border:1px solid var(--ink-100);
  border-radius:6px; font-family:var(--font-mono); font-size:11px; color:var(--ink-500); padding:4px 10px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* ============================================================
   PATTERN 01 · NAV
   ============================================================ */
.al-nav {
  position:fixed; top:0; left:0; right:0; z-index:50; background:transparent;
  transition:background var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.al-nav.is-scrolled { background:rgba(255,255,255,.92); backdrop-filter:blur(12px); box-shadow:0 1px 0 var(--ink-100); }
.al-nav__row { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:var(--sp-4); height:72px; }
@media (min-width:960px){ .al-nav__row { grid-template-columns:1fr auto 1fr; } }
.al-nav__logo { justify-self:start; }
.al-nav__logo img { height:34px; width:auto; display:block; }
.al-nav__links { display:none; align-items:center; gap:var(--sp-6); list-style:none; padding:0; margin:0; }
.al-nav__links a { font-size:15px; font-weight:600; color:var(--ink-600); text-decoration:none; transition:color var(--dur-base) var(--ease-out); }
.al-nav__links a:hover { color:var(--ink-900); }
.al-nav__right { display:flex; align-items:center; gap:var(--sp-6); justify-self:end; grid-column:3; }
.al-nav__login { display:none; font-size:15px; font-weight:600; color:var(--ink-600); text-decoration:none; }
.al-nav__login:hover { color:var(--ink-900); }
@media (min-width:960px){
  .al-nav__links { display:flex; }
  .al-nav__login { display:inline; }
}

/* ============================================================
   PATTERN 02 · HERO
   ============================================================ */
.al-hero {
  padding:calc(var(--sp-12) + 72px) 0 var(--sp-8); text-align:center; position:relative; overflow:hidden;
  background:
    radial-gradient(ellipse 75% 115% at 0% 0%, rgba(203,215,236,.4) 0%, rgba(203,215,236,0) 58%),
    linear-gradient(180deg, #EEF1F7 0%, #EDF0F6 45%, #FBFBFC 88%, var(--white) 100%);
}
.al-hero::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:url("../img/noisy-texture-100x100.webp"); background-repeat:repeat;
  background-size:180px 180px; image-rendering:pixelated; opacity:.6;
  -webkit-mask-image:linear-gradient(180deg,#000 80%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 80%,transparent 100%);
}
@media (min-width:768px){ .al-hero { padding-top:calc(56px + 72px); } }
/* soft light shafts, top-aligned with the header frame */
.al-hero__rays { position:absolute; inset:0; pointer-events:none; }
.al-hero__ray {
  position:absolute; top:0; display:block; border-radius:999px;
  background:linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.5) 50%, rgba(255,255,255,0) 100%);
  filter:blur(40px); transform-origin:50% 0;
}
.al-hero__ray--left  { left:calc(50% - 460px); top:-120px; width:clamp(140px,18vw,280px); height:135%; transform:rotate(-45deg); }
.al-hero__ray--right { right:max(1%, calc((100% - 1200px)/2 + 112px)); top:-120px; width:clamp(120px,16vw,240px); height:120%; transform:rotate(-45deg); opacity:.85; }
.al-hero__ray--logo  { left:max(-260px, calc((100% - 1200px)/2 - 335px)); top:-120px; width:clamp(120px,16vw,240px); height:90%; transform:rotate(-45deg); opacity:.85; }
.al-hero > .al-container { display:flex; flex-direction:column; position:relative; z-index:1; }
.al-hero__reviews {
  display:grid; grid-template-columns:1fr; gap:var(--sp-4);
  max-width:1020px; margin:var(--sp-12) auto var(--sp-6); width:100%; order:7;
}
@media (min-width:820px){
  .al-hero__reviews { grid-template-columns:repeat(3,1fr); margin:var(--sp-8) auto 88px; order:0; }
}
.al-review-card {
  background:transparent; border:none; box-shadow:none; padding:0 12px; text-align:center;
  display:flex; flex-direction:column; gap:8px; align-items:center;
}
.al-review-card__stars { color:var(--yellow-500); display:flex; gap:2px; }
.al-review-card__stars .icon { width:17px; height:17px; }
.al-review-card blockquote { margin:0; font-size:15px; font-weight:700; color:var(--ink-900); line-height:1.5; }
.al-review-card footer { font-size:13px; color:var(--ink-500); margin-top:auto; }
.al-review-card footer b { color:var(--ink-700); font-weight:600; }
.al-hero__h1 { font-size:var(--text-display); font-weight:800; letter-spacing:var(--track-display); line-height:1.06; max-width:960px; margin:0 auto; }
.al-hero__sub { font-size:var(--text-lead); color:var(--ink-600); line-height:1.55; max-width:900px; margin:var(--sp-6) auto 0; }
.al-hero__ctas { display:flex; flex-wrap:wrap; justify-content:center; gap:var(--sp-4); margin-top:var(--sp-8); }
.al-hero__meta { display:flex; flex-wrap:wrap; justify-content:center; gap:var(--sp-2) var(--sp-6); margin-top:var(--sp-6); padding:0; list-style:none; }
.al-hero__meta li { font-size:var(--text-small); color:var(--ink-600); display:flex; align-items:center; gap:7px; }
.al-hero__meta .icon { color:var(--emerald-700); width:15px; height:15px; }

/* ============================================================
   PATTERN 03 · DEMO TABS (video-only under tabs)
   ============================================================ */
.al-demo { background:var(--white); padding:var(--sp-8) 0 var(--sp-24); }
.al-demo__head { text-align:center; max-width:var(--prose); margin:0 auto var(--sp-8); }
.al-tabs { display:flex; justify-content:safe center; overflow-x:auto; padding-bottom:2px; }
.al-tabs__track { display:inline-flex; flex:none; gap:4px; background:var(--ink-50); border:1px solid var(--ink-100); border-radius:var(--r-pill); padding:4px; }
.al-tab {
  font-size:14.5px; font-weight:600; color:var(--ink-600);
  padding:9px 20px; border-radius:var(--r-pill); border:none; background:transparent; cursor:pointer;
  transition:background var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out);
}
.al-tab:hover { color:var(--ink-900); }
.al-tab[aria-selected="true"] { background:var(--white); color:var(--emerald-800); box-shadow:var(--shadow-1); }
.al-demo__caption { text-align:center; font-size:18px; font-weight:600; color:var(--ink-600); margin:var(--sp-6) 0; }
.al-demo__stage { position:relative; max-width:1100px; margin:0 auto; }
.al-demo__panel { display:none; }
.al-demo__panel.is-active { display:block; animation:al-fadein var(--dur-base) var(--ease-out); }
@keyframes al-fadein { from{opacity:0} to{opacity:1} }
.al-demo__panel .al-browser { box-shadow:var(--shadow-3), var(--glow-yellow); }
.al-demo__video { display:block; width:100%; height:auto; }

/* demo mockup internals (stand-ins until video production) */
.al-mock {
  padding:clamp(20px,4vw,48px); min-height:clamp(380px,38vw,560px);
  display:flex; flex-direction:column; justify-content:center;
}
.al-mock__head { display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--sp-4); gap:var(--sp-4); flex-wrap:wrap; }
.al-mock__title { font-size:15px; font-weight:700; }
.al-mock__row {
  display:flex; justify-content:space-between; align-items:center; gap:var(--sp-4);
  padding:12px 0; border-bottom:1px solid var(--ink-50); font-size:14px;
  opacity:0; transform:translateY(6px);
}
.al-mock__row span em { font-style:normal; color:var(--ink-500); }
.al-mock.is-anim .al-mock__row { animation:al-rowin .5s var(--ease-out) forwards; }
.al-mock.is-anim .al-mock__row:nth-child(2){animation-delay:.15s}
.al-mock.is-anim .al-mock__row:nth-child(3){animation-delay:.65s}
.al-mock.is-anim .al-mock__row:nth-child(4){animation-delay:1.15s}
.al-mock.is-anim .al-mock__row:nth-child(5){animation-delay:1.65s}
.al-mock.is-anim .al-mock__row:nth-child(6){animation-delay:2.15s}
@keyframes al-rowin { to{opacity:1; transform:none} }
.al-mock__toggle { width:40px; height:22px; border-radius:var(--r-pill); background:var(--ink-200); position:relative; transition:background .3s var(--ease-out); flex:none; }
.al-mock__toggle::after { content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:var(--white); transition:transform .3s var(--ease-out); }
.al-mock.is-anim .al-mock__toggle { background:var(--emerald-600); }
.al-mock.is-anim .al-mock__toggle::after { transform:translateX(18px); }
.al-code { background:#0E1F1A; color:#C9E5DA; border-radius:var(--r-control); padding:18px 20px; font-family:var(--font-mono); font-size:13px; line-height:1.75; overflow-x:auto; margin:0; }
.al-code .c{color:#6E8F82} .al-code .g{color:#6EE7B7} .al-code .y{color:#F8CF52} .al-code .b{color:#7FB2F0}
.al-mock--dev { display:grid; gap:var(--sp-6); align-content:center; }
@media (min-width:820px){ .al-mock--dev { grid-template-columns:1.3fr 1fr; align-items:start; } }
.al-mock__verdict { border:1px solid var(--ink-100); border-radius:var(--r-control); padding:var(--sp-4); font-family:var(--font-mono); font-size:13px; display:grid; gap:10px; opacity:0; }
.al-mock.is-anim .al-mock__verdict { animation:al-rowin .5s var(--ease-out) .9s forwards; }
.al-mock__verdict dt { color:var(--ink-500); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.al-mock__verdict dd { margin:2px 0 0; font-weight:600; }
.al-mock__bar { height:6px; border-radius:3px; background:var(--ink-50); overflow:hidden; }
.al-mock__bar i { display:block; height:100%; width:0; border-radius:3px; background:var(--spam); }
.al-mock.is-anim .al-mock__bar i { transition:width 1.2s var(--ease-out) .9s; width:98%; }

/* ============================================================
   PATTERN 04 · LOGO TRUST BAR
   ============================================================ */
.al-logos { padding:var(--sp-16) 0; }
.al-logos__line { text-align:center; font-size:20px; color:var(--ink-600); max-width:860px; margin:0 auto var(--sp-8); }
.al-logos__line b { font-family:var(--font-mono); font-weight:600; color:var(--emerald-800); }
.al-logos__row { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:var(--sp-8) var(--sp-12); }
.al-logos__row img {
  height:26px; width:auto; opacity:0;
  filter:grayscale(1) brightness(.55) blur(12px);
  transition:filter .9s var(--ease-out), opacity .9s var(--ease-out);
}
.al-reveal.is-in .al-logos__row img { opacity:.55; filter:grayscale(1) brightness(.55) blur(0); }
.al-logos__row img:nth-child(2){transition-delay:.08s} .al-logos__row img:nth-child(3){transition-delay:.16s}
.al-logos__row img:nth-child(4){transition-delay:.24s} .al-logos__row img:nth-child(5){transition-delay:.32s}
.al-logos__row img:nth-child(6){transition-delay:.4s}
.al-reveal.is-in .al-logos__row img:hover { filter:grayscale(0) brightness(1) blur(0); opacity:1; transition-delay:0s; }

/* ============================================================
   PATTERN 05 · FEATURES (icon-left rows, no cards)
   ============================================================ */
.al-features { padding:var(--sp-24) 0; }
.al-features__grid { display:grid; gap:var(--sp-12) var(--sp-12); }
@media (min-width:680px){ .al-features__grid { grid-template-columns:1fr 1fr; } }
@media (min-width:1020px){ .al-features__grid { grid-template-columns:1fr 1fr 1fr; column-gap:var(--sp-12); row-gap:56px; } }
.al-feature { display:flex; gap:var(--sp-4); align-items:flex-start; }
.al-feature__icon {
  flex:none; display:flex; align-items:flex-start; justify-content:center;
  color:var(--emerald-600); padding-top:2px;
}
.al-feature__icon .icon { width:26px; height:26px; }
.al-feature h4 { font-size:17px; font-weight:700; margin-bottom:4px; }
.al-feature p { font-size:var(--text-small); color:var(--ink-600); line-height:1.55; }

/* ============================================================
   PATTERN 06 · WHY TRUST (alternating rows)
   ============================================================ */
.al-trust { padding:var(--sp-24) 0; background:var(--bg-warm); }
.al-trust__row { display:grid; gap:var(--sp-8); align-items:center; }
.al-trust__row + .al-trust__row { margin-top:var(--sp-24); }
@media (min-width:880px){
  .al-trust__row { grid-template-columns:1fr 1.15fr; gap:var(--sp-16); }
  .al-trust__row--flip .al-trust__copy { order:2; }
  .al-trust__row--flip .al-trust__visual { order:1; }
}
.al-trust__copy h3 { font-size:var(--text-h3); font-weight:700; letter-spacing:-0.01em; line-height:1.25; margin-bottom:var(--sp-4); }
.al-trust__copy p { color:var(--ink-600); }
.al-trust__visual {
  background:var(--white); border:none; border-radius:var(--r-card);
  box-shadow:var(--shadow-1); width:100%; max-width:480px; aspect-ratio:1.08/1;
  margin:0 auto; padding:18px; position:relative; overflow:hidden;
}

/* ---- scene language: masked photo + floating UI ---- */
.al-scene { position:relative; width:100%; height:100%; }
.al-scene__photo { position:absolute; object-fit:cover; border-radius:14px; }
.al-pill {
  position:absolute; background:var(--white); border-radius:10px;
  box-shadow:var(--shadow-2); padding:10px 14px; z-index:2;
}
.al-pill__title { display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:700; }
.al-pill__title .icon { width:13px; height:13px; color:var(--emerald-600); }
.al-pill__sub { font-family:var(--font-mono); font-size:11px; color:var(--ink-500); margin-top:3px; }
.al-pill--chip { border-radius:var(--r-pill); padding:7px 14px; }
.al-scene__label {
  position:absolute; z-index:2; font-family:var(--font-mono); font-size:10.5px; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--ink-500);
  background:rgba(255,255,255,.9); border-radius:6px; padding:4px 9px; backdrop-filter:blur(4px);
}
.al-minicard {
  position:absolute; background:var(--white); border-radius:12px; box-shadow:var(--shadow-2);
  padding:14px 16px; z-index:2; font-size:12.5px;
}
.al-minicard h6 { margin:0 0 8px; font-size:12px; font-weight:700; }
.al-minirow { display:flex; align-items:center; gap:8px; margin-top:6px; }
.al-minirow .who { flex:none; width:76px; font-weight:600; font-size:11.5px; }
.al-minirow .track { flex:1; height:5px; border-radius:3px; background:var(--ink-50); overflow:hidden; }
.al-minirow .track i { display:block; height:100%; border-radius:3px; }
.al-minirow em { font-style:normal; font-family:var(--font-mono); font-size:10.5px; color:var(--ink-500); flex:none; width:56px; text-align:right; }
/* transparency inspector */
.al-inspect {
  position:absolute; inset:auto 26px 26px 26px; top:64px; background:var(--white);
  border-radius:14px; box-shadow:var(--shadow-2); padding:20px 22px; z-index:1;
  font-family:var(--font-mono); font-size:13px;
}
.al-inspect__head { display:flex; justify-content:space-between; align-items:center; font-family:var(--font-sans); font-weight:700; font-size:13.5px; margin-bottom:12px; }
.al-inspect__kv { display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--ink-50); }
.al-inspect__kv:last-child { border-bottom:none; }
.al-inspect__kv b { font-weight:600; }
.al-inspect__meter { display:flex; align-items:center; gap:10px; flex:1; margin-left:18px; }
.al-inspect__meter .track { flex:1; height:6px; border-radius:3px; background:var(--ink-50); overflow:hidden; }
.al-inspect__meter .track i { display:block; height:100%; width:98%; background:var(--spam); border-radius:3px; }
.al-scene__grid {
  position:absolute; inset:0; border-radius:14px;
  background-image:radial-gradient(var(--ink-100) 1px, transparent 1px);
  background-size:22px 22px; opacity:.5;
}
/* status timeline (fallbacks) */
.al-status { display:grid; gap:0; }
.al-status__row { display:flex; align-items:center; gap:10px; padding:7px 0; font-size:12px; }
.al-status__row i { flex:none; width:9px; height:9px; border-radius:50%; }
.al-status__row.ok i { background:var(--emerald-500); }
.al-status__row.warn i { background:var(--yellow-600); }
.al-status__row b { font-family:var(--font-mono); font-weight:600; font-size:11.5px; color:var(--ink-600); }
/* platform chips (one product) */
.al-scene__chips { position:absolute; z-index:2; display:flex; flex-wrap:wrap; gap:8px; }
.al-scene__chips span {
  font-family:var(--font-mono); font-size:11px; font-weight:600;
  background:var(--white); box-shadow:var(--shadow-2); border-radius:7px; padding:6px 11px; color:var(--ink-700);
}
.al-trust__cta { margin-top:var(--sp-6); align-self:flex-start; border-radius:6px; }
.al-vmock { font-size:13px; }
.al-vmock__label { font-family:var(--font-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-500); margin-bottom:12px; }
.al-vmock__row { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.al-vmock__row span:first-child { flex:none; width:96px; font-weight:600; font-size:12.5px; }
.al-vmock__row .al-mock__bar { flex:1; }
.al-vmock__row em { font-style:normal; font-family:var(--font-mono); font-size:12px; color:var(--ink-500); flex:none; width:66px; text-align:right; }
.al-vmock__bar-al i { width:4%; background:var(--yellow-500); }
.al-vmock__bar-slow1 i { width:62%; background:var(--ink-200); }
.al-vmock__bar-slow2 i { width:88%; background:var(--ink-200); }
.al-vmock__field { height:34px; border:1px solid var(--ink-100); border-radius:var(--r-control); background:var(--white); margin-bottom:10px; }
.al-vmock__captcha { border:1px dashed var(--spam); color:var(--spam-text); border-radius:var(--r-control); font-size:12px; padding:9px 12px; display:flex; align-items:center; gap:8px; background:var(--spam-bg); }
.al-vmock__grid2 { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); align-items:start; }
.al-vmock__card { background:var(--white); border:1px solid var(--ink-100); border-radius:var(--r-control); padding:14px; }
.al-vmock__card h5 { margin:0 0 8px; font-size:12px; font-weight:700; }
.al-vmock__kv { display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:12px; padding:5px 0; border-bottom:1px solid var(--ink-50); }
.al-vmock__kv:last-child { border-bottom:none; }
.al-vmock__kv b { font-weight:600; }
.al-vmock__chips { display:flex; flex-wrap:wrap; gap:8px; }
.al-vmock__chips span { font-family:var(--font-mono); font-size:11.5px; font-weight:600; background:var(--white); border:1px solid var(--yellow-300); color:var(--yellow-900); border-radius:6px; padding:4px 10px; }

/* ============================================================
   PATTERN 07 · VOICES (testimonials + wp.org strip)
   ============================================================ */
.al-voices { padding:var(--sp-24) 0; background:var(--white); }
.al-voices__grid { display:grid; gap:var(--sp-4); }
@media (min-width:880px){ .al-voices__grid { grid-template-columns:1.5fr 1fr; } }
.al-quote { background:var(--white); border:1px solid var(--ink-100); border-radius:var(--r-card); padding:var(--sp-8); box-shadow:var(--shadow-1); display:flex; flex-direction:column; gap:var(--sp-6); }
.al-quote blockquote { margin:0; font-size:16px; font-weight:500; line-height:1.6; }
.al-quote--featured blockquote { font-size:clamp(18px,2vw,22px); line-height:1.55; }
.al-quote__who { display:flex; align-items:center; gap:12px; margin-top:auto; }
.al-quote__avatar { width:44px; height:44px; border-radius:50%; background:var(--yellow-500); color:var(--ink-900); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; flex:none; }
.al-quote__who b { display:block; font-size:14.5px; }
.al-quote__who span { font-size:13px; color:var(--ink-500); }
.al-voices__stack { display:grid; gap:var(--sp-4); }
.al-voices__stack .al-quote { padding:var(--sp-6); }
.al-voices__stack blockquote { font-size:14.5px; }

.al-wporg { margin-top:var(--sp-12); }
.al-wporg__lockup { display:flex; justify-content:center; align-items:center; gap:10px; margin-bottom:var(--sp-6); text-decoration:none; color:var(--ink-900); }
.al-wporg__stars { color:var(--yellow-500); display:flex; gap:2px; }
.al-wporg__stars .icon { width:18px; height:18px; }
.al-wporg__lockup b { font-family:var(--font-mono); font-weight:600; font-size:15px; }
.al-wporg__lockup span { font-size:14px; color:var(--ink-600); }
.al-wporg__row { display:grid; gap:var(--sp-4); }
@media (min-width:880px){ .al-wporg__row { grid-template-columns:1fr 1fr 1fr; } }
.al-review { background:var(--white); border:1px solid var(--ink-100); border-radius:var(--r-media); padding:var(--sp-4) var(--sp-6); font-size:13.5px; color:var(--ink-600); }
.al-review__stars { color:var(--yellow-500); display:flex; gap:1px; margin-bottom:8px; }
.al-review__stars .icon { width:12px; height:12px; }
.al-review p { line-height:1.55; }
.al-review footer { margin-top:10px; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-500); }

/* ============================================================
   PATTERN 08 · FAQ
   ============================================================ */
.al-faq { padding:var(--sp-24) 0; }
.al-faq__list { max-width:780px; margin:0 auto; }
.al-faq__contact { display:inline-flex; align-items:center; gap:8px; margin-top:var(--sp-4); font-weight:600; font-size:15px; text-decoration:none; }
.al-faq__item { border-bottom:1px solid var(--ink-100); }
.al-faq__q {
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:var(--sp-4);
  background:none; border:none; text-align:left; cursor:pointer;
  font-size:17px; font-weight:600; color:var(--ink-900); padding:20px 4px;
}
.al-faq__q .icon { width:16px; height:16px; color:var(--emerald-800); }
.al-faq__ic-minus { display:none; }
.al-faq__item.is-open .al-faq__ic-plus { display:none; }
.al-faq__item.is-open .al-faq__ic-minus { display:inline-block; }
.al-faq__a { overflow:hidden; max-height:0; transition:max-height var(--dur-slow) var(--ease-out); }
.al-faq__a p { padding:0 4px 20px; color:var(--ink-600); font-size:15.5px; max-width:60ch; }

/* ============================================================
   PATTERN 09 · FINAL CTA
   ============================================================ */
.al-cta {
  background:var(--emerald-950);
  background-image:linear-gradient(rgba(248,199,62,.05) 1px, transparent 1px);
  background-size:100% 8px;
  padding:var(--sp-32) 0; text-align:center; position:relative; overflow:hidden;
}
.al-cta__flow { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.al-cta > .al-container { position:relative; z-index:1; }
@media (prefers-reduced-motion: reduce){ .al-cta__flow { display:none; } }
.al-cta__h2 { font-size:clamp(2.25rem,4vw,3.5rem); font-weight:800; letter-spacing:var(--track-h2); line-height:1.12; color:var(--white); max-width:820px; margin:0 auto; }
.al-cta__sub { font-size:var(--text-lead); color:rgba(255,255,255,.75); max-width:720px; margin:var(--sp-4) auto var(--sp-8); line-height:1.55; }
.al-cta__meta { display:flex; flex-wrap:wrap; justify-content:center; gap:var(--sp-2) var(--sp-6); margin-top:var(--sp-6); padding:0; list-style:none; }
.al-cta__meta li { font-size:var(--text-small); color:rgba(255,255,255,.65); display:flex; align-items:center; gap:7px; }
.al-cta__meta .icon { color:var(--emerald-400); width:15px; height:15px; }

/* ============================================================
   PATTERN 10 · FOOTER (white)
   ============================================================ */
.al-footer { background:var(--white); border-top:1px solid var(--ink-100); padding:var(--sp-16) 0 var(--sp-8); }
.al-footer__grid { display:grid; gap:var(--sp-8); }
@media (min-width:880px){ .al-footer__grid { grid-template-columns:1.4fr 1fr 1fr 1fr; gap:var(--sp-12); } }
.al-footer__brand img { height:32px; width:auto; margin-bottom:var(--sp-4); }
.al-footer__brand p { font-size:14px; color:var(--ink-500); max-width:280px; line-height:1.6; }
.al-footer__social { display:flex; gap:var(--sp-4); margin-top:var(--sp-6); }
.al-footer__social a { color:var(--ink-500); transition:color var(--dur-base) var(--ease-out); }
.al-footer__social a:hover { color:var(--emerald-800); }
.al-footer__social .icon { width:20px; height:20px; }
.al-footer__col h5 {
  margin:0 0 var(--sp-4); font-family:var(--font-mono); font-size:11px; font-weight:600;
  letter-spacing:var(--track-eyebrow); text-transform:uppercase; color:var(--ink-900);
}
.al-footer__col ul { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.al-footer__col a { font-size:14.5px; color:var(--ink-600); text-decoration:none; transition:color var(--dur-base) var(--ease-out); }
.al-footer__col a:hover { color:var(--ink-900); }
.al-footer__legal { display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--sp-4); border-top:1px solid var(--ink-50); margin-top:var(--sp-12); padding-top:var(--sp-6); font-size:14px; color:var(--ink-500); }
.al-footer__legal a { color:var(--ink-500); text-decoration:none; margin-left:var(--sp-4); }
.al-footer__legal a:hover { color:var(--ink-900); }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .al-reveal { opacity:1; transform:none; }
  .al-mock__row, .al-mock__verdict { opacity:1 !important; transform:none !important; }
  .al-mock .al-mock__bar i { width:98%; }
}
