:root {
  --pf-paper: #f4efe5;
  --pf-paper-2: #fffaf0;
  --pf-ink: #171310;
  --pf-orange: #d65a16;
  --pf-orange-dark: #9f3907;
  --pf-nav-orange: #dc874d;
  --pf-yellow: #f2c94c;
  --pf-line: rgba(23, 19, 16, .24);
  --pf-shadow: 14px 14px 0 var(--pf-ink);
}

html { scroll-behavior: smooth; }
body.products-page,
body.product-page {
  margin: 0;
  background: var(--pf-paper) !important;
  color: var(--pf-ink) !important;
  font-family: "Manrope", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.products-page *, body.product-page * { box-sizing: border-box; }
body.products-page a, body.product-page a { color: inherit; text-decoration: none; }

/* Shared navigation */
.pf-nav,
body.product-page .site-nav {
  position: sticky !important;
  inset: 0 0 auto !important;
  z-index: 100 !important;
  height: 72px !important;
  background: var(--pf-nav-orange) !important;
  border-bottom: 2px solid var(--pf-ink) !important;
  backdrop-filter: blur(14px);
}
.pf-nav-inner,
body.product-page .site-nav .container {
  width: min(1180px, calc(100% - 44px)) !important;
  height: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.pf-brand,
body.product-page .nav-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--pf-ink) !important;
  font: 600 .96rem "Montserrat Medium", sans-serif !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}
.pf-brand strong,
body.product-page .nav-brand b { color: var(--pf-paper-2) !important; font-weight: 700 !important; }
.pf-brand-mark {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  background: var(--pf-ink);
  color: var(--pf-yellow);
  clip-path: polygon(50% 0, 62% 24%, 88% 17%, 78% 55%, 50% 100%, 22% 55%, 12% 17%, 38% 24%);
}
.pf-nav-links,
body.product-page .nav-links { display: flex !important; align-items: center !important; gap: 30px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.pf-nav-links a,
body.product-page .nav-links > li > a,
body.product-page .nav-dropdown-toggle,
body.product-page .nav-tools-link {
  color: var(--pf-ink) !important;
  font: 700 .78rem "Space Grotesk", sans-serif !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
.pf-nav-links > li > a:hover,
body.product-page .nav-links > li > a:hover { color: var(--pf-paper-2) !important; }
.pf-nav .nav-dropdown,
body.product-page .nav-dropdown { position: relative !important; }
.pf-nav .nav-dropdown-menu,
body.product-page .nav-dropdown-menu {
  position: absolute !important;
  top: calc(100% + 20px) !important;
  right: 0 !important;
  width: 330px !important;
  padding: 8px !important;
  background: var(--pf-ink) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: 8px 8px 0 var(--pf-orange) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(8px) !important;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
  z-index: 200 !important;
}
.pf-nav .nav-dropdown-menu::before,
body.product-page .nav-dropdown-menu::before { content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 22px; }
.pf-nav .nav-dropdown:hover .nav-dropdown-menu,
.pf-nav .nav-dropdown:focus-within .nav-dropdown-menu,
body.product-page .nav-dropdown:hover .nav-dropdown-menu,
body.product-page .nav-dropdown:focus-within .nav-dropdown-menu,
body.product-page .nav-dropdown.open .nav-dropdown-menu { opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; }
.pf-nav .nav-dropdown-menu a,
body.product-page .nav-dropdown-menu a { display: flex !important; align-items: flex-start !important; flex-direction: column !important; gap: 3px !important; padding: 12px 16px !important; color: var(--pf-paper-2) !important; border-radius: 0 !important; }
body.product-page .nav-dropdown-menu a { align-items: center !important; flex-direction: row !important; gap: 12px !important; }
.pf-nav .nav-dropdown-menu small { color: rgba(255,255,255,.55); font: 500 .7rem "Manrope", sans-serif; letter-spacing: 0; text-transform: none; }
.pf-nav .nav-dropdown-menu a:hover,
body.product-page .nav-dropdown-menu a:hover { color: var(--pf-yellow) !important; background: rgba(255,255,255,.08) !important; }
body.product-page .tool-info-desc { color: rgba(255,255,255,.55) !important; }

/* Products homepage */
.pf-hero {
  min-height: calc(100svh - 72px);
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  overflow: hidden;
  border-bottom: 2px solid var(--pf-ink);
  background: var(--pf-paper-2);
}
.pf-hero-copy {
  min-height: calc(100svh - 72px);
  padding: clamp(24px, 2.5vw, 34px) clamp(38px, 6.5vw, 104px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 2;
  background: var(--pf-paper-2);
}
.pf-hero-art {
  min-height: calc(100svh - 72px);
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  background: var(--pf-paper-2);
}
.pf-hero-disc {
  position: absolute;
  z-index: 0;
  width: min(78%, 560px);
  aspect-ratio: 1;
  left: 48%;
  top: 42%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: var(--pf-yellow);
}
.pf-hero-fox {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: clamp(18px, 2.8vw, 44px);
  object-fit: contain;
  transform: scale(1.08);
  filter: drop-shadow(0 18px 20px rgba(23,19,16,.14));
}
.pf-hero-index {
  position: absolute;
  z-index: 3;
  top: 28px;
  right: 24px;
  writing-mode: vertical-rl;
  color: var(--pf-ink);
  font: 700 .68rem "JetBrains Mono", monospace;
  letter-spacing: .18em;
}
.pf-hero-copy::after {
  content: "PF / HOME";
  position: absolute;
  right: 28px;
  bottom: 24px;
  color: rgba(23,19,16,.38);
  font: 700 .68rem "JetBrains Mono", monospace;
  letter-spacing: .18em;
}
.pf-kicker {
  margin: 0 0 14px;
  color: var(--pf-orange);
  font: 700 .75rem "Space Grotesk", sans-serif;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.pf-hero-logo-frame {
  width: min(100%, 560px);
  height: clamp(240px, 22vw, 270px);
  margin: 0;
  position: relative;
  overflow: hidden;
  align-self: flex-start;
}
.pf-hero-logo {
  position: absolute;
  top: -45px;
  left: 50%;
  width: min(100%, 470px);
  max-width: none;
  height: auto;
  margin: 0;
  clip-path: inset(0 0 28% 0);
  transform: translateX(-50%);
}
.pf-hero-wordmark {
  margin: -2px 0 0;
  color: var(--pf-ink);
  font: 700 clamp(1.05rem, 1.8vw, 1.55rem) "Space Grotesk", sans-serif;
  letter-spacing: .25em;
  line-height: 1;
  text-transform: uppercase;
}
.pf-hero-wordmark span { color: var(--pf-orange); }
.pf-hero h1 {
  max-width: 720px;
  margin: 12px 0 0;
  color: var(--pf-ink);
  font: 650 clamp(2.8rem, 5vw, 5.5rem)/.84 "Space Grotesk", sans-serif;
  letter-spacing: -.075em;
}
.pf-hero h1 em { color: var(--pf-yellow); font-style: normal; }
.pf-hero-copy > p:last-of-type {
  max-width: 520px;
  margin: 28px 0 0;
  color: var(--pf-paper-2);
  background: var(--pf-orange);
  padding: 14px 16px;
  font-size: clamp(.92rem, 1.15vw, 1.08rem);
  line-height: 1.55;
}
.pf-hero-link {
  align-self: flex-start;
  margin-top: 28px;
  padding: 13px 0 8px;
  border-bottom: 3px solid var(--pf-ink);
  font: 700 .86rem "Space Grotesk", sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pf-hero-link span { display: inline-block; transition: transform .2s ease; }
.pf-hero-link:hover span { transform: translateX(7px); }
.pf-product-rail {
  min-height: calc(100svh - 72px);
  padding: clamp(38px, 5vw, 72px) clamp(28px, 5vw, 76px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background: var(--pf-ink);
  color: var(--pf-paper-2);
}
.pf-product-rail::before {
  content: "03";
  position: absolute;
  top: -70px;
  right: -20px;
  color: rgba(255,250,240,.05);
  font: 750 22rem/.8 "Space Grotesk", sans-serif;
  letter-spacing: -.1em;
  pointer-events: none;
}
.pf-rail-header {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 18px;
  color: var(--pf-yellow);
  font: 700 .7rem "JetBrains Mono", monospace;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.pf-rail-note { color: rgba(255,250,240,.55); }
.pf-product-list { position: relative; z-index: 1; border-top: 2px solid var(--pf-paper-2); }
.pf-product-choice {
  min-height: 150px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid rgba(255,250,240,.3);
  color: var(--pf-paper-2);
  transition: background .25s ease, color .25s ease, padding .25s ease;
}
.pf-product-choice::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 7px;
  background: var(--choice-accent);
  transform: scaleY(.22);
  transform-origin: center;
  transition: transform .25s ease;
}
.pf-product-choice .pf-choice-index {
  align-self: start;
  padding-top: 22px;
  color: var(--choice-accent);
  font: 700 .7rem "JetBrains Mono", monospace;
  letter-spacing: .1em;
}
.pf-choice-copy { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 8px; }
.pf-choice-copy strong { font: 650 clamp(1.8rem, 3.8vw, 4rem)/.83 "Space Grotesk", sans-serif; letter-spacing: -.07em; }
.pf-choice-copy small { color: rgba(255,250,240,.6); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; }
.pf-choice-arrow { position: relative; z-index: 2; align-self: start; padding-top: 20px; color: var(--choice-accent); font: 1.35rem "Space Grotesk", sans-serif; transition: transform .25s ease; }
.pf-product-choice img { position: absolute; z-index: 0; right: -3%; top: 50%; width: 46%; height: 150%; object-fit: cover; object-position: left center; opacity: .12; filter: grayscale(1) contrast(1.1); transform: translateY(-50%) rotate(-3deg) scale(1.05); transition: opacity .3s ease, transform .3s ease, filter .3s ease; }
.choice-eb { --choice-accent: var(--pf-yellow); }
.choice-de { --choice-accent: #d995ff; }
.choice-ae { --choice-accent: #72cd9c; }
.pf-product-choice:hover,
.pf-product-choice:focus-visible { padding-left: 12px; background: var(--choice-accent); color: var(--pf-ink); outline: none; }
.pf-product-choice:hover::before,
.pf-product-choice:focus-visible::before { transform: scaleY(1); background: var(--pf-ink); }
.pf-product-choice:hover .pf-choice-index,
.pf-product-choice:hover .pf-choice-arrow,
.pf-product-choice:focus-visible .pf-choice-index,
.pf-product-choice:focus-visible .pf-choice-arrow { color: var(--pf-ink); }
.pf-product-choice:hover .pf-choice-copy small,
.pf-product-choice:focus-visible .pf-choice-copy small { color: rgba(23,19,16,.65); }
.pf-product-choice:hover img,
.pf-product-choice:focus-visible img { opacity: .24; filter: grayscale(.2) contrast(1.05); transform: translateY(-50%) rotate(0) scale(1.1); }
.pf-product-choice:hover .pf-choice-arrow,
.pf-product-choice:focus-visible .pf-choice-arrow { transform: translate(4px, -4px); }
.pf-rail-footer { position: relative; z-index: 1; margin: 20px 0 0; color: rgba(255,250,240,.5); font: 600 .68rem "JetBrains Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }

.pf-manifesto {
  padding: 28px 4vw;
  display: flex;
  justify-content: space-between;
  gap: 30px;
  background: var(--pf-yellow);
  border-bottom: 2px solid var(--pf-ink);
  color: var(--pf-ink);
  font: 700 clamp(.76rem, 1.1vw, .95rem) "Space Grotesk", sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.pf-manifesto span::before { content: "✦"; margin-right: 18px; color: var(--pf-orange-dark); }
.pf-products-label { padding: clamp(85px,10vw,150px) 5vw 70px; position: relative; overflow: hidden; background: var(--pf-ink); color: var(--pf-paper-2); }
.pf-products-label::after { content: "THREE PRODUCTS / ONE LESS THING TO WAIT FOR"; position: absolute; right: 5vw; bottom: 74px; width: 250px; color: rgba(255,250,240,.55); font: 600 .66rem/1.8 "JetBrains Mono",monospace; letter-spacing: .12em; text-align: right; }
.pf-products-label p { margin: 0 0 14px; color: var(--pf-orange); font: 700 .72rem "Space Grotesk", sans-serif; letter-spacing: .18em; text-transform: uppercase; }
.pf-products-label h2 { margin: 0; font: 650 clamp(3rem, 7vw, 7rem)/.88 "Space Grotesk", sans-serif; letter-spacing: -.065em; }
.pf-products-label h2 span { color: var(--pf-orange); }

.pf-product {
  min-height: 700px;
  display: grid;
  grid-template-columns: minmax(300px, .82fr) minmax(440px, 1.18fr);
  border-top: 2px solid var(--pf-ink);
  overflow: hidden;
  position: relative;
}
.pf-product::before { content: attr(data-mark); position: absolute; z-index: 0; top: -.17em; left: -.03em; color: currentColor; opacity: .055; font: 750 clamp(12rem,22vw,26rem)/1 "Space Grotesk",sans-serif; letter-spacing: -.1em; pointer-events: none; }
.pf-product:nth-of-type(even)::before { left: auto; right: -.03em; }
.pf-product:nth-of-type(even) { grid-template-columns: minmax(440px, 1.18fr) minmax(300px, .82fr); }
.pf-product:nth-of-type(even) .pf-product-copy { order: 2; }
.pf-product.theme-dark { background: var(--pf-ink); color: var(--pf-paper-2); }
.pf-product.theme-paper { background: var(--pf-paper-2); color: var(--pf-ink); }
.pf-product.theme-yellow { background: var(--pf-yellow); color: var(--pf-ink); }
.pf-product.theme-orange { background: var(--pf-orange); color: var(--pf-ink); }
.pf-product-copy { padding: clamp(60px, 8vw, 120px) clamp(30px, 6vw, 90px); display: flex; flex-direction: column; justify-content: center; position: relative; z-index: 1; }
.pf-product-number { margin-bottom: auto; font: 700 .78rem "JetBrains Mono", monospace; letter-spacing: .15em; }
.pf-product h3 { margin: 80px 0 25px; font: 650 clamp(3.2rem, 6.7vw, 7.2rem)/.86 "Space Grotesk", sans-serif; letter-spacing: -.07em; }
.theme-dark .pf-product h3 { color: var(--pf-yellow); }
.pf-product-copy p { max-width: 550px; margin: 0; font-size: 1rem; line-height: 1.75; }
.pf-meta { margin-top: 24px !important; opacity: .65; font: 600 .72rem "JetBrains Mono", monospace !important; text-transform: uppercase; }
.pf-product-link { align-self: flex-start; margin-top: 38px; border-bottom: 3px solid currentColor; padding-bottom: 8px; font: 700 .82rem "Space Grotesk", sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.pf-product-link span { display: inline-block; margin-left: 8px; transition: transform .2s ease; }
.pf-product-link:hover span { transform: translateX(8px); }
.pf-product-visual { min-height: 620px; padding: clamp(28px, 5vw, 72px); display: grid; place-items: center; position: relative; z-index: 1; }
.pf-product-visual::before { content: "SOURCE  /  RECORD  /  RESULT"; position: absolute; top: 25px; left: clamp(28px,5vw,72px); color: currentColor; opacity: .5; font: 650 .62rem "JetBrains Mono",monospace; letter-spacing: .14em; }
.pf-product-visual img { width: min(100%, 880px); max-height: 580px; object-fit: contain; display: block; border: 2px solid var(--pf-ink); box-shadow: var(--pf-shadow); background: #111; transition: transform .35s ease, box-shadow .35s ease; }
.pf-product .pf-product-visual img { transform: rotate(-1.1deg); }
.pf-product:nth-of-type(even) .pf-product-visual img { transform: rotate(1.1deg); }
.pf-product:hover .pf-product-visual img { transform: translate(-4px, -4px) rotate(0); box-shadow: 20px 20px 0 var(--pf-ink); }
.theme-dark .pf-product-visual img { border-color: var(--pf-paper-2); box-shadow: 14px 14px 0 var(--pf-orange); }

.pf-final {
  padding: clamp(90px, 13vw, 180px) 5vw;
  text-align: center;
  background: var(--pf-paper-2);
  border-top: 2px solid var(--pf-ink);
}
.pf-final h2 { max-width: 950px; margin: 0 auto; font: 650 clamp(3.2rem, 7vw, 7.4rem)/.9 "Space Grotesk", sans-serif; letter-spacing: -.065em; }
.pf-final h2 span { color: var(--pf-orange); }
.pf-final a { margin-top: 40px; }
.pf-footer, body.product-page .site-footer, body.product-aebridge > footer { padding: 28px 5vw !important; background: var(--pf-ink) !important; color: var(--pf-paper-2) !important; border: 0 !important; font-size: .75rem !important; }

/* Product detail pages */
body.product-page .hero,
body.product-aebridge .hero {
  position: relative !important;
  overflow: hidden !important;
  padding: clamp(80px, 10vw, 138px) 0 clamp(90px, 11vw, 150px) !important;
  background: var(--pf-paper-2) !important;
  border-bottom: 2px solid var(--pf-ink) !important;
  text-align: left !important;
}
body.product-page .hero::after {
  content: "";
  position: absolute;
  width: clamp(360px, 38vw, 520px);
  aspect-ratio: 1;
  right: -260px;
  top: 125px;
  border-radius: 50%;
  background: var(--pf-yellow);
  opacity: .62;
  pointer-events: none;
}
body.product-page .hero .container,
body.product-aebridge .hero-inner { width: min(1120px, calc(100% - 44px)) !important; margin: 0 auto !important; padding: 0 24px !important; box-sizing: border-box !important; position: relative; z-index: 1; }
body.product-page .hero h1,
body.product-aebridge .hero h1 {
  max-width: 1000px !important;
  margin: 24px 0 !important;
  color: var(--pf-ink) !important;
  font: 650 clamp(4rem, 10vw, 9.5rem)/.83 "Space Grotesk", sans-serif !important;
  letter-spacing: -.075em !important;
  text-align: left !important;
}
body.product-page .hero h1 .accent,
body.product-page .hero-statement .accent,
body.product-aebridge .hero h1 span,
body.product-aebridge .hero-statement span { color: var(--pf-orange) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }
body.product-page .hero-product-name,
body.product-aebridge .eyebrow { margin: 0 0 18px !important; color: var(--pf-orange) !important; font: 700 .76rem "Space Grotesk", sans-serif !important; letter-spacing: .17em !important; text-transform: uppercase !important; text-align: left !important; }
body.product-page .hero-statement,
body.product-aebridge .hero-statement { margin: 0 0 22px !important; color: var(--pf-ink) !important; font: 650 clamp(1.65rem, 3.5vw, 3.2rem)/1 "Space Grotesk", sans-serif !important; letter-spacing: -.04em !important; text-align: left !important; }
body.product-page .hero-sub,
body.product-aebridge .lead { max-width: 720px !important; margin: 24px 0 !important; color: rgba(23,19,16,.76) !important; font-size: 1.03rem !important; line-height: 1.75 !important; text-align: left !important; }
body.product-page .version-req,
body.product-aebridge .version-req { max-width: 760px !important; margin: 18px 0 !important; color: rgba(23,19,16,.68) !important; font: 600 .74rem/1.65 "JetBrains Mono", monospace !important; text-align: left !important; }
body.product-page .hero-badge,
body.product-aebridge .badge { display: inline-flex !important; margin: 10px 0 30px !important; padding: 9px 13px !important; background: var(--pf-ink) !important; border: 0 !important; border-radius: 0 !important; color: var(--pf-yellow) !important; font: 700 .68rem "JetBrains Mono", monospace !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
body.product-page .hero-badge .dot,
body.product-aebridge .badge i { background: var(--pf-orange) !important; }
body.product-page .hero-cta { text-align: center !important; }
body.product-page .hero-cta { margin: -6px 0 48px !important; }

body.product-page .pain-points { max-width: 900px !important; margin: 45px 0 10px !important; display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 0 !important; border-top: 2px solid var(--pf-ink) !important; }
body.product-page .pain-point { padding: 18px 12px 18px 0 !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--pf-line) !important; border-radius: 0 !important; color: var(--pf-ink) !important; }
body.product-page .x-mark { color: var(--pf-orange) !important; }
body.product-aebridge .pain-points { border-top: 0 !important; }

body.product-page .panel-showcase,
body.product-aebridge .panel-showcase { width: min(1060px, calc(100% - 44px)) !important; margin: clamp(65px, 9vw, 120px) auto 0 !important; padding: 0 !important; }
body.product-page .panel-frame,
body.product-aebridge .panel-frame { overflow: hidden !important; background: #101010 !important; border: 2px solid var(--pf-ink) !important; border-radius: 0 !important; box-shadow: 14px 14px 0 var(--pf-orange) !important; }
body.product-page .panel-frame img,
body.product-aebridge .panel-frame img { display: block; }
.slideshow-arrow {
  position: absolute;
  top: 50%;
  z-index: 4;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,250,240,.58);
  border-radius: 50%;
  background: rgba(23,19,16,.78);
  color: var(--pf-paper-2);
  font: 400 1.45rem/1 "Space Grotesk", sans-serif;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.slide-arrow-prev { left: 14px; }
.slide-arrow-next { right: 14px; }
.slideshow-arrow:hover,
.slideshow-arrow:focus-visible {
  border-color: var(--pf-yellow);
  background: var(--pf-yellow);
  color: var(--pf-ink);
  outline: none;
  transform: translateY(-50%) scale(1.06);
}
body.product-page .slide-label,
body.product-aebridge .showcase-label { color: var(--pf-ink) !important; font: 700 .72rem "JetBrains Mono", monospace !important; text-transform: uppercase !important; }
body.product-page .slide-dot { background: rgba(23,19,16,.25) !important; }
body.product-page .slide-dot.active { background: var(--pf-orange) !important; }
body.product-page .preview-btn,
body.product-aebridge .preview-btn,
body.product-page .tool-preview-btn { background: var(--pf-ink) !important; color: var(--pf-paper-2) !important; border: 0 !important; border-radius: 0 !important; }

body.product-page .features,
body.product-aebridge .feature-grid { width: min(1060px, calc(100% - 44px)) !important; margin: 90px auto 0 !important; display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 0 !important; border-top: 2px solid var(--pf-ink) !important; }
body.product-page .feature-card,
body.product-aebridge .feature { padding: 28px !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--pf-line) !important; border-radius: 0 !important; color: var(--pf-ink) !important; }
body.product-page .feature-card + .feature-card,
body.product-aebridge .feature + .feature { padding-left: 28px !important; border-left: 1px solid var(--pf-line) !important; }
body.product-page .feature-name,
body.product-aebridge .feature h2 { color: var(--pf-ink) !important; font-family: "Space Grotesk", sans-serif !important; font-size: 1.12rem !important; }
body.product-page .feature-desc,
body.product-aebridge .feature p { color: rgba(23,19,16,.68) !important; line-height: 1.7 !important; }

body.product-page .product-feature-section { padding: 0 0 clamp(80px, 10vw, 130px); background: var(--pf-paper); }
body.product-page .product-feature-heading { margin: clamp(72px, 9vw, 110px) 0 24px; }
body.product-page .product-feature-heading .section-label { margin-bottom: 14px; text-align: left; }
body.product-page .product-feature-heading .section-label span { color: var(--pf-orange); font: 700 .76rem "JetBrains Mono", monospace; letter-spacing: .16em; }
body.product-page .product-feature-heading .section-title { margin: 0; text-align: left; font-size: clamp(2.8rem, 6vw, 5.8rem) !important; }
body.product-page .product-feature-heading .section-desc { margin: 16px 0 0; text-align: left; }
body.product-aebridge .product-feature-heading { width: min(1060px, calc(100% - 44px)); margin-left: auto; margin-right: auto; }
body.product-page .product-feature-heading + .features,
body.product-aebridge .product-feature-heading + .feature-grid { margin-top: 0 !important; }
body.product-aebridge .product-feature-section { padding-top: 1px; }
body.product-aebridge .hero { border-bottom: 0 !important; }

body.product-page .tools-section { padding: clamp(80px, 10vw, 135px) 0 !important; background: var(--pf-paper) !important; border: 0 !important; }
body.product-page .section-label { color: var(--pf-orange) !important; }
body.product-page .section-label::before,
body.product-page .section-label::after { background: var(--pf-ink) !important; opacity: .2 !important; }
body.product-page .section-title { color: var(--pf-ink) !important; font: 650 clamp(3rem, 7vw, 6.5rem)/.9 "Space Grotesk", sans-serif !important; letter-spacing: -.06em !important; }
body.product-page .section-desc { color: rgba(23,19,16,.65) !important; }
body.product-page .category-tabs { border-bottom: 2px solid var(--pf-ink) !important; }
body.product-page .category-tab { color: rgba(23,19,16,.84) !important; font-weight: 750 !important; letter-spacing: .07em !important; }
body.product-page .category-tab:hover { color: var(--pf-orange-dark) !important; }
body.product-page .category-tab.active { color: var(--pf-ink) !important; border-bottom-color: var(--pf-orange) !important; }
body.product-page .group-tab {
  background: var(--pf-paper-2) !important;
  color: var(--pf-ink) !important;
  border: 1.5px solid rgba(23,19,16,.48) !important;
  font-weight: 750 !important;
}
body.product-page .group-tab:hover { color: var(--pf-orange-dark) !important; border-color: var(--pf-orange-dark) !important; }
body.product-page .group-tab.active { background: var(--pf-yellow) !important; color: var(--pf-ink) !important; border-color: var(--pf-ink) !important; box-shadow: 4px 4px 0 var(--pf-orange) !important; }
body.product-page .tools-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 0 34px !important; }
body.product-page .tool-card { min-height: 0 !important; padding: 25px 0 !important; background: transparent !important; border: 0 !important; border-top: 1px solid var(--pf-line) !important; border-radius: 0 !important; box-shadow: none !important; color: var(--pf-ink) !important; transform: none !important; }
body.product-page .tool-card:hover { background: transparent !important; border-top-color: var(--pf-orange) !important; transform: translateX(4px) !important; }
body.product-page .tool-name { color: var(--pf-ink) !important; font-family: "Space Grotesk", sans-serif !important; font-size: 1.12rem !important; }
body.product-page .tool-blurb { color: rgba(23,19,16,.67) !important; }
body.product-page .tool-tag { color: var(--pf-orange) !important; background: transparent !important; border: 1px solid var(--pf-orange) !important; }

body.product-page .beta-section,
body.product-aebridge .beta-section { padding: clamp(80px, 10vw, 130px) 22px !important; background: var(--pf-orange) !important; border: 0 !important; }
body.product-page .beta-inner,
body.product-aebridge .beta-inner { max-width: 960px !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; text-align: center !important; }
body.product-page .beta-inner::before,
body.product-aebridge .beta-inner::before { display: none !important; }
body.product-page .beta-badge,
body.product-aebridge .beta-badge { padding: 8px 14px !important; background: var(--pf-paper-2) !important; color: var(--pf-ink) !important; border: 2px solid var(--pf-ink) !important; border-radius: 999px !important; box-shadow: 4px 4px 0 rgba(23,19,16,.22) !important; }
body.product-page .beta-dot,
body.product-aebridge .beta-dot { background: var(--pf-yellow) !important; }
body.product-page .beta-heading,
body.product-aebridge .beta-heading { color: var(--pf-ink) !important; font: 650 clamp(3.5rem, 8vw, 7.6rem)/.88 "Space Grotesk", sans-serif !important; letter-spacing: -.065em !important; }
body.product-page .beta-sub,
body.product-aebridge .beta-sub { color: var(--pf-paper-2) !important; font-weight: 550 !important; }
/* Printed-ticket calls to action */
.pf-final a,
body.product-page .hero-btn,
body.product-page .beta-btn,
body.product-aebridge .beta-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 13px 15px 13px 21px !important;
  background: var(--pf-yellow) !important;
  color: var(--pf-ink) !important;
  border: 2px solid var(--pf-ink) !important;
  border-radius: 0 !important;
  box-shadow: 8px 8px 0 var(--pf-orange) !important;
  font: 750 .78rem "Space Grotesk", sans-serif !important;
  letter-spacing: .08em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  transform: rotate(-1deg) !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}
.pf-final a::after,
body.product-page .hero-btn::after,
body.product-page .beta-btn::after,
body.product-aebridge .beta-btn::after {
  content: "↗";
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  background: var(--pf-ink);
  color: var(--pf-yellow);
  border-radius: 50%;
  font-size: 1rem;
  transition: transform .18s ease;
}
.pf-final a:hover,
body.product-page .hero-btn:hover,
body.product-page .beta-btn:hover,
body.product-aebridge .beta-btn:hover {
  opacity: 1 !important;
  transform: translate(-3px, -3px) rotate(.5deg) !important;
  box-shadow: 11px 11px 0 var(--pf-orange) !important;
}
.pf-final a:hover::after,
body.product-page .hero-btn:hover::after,
body.product-page .beta-btn:hover::after,
body.product-aebridge .beta-btn:hover::after { transform: rotate(12deg) translate(1px, -1px); }
body.product-page .beta-btn,
body.product-aebridge .beta-btn { box-shadow: 8px 8px 0 var(--pf-paper-2) !important; }
body.product-page .beta-btn:hover,
body.product-aebridge .beta-btn:hover { box-shadow: 11px 11px 0 var(--pf-paper-2) !important; }
body.product-page .beta-note,
body.product-aebridge .beta-note { color: rgba(255,250,240,.82) !important; }

body.product-page .video-modal-overlay,
body.product-aebridge .video-modal-overlay { background: rgba(23,19,16,.88) !important; }
body.product-page .video-modal,
body.product-aebridge .video-modal {
  overflow: hidden !important;
  background: #0d0c0b !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 24px !important;
  box-shadow: 0 34px 90px rgba(0,0,0,.58), 0 10px 28px rgba(0,0,0,.34) !important;
}
body.product-page .video-modal video,
body.product-aebridge .video-modal video { background: #080706 !important; }
body.product-page .video-modal-footer,
body.product-aebridge .video-modal-footer { background: #151311 !important; border-top-color: rgba(255,255,255,.1) !important; }
body.product-page .video-modal-title,
body.product-aebridge .video-modal-title { color: var(--pf-paper-2) !important; }
body.product-page .video-modal-close,
body.product-aebridge .video-modal-close { color: rgba(255,250,240,.68) !important; }
body.product-page .video-modal-close:hover,
body.product-aebridge .video-modal-close:hover { color: var(--pf-paper-2) !important; background: rgba(255,255,255,.08) !important; }

/* Reveal and depth */
.pf-reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.pf-reveal.is-visible { opacity: 1; transform: none; }
.pf-depth { transform: translateY(var(--pf-shift, 0)); }

@media (max-width: 860px) {
  .pf-nav-links, body.product-page .nav-links { gap: 16px !important; }
  .pf-hero { grid-template-columns: 1fr; }
  .pf-hero-art { min-height: 520px; order: -1; }
  .pf-hero-copy { min-height: auto; padding-top: 64px; padding-bottom: 64px; }
  .pf-product-rail { min-height: auto; padding-top: 54px; padding-bottom: 54px; }
  .pf-product-choice { min-height: 140px; }
  .pf-manifesto { flex-direction: column; gap: 10px; }
  .pf-product, .pf-product:nth-of-type(even) { grid-template-columns: 1fr; }
  .pf-product:nth-of-type(even) .pf-product-copy { order: 0; }
  .pf-product-copy { min-height: 520px; }
  .pf-product-visual { min-height: 480px; }
  .slideshow-arrow { width: 40px; height: 40px; }
  .slide-arrow-prev { left: 10px; }
  .slide-arrow-next { right: 10px; }
  body.product-page .features, body.product-aebridge .feature-grid { grid-template-columns: 1fr !important; }
  body.product-page .feature-card + .feature-card, body.product-aebridge .feature + .feature { padding-left: 0 !important; border-left: 0 !important; }
}

@media (max-width: 620px) {
  .pf-nav-inner, body.product-page .site-nav .container { width: min(100% - 28px, 1180px) !important; }
  .pf-brand, body.product-page .nav-brand { letter-spacing: .09em !important; font-size: .78rem !important; }
  .pf-nav-links, body.product-page .nav-links { gap: 12px !important; }
  .pf-nav-links a, body.product-page .nav-links > li > a, body.product-page .nav-dropdown-toggle, body.product-page .nav-tools-link { font-size: .66rem !important; }
  .pf-nav-links li:last-child,
  body.product-page .nav-links li:last-child { display: none !important; }
  .pf-hero-copy { padding: 36px 22px 40px; }
  .pf-hero-art { min-height: 410px; }
  .pf-hero-fox { padding: 14px; transform: scale(1.02); }
  .pf-hero-disc { width: 82%; left: 54%; top: 44%; }
  .pf-hero-logo-frame { height: 240px; }
  .pf-hero-logo { top: 18px; width: min(100%, 320px); clip-path: inset(0 0 25% 0); }
  .pf-hero-wordmark { font-size: 1rem; letter-spacing: .18em; }
  .pf-product-rail { padding: 38px 22px 42px; }
  .pf-rail-header { flex-direction: column; gap: 7px; }
  .pf-product-choice { min-height: 128px; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; }
  .pf-choice-copy strong { font-size: clamp(1.8rem, 10vw, 3rem); }
  .pf-product-choice img { width: 50%; }
  .pf-products-label::after { display: none; }
  .pf-product-copy { padding: 64px 22px; min-height: 480px; }
  .pf-product h3 { margin-top: 70px; }
  .pf-product-visual { min-height: 360px; padding: 25px 22px 40px; }
  .pf-products-label { padding: 75px 22px 35px; }
  body.product-page .hero .container, body.product-aebridge .hero-inner { width: calc(100% - 32px) !important; }
  body.product-page .hero::after { width: 68vw; right: -38vw; top: 110px; }
  body.product-page .pain-points { grid-template-columns: 1fr !important; }
  body.product-page .panel-showcase, body.product-aebridge .panel-showcase, body.product-page .features, body.product-aebridge .feature-grid { width: calc(100% - 32px) !important; }
  body.product-page .panel-frame, body.product-aebridge .panel-frame { box-shadow: 8px 8px 0 var(--pf-orange) !important; }
  body.product-page .video-modal, body.product-aebridge .video-modal { border-radius: 16px !important; }
  body.product-page .tools-grid { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pf-reveal { opacity: 1; transform: none; transition: none; }
  .pf-depth { transform: none !important; }
}

/* About page */
body.about-page {
  margin: 0;
  background: var(--pf-paper-2);
  color: var(--pf-ink);
  font-family: "Manrope", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.about-page * { box-sizing: border-box; }
body.about-page a { color: inherit; text-decoration: none; }

.pf-about-hero {
  min-height: calc(100svh - 72px);
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(420px, .98fr);
  border-bottom: 2px solid var(--pf-ink);
  overflow: hidden;
}
.pf-about-intro {
  padding: clamp(64px, 9vw, 132px) clamp(28px, 7vw, 108px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--pf-orange);
}
.pf-about-kicker {
  margin: 0 0 26px;
  color: var(--pf-paper-2);
  font: 700 .76rem/1.3 "JetBrains Mono", monospace;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.pf-about-intro h1 {
  max-width: 650px;
  margin: 0;
  font: 650 clamp(3.6rem, 7vw, 8rem)/.86 "Space Grotesk", sans-serif;
  letter-spacing: -.075em;
}
.pf-about-intro h1 em { color: var(--pf-yellow); font-style: normal; }
.pf-about-art {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  background: var(--pf-paper-2);
}
.pf-about-art::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: min(78%, 560px);
  aspect-ratio: 1;
  right: -15%;
  top: 12%;
  background: var(--pf-yellow);
  transform: rotate(8deg);
}
.pf-about-art img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  padding: clamp(18px, 3vw, 48px);
  object-fit: contain;
  transform: scale(1.08);
  filter: drop-shadow(0 18px 20px rgba(23, 19, 16, .14));
}
.pf-about-index {
  position: absolute;
  z-index: 2;
  top: 28px;
  right: 24px;
  writing-mode: vertical-rl;
  color: var(--pf-ink);
  font: 700 .68rem/1 "JetBrains Mono", monospace;
  letter-spacing: .18em;
}
.pf-about-story {
  padding: clamp(72px, 10vw, 150px) clamp(28px, 8vw, 120px);
  display: grid;
  grid-template-columns: minmax(180px, .34fr) minmax(0, 1fr);
  gap: clamp(46px, 9vw, 150px);
  background: var(--pf-paper-2);
  border-bottom: 2px solid var(--pf-ink);
}
.pf-about-story-label {
  color: var(--pf-orange);
  font: 700 .74rem/1.5 "JetBrains Mono", monospace;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.pf-about-story-copy > p {
  max-width: 780px;
  margin: 0;
  font: 500 clamp(1.65rem, 3.2vw, 3.5rem)/1.12 "Space Grotesk", sans-serif;
  letter-spacing: -.045em;
}
.pf-about-founder {
  display: grid;
  grid-template-columns: minmax(180px, .45fr) minmax(0, 1fr);
  gap: clamp(30px, 6vw, 100px);
  margin-top: clamp(72px, 10vw, 135px);
  padding-top: 26px;
  border-top: 2px solid var(--pf-ink);
}
.pf-about-founder-label {
  margin: 0 0 14px;
  color: var(--pf-orange);
  font: 700 .72rem/1.3 "JetBrains Mono", monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.pf-about-founder h2 {
  margin: 0;
  font: 650 clamp(2.4rem, 5.2vw, 5.4rem)/.9 "Space Grotesk", sans-serif;
  letter-spacing: -.065em;
}
.pf-about-founder > p {
  max-width: 680px;
  margin: 0;
  font-size: 1.04rem;
  line-height: 1.82;
}

@media (max-width: 860px) {
  .pf-about-hero { grid-template-columns: 1fr; }
  .pf-about-art { min-height: 520px; order: -1; }
  .pf-about-intro { padding-block: 72px; }
  .pf-about-story { grid-template-columns: 1fr; gap: 25px; }
  .pf-about-founder { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .pf-about-art { min-height: 410px; }
  .pf-about-intro { padding: 64px 22px; }
  .pf-about-intro h1 { font-size: clamp(3rem, 15vw, 5rem); }
  .pf-about-story { padding: 70px 22px; }
  .pf-about-story-copy > p { font-size: clamp(1.6rem, 8vw, 2.5rem); }
  .pf-about-founder { margin-top: 70px; }
}
/* About story: direct entry */
.pf-about-story {
  padding-top: clamp(86px, 12vw, 170px);
}
.pf-about-origin {
  display: grid;
  gap: 28px;
  max-width: 900px;
}
.pf-about-origin p {
  margin: 0;
  font: 500 clamp(1.4rem, 2.55vw, 2.85rem)/1.2 "Space Grotesk", sans-serif;
  letter-spacing: -.035em;
}
.pf-about-founder-copy {
  display: grid;
  gap: 22px;
}
.pf-about-founder-copy > p {
  max-width: 680px;
  margin: 0;
  font-size: 1.04rem;
  line-height: 1.82;
}
.pf-about-founder-copy em { font-style: italic; }
/* About typography: quieter reading scale */
.pf-about-story {
  padding-top: clamp(70px, 9vw, 120px);
  padding-bottom: clamp(70px, 9vw, 125px);
}
.pf-about-origin p {
  font-size: clamp(1.08rem, 1.55vw, 1.5rem);
  line-height: 1.55;
}
.pf-about-founder h2 {
  font-size: clamp(2.3rem, 4.2vw, 4.4rem);
}
.pf-about-founder-copy > p {
  font-size: clamp(.95rem, 1.05vw, 1.05rem);
  line-height: 1.7;
}
/* Unified dark mode */
:root {
  --pf-paper: #0b1220;
  --pf-paper-2: #101a28;
  --pf-ink: #eef5fb;
  --pf-orange: #dc6f2b;
  --pf-orange-dark: #a94712;
  --pf-nav-orange: #162235;
  --pf-yellow: #f2c94c;
  --pf-line: rgba(213, 224, 236, .22);
  --pf-shadow: 14px 14px 0 #050a12;
}

html { background: #080e18; }
body.products-page,
body.product-page,
body.about-page {
  background: var(--pf-paper) !important;
  color: var(--pf-ink) !important;
}

/* Product pages have their own inline variables; align them to the shared theme. */
body.product-page {
  --field: #0b1220;
  --field-2: #101a28;
  --panel: #101a28;
  --panel-1: #101a28;
  --panel-solid: #101a28;
  --ink: #eef5fb;
  --ink-2: #d5e0ec;
  --muted: #9fb1c6;
  --muted-2: #8b9db3;
  --faint: #71869f;
  --line: rgba(213, 224, 236, .22);
  --line-strong: rgba(213, 224, 236, .38);
  --accent: #f2c94c;
  --brand: #f2c94c;
  --ok: #f2c94c;
  --shadow-card: 10px 10px 0 #050a12;
}

/* Navigation */
.pf-nav,
body.product-page .site-nav {
  background: var(--pf-nav-orange) !important;
  border-bottom-color: rgba(238, 245, 251, .22) !important;
}
.pf-brand,
body.product-page .nav-brand {
  color: var(--pf-ink) !important;
}
.pf-brand strong,
body.product-page .nav-brand b {
  color: var(--pf-yellow) !important;
}
.pf-brand-mark {
  background: var(--pf-ink);
  color: #080e18;
}
.pf-nav-links > li > a:hover,
body.product-page .nav-links > li > a:hover,
body.product-page .nav-dropdown-toggle:hover,
body.product-page .nav-tools-link:hover {
  color: var(--pf-yellow) !important;
}
.pf-nav .nav-dropdown-menu,
body.product-page .nav-dropdown-menu {
  background: #0a111d !important;
  border: 1px solid rgba(213, 224, 236, .2) !important;
  box-shadow: 8px 8px 0 var(--pf-orange) !important;
}
.pf-nav .nav-dropdown-menu a,
body.product-page .nav-dropdown-menu a {
  color: var(--pf-ink) !important;
}
.pf-nav .nav-dropdown-menu small,
body.product-page .tool-info-desc {
  color: rgba(213, 224, 236, .6) !important;
}

/* Homepage and About surfaces */
body.products-page .pf-hero,
body.products-page .pf-hero-copy,
body.products-page .pf-hero-art,
body.about-page .pf-about-story {
  background: var(--pf-paper-2) !important;
  color: var(--pf-ink) !important;
}
body.products-page .pf-product-rail {
  background: #080e18 !important;
  color: var(--pf-ink) !important;
}
body.products-page .pf-product-list {
  border-top-color: rgba(238, 245, 251, .72) !important;
}
body.products-page .pf-product-choice {
  color: var(--pf-ink) !important;
  border-bottom-color: rgba(238, 245, 251, .25) !important;
}
body.products-page .pf-product-choice:hover,
body.products-page .pf-product-choice:focus-visible {
  color: #171310 !important;
}
body.products-page .pf-manifesto {
  background: var(--pf-yellow) !important;
  color: #171310 !important;
  border-bottom-color: #080e18 !important;
}
body.products-page .pf-products-label,
body.products-page .pf-product.theme-dark {
  background: #080e18 !important;
  color: var(--pf-ink) !important;
}
body.products-page .pf-product.theme-paper {
  background: var(--pf-paper-2) !important;
  color: var(--pf-ink) !important;
}
body.products-page .pf-product.theme-yellow,
body.products-page .pf-product.theme-orange {
  color: #171310 !important;
}
body.products-page .pf-final,
body.about-page .pf-final {
  background: var(--pf-paper-2) !important;
  color: var(--pf-ink) !important;
  border-top-color: rgba(238, 245, 251, .22) !important;
}
.pf-footer,
body.product-page .site-footer {
  background: #050a12 !important;
  color: var(--pf-ink) !important;
  border-top: 1px solid rgba(238, 245, 251, .16) !important;
}
body.about-page .pf-about-story {
  border-bottom-color: rgba(238, 245, 251, .22) !important;
}

/* Product-page hierarchy and controls */
body.product-page .hero {
  background: var(--pf-paper-2) !important;
  color: var(--pf-ink) !important;
  border-bottom-color: rgba(238, 245, 251, .22) !important;
}
body.product-page .hero h1,
body.product-page .hero-statement,
body.product-page .hero-product-name,
body.product-page .showcase-label,
body.product-page .feature-name,
body.product-page .feature-card,
body.product-page .tool-name,
body.product-page .tool-card {
  color: var(--pf-ink) !important;
}
body.product-page .hero-product-name,
body.product-page .section-label {
  color: var(--pf-orange) !important;
}
body.product-page .hero-sub,
body.product-page .version-req,
body.product-page .section-desc,
body.product-page .feature-desc,
body.product-page .tool-blurb,
body.product-page .hero-badge,
body.product-page .category-tab,
body.product-page .beta-note {
  color: rgba(213, 224, 236, .74) !important;
}
body.product-page .hero-badge {
  background: #080e18 !important;
  border-color: rgba(238, 245, 251, .25) !important;
}
body.product-page .pain-points,
body.product-page .features,
body.product-aebridge .feature-grid {
  border-color: rgba(238, 245, 251, .28) !important;
}
body.product-page .pain-point,
body.product-page .feature-card,
body.product-aebridge .feature,
body.product-page .tool-card {
  border-color: rgba(213, 224, 236, .22) !important;
  color: #eef5fb !important;
}
body.product-page .panel-frame {
  background: #080e18 !important;
  border-color: rgba(238, 245, 251, .78) !important;
  box-shadow: 14px 14px 0 #dc6f2b !important;
}
body.product-page .slide-label,
body.product-aebridge .showcase-label {
  color: #eef5fb !important;
  background: rgba(8, 14, 24, .84) !important;
  border-color: rgba(238, 245, 251, .28) !important;
}
body.product-page .slideshow-arrow {
  background: rgba(8, 14, 24, .9) !important;
  color: #eef5fb !important;
  border-color: rgba(238, 245, 251, .48) !important;
}
body.product-page .slide-dot {
  background: rgba(238, 245, 251, .3) !important;
}
body.product-page .slide-dot.active {
  background: #dc6f2b !important;
}
body.product-page .hero h1 .accent,
body.product-page .hero-statement .accent,
body.product-aebridge .hero h1 span,
body.product-aebridge .hero-statement span {
  color: #dc6f2b !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
body.product-page .hero-sub,
body.product-aebridge .lead,
body.product-page .version-req,
body.product-aebridge .version-req,
body.product-page .section-desc,
body.product-page .feature-desc,
body.product-aebridge .feature p,
body.product-page .tool-blurb {
  color: rgba(213, 224, 236, .78) !important;
}
body.product-page .hero-product-name,
body.product-aebridge .eyebrow,
body.product-page .section-label {
  color: #dc6f2b !important;
}
body.product-page .section-title,
body.product-page .feature-name,
body.product-aebridge .feature h2,
body.product-page .tool-name {
  color: #eef5fb !important;
}
body.product-page .product-feature-section,
body.product-page .tools-section {
  background: #0b1220 !important;
  color: #eef5fb !important;
}
body.product-page .category-tabs {
  border-bottom-color: rgba(238, 245, 251, .3) !important;
}
body.product-page .category-tab {
  color: rgba(213, 224, 236, .82) !important;
}
body.product-page .category-tab.active {
  color: #eef5fb !important;
}
body.product-page .group-tab {
  background: #101a28 !important;
  color: #eef5fb !important;
  border-color: rgba(213, 224, 236, .38) !important;
}
body.product-page .group-tab.active {
  background: #f2c94c !important;
  color: #171310 !important;
  border-color: #171310 !important;
}
body.product-page .tool-card {
  background: transparent !important;
  border-top-color: rgba(213, 224, 236, .22) !important;
}
body.product-page .tool-card:hover {
  border-top-color: #dc6f2b !important;
}
body.product-page .tool-tag {
  color: #f2c94c !important;
  border-color: #f2c94c !important;
}
body.product-page .preview-btn,
body.product-page .tool-preview-btn {
  background: #101a28 !important;
  color: #eef5fb !important;
  border-color: rgba(213, 224, 236, .38) !important;
}
body.product-page .beta-section {
  background: #a94712 !important;
}
body.product-page .beta-heading {
  color: #eef5fb !important;
}
body.product-page .beta-sub,
body.product-page .beta-note {
  color: #fffaf0 !important;
}
body.product-page .beta-badge {
  background: #101a28 !important;
  color: #f2c94c !important;
  border-color: rgba(238, 245, 251, .35) !important;
}
body.product-page .hero-btn,
body.product-page .beta-btn {
  background: #f2c94c !important;
  color: #171310 !important;
  border-color: #171310 !important;
  box-shadow: 8px 8px 0 #dc6f2b !important;
}
body.product-page .hero-btn::after,
body.product-page .beta-btn::after {
  background: #080e18 !important;
  color: #f2c94c !important;
}
body.product-page .video-modal-overlay {
  background: rgba(3, 7, 12, .9) !important;
}
body.product-page .video-modal,
body.product-page .video-modal-footer {
  background: #101a28 !important;
  border-color: rgba(213, 224, 236, .24) !important;
}
body.product-page .video-modal-title {
  color: #eef5fb !important;
}
body.product-page .video-modal-close {
  color: rgba(213, 224, 236, .72) !important;
}
/* Final product dark theme */
:root {
  --pf-nav-orange: #dc874d;
}
.pf-nav,
body.product-page .site-nav {
  background: var(--pf-nav-orange) !important;
}
.pf-brand,
body.product-page .nav-brand {
  color: #171310 !important;
}
.pf-brand strong,
body.product-page .nav-brand b {
  color: #fffaf0 !important;
}
.pf-nav-links a,
body.product-page .nav-links > li > a,
body.product-page .nav-dropdown-toggle,
body.product-page .nav-tools-link {
  color: #171310 !important;
}
.pf-nav-links a:hover,
body.product-page .nav-links > li > a:hover,
body.product-page .nav-dropdown-toggle:hover,
body.product-page .nav-tools-link:hover {
  color: #fffaf0 !important;
}
body.product-page {
  --field: #0c0b0a;
  --field-2: #17120e;
  --panel: #1a1511;
  --panel-1: #1a1511;
  --panel-solid: #17120f;
  --line: rgba(245, 231, 215, .2);
  --line-strong: rgba(245, 231, 215, .34);
  --accent: #f2c94c;
  --brand: #f2c94c;
}
body.product-page {
  background:
    radial-gradient(66% 48% at 88% 0%, rgba(220, 111, 43, .12), transparent 70%),
    linear-gradient(145deg, #21150f 0%, #0c0b0a 68%) !important;
  color: #eef5fb !important;
}
body.product-page main {
  background: transparent !important;
}
body.product-page .hero {
  background:
    radial-gradient(70% 62% at 92% 8%, rgba(220, 111, 43, .08), transparent 68%),
    #19130f !important;
  color: #eef5fb !important;
  border-bottom-color: rgba(245, 231, 215, .22) !important;
}
body.product-page .hero::after {
  background: radial-gradient(circle, rgba(220, 111, 43, .2), transparent 70%) !important;
  opacity: 1 !important;
}
body.product-page .hero h1,
body.product-page .hero-statement,
body.product-page .showcase-label,
body.product-page .section-title,
body.product-page .feature-name,
body.product-aebridge .feature h2,
body.product-page .tool-name {
  color: #eef5fb !important;
}
body.product-page .hero h1 .accent,
body.product-page .hero-statement .accent,
body.product-aebridge .hero h1 span,
body.product-aebridge .hero-statement span,
body.product-page .hero-product-name,
body.product-aebridge .eyebrow,
body.product-page .section-label {
  color: #dc6f2b !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
body.product-page .hero-sub,
body.product-aebridge .lead,
body.product-page .version-req,
body.product-aebridge .version-req,
body.product-page .section-desc,
body.product-page .feature-desc,
body.product-aebridge .feature p,
body.product-page .tool-blurb {
  color: rgba(213, 224, 236, .78) !important;
}
body.product-page .hero-badge {
  background: #080706 !important;
  color: #f2c94c !important;
  border-color: rgba(238, 245, 251, .25) !important;
}
body.product-page .pain-points,
body.product-page .features,
body.product-aebridge .feature-grid,
body.product-page .category-tabs {
  border-color: rgba(238, 245, 251, .28) !important;
}
body.product-page .pain-point,
body.product-page .feature-card,
body.product-aebridge .feature,
body.product-page .tool-card {
  border-color: rgba(213, 224, 236, .22) !important;
  color: #eef5fb !important;
}
body.product-page .panel-frame {
  background: #080706 !important;
  border-color: rgba(238, 245, 251, .78) !important;
  box-shadow: 14px 14px 0 #dc6f2b !important;
}
body.product-page .slide-label,
body.product-aebridge .showcase-label {
  color: #eef5fb !important;
  background: rgba(8, 14, 24, .84) !important;
  border-color: rgba(238, 245, 251, .28) !important;
}
body.product-page .slideshow-arrow {
  background: rgba(8, 14, 24, .9) !important;
  color: #eef5fb !important;
  border-color: rgba(238, 245, 251, .48) !important;
}
body.product-page .slide-dot {
  background: rgba(238, 245, 251, .3) !important;
}
body.product-page .slide-dot.active {
  background: #dc6f2b !important;
}
body.product-page .product-feature-section,
body.product-page .tools-section {
  background: #11100e !important;
  color: #eef5fb !important;
}
body.product-page .category-tab {
  color: rgba(213, 224, 236, .82) !important;
}
body.product-page .category-tab.active {
  color: #eef5fb !important;
}
body.product-page .group-tab,
body.product-page .preview-btn,
body.product-page .tool-preview-btn {
  background: #1a1511 !important;
  color: #eef5fb !important;
  border-color: rgba(213, 224, 236, .38) !important;
}
body.product-page .group-tab.active {
  background: #f2c94c !important;
  color: #171310 !important;
  border-color: #171310 !important;
}
body.product-page .tool-card {
  background: transparent !important;
  border-top-color: rgba(213, 224, 236, .22) !important;
}
body.product-page .tool-card:hover {
  border-top-color: #dc6f2b !important;
}
body.product-page .tool-tag {
  color: #f2c94c !important;
  border-color: #f2c94c !important;
}
body.product-page .beta-section {
  background:
    linear-gradient(135deg, rgba(220, 111, 43, .12), transparent 58%),
    #12100e !important;
  border-top: 2px solid rgba(220, 111, 43, .65) !important;
}
body.product-page .beta-heading,
body.product-page .beta-sub,
body.product-page .beta-note {
  color: #fffaf0 !important;
}
body.product-page .beta-badge {
  background: #1a1511 !important;
  color: #f2c94c !important;
  border-color: rgba(238, 245, 251, .35) !important;
}
body.product-page .hero-btn,
body.product-page .beta-btn {
  background: #f2c94c !important;
  color: #171310 !important;
  border-color: #171310 !important;
  box-shadow: 8px 8px 0 #dc6f2b !important;
}
body.product-page .hero-btn::after,
body.product-page .beta-btn::after {
  background: #080e18 !important;
  color: #f2c94c !important;
}
body.product-page .video-modal-overlay {
  background: rgba(3, 7, 12, .9) !important;
}
body.product-page .video-modal,
body.product-page .video-modal-footer {
  background: #17120f !important;
  border-color: rgba(213, 224, 236, .24) !important;
}
body.product-page .video-modal-title {
  color: #eef5fb !important;
}
body.product-page .video-modal-close {
  color: rgba(213, 224, 236, .72) !important;
}
/* Very slight product-page gradient */
body.product-page {
  background:
    linear-gradient(160deg, #171514 0%, #121110 52%, #0e0d0c 100%) !important;
}
body.product-page .hero {
  background:
    linear-gradient(160deg, #1b1816 0%, #171514 58%, #141210 100%) !important;
}
body.product-page .product-feature-section,
body.product-page .tools-section {
  background: #11100f !important;
}
/* Larger shared navigation */
.pf-nav,
body.product-page .site-nav {
  height: 86px !important;
}
.pf-nav-inner,
body.product-page .site-nav .container {
  height: 100% !important;
}
.pf-brand,
body.product-page .nav-brand {
  font-size: 1.12rem !important;
  letter-spacing: .14em !important;
}
.pf-nav-links,
body.product-page .nav-links {
  gap: 34px !important;
}
.pf-nav-links a,
body.product-page .nav-links > li > a,
body.product-page .nav-dropdown-toggle,
body.product-page .nav-tools-link {
  font-size: .88rem !important;
  letter-spacing: .06em !important;
}
@media (max-width: 760px) {
  .pf-nav,
  body.product-page .site-nav {
    height: 72px !important;
  }
  .pf-brand,
  body.product-page .nav-brand {
    font-size: .94rem !important;
    letter-spacing: .1em !important;
  }
  .pf-nav-links,
  body.product-page .nav-links {
    gap: 16px !important;
  }
  .pf-nav-links a,
  body.product-page .nav-links > li > a,
  body.product-page .nav-dropdown-toggle,
  body.product-page .nav-tools-link {
    font-size: .74rem !important;
  }
}

/* Final reference-fit adjustments for the first viewport. */
body.product-page .hero {
  padding: clamp(36px, 5vw, 62px) 0 clamp(54px, 6vw, 76px) !important;
}
body.product-page:not(.product-aebridge) .hero > .container > .panel-showcase,
body.product-aebridge .panel-showcase {
  width: min(100%, 360px) !important;
  max-width: 360px !important;
  justify-self: end !important;
}
body.product-aebridge .hero {
  padding-top: clamp(36px, 5vw, 62px) !important;
}
body.product-aebridge .panel-showcase {
  margin-top: clamp(36px, 5vw, 62px) !important;
}

/* Editorial product index homepage */
body.editorial-home {
  min-height: 100svh;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(72% 58% at 98% -8%, rgba(242, 201, 76, .06), transparent 68%),
    linear-gradient(145deg, #1b1511 0%, #15110e 48%, #0f0d0b 100%) !important;
  color: #f4ede4 !important;
  font-family: "Manrope", system-ui, sans-serif;
}
body.editorial-home .editorial-home-shell {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 100svh;
  padding: clamp(46px, 7vw, 96px) 7vw 56px;
  isolation: isolate;
}
body.editorial-home .editorial-ghost-number {
  position: absolute;
  z-index: -1;
  top: -0.22em;
  right: -0.06em;
  color: rgba(244, 237, 228, .055);
  font: 700 clamp(18rem, 42vw, 38rem)/.75 "Space Grotesk", sans-serif;
  letter-spacing: -.10em;
  pointer-events: none;
  user-select: none;
}
body.editorial-home .editorial-products {
  position: relative;
  z-index: 1;
  width: min(940px, 100%);
}
body.editorial-home .editorial-products-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 17px;
  border-bottom: 2px solid rgba(244, 237, 228, .86);
}
body.editorial-home .editorial-products-head p,
body.editorial-home .editorial-products-head span,
body.editorial-home .editorial-footer,
body.editorial-home .editorial-meta {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  text-transform: uppercase;
}
body.editorial-home .editorial-products-head p {
  margin: 0;
  color: #f2c94c;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .2em;
}
body.editorial-home .editorial-products-head span {
  color: rgba(244, 237, 228, .55);
  font-size: .64rem;
  font-weight: 400;
  letter-spacing: .18em;
}
body.editorial-home .editorial-list {
  border-bottom: 1px solid rgba(244, 237, 228, .3);
}
body.editorial-home .editorial-product {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 42%);
  min-height: clamp(144px, 17.5vw, 202px);
  overflow: hidden;
  border-bottom: 1px solid rgba(244, 237, 228, .28);
  color: #f4ede4;
  text-decoration: none;
}
body.editorial-home .editorial-product:last-child {
  border-bottom: 0;
}
body.editorial-home .editorial-product-copy {
  position: relative;
  z-index: 2;
  padding: 25px 30px 21px 0;
}
body.editorial-home .editorial-index {
  position: absolute;
  top: 25px;
  left: 0;
  font: 500 .66rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .08em;
}
body.editorial-home .editorial-mark {
  position: absolute;
  top: 58px;
  left: 0;
  width: 8px;
  height: 34px;
}
body.editorial-home .editorial-product h1,
body.editorial-home .editorial-product h2 {
  margin: 0 0 10px 58px;
  color: #f7f1e9;
  font: 700 clamp(2.65rem, 5.3vw, 5rem)/.82 "Space Grotesk", sans-serif;
  letter-spacing: -.075em;
  transition: color .22s ease, transform .22s ease;
}
body.editorial-home .editorial-product p {
  margin: 0 0 0 58px;
  color: rgba(244, 237, 228, .56);
  font: 500 .7rem/1.35 "Manrope", sans-serif;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.editorial-home .editorial-product-preview {
  position: relative;
  min-height: 100%;
  overflow: hidden;
  background: #0d0b09;
}
body.editorial-home .editorial-product-preview::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(21, 17, 14, .98) 0%, rgba(21, 17, 14, .45) 24%, rgba(15, 13, 11, .2) 70%),
    linear-gradient(180deg, rgba(15, 13, 11, .25), rgba(15, 13, 11, .48));
  content: "";
  pointer-events: none;
}
body.editorial-home .editorial-product-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .42;
  filter: brightness(.52) saturate(.58) contrast(1.05);
  transform: scale(1.05);
  transition: opacity .3s ease, transform .45s cubic-bezier(.2, .75, .2, 1), filter .3s ease;
}
body.editorial-home .editorial-arrow {
  position: absolute;
  z-index: 3;
  top: 25px;
  right: 2px;
  font: 400 1.45rem/1 "Manrope", sans-serif;
  transition: transform .22s ease, color .22s ease;
}
body.editorial-home .editorial-product:hover .editorial-product-preview img,
body.editorial-home .editorial-product:focus-visible .editorial-product-preview img {
  opacity: .7;
  filter: brightness(.62) saturate(.7) contrast(1.05);
  transform: scale(1);
}
body.editorial-home .editorial-product:hover h1,
body.editorial-home .editorial-product:hover h2,
body.editorial-home .editorial-product:focus-visible h1,
body.editorial-home .editorial-product:focus-visible h2 {
  color: #fffaf0;
  transform: translateX(3px);
}
body.editorial-home .editorial-product:hover .editorial-arrow,
body.editorial-home .editorial-product:focus-visible .editorial-arrow {
  transform: translate(3px, -3px);
}
body.editorial-home .editorial-product:focus-visible {
  outline: 2px solid #f2c94c;
  outline-offset: 5px;
}
body.editorial-home .editorial-eb .editorial-index,
body.editorial-home .editorial-eb .editorial-arrow { color: #f2c94c; }
body.editorial-home .editorial-eb .editorial-mark { background: #f2c94c; }
body.editorial-home .editorial-de .editorial-index,
body.editorial-home .editorial-de .editorial-arrow { color: #d99aff; }
body.editorial-home .editorial-de .editorial-mark { background: #d99aff; }
body.editorial-home .editorial-ae .editorial-index,
body.editorial-home .editorial-ae .editorial-arrow { color: #72cda0; }
body.editorial-home .editorial-ae .editorial-mark { background: #72cda0; }
body.editorial-home .editorial-footer {
  margin: 22px 0 0;
  color: rgba(244, 237, 228, .55);
  font-size: .64rem;
  letter-spacing: .13em;
}
body.editorial-home .editorial-meta {
  display: flex;
  gap: 22px;
  margin-top: 26px;
}
body.editorial-home .editorial-meta a {
  color: rgba(244, 237, 228, .52);
  font-size: .62rem;
  letter-spacing: .14em;
  text-decoration: none;
  transition: color .2s ease;
}
body.editorial-home .editorial-meta a:hover,
body.editorial-home .editorial-meta a:focus-visible {
  color: #f2c94c;
}
@media (max-width: 680px) {
  body.editorial-home .editorial-home-shell {
    display: block;
    min-height: 100svh;
    padding: 42px 22px 42px;
  }
  body.editorial-home .editorial-ghost-number {
    top: -.03em;
    right: -.12em;
    font-size: 15rem;
  }
  body.editorial-home .editorial-products-head {
    gap: 12px;
    padding-bottom: 14px;
  }
  body.editorial-home .editorial-products-head p {
    font-size: .62rem;
    letter-spacing: .13em;
  }
  body.editorial-home .editorial-products-head span {
    font-size: .53rem;
    letter-spacing: .1em;
  }
  body.editorial-home .editorial-product {
    display: block;
    min-height: 146px;
  }
  body.editorial-home .editorial-product-copy {
    min-height: 146px;
    padding: 24px 0 18px;
  }
  body.editorial-home .editorial-product-preview {
    position: absolute;
    inset: 0 0 0 30%;
    opacity: .48;
  }
  body.editorial-home .editorial-product-preview::after {
    background: linear-gradient(90deg, #15110e 0%, rgba(21, 17, 14, .75) 32%, rgba(15, 13, 11, .3) 100%);
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    margin-left: 44px;
    font-size: clamp(2.35rem, 13vw, 3.7rem);
  }
  body.editorial-home .editorial-product p {
    margin-left: 44px;
    font-size: .6rem;
    letter-spacing: .07em;
  }
  body.editorial-home .editorial-index {
    top: 24px;
    font-size: .6rem;
  }
  body.editorial-home .editorial-mark {
    top: 56px;
    width: 7px;
    height: 30px;
  }
  body.editorial-home .editorial-arrow {
    top: 22px;
    right: 0;
    font-size: 1.2rem;
  }
  body.editorial-home .editorial-footer {
    margin-top: 18px;
    font-size: .55rem;
    line-height: 1.6;
  }
}

/* Combined brand lockup + editorial product index */
@keyframes editorial-enter {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}
body.editorial-home .editorial-home-shell {
  width: min(1340px, 100%);
  margin: 0 auto;
  grid-template-columns: minmax(245px, .72fr) minmax(520px, 1.28fr);
  gap: clamp(54px, 8vw, 126px);
  align-items: center;
  padding: clamp(48px, 7vw, 92px) 6vw 54px;
}
body.editorial-home .editorial-ghost-number {
  right: -.01em;
  top: -.2em;
}
body.editorial-home .editorial-brand-panel {
  position: relative;
  z-index: 1;
  max-width: 380px;
  animation: editorial-enter .7s cubic-bezier(.2, .75, .2, 1) both;
}
body.editorial-home .editorial-brand-kicker {
  margin: 0 0 28px;
  color: #f2c94c;
  font: 500 .7rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.editorial-home .editorial-brand-title {
  margin: 0;
  color: #f7f0e7;
  font: 700 clamp(3.5rem, 6.6vw, 6.8rem)/.82 "Space Grotesk", sans-serif;
  letter-spacing: -.1em;
}
body.editorial-home .editorial-brand-title span {
  color: #f2c94c;
}
body.editorial-home .editorial-brand-rule {
  width: 92px;
  height: 3px;
  margin: 34px 0 25px;
  background: #f2c94c;
}
body.editorial-home .editorial-brand-copy {
  margin: 0;
  color: rgba(244, 237, 228, .62);
  font: 500 clamp(.82rem, 1.1vw, .98rem)/1.6 "Manrope", sans-serif;
  letter-spacing: .02em;
}
body.editorial-home .editorial-contact {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  margin-top: 34px;
  padding: 12px 0 10px;
  border-bottom: 1px solid rgba(242, 201, 76, .58);
  color: #f4ede4;
  font: 600 .72rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
  transition: color .2s ease, border-color .2s ease, transform .2s ease;
}
body.editorial-home .editorial-contact span {
  color: #f2c94c;
  font-size: 1.1rem;
  line-height: .7;
}
body.editorial-home .editorial-contact:hover,
body.editorial-home .editorial-contact:focus-visible {
  border-color: #f2c94c;
  color: #f2c94c;
  outline: none;
  transform: translateX(4px);
}
body.editorial-home .editorial-products {
  width: 100%;
  animation: editorial-enter .7s .08s cubic-bezier(.2, .75, .2, 1) both;
}
body.editorial-home .editorial-product {
  min-height: clamp(138px, 15vw, 186px);
}
body.editorial-home .editorial-product h1,
body.editorial-home .editorial-product h2 {
  font-size: clamp(2.55rem, 4.5vw, 4.4rem);
}
body.editorial-home .editorial-product:nth-child(1) { animation: editorial-enter .6s .16s ease both; }
body.editorial-home .editorial-product:nth-child(2) { animation: editorial-enter .6s .24s ease both; }
body.editorial-home .editorial-product:nth-child(3) { animation: editorial-enter .6s .32s ease both; }
@media (max-width: 960px) {
  body.editorial-home .editorial-home-shell {
    display: block;
    max-width: 720px;
    padding: 58px 34px 48px;
  }
  body.editorial-home .editorial-ghost-number {
    right: -.08em;
    top: -.08em;
  }
  body.editorial-home .editorial-brand-panel {
    max-width: 520px;
    margin: 0 0 58px;
  }
  body.editorial-home .editorial-brand-title {
    font-size: clamp(3.5rem, 10vw, 5.5rem);
  }
  body.editorial-home .editorial-products {
    width: 100%;
  }
}
@media (max-width: 680px) {
  body.editorial-home .editorial-home-shell {
    max-width: none;
    padding: 42px 22px 42px;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: 48px;
  }
  body.editorial-home .editorial-brand-kicker {
    margin-bottom: 22px;
    font-size: .6rem;
    letter-spacing: .14em;
  }
  body.editorial-home .editorial-brand-title {
    font-size: clamp(3.25rem, 16vw, 5rem);
  }
  body.editorial-home .editorial-brand-rule {
    margin: 26px 0 19px;
  }
  body.editorial-home .editorial-brand-copy {
    font-size: .8rem;
  }
  body.editorial-home .editorial-contact {
    margin-top: 27px;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.editorial-home .editorial-brand-panel,
  body.editorial-home .editorial-products,
  body.editorial-home .editorial-product {
    animation: none;
  }
}

/* Stronger Pragmatic Fox brand hierarchy */
body.editorial-home .editorial-brand-name {
  margin: 0;
  color: #f7f0e7;
  font: 700 clamp(3.4rem, 6.8vw, 6.6rem)/.8 "Space Grotesk", sans-serif;
  letter-spacing: -.105em;
  white-space: nowrap;
}
body.editorial-home .editorial-brand-name span {
  color: #f2c94c;
}
body.editorial-home .editorial-brand-title {
  margin: 28px 0 0;
  color: #f7f0e7;
  font: 500 clamp(1.5rem, 2.8vw, 2.35rem)/.92 "Space Grotesk", sans-serif;
  letter-spacing: -.055em;
}
body.editorial-home .editorial-brand-title strong {
  color: #f2c94c;
  font-weight: 600;
}
body.editorial-home .editorial-brand-rule {
  margin-top: 30px;
}
@media (max-width: 960px) {
  body.editorial-home .editorial-brand-name {
    font-size: clamp(3.6rem, 11vw, 6.4rem);
  }
  body.editorial-home .editorial-brand-title {
    margin-top: 24px;
    font-size: clamp(1.45rem, 4.8vw, 2.2rem);
  }
}
@media (max-width: 680px) {
  body.editorial-home .editorial-brand-name {
    font-size: clamp(3rem, 15vw, 5rem);
    letter-spacing: -.1em;
  }
  body.editorial-home .editorial-brand-title {
    margin-top: 22px;
    font-size: clamp(1.4rem, 7.4vw, 2rem);
  }
}

/* Brand overlap and clearer product hover states */
body.editorial-home .editorial-brand-panel {
  min-width: 0;
}
body.editorial-home .editorial-brand-name {
  white-space: normal;
  line-height: .76;
}
body.editorial-home .editorial-product {
  isolation: isolate;
  transition: background .28s ease, border-color .28s ease;
}
body.editorial-home .editorial-product::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  opacity: 0;
  content: "";
  pointer-events: none;
  transition: opacity .28s ease;
}
body.editorial-home .editorial-product:hover::before,
body.editorial-home .editorial-product:focus-visible::before {
  opacity: 1;
}
body.editorial-home .editorial-eb::before {
  background: linear-gradient(90deg, rgba(242, 201, 76, .2), rgba(242, 201, 76, .08) 46%, rgba(242, 201, 76, .025));
}
body.editorial-home .editorial-de::before {
  background: linear-gradient(90deg, rgba(217, 154, 255, .2), rgba(217, 154, 255, .08) 46%, rgba(217, 154, 255, .025));
}
body.editorial-home .editorial-ae::before {
  background: linear-gradient(90deg, rgba(114, 205, 160, .2), rgba(114, 205, 160, .08) 46%, rgba(114, 205, 160, .025));
}
body.editorial-home .editorial-eb:hover,
body.editorial-home .editorial-eb:focus-visible {
  border-color: rgba(242, 201, 76, .62);
}
body.editorial-home .editorial-de:hover,
body.editorial-home .editorial-de:focus-visible {
  border-color: rgba(217, 154, 255, .62);
}
body.editorial-home .editorial-ae:hover,
body.editorial-home .editorial-ae:focus-visible {
  border-color: rgba(114, 205, 160, .62);
}
body.editorial-home .editorial-eb:hover h2,
body.editorial-home .editorial-eb:focus-visible h2 {
  color: #ffdb63;
}
body.editorial-home .editorial-de:hover h2,
body.editorial-home .editorial-de:focus-visible h2 {
  color: #e6baff;
}
body.editorial-home .editorial-ae:hover h2,
body.editorial-home .editorial-ae:focus-visible h2 {
  color: #8be0b6;
}
body.editorial-home .editorial-product:hover .editorial-mark,
body.editorial-home .editorial-product:focus-visible .editorial-mark {
  width: 10px;
  height: 44px;
  top: 52px;
}
@media (max-width: 960px) {
  body.editorial-home .editorial-brand-name {
    line-height: .78;
  }
}
@media (max-width: 680px) {
  body.editorial-home .editorial-product:hover .editorial-mark,
  body.editorial-home .editorial-product:focus-visible .editorial-mark {
    width: 9px;
    height: 38px;
    top: 52px;
  }
}

/* Homepage vertical brand-first composition */
body.editorial-home .editorial-home-shell {
  min-height: calc(100svh - 86px);
}
body.editorial-home .editorial-products {
  scroll-margin-top: 24px;
}
@media (max-width: 760px) {
  body.editorial-home .editorial-home-shell {
    min-height: calc(100svh - 72px);
  }
}

/* Centered vertical homepage flow */
body.editorial-home .editorial-home-shell {
  display: block;
  min-height: calc(100svh - 86px);
  padding: clamp(42px, 7vh, 74px) 6vw 56px;
}
body.editorial-home .editorial-brand-panel {
  width: min(940px, 100%);
  max-width: none;
  margin: 0 auto clamp(48px, 7vh, 76px);
  text-align: center;
}
body.editorial-home .editorial-brand-kicker {
  margin-bottom: 18px;
}
body.editorial-home .editorial-brand-name {
  font-size: clamp(3.45rem, 7vw, 6.2rem);
  text-align: center;
}
body.editorial-home .editorial-brand-title {
  margin-top: 20px;
}
body.editorial-home .editorial-brand-rule {
  margin: 24px auto 20px;
}
body.editorial-home .editorial-brand-copy {
  text-align: center;
}
body.editorial-home .editorial-contact {
  margin-top: 24px;
}
body.editorial-home .editorial-products {
  width: min(940px, 100%);
  margin: 0 auto;
}
@media (max-width: 680px) {
  body.editorial-home .editorial-home-shell {
    min-height: calc(100svh - 72px);
    padding: 34px 22px 42px;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: 46px;
  }
}

/* Single-line Pragmatic Fox wordmark */
body.editorial-home .editorial-brand-name {
  white-space: nowrap;
}
@media (max-width: 680px) {
  body.editorial-home .editorial-brand-name {
    font-size: clamp(2.5rem, 12vw, 4.25rem);
  }
}

/* Montserrat Medium brand wordmark */
body.editorial-home .editorial-brand-name {
  font-family: "Montserrat", "Space Grotesk", sans-serif;
  font-weight: 500;
  letter-spacing: -.08em;
}

/* Homepage bottom contact action */
body.editorial-home .editorial-contact-wrap {
  display: flex;
  justify-content: center;
  margin-top: 34px;
}
body.editorial-home .editorial-contact {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 13px 15px 13px 21px !important;
  background: var(--pf-yellow) !important;
  color: var(--pf-ink) !important;
  border: 2px solid var(--pf-ink) !important;
  border-radius: 0 !important;
  box-shadow: 8px 8px 0 var(--pf-orange) !important;
  font: 750 .78rem "Space Grotesk", sans-serif !important;
  letter-spacing: .08em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  transform: rotate(-1deg) !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}
body.editorial-home .editorial-contact::after {
  content: "↗";
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  background: var(--pf-ink);
  color: var(--pf-yellow);
  border-radius: 50%;
  font: 400 1rem/1 "Manrope", sans-serif;
  transition: transform .18s ease;
}
body.editorial-home .editorial-contact:hover,
body.editorial-home .editorial-contact:focus-visible {
  color: var(--pf-ink);
  border-color: var(--pf-ink);
  transform: translate(-3px, -3px) rotate(.5deg) !important;
  box-shadow: 11px 11px 0 var(--pf-orange) !important;
  outline: none;
}
body.editorial-home .editorial-contact:hover::after,
body.editorial-home .editorial-contact:focus-visible::after {
  transform: rotate(12deg) translate(1px, -1px);
}
@media (max-width: 680px) {
  body.editorial-home .editorial-contact-wrap {
    margin-top: 28px;
  }
}

/* Elemental Bender paper surface */
body.product-elemental {
  background: #f4efe5 !important;
  color: #171310 !important;
}
body.product-elemental main,
body.product-elemental .hero,
body.product-elemental .tools-section,
body.product-elemental .site-footer {
  background: #f4efe5 !important;
  color: #171310 !important;
}
body.product-elemental .hero {
  border-bottom-color: rgba(23, 19, 16, .22) !important;
}
body.product-elemental .hero h1,
body.product-elemental .hero-statement,
body.product-elemental .showcase-label,
body.product-elemental .section-title,
body.product-elemental .feature-name,
body.product-elemental .tool-name {
  color: #171310 !important;
}
body.product-elemental .hero-sub,
body.product-elemental .version-req,
body.product-elemental .section-desc,
body.product-elemental .feature-desc,
body.product-elemental .tool-blurb {
  color: rgba(23, 19, 16, .72) !important;
}
body.product-elemental .pain-points,
body.product-elemental .features {
  border-color: rgba(23, 19, 16, .3) !important;
}
body.product-elemental .pain-point,
body.product-elemental .feature-card,
body.product-elemental .tool-card {
  border-color: rgba(23, 19, 16, .24) !important;
  color: #171310 !important;
}
body.product-elemental .tool-card:hover {
  border-top-color: #d65a16 !important;
}
body.product-elemental .category-tabs {
  border-bottom-color: rgba(23, 19, 16, .3) !important;
}
body.product-elemental .category-tab {
  color: rgba(23, 19, 16, .7) !important;
}
body.product-elemental .category-tab.active {
  color: #171310 !important;
}
body.product-elemental .site-footer {
  border-top-color: rgba(23, 19, 16, .18) !important;
}

/* Elemental Bender tool summary placement */
body.product-elemental .hero > .container > .tools-section {
  margin: 52px 0 58px;
  padding: 0;
  border-top: 1px solid rgba(23, 19, 16, .25);
}
body.product-elemental .hero > .container > .tools-section > .container {
  width: 100%;
  max-width: none;
  padding: 42px 0 0;
}
body.product-elemental .hero > .container > .tools-section .section-desc {
  margin-bottom: 38px;
}
body.product-elemental .hero > .container > .tools-section .group-tabs {
  margin-bottom: 34px;
}
@media (max-width: 768px) {
  body.product-elemental .hero > .container > .tools-section {
    margin: 42px 0 46px;
  }
  body.product-elemental .hero > .container > .tools-section > .container {
    padding-top: 34px;
  }
}

/* Homepage horizontal film-strip product rail */
body.editorial-home .editorial-products {
  width: min(1180px, 100%);
}
body.editorial-home .editorial-list {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  padding: 16px 0;
  overflow: hidden;
  border-top: 1px solid rgba(244, 237, 228, .28);
  border-bottom: 1px solid rgba(244, 237, 228, .3);
  background: #0d0b09;
}
body.editorial-home .editorial-list::before,
body.editorial-home .editorial-list::after {
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  height: 9px;
  background: radial-gradient(circle, rgba(244, 237, 228, .62) 0 2.2px, transparent 2.8px) 0 50% / 20px 100% repeat-x;
  content: "";
  pointer-events: none;
}
body.editorial-home .editorial-list::before { top: 3px; }
body.editorial-home .editorial-list::after { bottom: 3px; }
body.editorial-home .editorial-product {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 382px;
  border-right: 1px solid rgba(244, 237, 228, .28);
  border-bottom: 0;
  background: #0d0b09;
}
body.editorial-home .editorial-product:last-child {
  border-right: 0;
}
body.editorial-home .editorial-product-copy {
  order: 2;
  min-height: 166px;
  padding: 25px 22px 25px 53px;
}
body.editorial-home .editorial-product-preview {
  order: 1;
  height: 190px;
  min-height: 190px;
}
body.editorial-home .editorial-product-preview::after {
  background:
    linear-gradient(180deg, rgba(13, 11, 9, .2), rgba(13, 11, 9, .72)),
    linear-gradient(90deg, rgba(13, 11, 9, .82), rgba(13, 11, 9, .12) 52%, rgba(13, 11, 9, .32));
}
body.editorial-home .editorial-product h1,
body.editorial-home .editorial-product h2 {
  margin-left: 0;
  font-size: clamp(2.2rem, 4.2vw, 3.75rem);
}
body.editorial-home .editorial-product p {
  margin-left: 0;
}
body.editorial-home .editorial-index {
  top: 25px;
  left: 24px;
}
body.editorial-home .editorial-mark {
  top: 59px;
  left: 24px;
}
body.editorial-home .editorial-arrow {
  top: 28px;
  right: 20px;
}
body.editorial-home .editorial-product:hover .editorial-product-preview img,
body.editorial-home .editorial-product:focus-visible .editorial-product-preview img {
  opacity: .78;
}
@media (max-width: 760px) {
  body.editorial-home .editorial-list {
    display: flex;
    gap: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-color: rgba(244, 237, 228, .36) transparent;
    scrollbar-width: thin;
  }
  body.editorial-home .editorial-product {
    flex: 0 0 min(80vw, 320px);
    min-height: 350px;
    scroll-snap-align: start;
  }
  body.editorial-home .editorial-product-preview {
    position: relative;
    inset: auto;
    height: 166px;
    min-height: 166px;
    opacity: 1;
  }
  body.editorial-home .editorial-product-copy {
    min-height: 152px;
    padding: 23px 18px 23px 47px;
  }
  body.editorial-home .editorial-index,
  body.editorial-home .editorial-mark {
    left: 20px;
  }
  body.editorial-home .editorial-index { top: 23px; }
  body.editorial-home .editorial-mark { top: 56px; }
  body.editorial-home .editorial-arrow {
    top: 23px;
    right: 17px;
  }
}


/* Unified charcoal product surfaces */
body.product-page,
body.product-page main,
body.product-page .hero,
body.product-page .product-feature-section,
body.product-page .tools-section,
body.product-page .site-footer {
  background: #151311 !important;
  color: #eef5fb !important;
}
body.product-page .hero {
  background:
    radial-gradient(70% 60% at 92% 8%, rgba(220, 111, 43, .08), transparent 68%),
    linear-gradient(160deg, #1b1816 0%, #151311 62%, #11100f 100%) !important;
  border-bottom-color: rgba(245, 231, 215, .22) !important;
}
body.product-page .product-feature-section,
body.product-page .tools-section {
  background: #11100f !important;
  color: #eef5fb !important;
}
body.product-page .site-footer {
  background: #0c0b0a !important;
  color: rgba(238, 245, 251, .72) !important;
}
body.product-page .hero h1,
body.product-page .hero-statement,
body.product-page .showcase-label,
body.product-page .section-title,
body.product-page .feature-name,
body.product-page .tool-name,
body.product-aebridge .feature h2 {
  color: #eef5fb !important;
}
body.product-page .hero-sub,
body.product-page .lead,
body.product-page .version-req,
body.product-page .section-desc,
body.product-page .feature-desc,
body.product-aebridge .feature p,
body.product-page .tool-blurb {
  color: rgba(213, 224, 236, .78) !important;
}
body.product-page .pain-points,
body.product-page .features,
body.product-aebridge .feature-grid {
  border-color: rgba(245, 231, 215, .24) !important;
}
body.product-page .pain-point,
body.product-page .feature-card,
body.product-aebridge .feature,
body.product-page .tool-card {
  border-color: rgba(213, 224, 236, .22) !important;
  color: #eef5fb !important;
}
body.product-elemental .hero > .container > .tools-section {
  border-top-color: rgba(245, 231, 215, .24) !important;
}
body.product-aebridge .hero-inner > .product-feature-section {
  margin: 52px 0 58px;
  padding: 0;
  border-top: 1px solid rgba(245, 231, 215, .24);
}
body.product-aebridge .hero-inner > .product-feature-section .product-feature-heading {
  padding-top: 42px;
}
body.product-aebridge .hero-inner > .product-feature-section .feature-grid {
  padding-bottom: 0;
}
@media (max-width: 760px) {
  body.product-aebridge .hero-inner > .product-feature-section {
    margin: 42px 0 46px;
  }
  body.product-aebridge .hero-inner > .product-feature-section .product-feature-heading {
    padding-top: 34px;
  }
}

/* Product details: keep supporting surfaces in the same charcoal system */
body.product-page > footer,
body.product-page .hero-badge,
body.product-aebridge .badge {
  background: #0c0b0a !important;
  color: #eef5fb !important;
  border-color: rgba(238, 245, 251, .28) !important;
}
body.product-difference .hero > .container > .product-feature-heading {
  margin: 52px 0 0;
  padding-top: 42px;
  border-top: 1px solid rgba(245, 231, 215, .24);
}
body.product-difference .hero > .container > .features {
  margin-bottom: 58px !important;
}
@media (max-width: 760px) {
  body.product-difference .hero > .container > .product-feature-heading {
    margin-top: 42px;
    padding-top: 34px;
  }
  body.product-difference .hero > .container > .features {
    margin-bottom: 46px !important;
  }
}

/* Borderless product summaries */
body.product-page .hero > .container > .tools-section,
body.product-page .hero > .container > .product-feature-heading,
body.product-page .hero-inner > .product-feature-section,
body.product-page .product-feature-section {
  border-top: 0 !important;
  border-bottom: 0 !important;
}
body.product-page .features,
body.product-aebridge .feature-grid {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

/* What It Does uses the page surface */
body.product-page .product-feature-section,
body.product-page .tools-section {
  background: transparent !important;
}

/* Remove homepage product rail dots */
body.editorial-home .editorial-list::before,
body.editorial-home .editorial-list::after {
  display: none !important;
}

/* Click-to-enlarge product screenshots */
body.product-page .slideshow img.active,
body.product-page .panel-showcase .panel-frame > img {
  cursor: zoom-in;
}
body.product-page .slideshow img:not(.active) {
  pointer-events: none;
}
body.product-page.image-modal-open {
  overflow: hidden;
}
body.product-page .image-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(4, 8, 16, .88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease, visibility .22s;
}
body.product-page .image-modal-overlay.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
body.product-page .image-modal {
  position: relative;
  width: min(1280px, 94vw);
  max-height: 92vh;
  overflow: hidden;
  border: 1px solid rgba(238, 245, 251, .28);
  border-radius: 20px;
  background: #0c0b0a;
  box-shadow: 0 40px 100px -20px rgba(0, 0, 0, .92);
  transform: scale(.94) translateY(16px);
  transition: transform .22s ease;
}
body.product-page .image-modal-overlay.open .image-modal {
  transform: scale(1) translateY(0);
}
body.product-page .image-modal > img {
  display: block;
  width: 100%;
  max-height: calc(92vh - 58px);
  object-fit: contain;
  background: #080706;
}
body.product-page .image-modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 18px;
  border-top: 1px solid rgba(238, 245, 251, .14);
}
body.product-page .image-modal-title {
  color: #eef5fb;
  font: 600 .9rem "Space Grotesk", sans-serif;
}
body.product-page .image-modal-close {
  display: inline-flex;
  align-items: center;
  padding: 5px 8px;
  border: 0;
  border-radius: 6px;
  background: none;
  color: rgba(213, 224, 236, .72);
  font: 600 .8rem "Manrope", sans-serif;
  cursor: pointer;
}
body.product-page .image-modal-close:hover,
body.product-page .image-modal-close:focus-visible {
  background: rgba(255, 255, 255, .08);
  color: #eef5fb;
  outline: none;
}
@media (max-width: 600px) {
  body.product-page .image-modal-overlay { padding: 12px; }
  body.product-page .image-modal { border-radius: 16px; }
  body.product-page .image-modal > img { max-height: calc(92vh - 54px); }
}

/* Darker orange contact buttons */
body.editorial-home .editorial-contact,
body.about-page .pf-final a {
  background: var(--pf-orange-dark) !important;
  color: var(--pf-paper-2) !important;
}
body.editorial-home .editorial-contact:hover,
body.editorial-home .editorial-contact:focus-visible,
body.about-page .pf-final a:hover,
body.about-page .pf-final a:focus-visible {
  background: #8f3509 !important;
  color: var(--pf-paper-2) !important;
}

/* Reference CTA palette */
:root {
  --pf-button-gold: #daa83c;
  --pf-button-ink: #1a202c;
}
.pf-final a,
body.editorial-home .editorial-contact,
body.product-page .hero-btn,
body.product-page .beta-btn,
body.product-aebridge .beta-btn {
  background: var(--pf-button-gold) !important;
  color: var(--pf-button-ink) !important;
  border-color: var(--pf-button-ink) !important;
}
.pf-final a::after,
body.editorial-home .editorial-contact::after,
body.product-page .hero-btn::after,
body.product-page .beta-btn::after,
body.product-aebridge .beta-btn::after {
  background: var(--pf-button-ink) !important;
  color: var(--pf-button-gold) !important;
}
.pf-final a:hover,
.pf-final a:focus-visible,
body.editorial-home .editorial-contact:hover,
body.editorial-home .editorial-contact:focus-visible,
body.product-page .hero-btn:hover,
body.product-page .hero-btn:focus-visible,
body.product-page .beta-btn:hover,
body.product-page .beta-btn:focus-visible,
body.product-aebridge .beta-btn:hover,
body.product-aebridge .beta-btn:focus-visible {
  background: #c79732 !important;
  color: var(--pf-button-ink) !important;
  border-color: var(--pf-button-ink) !important;
}

/* Homepage workflow CTA */
body.editorial-home .pf-final {
  width: min(940px, 100%);
  margin: clamp(52px, 7vw, 84px) auto 0;
  padding: clamp(64px, 9vw, 116px) 5vw;
  background: #1a202c;
  color: #eef5fb;
  border-top: 1px solid rgba(238, 245, 251, .22);
  text-align: center;
}
body.editorial-home .pf-final h2 span {
  color: var(--pf-button-gold) !important;
}
body.editorial-home .pf-final a {
  margin-top: 32px;
}

/* Full-bleed homepage workflow CTA */
body.editorial-home .pf-final {
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: 0;
}

/* Keep the homepage CTA centered and edge-to-edge at every viewport width. */
body.editorial-home .pf-final {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
}

/* Reference-style product dropdown */
.pf-nav .nav-dropdown-menu,
body.product-page .nav-dropdown-menu {
  top: calc(100% + 10px) !important;
  width: 280px !important;
  min-width: 240px !important;
  padding: 8px !important;
  background: #101a28 !important;
  border: 1px solid rgba(120, 148, 180, .28) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.pf-nav .nav-dropdown-menu::before,
body.product-page .nav-dropdown-menu::before {
  height: 12px !important;
}
.pf-nav .nav-dropdown-menu a,
body.product-page .nav-dropdown-menu a {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  border-radius: 8px !important;
  color: #eef5fb !important;
  text-align: left !important;
  transition: background .15s ease, color .15s ease !important;
}
.pf-nav .nav-dropdown-menu a:hover,
.pf-nav .nav-dropdown-menu a:focus-visible,
body.product-page .nav-dropdown-menu a:hover,
body.product-page .nav-dropdown-menu a:focus-visible {
  background: rgba(120, 148, 180, .08) !important;
  color: #eef5fb !important;
}
.pf-nav .nav-dropdown-menu .tool-dot,
body.product-page .nav-dropdown-menu .tool-dot {
  width: 10px !important;
  height: 10px !important;
  border-radius: 4px !important;
  flex: 0 0 10px !important;
}
.pf-nav .nav-dropdown-menu .tool-dot.eb,
body.product-page .nav-dropdown-menu .tool-dot.eb { background: oklch(.78 .15 78) !important; }
.pf-nav .nav-dropdown-menu .tool-dot.de,
body.product-page .nav-dropdown-menu .tool-dot.de { background: oklch(.74 .14 200) !important; }
.pf-nav .nav-dropdown-menu .tool-dot.ae,
body.product-page .nav-dropdown-menu .tool-dot.ae { background: oklch(.72 .16 155) !important; }
.pf-nav .nav-dropdown-menu .tool-info,
body.product-page .nav-dropdown-menu .tool-info {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
.pf-nav .nav-dropdown-menu .tool-info-name,
body.product-page .nav-dropdown-menu .tool-info-name {
  display: block !important;
  color: #eef5fb !important;
  font: 600 .9rem/1.3 "Manrope", sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.pf-nav .nav-dropdown-menu .tool-info-desc,
body.product-page .nav-dropdown-menu .tool-info-desc {
  display: block !important;
  margin-top: 2px !important;
  color: #5b7793 !important;
  font: 400 .72rem/1.3 "Manrope", sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Navigation labels are text controls, not inline links. */
.pf-nav a,
body.product-page .site-nav a {
  text-decoration: none !important;
}

/* Dedicated Products index */
body.products-index-page {
  min-height: 100svh;
  background:
    radial-gradient(72% 58% at 92% 2%, rgba(218, 168, 60, .08), transparent 68%),
    linear-gradient(160deg, #1b1816 0%, #151311 62%, #11100f 100%) !important;
  color: #eef5fb !important;
}
body.products-index-page .products-index-main {
  width: min(1320px, 100%);
  min-height: calc(100svh - 68px);
  margin: 0 auto;
  padding: clamp(74px, 9vw, 132px) clamp(22px, 6vw, 82px) clamp(76px, 10vw, 132px);
  box-sizing: border-box;
}
body.products-index-page .products-index-intro {
  position: relative;
  width: min(900px, 100%);
  margin: 0 auto clamp(62px, 8vw, 108px);
  text-align: center;
}
body.products-index-page .products-index-kicker {
  margin: 0 0 24px;
  color: var(--pf-button-gold);
  font: 500 .7rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.products-index-page .products-index-intro h1 {
  margin: 0;
  color: #f7f0e7;
  font: 700 clamp(3.2rem, 7vw, 6.4rem)/.86 "Space Grotesk", sans-serif;
  letter-spacing: -.085em;
}
body.products-index-page .products-index-intro > p:last-child {
  width: min(640px, 100%);
  margin: 26px auto 0;
  color: rgba(213, 224, 236, .72);
  font: 500 clamp(.95rem, 1.2vw, 1.12rem)/1.65 "Manrope", sans-serif;
}
body.products-index-page .products-index-products {
  width: 100%;
  margin: 0 auto;
}
body.products-index-page .products-index-products .editorial-products-head {
  border-bottom-color: rgba(244, 237, 228, .86);
}
body.products-index-page .products-index-products .editorial-footer {
  margin-top: 22px;
}
body.products-index-page .products-index-final {
  width: 100%;
  margin: 0;
}

/* Keep the products menu inside the viewport on narrow screens. The desktop
   menu is anchored to its trigger; on mobile a fixed, viewport-aware panel
   avoids clipping against the left edge when the trigger sits near the right. */
@media (max-width: 760px) {
  .pf-nav .nav-dropdown-menu,
  body.product-page .nav-dropdown-menu {
    position: fixed !important;
    top: 70px !important;
    right: 12px !important;
    left: auto !important;
    width: min(280px, calc(100vw - 24px)) !important;
  }
}

@media (max-width: 680px) {
  body.products-index-page .products-index-main {
    min-height: 0;
    padding: 64px 22px 82px;
  }
  body.products-index-page .products-index-intro {
    margin-bottom: 52px;
  }
  body.products-index-page .products-index-kicker {
    margin-bottom: 20px;
    font-size: .62rem;
  }
  body.products-index-page .products-index-intro h1 {
    font-size: clamp(3rem, 14vw, 4.6rem);
  }
  body.products-index-page .products-index-intro > p:last-child {
    margin-top: 22px;
    font-size: .9rem;
  }
}

/* Homepage navigation: a slimmer Fox-yellow header. */
body.editorial-home .pf-nav {
  height: 68px !important;
  background: var(--pf-yellow) !important;
  border-bottom: 2px solid #171310 !important;
}
body.editorial-home .pf-brand,
body.editorial-home .pf-brand strong,
body.editorial-home .pf-nav-links > li > a {
  color: #171310 !important;
}
body.editorial-home .pf-brand-mark {
  background: #171310 !important;
  color: var(--pf-yellow) !important;
}
body.editorial-home .pf-nav-links > li > a:hover,
body.editorial-home .pf-nav-links > li > a:focus-visible {
  color: var(--pf-orange-dark) !important;
}
body.editorial-home .editorial-home-shell {
  min-height: calc(100svh - 68px);
}
@media (max-width: 760px) {
  body.editorial-home .pf-nav {
    height: 64px !important;
  }
  body.editorial-home .editorial-home-shell {
    min-height: calc(100svh - 64px);
  }
}

/* About page: centered charcoal reading composition */
body.about-page {
  background:
    radial-gradient(72% 58% at 92% 2%, rgba(218, 168, 60, .1), transparent 68%),
    linear-gradient(160deg, #1b1816 0%, #151311 62%, #11100f 100%) !important;
  color: #eef5fb !important;
}
body.about-page main {
  background: transparent !important;
}
body.about-page .pf-about-story {
  position: relative;
  display: block;
  min-height: calc(100svh - 86px);
  overflow: hidden;
  padding: clamp(76px, 10vw, 144px) clamp(24px, 8vw, 120px) clamp(86px, 11vw, 156px);
  background: transparent !important;
  border-bottom: 1px solid rgba(245, 231, 215, .2) !important;
}
body.about-page .pf-about-story::before {
  position: absolute;
  z-index: 0;
  top: -.17em;
  right: -.045em;
  color: rgba(238, 245, 251, .045);
  content: "ABOUT";
  font: 700 clamp(12rem, 31vw, 31rem)/.75 "Space Grotesk", sans-serif;
  letter-spacing: -.1em;
  pointer-events: none;
  user-select: none;
}
body.about-page .pf-about-story::after {
  position: absolute;
  z-index: 0;
  top: 18%;
  left: 0;
  width: 9px;
  height: clamp(120px, 18vw, 240px);
  background: var(--pf-button-gold);
  content: "";
  opacity: .9;
}
body.about-page .pf-about-story-label,
body.about-page .pf-about-story-copy {
  position: relative;
  z-index: 1;
  width: min(900px, 100%);
  margin-right: auto;
  margin-left: auto;
}
body.about-page .pf-about-story-label {
  margin-bottom: clamp(28px, 4vw, 48px);
  color: var(--pf-button-gold) !important;
  font-size: .72rem;
  letter-spacing: .2em;
  text-align: center;
}
body.about-page .pf-about-origin {
  width: min(820px, 100%);
  max-width: none;
  margin: 0 auto;
  gap: 24px;
}
body.about-page .pf-about-origin p {
  color: #eef5fb !important;
  font-size: clamp(1.08rem, 1.55vw, 1.5rem);
  line-height: 1.62;
  letter-spacing: -.015em;
}
body.about-page .pf-about-founder {
  display: block;
  width: min(920px, 100%);
  margin: clamp(76px, 10vw, 128px) auto 0;
  padding-top: 30px;
  border-top: 1px solid rgba(245, 231, 215, .28) !important;
  text-align: center;
}
body.about-page .pf-about-founder h2 {
  max-width: 760px;
  margin: 0 auto 30px;
  color: #eef5fb !important;
  font-size: clamp(2.2rem, 4.6vw, 4.6rem);
  line-height: .94;
}
body.about-page .pf-about-founder h2 span {
  color: var(--pf-button-gold) !important;
  font-size: .62em;
  letter-spacing: -.02em;
}
body.about-page .pf-about-founder-copy {
  display: grid;
  width: min(760px, 100%);
  margin: 0 auto;
  gap: 22px;
  text-align: left;
}
body.about-page .pf-about-founder-copy > p {
  max-width: none;
  margin: 0;
  color: rgba(213, 224, 236, .78) !important;
  font-size: clamp(.96rem, 1.08vw, 1.08rem);
  line-height: 1.78;
}
body.about-page .pf-final {
  width: 100%;
  max-width: none;
  margin: 0;
  background: #1a202c !important;
  border-top: 0 !important;
  color: #eef5fb !important;
}
body.about-page .pf-footer {
  background: #0c0b0a !important;
  color: rgba(238, 245, 251, .68) !important;
}
@media (max-width: 680px) {
  body.about-page .pf-about-story {
    min-height: 0;
    padding: 64px 22px 82px;
  }
  body.about-page .pf-about-story::before {
    top: -.04em;
    right: -.12em;
    font-size: 12rem;
  }
  body.about-page .pf-about-story::after {
    top: 13%;
    width: 7px;
    height: 120px;
  }
  body.about-page .pf-about-story-label {
    margin-bottom: 30px;
    font-size: .62rem;
  }
  body.about-page .pf-about-origin p {
    font-size: 1.05rem;
    line-height: 1.62;
  }
  body.about-page .pf-about-founder {
    margin-top: 72px;
    padding-top: 24px;
  }
  body.about-page .pf-about-founder h2 {
    margin-bottom: 25px;
    font-size: clamp(2.2rem, 12vw, 3.8rem);
  }
  body.about-page .pf-about-founder-copy > p {
    font-size: .95rem;
    line-height: 1.7;
  }
}

/* Keep the menu on the same charcoal surface as the page beneath it. */
.pf-nav .nav-dropdown-menu,
body.product-page .nav-dropdown-menu {
  background: #151311 !important;
}

/* Shared navigation refresh: one warmer surface and one consistent height. */
:root {
  --pf-nav-surface: #f2c94c;
  --pf-nav-height: 68px;
  --pf-nav-height-mobile: 60px;
}
html {
  scrollbar-gutter: stable;
}
.pf-nav,
body.product-page .site-nav {
  height: var(--pf-nav-height) !important;
  background: var(--pf-nav-surface) !important;
  border-bottom: 2px solid rgba(23, 19, 16, .7) !important;
}
.pf-nav-inner,
body.product-page .site-nav .container {
  height: 100% !important;
}
body.editorial-home .pf-nav {
  height: var(--pf-nav-height) !important;
  background: var(--pf-nav-surface) !important;
}
.pf-brand,
.pf-brand strong,
body.product-page .nav-brand,
body.product-page .nav-brand b {
  color: #171310 !important;
}
.pf-nav-links > li.nav-dropdown,
body.product-page .nav-links > li.nav-dropdown {
  width: 116px !important;
  min-width: 116px !important;
  flex: 0 0 116px !important;
}
body.products-index-page .products-index-main,
body.editorial-home .editorial-home-shell,
body.about-page .pf-about-story {
  min-height: calc(100svh - var(--pf-nav-height));
}
@media (max-width: 760px) {
  .pf-nav,
  body.product-page .site-nav,
  body.editorial-home .pf-nav {
    height: var(--pf-nav-height-mobile) !important;
  }
  body.products-index-page .products-index-main,
  body.editorial-home .editorial-home-shell,
  body.about-page .pf-about-story {
    min-height: calc(100svh - var(--pf-nav-height-mobile));
  }
}

/* Products is a menu control; the product index is intentionally not linked. */
.pf-nav .nav-dropdown-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #171310 !important;
  cursor: pointer !important;
  font: 700 .88rem "Space Grotesk", sans-serif !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}
.pf-nav .nav-dropdown-toggle:hover,
.pf-nav .nav-dropdown-toggle:focus-visible {
  color: #fffaf0 !important;
}
.pf-nav .nav-dropdown-toggle:focus-visible {
  outline: 2px solid #fffaf0 !important;
  outline-offset: 5px !important;
}
body.product-page .nav-tools-link {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
}

/* Reference-style product pages: a quiet, poster-like two-column hero. */
body.product-page .hero {
  min-height: 0 !important;
  padding: clamp(58px, 7vw, 92px) 0 clamp(58px, 7vw, 88px) !important;
  background:
    radial-gradient(58% 70% at 92% 8%, rgba(220, 111, 43, .09), transparent 72%),
    linear-gradient(145deg, #1b1816 0%, #151311 62%, #11100f 100%) !important;
  border: 0 !important;
}
body.product-page .hero::after { display: none !important; }
body.product-page .hero > .container,
body.product-page .hero-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr) !important;
  column-gap: clamp(42px, 6vw, 92px) !important;
  row-gap: 0 !important;
  width: min(100% - 48px, 1020px) !important;
  max-width: 1020px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: left !important;
}
body.product-page .hero-product-name,
body.product-aebridge .eyebrow,
body.product-page .hero > .container > h1,
body.product-aebridge .hero-inner > h1,
body.product-page .hero-statement,
body.product-aebridge .hero-inner > .lead,
body.product-page .hero-sub,
body.product-page .version-req,
body.product-aebridge .hero-inner > .version-req,
body.product-page .hero-badge,
body.product-aebridge .hero-inner > .badge,
body.product-page .hero-cta {
  grid-column: 1 !important;
}
body.product-page .hero-product-name,
body.product-aebridge .eyebrow {
  margin: 0 0 14px !important;
  font-size: .58rem !important;
  letter-spacing: .2em !important;
}
body.product-page .hero > .container > h1,
body.product-aebridge .hero-inner > h1 {
  max-width: 520px !important;
  margin: 0 0 15px !important;
  font-size: clamp(3.8rem, 6.8vw, 6.4rem) !important;
  line-height: .82 !important;
  letter-spacing: -.085em !important;
}
body.product-page .hero-statement,
body.product-aebridge .hero-inner > .hero-statement {
  max-width: 520px !important;
  margin: 0 0 14px !important;
  font-size: clamp(1.45rem, 2.5vw, 2.25rem) !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
}
body.product-page .hero-sub,
body.product-aebridge .hero-inner > .lead {
  max-width: 490px !important;
  margin: 0 0 13px !important;
  font-size: .76rem !important;
  line-height: 1.55 !important;
}
body.product-page .version-req,
body.product-aebridge .hero-inner > .version-req {
  max-width: 490px !important;
  margin: 0 0 13px !important;
  font-size: .58rem !important;
  line-height: 1.5 !important;
}
body.product-page .hero-badge,
body.product-aebridge .hero-inner > .badge {
  justify-self: start !important;
  margin: 0 !important;
  padding: 6px 9px !important;
  font-size: .52rem !important;
  letter-spacing: .1em !important;
}
body.product-page:not(.product-aebridge) .hero > .container > .panel-showcase {
  grid-column: 2 !important;
  grid-row: 1 / span 10 !important;
  align-self: start !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.product-page .panel-frame,
body.product-aebridge .panel-frame {
  border: 1px solid rgba(238, 245, 251, .5) !important;
  border-radius: 3px !important;
  box-shadow: 8px 8px 0 #dc6f2b !important;
}
body.product-page .panel-frame > img,
body.product-page .panel-frame .slideshow {
  width: 100% !important;
}
body.product-page .panel-frame > img {
  height: auto !important;
}
body.product-page .hero-cta {
  justify-self: start !important;
  margin: 24px 0 0 !important;
  text-align: left !important;
}

/* Keep What It Does beneath the left-hand story, like the reference. */
body.product-page > .hero > .container > .tools-section,
body.product-page > .hero > .container > .product-feature-heading,
body.product-page > .hero > .container > .features,
body.product-aebridge .hero-inner > .product-feature-section {
  grid-column: 1 !important;
}
body.product-page > .hero > .container > .tools-section,
body.product-aebridge .hero-inner > .product-feature-section {
  margin: clamp(54px, 7vw, 82px) 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
body.product-page > .hero > .container > .tools-section > .container {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}
body.product-page .product-feature-heading {
  margin: 0 0 20px !important;
}
body.product-page .product-feature-heading .section-label,
body.product-page .tools-section > .container > .section-label {
  margin: 0 0 10px !important;
  text-align: left !important;
}
body.product-page .product-feature-heading .section-title,
body.product-page .tools-section .section-title {
  margin: 0 !important;
  font-size: clamp(2.55rem, 4.8vw, 4.5rem) !important;
  line-height: .88 !important;
  letter-spacing: -.075em !important;
  text-align: left !important;
}
body.product-page .product-feature-heading .section-desc,
body.product-page .tools-section .section-desc {
  max-width: 440px !important;
  margin: 12px 0 0 !important;
  font-size: .68rem !important;
  line-height: 1.55 !important;
  text-align: left !important;
}
body.product-page .features,
body.product-aebridge .feature-grid {
  width: 100% !important;
  margin: 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  border: 0 !important;
}
body.product-page .feature-card,
body.product-aebridge .feature-grid .feature {
  min-width: 0 !important;
  padding: 15px 16px 0 0 !important;
  border: 0 !important;
  border-right: 1px solid rgba(213, 224, 236, .18) !important;
  border-radius: 0 !important;
}
body.product-page .feature-card:last-child,
body.product-aebridge .feature-grid .feature:last-child {
  border-right: 0 !important;
  padding-right: 0 !important;
}
body.product-page .feature-card + .feature-card,
body.product-aebridge .feature-grid .feature + .feature {
  padding-left: 16px !important;
  border-left: 0 !important;
}
body.product-page .feature-name,
body.product-aebridge .feature-grid .feature h2 {
  font-size: .72rem !important;
  line-height: 1.25 !important;
}
body.product-page .feature-desc,
body.product-aebridge .feature-grid .feature p {
  margin-top: 7px !important;
  font-size: .57rem !important;
  line-height: 1.5 !important;
}

/* AE Bridge keeps its panel beside the hero, then brings the beta section full width. */
body.product-aebridge main {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr) !important;
  column-gap: clamp(42px, 6vw, 92px) !important;
  width: min(100% - 48px, 1020px) !important;
  max-width: 1020px !important;
  margin: 0 auto !important;
}
body.product-aebridge .hero {
  grid-column: 1 !important;
  padding: clamp(58px, 7vw, 92px) 0 58px !important;
}
body.product-aebridge .hero-inner {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
body.product-aebridge .panel-showcase {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
  width: 100% !important;
  margin: clamp(58px, 7vw, 92px) 0 0 !important;
  padding: 0 !important;
}
body.product-aebridge .beta-section,
body.product-aebridge > footer {
  grid-column: 1 / -1 !important;
}

@media (max-width: 860px) {
  body.product-page .hero > .container,
  body.product-page .hero-inner,
  body.product-aebridge main {
    display: block !important;
    width: calc(100% - 32px) !important;
    max-width: 720px !important;
  }
  body.product-page .hero {
    padding: 54px 0 56px !important;
  }
  body.product-page .hero > .container > .panel-showcase,
  body.product-aebridge .panel-showcase {
    width: 100% !important;
    margin: 42px auto 0 !important;
  }
  body.product-page .hero > .container > .tools-section,
  body.product-aebridge .hero-inner > .product-feature-section {
    margin-top: 56px !important;
  }
  body.product-aebridge .hero {
    padding-bottom: 0 !important;
  }
  body.product-aebridge .beta-section {
    margin-top: 56px !important;
  }
}
@media (max-width: 620px) {
  body.product-page .hero > .container,
  body.product-page .hero-inner,
  body.product-aebridge main {
    width: calc(100% - 32px) !important;
  }
  body.product-page .hero > .container > h1,
  body.product-aebridge .hero-inner > h1 {
    font-size: clamp(3.3rem, 16vw, 5rem) !important;
  }
  body.product-page .hero-statement,
  body.product-aebridge .hero-inner > .hero-statement {
    font-size: clamp(1.35rem, 7vw, 1.85rem) !important;
  }
  body.product-page .features,
  body.product-aebridge .feature-grid {
    grid-template-columns: 1fr !important;
  }
  body.product-page .feature-card,
  body.product-aebridge .feature-grid .feature,
  body.product-page .feature-card + .feature-card,
  body.product-aebridge .feature-grid .feature + .feature {
    padding: 14px 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(213, 224, 236, .18) !important;
  }
body.product-page .feature-card:last-child,
body.product-aebridge .feature-grid .feature:last-child {
    border-bottom: 0 !important;
  }
}

/* Final reference-fit overrides must remain after the legacy product rules. */
body.product-page .hero,
body.product-aebridge .hero {
  padding-top: clamp(32px, 4vw, 48px) !important;
}
body.product-page > .hero > .container > .tools-section,
body.product-aebridge .hero-inner > .product-feature-section {
  margin-top: clamp(30px, 4vw, 44px) !important;
}
body.product-aebridge .panel-showcase {
  margin-top: clamp(32px, 4vw, 48px) !important;
}
body.product-aebridge .product-feature-heading {
  padding-top: 0 !important;
}

/* Give the slide preview enough presence to read as part of the product story. */
body.product-page:not(.product-aebridge) .hero > .container > .panel-showcase,
body.product-aebridge .panel-showcase {
  width: min(100%, 460px) !important;
  max-width: 460px !important;
}

/* Increase supporting type for comfortable reading at the desktop preview size. */
body.product-page .hero-product-name,
body.product-aebridge .eyebrow {
  font-size: .68rem !important;
}
body.product-page .hero-sub,
body.product-aebridge .hero-inner > .lead {
  font-size: .88rem !important;
  line-height: 1.58 !important;
}
body.product-page .version-req,
body.product-aebridge .hero-inner > .version-req {
  font-size: .68rem !important;
  line-height: 1.55 !important;
}
body.product-page .hero-badge,
body.product-aebridge .hero-inner > .badge {
  font-size: .62rem !important;
}
body.product-page .product-feature-heading .section-desc,
body.product-page .tools-section .section-desc {
  font-size: .78rem !important;
  line-height: 1.55 !important;
}
body.product-page .feature-name,
body.product-aebridge .feature-grid .feature h2 {
  font-size: .82rem !important;
  line-height: 1.3 !important;
}
body.product-page .feature-desc,
body.product-aebridge .feature-grid .feature p {
  font-size: .70rem !important;
  line-height: 1.55 !important;
}

/* Let the product visual carry more of the desktop composition. */
body.product-page .hero > .container,
body.product-aebridge main {
  width: min(100% - 48px, 1200px) !important;
  max-width: 1200px !important;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr) !important;
  column-gap: clamp(36px, 4vw, 64px) !important;
}
body.product-page:not(.product-aebridge) .hero > .container > .panel-showcase,
body.product-aebridge .panel-showcase {
  width: 100% !important;
  max-width: none !important;
}

@media (max-width: 980px) and (min-width: 861px) {
  body.product-page .hero > .container,
  body.product-aebridge main {
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr) !important;
    column-gap: 28px !important;
  }
}

/* Reference-scale desktop canvas: keep the visual prominent without letting it
   overwhelm the left-hand product story. */
@media (min-width: 861px) {
  body.product-page .hero > .container,
  body.product-aebridge main {
    width: min(100% - 48px, 1020px) !important;
    max-width: 1020px !important;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr) !important;
    column-gap: clamp(42px, 6vw, 92px) !important;
  }
  body.product-page:not(.product-aebridge) .hero > .container > .panel-showcase,
  body.product-aebridge .panel-showcase {
    width: min(100%, 460px) !important;
    max-width: 460px !important;
  }
}

/* Elemental Bender's four tool summaries read as one horizontal strip on
   desktop, while the heading stays anchored to the left story. */
@media (min-width: 861px) {
  body.product-elemental > .hero > .container > .tools-section {
    width: min(1020px, calc(100vw - 48px)) !important;
  }
  body.product-elemental .tools-section > .container {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
  }
  body.product-elemental .tools-section .tools-grid.active {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* Product CTAs echo the homepage, with a shorter footprint at the end of a
   product page. */
body.product-page .product-final {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(32px, 4.5vw, 58px) 5vw clamp(36px, 5vw, 64px);
  box-sizing: border-box;
  background: #1a202c !important;
  color: #eef5fb !important;
  border-top: 1px solid rgba(238, 245, 251, .2);
  text-align: center;
}
body.product-aebridge .product-final { grid-column: 1 / -1 !important; }
body.product-page .product-final h2 {
  margin: 0;
  font-size: clamp(1.8rem, 3.2vw, 2.8rem);
  line-height: .98;
  letter-spacing: -.045em;
}
body.product-page .product-final h2 span { color: var(--pf-button-gold) !important; }
body.product-page .product-final a {
  display: inline-flex;
  margin-top: 18px;
  padding: 10px 24px;
  font-size: .78rem;
}

/* Keep the Products control on one stable line on every product page. */
.pf-nav-links > li,
body.product-page .nav-links > li {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
}
.pf-nav .nav-dropdown,
body.product-page .nav-dropdown {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.pf-nav .nav-dropdown-toggle,
body.product-page .nav-tools-control,
body.product-page .nav-dropdown-toggle {
  flex: 0 0 auto !important;
  align-items: center !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}
body.product-page .nav-tools-control {
  display: inline-flex !important;
  justify-content: center !important;
  width: 116px !important;
  min-width: 116px !important;
  gap: 4px !important;
}
body.product-page .nav-tools-link,
body.product-page .nav-dropdown-toggle {
  height: 24px !important;
  white-space: nowrap !important;
}
body.product-page .nav-dropdown-toggle svg { flex: 0 0 12px !important; }

/* Arrow navigation for the full-size image lightbox. */
body.product-page .image-modal-nav {
  position: absolute;
  inset: 0 0 56px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 14px;
  pointer-events: none;
}
body.product-page .image-modal-arrow {
  pointer-events: auto;
  display: inline-grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(238, 245, 251, .5);
  border-radius: 50%;
  background: rgba(12, 11, 10, .76);
  color: #eef5fb;
  font: 500 1.45rem/1 "Space Grotesk", sans-serif;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
body.product-page .image-modal-arrow:hover,
body.product-page .image-modal-arrow:focus-visible {
  background: var(--pf-button-gold);
  border-color: var(--pf-button-gold);
  color: var(--pf-button-ink);
  transform: scale(1.06);
  outline: none;
}
body.product-page .image-modal-overlay.single-slide .image-modal-arrow { display: none; }
@media (max-width: 600px) {
  body.product-page .image-modal-nav { inset: 0 0 54px; padding: 0 8px; }
  body.product-page .image-modal-arrow { width: 38px; height: 38px; font-size: 1.2rem; }
}

/* Final pass: keep the shared header geometry identical on every page. */
.pf-nav,
body.product-page .site-nav {
  box-sizing: border-box !important;
  height: var(--pf-nav-height) !important;
}
.pf-nav-inner,
body.product-page .site-nav .container {
  width: min(1180px, calc(100% - 44px)) !important;
  max-width: 1180px !important;
  box-sizing: border-box !important;
  height: 100% !important;
}

/* Give the product preview a genuinely readable share of the desktop frame. */
@media (min-width: 861px) {
  body.product-page .hero > .container,
  body.product-aebridge main {
    width: min(calc(100% - 48px), 1120px) !important;
    max-width: 1120px !important;
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr) !important;
    column-gap: clamp(42px, 5vw, 68px) !important;
  }
  body.product-page:not(.product-aebridge) .hero > .container > .panel-showcase,
  body.product-aebridge .panel-showcase {
    width: min(100%, 560px) !important;
    max-width: 560px !important;
  }
  body.product-elemental > .hero > .container > .tools-section {
    width: min(1120px, calc(100vw - 48px)) !important;
  }
}

/* Product CTAs keep the homepage treatment, at roughly half its visual scale. */
body.product-page .product-final {
  padding: clamp(28px, 3.4vw, 42px) 5vw clamp(30px, 3.8vw, 48px) !important;
}
body.product-page .product-final h2 {
  font-size: clamp(1.65rem, 2.8vw, 2.45rem) !important;
  line-height: .98 !important;
}
body.product-page .product-final a {
  gap: 7px !important;
  margin-top: 14px !important;
  padding: 6px 8px 6px 11px !important;
  border-width: 1px !important;
  box-shadow: 4px 4px 0 var(--pf-orange) !important;
  font-size: .64rem !important;
  transform: none !important;
}
body.product-page .product-final a::after {
  width: 16px !important;
  height: 16px !important;
  font-size: .6rem !important;
}
body.product-page .product-final a:hover,
body.product-page .product-final a:focus-visible {
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 var(--pf-orange) !important;
}

/* AE Bridge places its CTA in a grid; let it span the same full width as the
   homepage CTA instead of stopping at the centered content rail. */
body.product-aebridge .product-final {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
}

@media (max-width: 760px) {
  .pf-nav,
  body.product-page .site-nav {
    height: var(--pf-nav-height-mobile) !important;
  }
  .pf-nav-inner,
  body.product-page .site-nav .container {
    width: calc(100% - 28px) !important;
    max-width: none !important;
  }
}

/* Center the Products label on the same text baseline as Home, About, and
   Contact; the two product-page buttons should not create a taller row. */
.pf-nav .nav-dropdown,
body.product-page .nav-dropdown {
  height: 18px !important;
}
.pf-nav .nav-dropdown-toggle,
body.product-page .nav-tools-control,
body.product-page .nav-tools-link,
body.product-page .nav-dropdown-toggle {
  height: 18px !important;
  line-height: 18px !important;
}
body.product-page .nav-tools-control { gap: 2px !important; }

/* Keep every workflow CTA on one centered, compact scale. */
.pf-final {
  padding: clamp(28px, 3.4vw, 42px) 5vw clamp(30px, 3.8vw, 48px) !important;
  text-align: center !important;
}
.pf-final h2 {
  max-width: 950px !important;
  margin: 0 auto !important;
  font-size: 2.75rem !important;
  line-height: .98 !important;
}
.pf-final a {
  gap: 10px !important;
  margin-top: 18px !important;
  padding: 9px 12px 9px 16px !important;
  border-width: 2px !important;
  box-shadow: 6px 6px 0 var(--pf-orange) !important;
  font-size: .78rem !important;
  transform: none !important;
}
.pf-final a::after {
  width: 22px !important;
  height: 22px !important;
  font-size: .72rem !important;
}
.pf-final a:hover,
.pf-final a:focus-visible {
  transform: translate(-3px, -3px) !important;
  box-shadow: 8px 8px 0 var(--pf-orange) !important;
}

/* Elemental Bender only: trim the oversized preview by 20% while keeping
   Difference Engine and AE Bridge at the larger reading scale. */
@media (min-width: 861px) {
  body.product-page.product-elemental:not(.product-aebridge) .hero > .container > .panel-showcase {
    width: min(100%, 448px) !important;
    max-width: 448px !important;
  }
}

/* AE Bridge columns inherit the page surface; only the image frame itself
   keeps a panel treatment. */
body.product-aebridge main,
body.product-aebridge .hero,
body.product-aebridge .hero-inner,
body.product-aebridge .panel-showcase,
body.product-aebridge .product-feature-section,
body.product-aebridge .showcase-footer {
  background: transparent !important;
}

@media (max-width: 600px) {
  .pf-final h2 {
    font-size: clamp(1.85rem, 9vw, 2.75rem) !important;
  }
}

/* Contact page */
body.contact-page {
  min-height: 100svh;
  margin: 0;
  background:
    radial-gradient(70% 70% at 100% 0%, rgba(242, 201, 76, .08), transparent 68%),
    linear-gradient(145deg, #1b1714 0%, #151311 56%, #0f0e0d 100%) !important;
  color: #f4ede4 !important;
  font-family: "Manrope", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.contact-page *,
body.contact-page *::before,
body.contact-page *::after { box-sizing: border-box; }
body.contact-page .pf-contact-main {
  width: min(1040px, calc(100% - 44px));
  min-height: calc(100svh - 144px);
  margin: 0 auto;
  padding: clamp(58px, 8vw, 110px) 0 clamp(64px, 9vw, 120px);
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(360px, 1.15fr);
  align-items: start;
  gap: clamp(48px, 9vw, 132px);
}
body.contact-page .pf-contact-intro {
  position: relative;
  padding-top: 8px;
}
body.contact-page .pf-contact-intro::before {
  position: absolute;
  top: -52px;
  left: -24px;
  color: rgba(244, 237, 228, .045);
  content: "?";
  font: 700 clamp(14rem, 26vw, 22rem)/.8 "Space Grotesk", sans-serif;
  letter-spacing: -.12em;
  pointer-events: none;
}
body.contact-page .pf-contact-label {
  position: relative;
  z-index: 1;
  margin: 0 0 22px;
  color: var(--pf-yellow);
  font: 500 .72rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.contact-page .pf-contact-intro h1 {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #f7f1e9;
  font: 700 clamp(3rem, 6.4vw, 6.6rem)/.86 "Space Grotesk", sans-serif;
  letter-spacing: -.08em;
}
body.contact-page .pf-contact-intro h1 span { color: var(--pf-yellow); }
body.contact-page .pf-contact-intro p {
  max-width: 390px;
  margin: 30px 0 0;
  color: rgba(244, 237, 228, .68);
  font-size: clamp(.95rem, 1.25vw, 1.12rem);
  line-height: 1.65;
}
body.contact-page .pf-contact-form {
  display: grid;
  gap: 22px;
  padding: clamp(26px, 4vw, 42px);
  background: rgba(26, 24, 21, .76);
  border: 1px solid rgba(244, 237, 228, .2);
  box-shadow: 9px 9px 0 rgba(242, 201, 76, .8);
}
body.contact-page .pf-contact-field { display: grid; gap: 9px; }
body.contact-page .pf-contact-field label {
  color: #f4ede4;
  font: 600 .72rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body.contact-page .pf-contact-field input,
body.contact-page .pf-contact-field textarea {
  width: 100%;
  border: 1px solid rgba(244, 237, 228, .34);
  border-radius: 2px;
  outline: 0;
  background: rgba(15, 14, 13, .72);
  color: #fffaf0;
  font: 500 1rem/1.45 "Manrope", sans-serif;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
body.contact-page .pf-contact-field input {
  min-height: 48px;
  padding: 11px 13px;
}
body.contact-page .pf-contact-field textarea {
  min-height: 164px;
  padding: 12px 13px;
  resize: vertical;
}
body.contact-page .pf-contact-field input:focus,
body.contact-page .pf-contact-field textarea:focus {
  border-color: var(--pf-yellow);
  background: rgba(15, 14, 13, .92);
  box-shadow: 0 0 0 3px rgba(242, 201, 76, .16);
}
body.contact-page .pf-contact-honeypot {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
body.contact-page .pf-contact-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  padding-top: 3px;
}
body.contact-page .pf-contact-submit {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 11px 15px 11px 18px;
  border: 2px solid #1a202c;
  border-radius: 0;
  background: var(--pf-button-gold);
  box-shadow: 6px 6px 0 #1a202c;
  color: #1a202c;
  cursor: pointer;
  font: 700 .8rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
body.contact-page .pf-contact-submit span { font: 700 1.15rem/1 "Manrope", sans-serif; }
body.contact-page .pf-contact-submit:hover,
body.contact-page .pf-contact-submit:focus-visible {
  transform: translate(-3px, -3px);
  box-shadow: 9px 9px 0 #1a202c;
  background: #e5b84a;
  outline: 0;
}
body.contact-page .pf-contact-submit:disabled {
  cursor: wait;
  opacity: .66;
  transform: none;
  box-shadow: 6px 6px 0 #1a202c;
}
body.contact-page .pf-contact-status {
  min-height: 1.3em;
  margin: 0;
  color: rgba(244, 237, 228, .64);
  font-size: .86rem;
  line-height: 1.45;
}
body.contact-page .pf-contact-status[data-state="success"] { color: var(--pf-yellow); }
body.contact-page .pf-contact-status[data-state="error"] { color: #ffb3a7; }
body.contact-page .pf-footer {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 5vw !important;
  color: rgba(244, 237, 228, .74) !important;
  text-align: center;
}
@media (max-width: 760px) {
  body.contact-page .pf-contact-main {
    width: min(100% - 32px, 560px);
    min-height: 0;
    padding: 54px 0 76px;
    grid-template-columns: 1fr;
    gap: 42px;
  }
  body.contact-page .pf-contact-intro { padding-top: 0; }
  body.contact-page .pf-contact-intro::before {
    top: -30px;
    left: -12px;
    font-size: 12rem;
  }
  body.contact-page .pf-contact-intro h1 { font-size: clamp(3.05rem, 14vw, 4.7rem); }
  body.contact-page .pf-contact-intro p { margin-top: 22px; }
  body.contact-page .pf-contact-form {
    padding: 24px 20px;
    box-shadow: 6px 6px 0 rgba(242, 201, 76, .8);
  }
  body.contact-page .pf-contact-actions { align-items: flex-start; flex-direction: column; }
}

/* Match the What It Does copy to Elemental Bender's more readable scale. */
body.product-page:not(.product-elemental) .feature-name,
body.product-aebridge .feature-grid .feature h2 {
  font-size: 1.12rem !important;
  line-height: 1.2 !important;
}
body.product-page:not(.product-elemental) .feature-desc,
body.product-aebridge .feature-grid .feature p {
  font-size: .875rem !important;
  line-height: 1.55 !important;
}

/* Use the supplied fox mark as a compact, consistent navigation glyph. */
.pf-nav-mark,
body.product-page .nav-brand .pf-nav-mark {
  display: block !important;
  width: 18px !important;
  height: 23px !important;
  flex: 0 0 auto !important;
  object-fit: contain !important;
  object-position: center !important;
}
.pf-brand > span,
body.product-page .nav-brand > span {
  display: inline-flex;
  align-items: center;
}
.pf-nav .nav-dropdown-toggle,
body.product-page .nav-dropdown-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.pf-nav .nav-dropdown-toggle svg,
body.product-page .nav-dropdown-toggle svg {
  display: block !important;
  width: 12px !important;
  height: 12px !important;
  flex: 0 0 12px !important;
}
@media (max-width: 620px) {
  .pf-nav-mark,
  body.product-page .nav-brand .pf-nav-mark {
    width: 15px !important;
    height: 19px !important;
  }
}

/* Match the homepage's combined Products control to the product-page arrow. */
.pf-nav .nav-dropdown-toggle {
  gap: 2px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Match the menu's outer dimensions on the homepage and product pages. */
.pf-nav .nav-dropdown-menu {
  box-sizing: border-box !important;
  width: 280px !important;
  min-width: 280px !important;
}

/* Give every What It Does item the Difference Engine hover treatment. */
body.product-page .tool-card,
body.product-page .feature-card,
body.product-aebridge .feature-grid .feature {
  position: relative !important;
  overflow: hidden !important;
  transition: transform .25s ease, box-shadow .35s ease !important;
}
body.product-page .tool-card::before,
body.product-page .feature-card::before,
body.product-aebridge .feature-grid .feature::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--accent, var(--pf-yellow));
  opacity: 0;
  transition: opacity .3s ease;
  pointer-events: none;
}
body.product-page .tool-card:hover,
body.product-page .feature-card:hover,
body.product-aebridge .feature-grid .feature:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 18px 50px -28px rgba(0, 0, 0, .8) !important;
}
body.product-page .tool-card:hover::before,
body.product-page .feature-card:hover::before,
body.product-aebridge .feature-grid .feature:hover::before {
  opacity: 1;
}

/* Keep the Elemental Bender footer tight to its workflow CTA. */
body.product-elemental .site-footer {
  margin-top: 0 !important;
}

/* Restore the shared gold CTA color on the About page. */
body.about-page .pf-final a,
body.about-page .pf-final a:hover,
body.about-page .pf-final a:focus-visible {
  background: var(--pf-button-gold) !important;
  color: var(--pf-button-ink) !important;
  border-color: var(--pf-button-ink) !important;
}

/* Give the homepage the same quiet copyright footer as the product pages. */
.pf-footer {
  padding: 28px 5vw !important;
  background: #0c0b0a !important;
  color: rgba(238, 245, 251, .72) !important;
  border: 0 !important;
  font-size: .75rem !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

/* Keep light navigation links readable when hovered. */
.pf-nav-links > li > a:hover,
.pf-nav-links > li > a:focus-visible,
body.product-page .nav-links > li > a:hover,
body.product-page .nav-links > li > a:focus-visible {
  color: #fffaf0 !important;
  opacity: 1 !important;
}

/* Use one centered, stable Products arrow treatment on every page. */
.pf-nav .nav-dropdown-toggle,
body.product-page .nav-dropdown-toggle {
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  padding: 0 !important;
  line-height: 18px !important;
}
.pf-nav .nav-dropdown-toggle svg,
body.product-page .nav-dropdown-toggle svg {
  display: block !important;
  width: 12px !important;
  height: 12px !important;
  flex: 0 0 12px !important;
  transform: none !important;
}

/* Apply the enlarged CTA scale to the product-page variant as well. */
body.product-page .product-final h2 {
  font-size: 2.75rem !important;
  line-height: .98 !important;
}
body.product-page .product-final a {
  gap: 10px !important;
  margin-top: 18px !important;
  padding: 9px 12px 9px 16px !important;
  border-width: 2px !important;
  box-shadow: 6px 6px 0 var(--pf-orange) !important;
  font-size: .78rem !important;
  transform: none !important;
}
body.product-page .product-final a::after {
  width: 22px !important;
  height: 22px !important;
  font-size: .72rem !important;
}
body.product-page .product-final a:hover,
body.product-page .product-final a:focus-visible {
  transform: translate(-3px, -3px) !important;
  box-shadow: 8px 8px 0 var(--pf-orange) !important;
}

/* Keep the hover treatment readable on the light navigation surface. */
body.about-page .pf-nav-links > li > a:hover,
body.about-page .pf-nav-links > li > a:focus-visible,
body.editorial-home .pf-nav-links > li > a:hover,
body.editorial-home .pf-nav-links > li > a:focus-visible {
  color: #fffaf0 !important;
  opacity: 1 !important;
}

@media (max-width: 600px) {
  body.product-page .product-final h2 {
    font-size: clamp(1.85rem, 9vw, 2.75rem) !important;
  }
}

/* Keep the homepage's first desktop viewport compact enough to reach its
   contact action and copyright without a large dead band. */
@media (min-width: 861px) {
  body.editorial-home .editorial-home-shell {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 1340px !important;
    padding: 32px 6vw 24px !important;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: 28px !important;
  }
  body.editorial-home .pf-final {
    padding: 30px 5vw 34px !important;
  }

  /* Give Difference Engine a wider visual column, then let its feature strip
     use the same full-width treatment as Elemental Bender. */
  body.product-difference .hero > .container {
    grid-template-columns: minmax(0, .82fr) minmax(420px, 1.18fr) !important;
  }
  body.product-difference .hero > .container > .panel-showcase {
    width: min(100%, 620px) !important;
    max-width: 620px !important;
  }
  body.product-difference .hero > .container > .product-feature-heading,
  body.product-difference .hero > .container > .features {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
  }
  body.product-page.product-difference .hero > .container > .panel-showcase.panel-showcase {
    width: min(100%, 620px) !important;
    max-width: 620px !important;
  }

  /* AE Bridge's portrait panel gets a slightly lighter footprint while its
     supporting feature strip is brought into the shared composition below. */
  body.product-aebridge .panel-showcase {
    width: min(100%, 520px) !important;
    max-width: 520px !important;
  }
}


/* AE Bridge shares the same full-width What It Does row as the other
   products. Its feature section follows the hero and preview in the page
   grid, keeping the portrait panel clear while giving the summaries room. */
body.product-aebridge > main > .product-feature-section {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 56px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
body.product-aebridge > main > .product-feature-section .product-feature-heading {
  margin: 0 0 20px !important;
  padding-top: 0 !important;
}
body.product-aebridge > main > .product-feature-section .feature-grid {
  width: 100% !important;
  margin: 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.product-aebridge > main > .hero-cta {
  grid-column: 1 / -1 !important;
  justify-self: center !important;
  margin: 24px 0 0 !important;
  text-align: center !important;
}
@media (max-width: 860px) {
  body.product-aebridge > main > .product-feature-section {
    margin-top: 56px !important;
  }
  body.product-aebridge > main > .product-feature-section .feature-grid {
    grid-template-columns: 1fr !important;
  }
  body.product-aebridge > main > .hero-cta {
    display: flex !important;
    justify-content: center !important;
  }
}

@media (min-width: 861px) {
  body.product-aebridge > main > .product-feature-section {
    margin-top: 72px !important;
  }
}

/* Copyright is a centered, bright line on every surface. */
.pf-footer,
body.product-page > footer,
body.product-page .site-footer {
  color: #fffaf0 !important;
  text-align: center !important;
}
body.editorial-home .pf-footer,
body.about-page .pf-footer,
body.product-page .pf-footer {
  color: #fffaf0 !important;
}
body.product-page .site-footer .container,
body.product-page > footer .container {
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

/* On shorter desktop windows, keep the complete homepage composition in one
   view without sacrificing the product names or their previews. */
@media (min-width: 861px) and (max-height: 800px) {
  body.editorial-home .editorial-home-shell {
    min-height: 0 !important;
    padding: 6px 6vw 0 !important;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: 8px !important;
  }
  body.editorial-home .editorial-brand-kicker {
    margin-bottom: 10px !important;
  }
  body.editorial-home .editorial-brand-name {
    font-size: clamp(2.8rem, 6vw, 5rem) !important;
  }
  body.editorial-home .editorial-brand-title {
    margin-top: 12px !important;
    font-size: clamp(1.2rem, 2.4vw, 1.8rem) !important;
  }
  body.editorial-home .editorial-brand-rule {
    margin: 16px auto 12px !important;
  }
  body.editorial-home .editorial-brand-copy {
    font-size: .8rem !important;
    line-height: 1.35 !important;
  }
  body.editorial-home .editorial-products-head {
    padding-bottom: 8px !important;
  }
  body.editorial-home .editorial-list {
    padding: 4px 0 !important;
  }
  body.editorial-home .editorial-product {
    min-height: 210px !important;
  }
  body.editorial-home .editorial-product-preview {
    height: 96px !important;
    min-height: 96px !important;
  }
  body.editorial-home .editorial-product-copy {
    min-height: 114px !important;
    padding: 14px 18px 14px 48px !important;
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    font-size: clamp(2.15rem, 3.7vw, 3.5rem) !important;
  }
  body.editorial-home .pf-final {
    padding: 6px 5vw 8px !important;
  }
  body.editorial-home .pf-final h2 {
    font-size: 2.75rem !important;
    line-height: .98 !important;
  }
  body.editorial-home .pf-final a {
    margin-top: 6px !important;
  }
  body.editorial-home .pf-footer {
    padding: 10px 5vw !important;
  }
}

/* Restore AE Bridge's compact two-column rhythm. The panel remains beside the
   story while its supporting tools and beta action stay in the left column,
   leaving a clear handoff into the shared workflow CTA. */
body.product-aebridge > main > .product-feature-section {
  grid-column: 1 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: start !important;
}
body.product-aebridge > main > .product-feature-section .product-feature-heading {
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
}
body.product-aebridge > main > .product-feature-section .feature-grid {
  width: 100% !important;
  margin: 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.product-aebridge > main > .hero-cta {
  grid-column: 1 !important;
  justify-self: start !important;
  margin: 18px 0 24px !important;
  text-align: left !important;
}
@media (min-width: 861px) {
  body.product-aebridge > main > .panel-showcase {
    width: min(100%, 360px) !important;
    max-width: 360px !important;
    justify-self: end !important;
  }
}
@media (max-width: 860px) {
  body.product-aebridge > main > .product-feature-section {
    margin: 0 !important;
  }
  body.product-aebridge > main > .product-feature-section .feature-grid {
    grid-template-columns: 1fr !important;
  }
  body.product-aebridge > main > .hero-cta {
    justify-self: center !important;
    margin: 18px 0 24px !important;
    text-align: center !important;
  }
}

/* Small, deliberate breathing room between the homepage film strip and its
   workflow CTA, while keeping the complete composition within the desktop
   viewport. */
@media (min-width: 861px) and (max-height: 800px) {
  body.editorial-home .editorial-home-shell {
    padding-top: 0 !important;
  }
  body.editorial-home .pf-final {
    margin-top: 16px !important;
    padding-bottom: 0 !important;
  }
  body.editorial-home .pf-footer {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
}
@media (min-width: 861px) and (min-height: 801px) {
  body.editorial-home .pf-final {
    margin-top: 24px !important;
    padding-bottom: 10px !important;
  }
}

/* Use the navigation yellow for every orange product accent and preview
   treatment, so the pages read as one visual system. */
body.product-page .hero h1 .accent,
body.product-page .hero-statement .accent,
body.product-aebridge .hero h1 span,
body.product-aebridge .hero-statement span,
body.product-page .hero-product-name,
body.product-aebridge .eyebrow,
body.product-page .section-label,
body.product-page .section-label span,
body.product-page .x-mark {
  color: var(--pf-nav-surface) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
body.product-page .panel-frame,
body.product-aebridge .panel-frame {
  box-shadow: 8px 8px 0 var(--pf-nav-surface) !important;
}
body.product-page .slide-dot {
  background: rgba(242, 201, 76, .3) !important;
}
body.product-page .slide-dot.active {
  background: var(--pf-nav-surface) !important;
}

/* Give the wordmark a little air between Pragmatic and Fox without changing
   the navigation geometry. */
.pf-brand > span > strong,
body.product-page .nav-brand > span > b {
  margin-left: .18em !important;
}

/* Match AE Bridge's What It Does strip and CTA rhythm to Difference Engine.
   The preview remains in the right column; the supporting story spans the
   page beneath it so all product pages share the same readable cadence. */
body.product-aebridge > main > .product-feature-section {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
body.product-aebridge > main > .product-feature-section .product-feature-heading {
  width: 100% !important;
  margin: 0 0 20px !important;
  padding: 42px 0 0 !important;
}
body.product-aebridge > main > .product-feature-section .feature-grid {
  width: 100% !important;
  margin: 0 0 58px !important;
  padding: 0 0 100px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.product-aebridge > main > .product-feature-section .feature-grid .feature {
  min-width: 0 !important;
  padding: 15px 16px 0 0 !important;
  border: 0 !important;
  border-right: 1px solid rgba(213, 224, 236, .18) !important;
  border-radius: 0 !important;
}
body.product-aebridge > main > .product-feature-section .feature-grid .feature:last-child {
  padding-right: 0 !important;
  border-right: 0 !important;
}
body.product-aebridge > main > .product-feature-section .feature-grid .feature + .feature {
  padding-left: 16px !important;
  border-left: 0 !important;
}
body.product-aebridge > main > .hero-cta {
  grid-column: 1 !important;
  justify-self: start !important;
  margin: 24px 0 88px !important;
  text-align: left !important;
}

/* Remove the final rail padding so the homepage CTA follows the products
   immediately at every desktop height. */
body.editorial-home .editorial-products,
body.editorial-home .editorial-list {
  margin-bottom: 0 !important;
}
body.editorial-home .editorial-list {
  padding-bottom: 0 !important;
}

/* The homepage is a compact landing composition, not a full-height hero.
   Do not reserve the rest of the viewport before the workflow CTA; that
   creates the large blank band users see on taller screens. */
body.editorial-home .editorial-home-shell {
  min-height: 0 !important;
}

/* Keep the film-strip compact on larger desktop windows too. Without this
   cap, the three product frames grow with the viewport and push the CTA below
   the fold even though there is no intentional spacing between sections. */
@media (min-width: 861px) {
  body.editorial-home .editorial-home-shell {
    padding-bottom: 0 !important;
  }
  body.editorial-home .editorial-products-head {
    padding-bottom: 8px !important;
  }
  body.editorial-home .editorial-list {
    padding: 4px 0 !important;
  }
  body.editorial-home .editorial-product {
    min-height: 210px !important;
  }
  body.editorial-home .editorial-product-preview {
    height: 96px !important;
    min-height: 96px !important;
  }
  body.editorial-home .editorial-product-copy {
    min-height: 114px !important;
    padding: 14px 18px 14px 48px !important;
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    font-size: clamp(2.15rem, 3.7vw, 3.5rem) !important;
  }
}

/* On a taller laptop/desktop viewport, trim only the footer's vertical
   padding so the complete homepage still ends within the first screen. */
@media (min-width: 861px) and (min-height: 801px) {
  body.editorial-home .pf-footer {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}

@media (max-width: 860px) {
  body.product-aebridge > main > .product-feature-section {
    margin: 0 !important;
  }
  body.product-aebridge > main > .product-feature-section .product-feature-heading {
    padding-top: 34px !important;
  }
  body.product-aebridge > main > .product-feature-section .feature-grid {
    grid-template-columns: 1fr !important;
    margin-bottom: 46px !important;
    padding-bottom: 0 !important;
  }
  body.product-aebridge > main > .product-feature-section .feature-grid .feature,
  body.product-aebridge > main > .product-feature-section .feature-grid .feature + .feature {
    padding: 14px 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(213, 224, 236, .18) !important;
  }
  body.product-aebridge > main > .product-feature-section .feature-grid .feature:last-child {
    border-bottom: 0 !important;
  }
  body.product-aebridge > main > .hero-cta {
    justify-self: center !important;
    margin: 24px 0 48px !important;
    text-align: center !important;
  }
}

/* Keep the beta request close to the What It Does content, matching the
   Elemental Bender rhythm on the other product pages. */
@media (min-width: 861px) {
  body.product-difference .hero > .container > .features,
  body.product-aebridge > main > .product-feature-section .feature-grid {
    margin-bottom: 0 !important;
  }
}

/* Let the homepage use the full first screen without compressing the film
   strip. The shell grows into available space, leaving the workflow CTA and
   copyright anchored at the bottom of the viewport. */
@media (min-width: 861px) {
  body.editorial-home {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100svh !important;
  }
  body.editorial-home .editorial-home-shell {
    flex: 1 0 auto !important;
  }
  body.editorial-home .editorial-product {
    min-height: 250px !important;
  }
  body.editorial-home .editorial-product-preview {
    height: 108px !important;
    min-height: 108px !important;
  }
  body.editorial-home .editorial-product-copy {
    min-height: 114px !important;
  }
  body.editorial-home .pf-final {
    margin-top: 24px !important;
  }
  body.editorial-home .pf-footer {
    height: 24px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* Make the homepage film strip twice as tall on desktop. Keep the product
   typography, spacing, and controls unchanged while giving each preview more
   room to read. */
@media (min-width: 861px) {
  body.editorial-home .editorial-product {
    min-height: 500px !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 386px !important;
    height: 386px !important;
    min-height: 386px !important;
  }
  body.editorial-home .editorial-product-copy {
    flex: 0 0 114px !important;
    min-height: 114px !important;
  }
}

/* Give the taller strip a wider, more balanced footprint without changing
   the surrounding homepage composition. */
@media (min-width: 861px) {
  body.editorial-home .editorial-products {
    width: min(1280px, calc(100vw - 8vw)) !important;
    /* Center the rail from its middle (Difference Engine) column. */
    margin-left: calc((100% - min(1280px, calc(100vw - 8vw))) / 2) !important;
    margin-right: 0 !important;
    transform: none !important;
    animation: editorial-enter .7s .08s cubic-bezier(.2, .75, .2, 1) both !important;
  }
  body.editorial-home .editorial-list {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  body.editorial-home .editorial-de {
    grid-column: 2 !important;
    justify-self: stretch !important;
  }
}

/* Shared workflow CTA treatment: warm charcoal surface, one yellow accent,
   and the same centered flex alignment on every page. */
.pf-final,
body.products-page .pf-final,
body.product-page .product-final {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  min-height: 216px !important;
  padding: clamp(34px, 4vw, 52px) 5vw !important;
  background: #171310 !important;
  border-top: 1px solid rgba(255, 250, 240, .2) !important;
  color: #fffaf0 !important;
  text-align: center !important;
}
.pf-final h2,
body.products-page .pf-final h2,
body.product-page .product-final h2 {
  width: 100% !important;
  max-width: 950px !important;
  margin: 0 auto !important;
  color: #fffaf0 !important;
  font-size: clamp(2rem, 3.8vw, 2.75rem) !important;
  line-height: .98 !important;
  text-align: center !important;
}
.pf-final h2 span,
body.products-page .pf-final h2 span,
body.product-page .product-final h2 span {
  color: #f2c94c !important;
}
.pf-final a,
body.products-page .pf-final a,
body.product-page .product-final a {
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 44px !important;
  margin: 0 auto !important;
  padding: 9px 12px 9px 16px !important;
  background: #f2c94c !important;
  border: 2px solid #171310 !important;
  box-shadow: 6px 6px 0 #f2c94c !important;
  color: #171310 !important;
  font: 750 .78rem/1 "Space Grotesk", sans-serif !important;
  text-align: center !important;
  transform: none !important;
}
.pf-final a::after,
body.products-page .pf-final a::after,
body.product-page .product-final a::after {
  background: #171310 !important;
  color: #f2c94c !important;
}
.pf-final a:hover,
.pf-final a:focus-visible,
body.products-page .pf-final a:hover,
body.products-page .pf-final a:focus-visible,
body.product-page .product-final a:hover,
body.product-page .product-final a:focus-visible {
  background: #f2c94c !important;
  border-color: #171310 !important;
  box-shadow: 8px 8px 0 #f2c94c !important;
  color: #171310 !important;
  transform: translate(-2px, -2px) !important;
}

@media (max-width: 600px) {
  .pf-final,
  body.products-page .pf-final,
  body.product-page .product-final {
    min-height: 198px !important;
    padding: 30px 22px 34px !important;
  }
  .pf-final h2,
  body.products-page .pf-final h2,
  body.product-page .product-final h2 {
    font-size: clamp(1.85rem, 9vw, 2.35rem) !important;
  }
}

/* Final CTA alignment: the homepage and About CTA use the same surface,
   geometry, and centered rhythm as Elemental Bender's product CTA. Explicit
   colors and a cleared image layer prevent older page-specific themes from
   leaking through on these shared sections. */
.pf-final,
body.products-page .pf-final,
body.product-page .product-final {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 216px !important;
  margin: 0 !important;
  padding: 34px 5vw !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  background-color: #171310 !important;
  background-image: none !important;
  border-top: 1px solid rgba(255, 250, 240, .2) !important;
  color: #fffaf0 !important;
  text-align: center !important;
}

body.editorial-home .pf-final,
body.about-page .pf-final,
body.product-page .product-final {
  background: #171310 !important;
  background-color: #171310 !important;
  background-image: none !important;
  color: #fffaf0 !important;
}

.pf-final h2,
body.products-page .pf-final h2,
body.product-page .product-final h2 {
  width: 100% !important;
  max-width: 950px !important;
  margin: 0 auto !important;
  color: #fffaf0 !important;
  font-size: clamp(2rem, 3.8vw, 2.75rem) !important;
  line-height: .98 !important;
  text-align: center !important;
}

.pf-final h2 span,
body.products-page .pf-final h2 span,
body.product-page .product-final h2 span {
  color: #f2c94c !important;
}

.pf-final a,
body.products-page .pf-final a,
body.product-page .product-final a {
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 44px !important;
  margin: 0 auto !important;
  padding: 9px 12px 9px 16px !important;
  background: #f2c94c !important;
  border: 2px solid #171310 !important;
  box-shadow: 6px 6px 0 #f2c94c !important;
  color: #171310 !important;
  font: 750 .78rem/1 "Space Grotesk", sans-serif !important;
  text-align: center !important;
  transform: none !important;
}

.pf-final a::after,
body.products-page .pf-final a::after,
body.product-page .product-final a::after {
  background: #171310 !important;
  color: #f2c94c !important;
}

@media (max-width: 600px) {
  .pf-final,
  body.products-page .pf-final,
  body.product-page .product-final {
    min-height: 198px !important;
    padding: 30px 22px 34px !important;
  }
}

/* MacBook-sized desktop windows need a little more air than the oversized
   monitor composition. Keep the same type hierarchy and horizontal product
   rail, but bring the frame heights down so the CTA is not clipped below the
   first viewport. The width guard leaves larger external monitors unchanged. */
@media (min-width: 861px) and (max-width: 1800px) and (max-height: 980px) {
  body.editorial-home .editorial-home-shell {
    min-height: 0 !important;
    padding: 28px 6vw 24px !important;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: 28px !important;
  }
  body.editorial-home .editorial-brand-kicker {
    margin-bottom: 12px !important;
    font-size: .64rem !important;
  }
  body.editorial-home .editorial-brand-name {
    font-size: clamp(3.5rem, 6vw, 5.5rem) !important;
    line-height: .82 !important;
  }
  body.editorial-home .editorial-brand-title {
    margin-top: 16px !important;
    font-size: clamp(1.35rem, 2.35vw, 1.9rem) !important;
  }
  body.editorial-home .editorial-brand-rule {
    margin: 18px auto 14px !important;
  }
  body.editorial-home .editorial-brand-copy {
    max-width: 760px !important;
    font-size: .86rem !important;
    line-height: 1.45 !important;
  }
  body.editorial-home .editorial-products {
    width: min(1280px, 100%) !important;
  }
  body.editorial-home .editorial-products-head {
    padding-bottom: 10px !important;
  }
  body.editorial-home .editorial-product {
    min-height: 320px !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 208px !important;
    height: 208px !important;
    min-height: 208px !important;
  }
  body.editorial-home .editorial-product-copy {
    flex: 0 0 112px !important;
    min-height: 112px !important;
    padding: 14px 18px 12px 48px !important;
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    margin-bottom: 8px !important;
    font-size: clamp(2.6rem, 4vw, 3.35rem) !important;
    line-height: .84 !important;
  }
  body.editorial-home .editorial-product p {
    font-size: .66rem !important;
  }
  body.editorial-home .pf-final {
    margin-top: 18px !important;
  }
  body.editorial-home .pf-footer {
    height: auto !important;
    min-height: 24px !important;
    padding: 8px 5vw !important;
  }

  /* Give product pages a wider two-column canvas at laptop widths. This
     keeps the screenshot and the story from feeling pinched together while
     preserving the larger-monitor proportions. */
  body.product-page .hero > .container,
  body.product-aebridge main {
    width: min(calc(100% - 72px), 1240px) !important;
    max-width: 1240px !important;
    column-gap: clamp(52px, 5vw, 76px) !important;
  }
  body.product-page:not(.product-aebridge) .hero > .container > .panel-showcase,
  body.product-aebridge .panel-showcase {
    width: min(100%, 520px) !important;
    max-width: 520px !important;
  }
  body.product-page .hero,
  body.product-aebridge .hero {
    padding-top: 52px !important;
    padding-bottom: 72px !important;
  }
}

/* Video previews use several tall source ratios. Size the modal from the
   available viewport height as well as its width so portrait previews never
   run beyond a laptop window. */
body.product-page .video-modal-overlay {
  box-sizing: border-box !important;
  padding: 24px !important;
}
body.product-page .video-modal {
  box-sizing: border-box !important;
  width: min(1350px, calc(100vw - 48px));
  max-width: 100%;
  max-height: calc(100svh - 48px);
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
body.product-page .video-modal video {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: calc(100svh - 112px);
  margin: 0 auto;
  object-fit: contain;
  flex: 0 1 auto;
}
body.product-page .video-modal-footer {
  width: 100%;
  flex: 0 0 auto;
}

/* Hybrid information architecture: Products is a real destination, while
   the adjacent caret keeps the quick product switcher on every page. */
.pf-nav .nav-dropdown,
body.product-page .nav-dropdown {
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
}
.pf-nav .nav-products-link,
body.product-page .nav-products-link {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 20px !important;
  color: var(--pf-ink) !important;
  font: 700 .78rem/1 "Space Grotesk", sans-serif !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
.pf-nav .nav-products-link:hover,
.pf-nav .nav-products-link:focus-visible,
body.product-page .nav-products-link:hover,
body.product-page .nav-products-link:focus-visible {
  color: var(--pf-paper-2) !important;
}
.pf-nav .nav-dropdown-toggle,
body.product-page .nav-dropdown-toggle {
  display: inline-grid !important;
  place-items: center !important;
  width: 15px !important;
  height: 20px !important;
  min-width: 15px !important;
  padding: 0 !important;
  color: var(--pf-ink) !important;
  font-size: 0 !important;
  line-height: 1 !important;
}
.pf-nav .nav-dropdown-toggle svg,
body.product-page .nav-dropdown-toggle svg {
  width: 11px !important;
  height: 11px !important;
  margin: 0 !important;
}
.pf-nav .nav-dropdown-toggle:hover,
.pf-nav .nav-dropdown-toggle:focus-visible,
body.product-page .nav-dropdown-toggle:hover,
body.product-page .nav-dropdown-toggle:focus-visible {
  color: var(--pf-paper-2) !important;
}
body.editorial-home .pf-nav .nav-products-link,
body.editorial-home .pf-nav .nav-dropdown-toggle,
body.products-index-page .pf-nav .nav-products-link,
body.products-index-page .pf-nav .nav-dropdown-toggle {
  color: var(--pf-ink) !important;
}
body.editorial-home .pf-nav .nav-products-link:hover,
body.editorial-home .pf-nav .nav-products-link:focus-visible,
body.editorial-home .pf-nav .nav-dropdown-toggle:hover,
body.editorial-home .pf-nav .nav-dropdown-toggle:focus-visible,
body.products-index-page .pf-nav .nav-products-link:hover,
body.products-index-page .pf-nav .nav-products-link:focus-visible,
body.products-index-page .pf-nav .nav-dropdown-toggle:hover,
body.products-index-page .pf-nav .nav-dropdown-toggle:focus-visible {
  color: var(--pf-orange-dark) !important;
}

/* Give the homepage rail the live site's scanning rhythm without losing the
   screenshot-led editorial treatment. */
body.editorial-home .editorial-home-shell {
  padding-top: clamp(34px, 5vw, 64px) !important;
  padding-bottom: clamp(32px, 4vw, 46px) !important;
}
body.editorial-home .editorial-brand-panel {
  margin-bottom: clamp(34px, 5vw, 54px) !important;
}
body.editorial-home .editorial-list {
  background: rgba(13, 11, 9, .9) !important;
}
body.editorial-home .editorial-product {
  min-height: clamp(414px, 31vw, 472px) !important;
}
body.editorial-home .editorial-product-preview {
  height: clamp(286px, 21vw, 322px) !important;
  min-height: clamp(286px, 21vw, 322px) !important;
}
body.editorial-home .editorial-product-copy {
  min-height: 142px !important;
  padding-top: 22px !important;
  padding-bottom: 18px !important;
}
body.editorial-home .editorial-products-head span {
  color: rgba(244, 237, 228, .62) !important;
}
@media (max-width: 680px) {
  body.editorial-home .editorial-product {
    min-height: 332px !important;
  }
  body.editorial-home .editorial-product-preview {
    height: 166px !important;
    min-height: 166px !important;
  }
  body.editorial-home .editorial-product-copy {
    min-height: 166px !important;
  }
}

/* Dedicated Products index: a calm, scan-friendly list with one strong
   screenshot per product instead of another generic card mosaic. */
body.products-index-page {
  min-height: 100svh;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(72% 58% at 92% 2%, rgba(218, 168, 60, .08), transparent 68%),
    linear-gradient(160deg, #1b1816 0%, #151311 62%, #11100f 100%) !important;
  color: #f4ede4 !important;
}
body.products-index-page .pf-brand,
body.products-index-page .pf-brand strong,
body.products-index-page .pf-nav-links > li > a,
body.products-index-page .nav-products-link,
body.products-index-page .nav-dropdown-toggle,
body.products-index-page .pf-nav .nav-products-link,
body.products-index-page .pf-nav .nav-dropdown-toggle {
  color: #171310 !important;
}
body.products-index-page .pf-nav-links > li > a:hover,
body.products-index-page .nav-products-link:hover,
body.products-index-page .nav-dropdown-toggle:hover,
body.products-index-page .pf-nav .nav-products-link:hover,
body.products-index-page .pf-nav .nav-dropdown-toggle:hover,
body.products-index-page .pf-nav-links > li > a:focus-visible,
body.products-index-page .nav-products-link:focus-visible,
body.products-index-page .nav-dropdown-toggle:focus-visible,
body.products-index-page .pf-nav .nav-products-link:focus-visible,
body.products-index-page .pf-nav .nav-dropdown-toggle:focus-visible {
  color: #9f3907 !important;
}

/* The product templates use the legacy .site-nav wrapper; keep its caret in
   the same black/yellow treatment as the shared nav on the editorial pages. */
body.product-page .site-nav .nav-products-link,
body.product-page .site-nav .nav-dropdown-toggle {
  color: #171310 !important;
}
body.product-page .site-nav .nav-products-link:hover,
body.product-page .site-nav .nav-dropdown-toggle:hover,
body.product-page .site-nav .nav-products-link:focus-visible,
body.product-page .site-nav .nav-dropdown-toggle:focus-visible {
  color: #9f3907 !important;
}

/* The homepage, About, Contact, and Products templates all use .pf-nav.
   Keep the direct Products label and its caret black at rest so they never
   jump to the pale dark-mode token used by older page rules. */
.pf-nav .nav-products-link,
.pf-nav .nav-dropdown-toggle {
  color: #171310 !important;
}
.pf-nav .nav-products-link:hover,
.pf-nav .nav-dropdown-toggle:hover,
.pf-nav .nav-products-link:focus-visible,
.pf-nav .nav-dropdown-toggle:focus-visible {
  color: #9f3907 !important;
}

/* Homepage-specific selector wins over the legacy dark-mode override. */
body.editorial-home .pf-nav .nav-products-link,
body.editorial-home .pf-nav .nav-dropdown-toggle {
  color: #171310 !important;
}
body.editorial-home .pf-nav .nav-products-link:hover,
body.editorial-home .pf-nav .nav-dropdown-toggle:hover,
body.editorial-home .pf-nav .nav-products-link:focus-visible,
body.editorial-home .pf-nav .nav-dropdown-toggle:focus-visible {
  color: #9f3907 !important;
}
body.products-index-page .editorial-products-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 0 14px;
  border-bottom: 1px solid rgba(244, 237, 228, .84);
}
body.products-index-page .editorial-products-head p,
body.products-index-page .editorial-products-head span {
  margin: 0;
  color: rgba(244, 237, 228, .72);
  font: 500 .7rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .18em;
  text-transform: uppercase;
}
body.products-index-page .editorial-products-head p { color: var(--pf-yellow); }
body.products-index-page .pf-nav {
  background: var(--pf-yellow) !important;
  border-bottom-color: var(--pf-ink) !important;
}
body.products-index-page .pf-brand,
body.products-index-page .pf-brand strong,
body.products-index-page .pf-nav-links > li > a {
  color: var(--pf-ink) !important;
}
body.products-index-page .products-index-main {
  width: min(1280px, 100%);
  min-height: calc(100svh - 68px);
  margin: 0 auto;
  padding: clamp(58px, 8vw, 104px) clamp(24px, 6vw, 80px) clamp(68px, 9vw, 112px);
}
body.products-index-page .products-index-intro {
  width: min(820px, 100%);
  margin: 0 auto clamp(48px, 7vw, 76px);
  text-align: center;
}
body.products-index-page .products-index-kicker {
  margin: 0 0 20px;
  color: var(--pf-yellow);
  font: 500 .7rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.products-index-page .products-index-intro h1 {
  margin: 0;
  color: #f7f0e7;
  font: 700 clamp(3rem, 7vw, 5.9rem)/.88 "Space Grotesk", sans-serif;
  letter-spacing: -.08em;
}
body.products-index-page .products-index-intro h1 span {
  color: var(--pf-yellow);
}
body.products-index-page .products-index-intro > p:last-child {
  width: min(650px, 100%);
  margin: 24px auto 0;
  color: rgba(244, 237, 228, .7);
  font: 500 clamp(.95rem, 1.2vw, 1.1rem)/1.6 "Manrope", sans-serif;
}
body.products-index-page .products-index-products {
  width: 100%;
}
body.products-index-page .products-index-products .editorial-products-head {
  border-bottom-color: rgba(244, 237, 228, .84) !important;
}
body.products-index-page .products-index-list {
  display: grid;
  grid-auto-rows: 360px;
  border-bottom: 1px solid rgba(244, 237, 228, .28);
}
body.products-index-page .products-index-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 44%);
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border-bottom: 1px solid rgba(244, 237, 228, .25);
  color: #f4ede4;
  text-decoration: none;
}
body.products-index-page .products-index-row:last-child { border-bottom: 0; }
body.products-index-page .products-index-copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 34px clamp(28px, 5vw, 72px) 34px 58px;
}
body.products-index-page .products-index-index {
  position: absolute;
  top: 34px;
  left: 0;
  font: 500 .68rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .08em;
}
body.products-index-page .products-index-kicker-small {
  margin-bottom: 16px;
  color: rgba(244, 237, 228, .55);
  font: 500 .66rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.products-index-page .products-index-row h2 {
  margin: 0 0 12px;
  color: #f7f1e9;
  font: 700 clamp(2.3rem, 5vw, 4.4rem)/.86 "Space Grotesk", sans-serif;
  letter-spacing: -.08em;
}
body.products-index-page .products-index-row h2 span { color: currentColor; }
body.products-index-page .products-index-row p {
  max-width: 560px;
  margin: 0;
  color: rgba(244, 237, 228, .68);
  font: 500 clamp(.9rem, 1.2vw, 1.05rem)/1.55 "Manrope", sans-serif;
}
body.products-index-page .products-index-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  color: var(--pf-yellow);
  font: 700 .72rem/1 "Space Grotesk", sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: transform .2s ease;
}
body.products-index-page .products-index-media {
  position: relative;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: #0d0b09;
}
body.products-index-page .products-index-media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(21, 17, 14, .92), rgba(21, 17, 14, .16) 55%, rgba(15, 13, 11, .25));
  content: "";
  pointer-events: none;
}
body.products-index-page .products-index-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .66;
  filter: brightness(.66) saturate(.72) contrast(1.04);
  transform: scale(1.03);
  transition: opacity .3s ease, transform .45s cubic-bezier(.2, .75, .2, 1), filter .3s ease;
}
body.products-index-page .products-index-row:hover .products-index-media img,
body.products-index-page .products-index-row:focus-visible .products-index-media img {
  opacity: .92;
  filter: brightness(.78) saturate(.86) contrast(1.04);
  transform: scale(1);
}
body.products-index-page .products-index-row:hover .products-index-link,
body.products-index-page .products-index-row:focus-visible .products-index-link { transform: translateX(4px); }
body.products-index-page .products-index-row:focus-visible {
  outline: 2px solid var(--pf-yellow);
  outline-offset: 5px;
}
body.products-index-page .products-index-row.editorial-eb .products-index-index,
body.products-index-page .products-index-row.editorial-eb .products-index-link,
body.products-index-page .products-index-row.editorial-eb h2 span { color: var(--pf-yellow); }
body.products-index-page .products-index-row.editorial-de .products-index-index,
body.products-index-page .products-index-row.editorial-de .products-index-link,
body.products-index-page .products-index-row.editorial-de h2 span { color: #d99aff; }
body.products-index-page .products-index-row.editorial-ae .products-index-index,
body.products-index-page .products-index-row.editorial-ae .products-index-link,
body.products-index-page .products-index-row.editorial-ae h2 span { color: #72cda0; }
body.products-index-page .pf-final { margin-top: 0 !important; }
@media (max-width: 700px) {
  body.products-index-page .products-index-main { padding: 58px 22px 76px; }
  body.products-index-page .products-index-intro { margin-bottom: 48px; }
  body.products-index-page .products-index-list { grid-auto-rows: auto; }
  body.products-index-page .products-index-row { grid-template-columns: 1fr; height: auto; min-height: 0; }
  body.products-index-page .products-index-copy { min-height: 236px; padding: 30px 0 30px 44px; }
  body.products-index-page .products-index-index { top: 30px; }
  body.products-index-page .products-index-media { min-height: 210px; }
  body.products-index-page .products-index-media::after { background: linear-gradient(180deg, rgba(21, 17, 14, .1), rgba(21, 17, 14, .6)); }
}

/* Final homepage balance for the hybrid layout. The product rail remains
   the visual anchor, but its copy and preview tracks share one predictable
   height so the workflow CTA stays comfortably on-screen on large monitors. */
@media (min-width: 861px) {
  body.editorial-home .editorial-home-shell {
    padding-top: clamp(42px, 4vw, 54px) !important;
    padding-bottom: 18px !important;
  }
  body.editorial-home .editorial-product {
    min-height: 480px !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 338px !important;
    height: 338px !important;
    min-height: 338px !important;
  }
  body.editorial-home .editorial-product-copy {
    box-sizing: border-box !important;
    flex: 0 0 142px !important;
    min-height: 142px !important;
  }
}

/* At laptop-sized desktop widths, use a shorter rail rather than forcing a
   vertical scroll just to reach the CTA. The same three-column composition
   and type scale are retained. */
@media (min-width: 861px) and (max-width: 1800px) and (max-height: 1100px) {
  body.editorial-home .editorial-home-shell {
    padding-top: 28px !important;
    padding-bottom: 18px !important;
  }
  body.editorial-home .editorial-product {
    min-height: 360px !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 232px !important;
    height: 232px !important;
    min-height: 232px !important;
  }
  body.editorial-home .editorial-product-copy {
    box-sizing: border-box !important;
    flex: 0 0 128px !important;
    min-height: 128px !important;
  }
}

/* Keep the yellow Products nav legible like the homepage. This sits last so
   the dark-mode palette used by the legacy product rules cannot turn the
   brand and links pale on the new index page. */
body.products-index-page .pf-brand,
body.products-index-page .pf-brand strong,
body.products-index-page .pf-nav-links > li > a,
body.products-index-page .nav-products-link,
body.products-index-page .nav-dropdown-toggle,
body.products-index-page .pf-nav .nav-products-link,
body.products-index-page .pf-nav .nav-dropdown-toggle {
  color: #171310 !important;
}
body.products-index-page .pf-nav-links > li > a:hover,
body.products-index-page .nav-products-link:hover,
body.products-index-page .nav-dropdown-toggle:hover,
body.products-index-page .pf-nav .nav-products-link:hover,
body.products-index-page .pf-nav .nav-dropdown-toggle:hover,
body.products-index-page .pf-nav-links > li > a:focus-visible,
body.products-index-page .nav-products-link:focus-visible,
body.products-index-page .nav-dropdown-toggle:focus-visible,
body.products-index-page .pf-nav .nav-products-link:focus-visible,
body.products-index-page .pf-nav .nav-dropdown-toggle:focus-visible {
  color: #9f3907 !important;
}

/* Fluid laptop composition. The earlier desktop rules used a fixed compact
   rail, which made the homepage feel crowded at 13–16 inch widths. Let the
   three frames grow with the available width while keeping the same poster
   hierarchy on a larger monitor. */
@media (min-width: 861px) and (max-width: 1920px) {
  body.editorial-home .editorial-home-shell {
    padding: clamp(32px, 4vw, 54px) clamp(5vw, 7vw, 88px) 24px !important;
  }
  body.editorial-home .editorial-brand-panel {
    width: min(960px, 100%) !important;
    margin-bottom: clamp(36px, 4vw, 52px) !important;
  }
  body.editorial-home .editorial-brand-name {
    font-size: clamp(3.9rem, 6.2vw, 6.5rem) !important;
    line-height: .82 !important;
  }
  body.editorial-home .editorial-brand-title {
    margin-top: 18px !important;
    font-size: clamp(1.5rem, 2.5vw, 2.35rem) !important;
  }
  body.editorial-home .editorial-brand-rule {
    margin: 22px auto 16px !important;
  }
  body.editorial-home .editorial-brand-copy {
    max-width: 820px !important;
    font-size: clamp(.94rem, 1.05vw, 1.08rem) !important;
    line-height: 1.5 !important;
  }
  body.editorial-home .editorial-products {
    width: min(1280px, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
  }
  body.editorial-home .editorial-products-head {
    padding-bottom: 14px !important;
  }
  body.editorial-home .editorial-list {
    padding: 6px 0 !important;
  }
  body.editorial-home .editorial-product {
    min-height: clamp(360px, 39vh, 480px) !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 clamp(220px, 24vh, 338px) !important;
    height: clamp(220px, 24vh, 338px) !important;
    min-height: clamp(220px, 24vh, 338px) !important;
  }
  body.editorial-home .editorial-product-copy {
    box-sizing: border-box !important;
    flex: 0 0 clamp(128px, 15vh, 142px) !important;
    min-height: clamp(128px, 15vh, 142px) !important;
    padding: 24px 22px 22px 53px !important;
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    font-size: clamp(3.25rem, 4.6vw, 4rem) !important;
    line-height: .84 !important;
  }
  body.editorial-home .editorial-product p {
    font-size: clamp(.68rem, .75vw, .8rem) !important;
  }
}

/* Short laptop windows still get comfortable type and image proportions;
   only the vertical rhythm gives back a little room when the browser chrome
   leaves less than 800px of usable height. */
@media (min-width: 861px) and (max-width: 1920px) and (max-height: 800px) {
  body.editorial-home .editorial-home-shell {
    padding: 28px clamp(5vw, 7vw, 88px) 18px !important;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: clamp(28px, 3.4vw, 42px) !important;
  }
  body.editorial-home .editorial-brand-name {
    font-size: clamp(3.5rem, 5.8vw, 5.5rem) !important;
  }
  body.editorial-home .editorial-brand-title {
    margin-top: 15px !important;
    font-size: clamp(1.35rem, 2.2vw, 2rem) !important;
  }
  body.editorial-home .editorial-brand-rule {
    margin: 18px auto 14px !important;
  }
  body.editorial-home .editorial-brand-copy {
    font-size: clamp(.88rem, .95vw, 1rem) !important;
    line-height: 1.45 !important;
  }
  body.editorial-home .editorial-products-head {
    padding-bottom: 10px !important;
  }
  body.editorial-home .editorial-list {
    padding: 4px 0 !important;
  }
  body.editorial-home .editorial-product {
    min-height: clamp(338px, 42vh, 372px) !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 clamp(200px, 23vh, 230px) !important;
    height: clamp(200px, 23vh, 230px) !important;
    min-height: clamp(200px, 23vh, 230px) !important;
  }
  body.editorial-home .editorial-product-copy {
    flex: 0 0 clamp(138px, 16vh, 142px) !important;
    min-height: clamp(138px, 16vh, 142px) !important;
    padding: 20px 18px 18px 48px !important;
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    font-size: clamp(2.85rem, 4.2vw, 3.5rem) !important;
  }
}

/* Keep the homepage workflow CTA identical to the product CTA: the same
   surface height, vertical rhythm, and button box model leave visible air
   beneath the action instead of letting it sit against the lower edge. */
@media (min-width: 601px) {
  body.editorial-home .pf-final {
    box-sizing: border-box !important;
    min-height: 216px !important;
    margin-top: 24px !important;
    padding: 34px 5vw !important;
  }
  body.editorial-home .pf-final a {
    box-sizing: border-box !important;
    height: 44px !important;
    min-height: 44px !important;
  }
}

/* Keep the About page focused on its reading content. The large ABOUT word
   is decorative only and competes with the story on smaller screens. */
body.about-page .pf-about-story::before {
  display: none !important;
  content: none !important;
}

/* Center the constrained supporting sentence within the full brand panel,
   rather than leaving its max-width box anchored to the left edge. */
body.editorial-home .editorial-brand-copy {
  margin-inline: auto !important;
  text-align: center !important;
}

/* MacBook-sized windows have less vertical room after browser chrome is
   accounted for. Give the rail a bounded, readable track so each product's
   short description remains inside the film strip instead of being pushed
   below the visible frame. Larger monitors retain the roomier composition. */
@media (min-width: 861px) and (max-width: 1800px) and (min-height: 801px) and (max-height: 1100px) {
  body.editorial-home .editorial-home-shell {
    padding-top: 28px !important;
    padding-bottom: 18px !important;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: 30px !important;
  }
  body.editorial-home .editorial-products-head {
    padding-bottom: 10px !important;
  }
  body.editorial-home .editorial-list {
    padding: 4px 0 !important;
  }
  body.editorial-home .editorial-product {
    min-height: 374px !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 232px !important;
    height: 232px !important;
    min-height: 232px !important;
  }
  body.editorial-home .editorial-product-copy {
    flex: 0 0 142px !important;
    min-height: 142px !important;
    padding: 20px 18px 18px 48px !important;
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    font-size: clamp(2.9rem, 4.2vw, 3.5rem) !important;
    line-height: .84 !important;
  }
  body.editorial-home .editorial-product p {
    font-size: clamp(.68rem, .75vw, .8rem) !important;
  }
}

/* On a short laptop viewport, keep the entire landing composition available
   without resorting to a tiny type scale. The rail remains horizontal; only
   its image and surrounding whitespace yield a little height. */
@media (min-width: 861px) and (max-width: 1800px) and (max-height: 800px) {
  body.editorial-home .editorial-home-shell {
    padding: 0 5vw !important;
  }
  body.editorial-home .editorial-brand-panel {
    margin-bottom: 12px !important;
  }
  body.editorial-home .editorial-brand-kicker {
    margin-bottom: 8px !important;
    font-size: .58rem !important;
  }
  body.editorial-home .editorial-brand-name {
    font-size: clamp(2.8rem, 5.2vw, 4.6rem) !important;
    line-height: .78 !important;
  }
  body.editorial-home .editorial-brand-title {
    margin-top: 10px !important;
    font-size: clamp(1.2rem, 2.1vw, 1.7rem) !important;
  }
  body.editorial-home .editorial-brand-rule {
    margin: 12px auto 10px !important;
  }
  body.editorial-home .editorial-brand-copy {
    font-size: clamp(.76rem, .85vw, .9rem) !important;
    line-height: 1.35 !important;
  }
  body.editorial-home .editorial-products-head {
    padding-bottom: 4px !important;
  }
  body.editorial-home .editorial-list {
    padding: 0 !important;
  }
  body.editorial-home .editorial-product {
    min-height: 250px !important;
  }
  body.editorial-home .editorial-product-preview {
    flex: 0 0 145px !important;
    height: 145px !important;
    min-height: 145px !important;
  }
  body.editorial-home .editorial-product-copy {
    flex: 0 0 105px !important;
    min-height: 105px !important;
    padding: 10px 14px 9px 42px !important;
  }
  body.editorial-home .editorial-product h1,
  body.editorial-home .editorial-product h2 {
    margin-bottom: 6px !important;
    font-size: clamp(2.15rem, 3.2vw, 2.8rem) !important;
  }
  body.editorial-home .editorial-product p {
    font-size: .6rem !important;
  }
  body.editorial-home .pf-final {
    min-height: 180px !important;
    margin-top: 12px !important;
    padding: 20px 5vw !important;
    gap: 12px !important;
  }
  body.editorial-home .pf-final h2 {
    font-size: clamp(1.85rem, 3.2vw, 2.35rem) !important;
  }
  body.editorial-home .pf-final a {
    height: 40px !important;
    min-height: 40px !important;
  }
  body.editorial-home .pf-footer {
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 !important;
  }
}

/* -------------------------------------------------------------------------
   2026 ART-DIRECTION PASS
   A final, deliberately small layer for the shared visual language.  The
   stylesheet contains legacy product rules above; keeping this layer last
   makes the intended system explicit without rewriting working interactions.
   ------------------------------------------------------------------------- */

:root {
  --pf-charcoal: #171514;
  --pf-charcoal-deep: #110f0e;
  --pf-warm-white: #f7f1e9;
  --pf-copy: rgba(244, 237, 228, .74);
  --pf-copy-soft: rgba(244, 237, 228, .56);
  --pf-gold: #f2c94c;
  --pf-gold-deep: #daa83c;
  --pf-focus: #ffe28a;
  --pf-radius: 12px;
}

/* One quiet, cinematic field across every dark surface. */
body.editorial-home,
body.products-index-page,
body.about-page,
body.contact-page,
body.product-page {
  background:
    radial-gradient(75% 55% at 96% -12%, rgba(242, 201, 76, .055), transparent 70%),
    linear-gradient(155deg, #1d1917 0%, var(--pf-charcoal) 58%, var(--pf-charcoal-deep) 100%) !important;
}

/* Keep the navigation a fixed visual anchor; link hit areas do not move when
   the Products control opens or receives focus. */
.pf-nav,
body.product-page .site-nav {
  height: 68px !important;
  min-height: 68px !important;
  background: var(--pf-gold) !important;
  border-bottom: 1px solid rgba(23, 19, 16, .72) !important;
}
.pf-nav-inner,
body.product-page .site-nav .container {
  width: min(1180px, calc(100% - 48px)) !important;
  min-height: 68px !important;
}
.pf-brand,
body.product-page .nav-brand {
  color: #171310 !important;
  letter-spacing: .14em !important;
}
.pf-brand strong,
body.product-page .nav-brand b { color: #171310 !important; }
.pf-nav-links > li > a,
.pf-nav .nav-products-link,
.pf-nav .nav-dropdown-toggle,
body.product-page .nav-links > li > a,
body.product-page .nav-products-link,
body.product-page .nav-dropdown-toggle {
  min-height: 20px !important;
  color: #171310 !important;
  line-height: 20px !important;
}
.pf-nav-links > li > a:hover,
.pf-nav-links > li > a:focus-visible,
.pf-nav .nav-products-link:hover,
.pf-nav .nav-products-link:focus-visible,
.pf-nav .nav-dropdown-toggle:hover,
.pf-nav .nav-dropdown-toggle:focus-visible,
body.product-page .nav-links > li > a:hover,
body.product-page .nav-links > li > a:focus-visible,
body.product-page .nav-products-link:hover,
body.product-page .nav-products-link:focus-visible,
body.product-page .nav-dropdown-toggle:hover,
body.product-page .nav-dropdown-toggle:focus-visible {
  color: #fffaf0 !important;
}
.pf-nav .nav-dropdown-menu,
body.product-page .nav-dropdown-menu {
  top: calc(100% + 14px) !important;
  border: 1px solid rgba(244, 237, 228, .18) !important;
  border-radius: 8px !important;
  background: #1a1715 !important;
  box-shadow: 8px 8px 0 rgba(23, 19, 16, .5) !important;
}
.pf-nav .nav-dropdown-menu a,
body.product-page .nav-dropdown-menu a {
  border-radius: 6px !important;
  transition: background .2s ease, color .2s ease, padding .2s ease !important;
}
.pf-nav .nav-dropdown-menu a:hover,
.pf-nav .nav-dropdown-menu a:focus-visible,
body.product-page .nav-dropdown-menu a:hover,
body.product-page .nav-dropdown-menu a:focus-visible {
  padding-left: 20px !important;
  background: rgba(242, 201, 76, .12) !important;
  color: var(--pf-gold) !important;
  outline: none !important;
}
.pf-nav .nav-dropdown-toggle,
body.product-page .nav-dropdown-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
}

/* Product heroes: establish a single poster-like frame and slightly calmer
   type scale. The content remains screenshot-led, with no decorative clutter. */
body.product-page .hero,
body.product-aebridge .hero {
  background:
    radial-gradient(58% 70% at 92% 4%, rgba(242, 201, 76, .055), transparent 72%),
    linear-gradient(160deg, #1c1917 0%, #171514 62%, #131110 100%) !important;
}
body.product-page .hero::before {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,.012), transparent 45%, rgba(0,0,0,.08));
  content: "";
  pointer-events: none;
}
body.product-aebridge .hero {
  background: transparent !important;
}
body.product-page .hero > .container,
body.product-aebridge main { position: relative; }
body.product-page .panel-frame,
body.product-aebridge .panel-frame {
  border: 1px solid rgba(247, 241, 233, .32) !important;
  border-radius: var(--pf-radius) !important;
  box-shadow: 12px 12px 0 var(--pf-gold) !important;
  overflow: hidden !important;
  transition: transform .35s cubic-bezier(.2, .75, .2, 1), box-shadow .35s ease !important;
}
body.product-page .panel-showcase:hover .panel-frame,
body.product-page .panel-showcase:focus-within .panel-frame {
  transform: translate(-3px, -3px) !important;
  box-shadow: 16px 16px 0 var(--pf-gold) !important;
}
body.product-page .panel-frame img,
body.product-page .panel-frame .slideshow { border-radius: inherit !important; }
body.product-page .hero h1,
body.product-page .hero-statement,
body.product-page .section-title,
body.product-aebridge .hero h1,
body.product-aebridge .hero-statement { color: var(--pf-warm-white) !important; }
body.product-page .hero-sub,
body.product-page .version-req,
body.product-page .section-desc,
body.product-page .feature-desc,
body.product-aebridge .lead,
body.product-aebridge .version-req,
body.product-aebridge .feature p {
  color: var(--pf-copy) !important;
}
body.product-page .hero-product-name,
body.product-page .section-label,
body.product-aebridge .eyebrow {
  color: var(--pf-gold) !important;
}

/* What It Does becomes a quiet information rail instead of a stack of generic
   cards. It keeps the requested borderless treatment and gains a clear hover
   cue shared by all three products. */
body.product-page .features,
body.product-aebridge .feature-grid {
  column-gap: 0 !important;
  background: transparent !important;
}
body.product-page .feature-card,
body.product-aebridge .feature-grid .feature {
  min-height: 138px !important;
  padding: 22px 26px 8px 0 !important;
  border-right: 1px solid rgba(244, 237, 228, .16) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.025), transparent 70%) !important;
  transition: transform .24s ease, background .24s ease, border-color .24s ease !important;
}
body.product-page .feature-card + .feature-card,
body.product-aebridge .feature-grid .feature + .feature {
  padding-left: 26px !important;
}
body.product-page .feature-card:last-child,
body.product-aebridge .feature-grid .feature:last-child {
  border-right: 0 !important;
  padding-right: 0 !important;
}
body.product-page .feature-card:hover,
body.product-page .feature-card:focus-within,
body.product-aebridge .feature-grid .feature:hover,
body.product-aebridge .feature-grid .feature:focus-within {
  background: linear-gradient(180deg, rgba(242,201,76,.085), transparent 78%) !important;
  border-color: rgba(242, 201, 76, .52) !important;
  transform: translateY(-4px) !important;
}
body.product-page .feature-name,
body.product-aebridge .feature-grid .feature h2 {
  color: var(--pf-warm-white) !important;
  font-size: clamp(1rem, 1.15vw, 1.18rem) !important;
  line-height: 1.18 !important;
}
body.product-page .feature-desc,
body.product-aebridge .feature-grid .feature p {
  color: var(--pf-copy) !important;
  font-size: clamp(.82rem, .95vw, .98rem) !important;
  line-height: 1.62 !important;
}

/* About: make the long-form story feel authored, with a stronger first beat
   and a restrained reading measure for the supporting paragraphs. */
body.about-page .pf-about-story {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(150px, .22fr) minmax(0, 1fr) !important;
  gap: clamp(48px, 8vw, 120px) !important;
  padding: clamp(72px, 8vw, 112px) clamp(30px, 7vw, 112px) clamp(84px, 9vw, 132px) !important;
  background:
    radial-gradient(55% 50% at 0% 15%, rgba(242, 201, 76, .045), transparent 72%),
    transparent !important;
  border-bottom: 1px solid rgba(244, 237, 228, .18) !important;
}
body.about-page .pf-about-story-label {
  position: sticky;
  top: 96px;
  align-self: start;
  margin: 0 !important;
  color: var(--pf-gold) !important;
}
body.about-page .pf-about-story-copy {
  min-width: 0 !important;
  margin: 0 !important;
}
body.about-page .pf-about-story-label::before {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 0 10px 1px 0;
  border-radius: 50%;
  background: var(--pf-gold);
  content: "";
}
body.about-page .pf-about-origin {
  gap: 30px !important;
  max-width: 900px !important;
}
body.about-page .pf-about-origin p {
  color: var(--pf-warm-white) !important;
  font-size: clamp(1.34rem, 2.2vw, 2.15rem) !important;
  line-height: 1.34 !important;
}
body.about-page .pf-about-origin p + p {
  max-width: 760px !important;
  color: var(--pf-copy) !important;
  font: 500 clamp(1rem, 1.2vw, 1.18rem)/1.68 "Manrope", sans-serif !important;
  letter-spacing: 0 !important;
}
body.about-page .pf-about-founder {
  align-items: start !important;
  margin-top: clamp(72px, 8vw, 112px) !important;
  padding-top: 30px !important;
  border-top: 1px solid rgba(242, 201, 76, .42) !important;
}
body.about-page .pf-about-founder h2 {
  color: var(--pf-warm-white) !important;
  margin-bottom: 0 !important;
}
body.about-page .pf-about-founder h2 span { color: var(--pf-gold) !important; }
body.about-page .pf-about-founder-copy > p {
  color: var(--pf-copy) !important;
  line-height: 1.7 !important;
}

/* Contact: a balanced two-column editorial form rather than a huge headline
   colliding with the fold at laptop widths. */
body.contact-page .pf-contact-main {
  width: min(1120px, calc(100% - 48px)) !important;
  min-height: calc(100svh - 140px) !important;
  padding: clamp(64px, 7vw, 96px) 0 clamp(68px, 8vw, 104px) !important;
  grid-template-columns: minmax(0, .96fr) minmax(420px, 1.04fr) !important;
  gap: clamp(56px, 7vw, 96px) !important;
  align-items: center !important;
}
body.contact-page .pf-contact-intro::before {
  display: none !important;
  content: none !important;
}
body.contact-page .pf-contact-intro { padding-top: 0 !important; }
body.contact-page .pf-contact-intro h1 {
  max-width: 520px !important;
  font-size: clamp(3.6rem, 5.35vw, 5.35rem) !important;
  line-height: .88 !important;
  letter-spacing: -.085em !important;
  text-wrap: balance;
}
body.contact-page .pf-contact-intro p {
  max-width: 430px !important;
  margin-top: 26px !important;
  color: var(--pf-copy) !important;
  font-size: clamp(.95rem, 1.1vw, 1.06rem) !important;
  line-height: 1.62 !important;
}
body.contact-page .pf-contact-form {
  padding: clamp(28px, 3.2vw, 42px) !important;
  border: 1px solid rgba(244, 237, 228, .22) !important;
  border-radius: var(--pf-radius) !important;
  background: rgba(26, 23, 21, .84) !important;
  box-shadow: 10px 10px 0 var(--pf-gold) !important;
}
body.contact-page .pf-contact-field input,
body.contact-page .pf-contact-field textarea {
  border-radius: 6px !important;
  background: rgba(10, 9, 8, .68) !important;
}
body.contact-page .pf-contact-field input:focus,
body.contact-page .pf-contact-field textarea:focus {
  border-color: var(--pf-gold) !important;
  box-shadow: 0 0 0 3px rgba(242, 201, 76, .16) !important;
}
body.contact-page .pf-contact-submit {
  min-height: 50px !important;
  border-radius: 6px !important;
  background: var(--pf-gold-deep) !important;
  box-shadow: 6px 6px 0 #1a202c !important;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease !important;
}
body.contact-page .pf-contact-submit:hover,
body.contact-page .pf-contact-submit:focus-visible {
  background: #e5b84a !important;
  box-shadow: 9px 9px 0 #1a202c !important;
}

/* AE Bridge's main element is a centered grid; pull its shared workflow CTA
   back out to the viewport edge so it aligns with the other product pages. */
body.product-aebridge > main > .product-final {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
}

/* Products index: bring the first row into view sooner and let each row read
   as a considered editorial spread, not a long sequence of generic cards. */
@media (min-width: 861px) {
  body.products-index-page .products-index-main {
    padding: clamp(56px, 6vw, 84px) clamp(28px, 6vw, 80px) clamp(64px, 8vw, 96px) !important;
  }
  body.products-index-page .products-index-intro {
    margin-bottom: clamp(38px, 4.5vw, 54px) !important;
  }
  body.products-index-page .products-index-list { grid-auto-rows: 320px !important; }
  body.products-index-page .products-index-copy {
    padding: 30px clamp(28px, 4vw, 64px) 30px 54px !important;
  }
  body.products-index-page .products-index-row::before {
    position: absolute;
    inset: 0 auto 0 0;
    z-index: 3;
    width: 5px;
    background: var(--pf-yellow);
    content: "";
    transform: scaleY(.2);
    transform-origin: center;
    transition: transform .28s ease;
  }
  body.products-index-page .products-index-row:hover::before,
  body.products-index-page .products-index-row:focus-visible::before { transform: scaleY(1); }
}

/* The home rail is the one place where the first viewport matters. Reduce
   only its outer rhythm at a 13–16 inch laptop size so the CTA and copyright
   remain visible while the product frames keep their readable dimensions. */
@media (min-width: 861px) and (max-width: 1800px) and (min-height: 801px) and (max-height: 1100px) {
  body.editorial-home .editorial-home-shell {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
  body.editorial-home .editorial-brand-panel { margin-bottom: 18px !important; }
  body.editorial-home .editorial-products-head { padding-bottom: 6px !important; }
  body.editorial-home .editorial-list { padding: 0 !important; }
  body.editorial-home .pf-final { margin-top: 12px !important; }
  body.editorial-home .pf-footer {
    min-height: 18px !important;
    height: 18px !important;
    padding: 0 !important;
  }
}

/* Focus rings and reduced-motion behavior are part of the finish, not an
   afterthought. */
:where(a, button, input, textarea):focus-visible {
  outline: 2px solid var(--pf-focus) !important;
  outline-offset: 4px !important;
}
body.pf-modal-open { overflow: hidden !important; }
body.pf-error-page {
  min-height: 100svh;
  margin: 0;
  background: linear-gradient(145deg, #1b1511 0%, #15110e 48%, #0f0d0b 100%) !important;
  color: var(--pf-paper-2);
}
.pf-error {
  min-height: calc(100svh - 142px);
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 18px;
  padding: 72px 22px 82px;
  text-align: center;
}
.pf-error-label {
  color: var(--pf-yellow);
  font: 500 .72rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.pf-error h1 {
  max-width: 720px;
  color: var(--pf-paper-2);
  font: 700 clamp(3.4rem, 8vw, 7rem)/.86 "Space Grotesk", sans-serif;
  letter-spacing: -.08em;
}
.pf-error h1 span { color: var(--pf-yellow); }
.pf-error p:not(.pf-error-label) {
  max-width: 480px;
  color: rgba(244, 237, 228, .64);
  font: 500 1rem/1.6 "Manrope", sans-serif;
}
.pf-error a {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: 10px;
  padding: 13px 17px 12px;
  background: var(--pf-yellow);
  color: var(--pf-ink);
  font: 700 .72rem/1 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
  box-shadow: 6px 6px 0 var(--pf-ink);
  transition: transform .2s ease, box-shadow .2s ease;
}
.pf-error a:hover,
.pf-error a:focus-visible { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--pf-ink); }
@media (max-width: 760px) {
  .pf-error { min-height: calc(100svh - 134px); padding-top: 54px; }
  .pf-error h1 { font-size: clamp(3.15rem, 15vw, 5rem); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Mobile escape hatch: the desktop art-direction grid must collapse cleanly
   rather than allowing its reading columns to become a 150px/132px sliver. */
@media (max-width: 860px) {
  .pf-nav,
  body.product-page .site-nav {
    height: 60px !important;
    min-height: 60px !important;
  }
  .pf-nav-inner,
  body.product-page .site-nav .container {
    min-height: 60px !important;
  }
  body.editorial-home .editorial-home-shell {
    box-sizing: border-box !important;
    width: 100% !important;
  }
  body.editorial-home .editorial-brand-panel,
  body.editorial-home .editorial-products {
    width: 100% !important;
  }
  body.about-page .pf-about-story {
    display: block !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    padding: 64px 22px 82px !important;
  }
  body.about-page .pf-about-story-label {
    position: static !important;
    display: block !important;
    width: auto !important;
    margin: 0 0 30px !important;
  }
  body.about-page .pf-about-story-copy {
    width: 100% !important;
  }
  body.contact-page .pf-contact-main {
    width: min(calc(100% - 32px), 560px) !important;
    min-height: 0 !important;
    padding: 54px 0 76px !important;
    grid-template-columns: 1fr !important;
    gap: 42px !important;
    align-items: start !important;
  }
  body.contact-page .pf-contact-intro h1 {
    max-width: none !important;
    font-size: clamp(3.05rem, 14vw, 4.7rem) !important;
  }
  body.contact-page .pf-contact-form {
    width: 100% !important;
  }
}

@media (max-width: 760px) {
  .pf-nav-inner,
  body.product-page .site-nav .container {
    width: calc(100% - 32px) !important;
  }
  .pf-brand,
  body.product-page .nav-brand {
    gap: 5px !important;
    font-size: .78rem !important;
    letter-spacing: .08em !important;
  }
  .pf-nav-mark,
  body.product-page .nav-brand .pf-nav-mark {
    width: 14px !important;
    height: 18px !important;
  }
  .pf-nav-links,
  body.product-page .nav-links {
    gap: 10px !important;
  }
  .pf-nav-links > li > a,
  .pf-nav .nav-products-link,
  .pf-nav .nav-dropdown-toggle,
  body.product-page .nav-links > li > a,
  body.product-page .nav-products-link,
  body.product-page .nav-dropdown-toggle {
    font-size: .6rem !important;
    letter-spacing: .04em !important;
  }
  .pf-nav .nav-dropdown-toggle,
  body.product-page .nav-dropdown-toggle {
    font-size: 0 !important;
  }
  .pf-nav-links > li.nav-dropdown,
  body.product-page .nav-links > li.nav-dropdown {
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }
}