:root {
      --wb-ink: #101817;
      --wb-muted: #687775;
      --wb-canvas: #e2efed;
      --wb-paper: #f8fcfb;
      --wb-paper-soft: #edf5f3;
      --wb-line: #c1d8d4;
      --wb-teal: #365f5c;
      --wb-green: #629491;
      --wb-orange: #e85c33;
      --wb-blue: #428eff;
      --wb-yellow: #ffc640;
      --wb-sans: "Inter", Arial, sans-serif;
      --wb-heading: "Montserrat Alternates", "Inter", Arial, sans-serif;
      --wb-serif: "Lora", Georgia, serif;
      --wb-frame: min(1820px, calc(100vw - 28px));
      --wb-radius: 18px;
      --wb-ease: cubic-bezier(.22, 1, .36, 1);
    }
.wb-page, .wb-page *, .wb-page *::before, .wb-page *::after { box-sizing: border-box; }
body.webbies-landing-page { background: var(--wb-canvas); scroll-behavior: smooth; }
body.webbies-landing-page {
      margin: 0;
      overflow-x: clip;
      background: var(--wb-canvas);
      color: var(--wb-ink);
      font: 400 16px/1.6 var(--wb-sans);
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }
body.webbies-landing-page::before {
      position: fixed;
      z-index: 999;
      inset: 0;
      pointer-events: none;
      content: "";
      opacity: .022;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
      mix-blend-mode: multiply;
    }
.wb-page ::selection { background: var(--wb-yellow); color: var(--wb-ink); }
.wb-page a { color: inherit; }
.wb-page button { color: inherit; font: inherit; }
.wb-page img, .wb-page svg { display: block; max-width: 100%; }
.wb-page h1, .wb-page h2, .wb-page h3, .wb-page p { margin: 0; }
.wb-page h1, .wb-page h2, .wb-page h3 { font-family: var(--wb-heading); font-weight: 600; letter-spacing: -.045em; text-wrap: balance; }
.wb-page :focus-visible { outline: 3px solid var(--wb-orange); outline-offset: 4px; }

    .wb-skip {
      position: fixed;
      z-index: 2000;
      top: 10px;
      left: 10px;
      transform: translateY(-150%);
      padding: 10px 16px;
      border-radius: 999px;
      background: var(--wb-yellow);
      font-weight: 700;
      transition: transform .2s ease;
    }
    .wb-skip:focus { transform: none; }

    .wb-progress {
      position: fixed;
      z-index: 1000;
      top: 50%;
      right: 7px;
      width: 6px;
      height: 132px;
      overflow: hidden;
      border-radius: 99px;
      background: rgba(8,123,105,.14);
      transform: translateY(-50%);
    }
    .wb-progress span {
      display: block;
      width: 100%;
      height: 100%;
      transform: scaleY(0);
      transform-origin: top;
      border-radius: inherit;
      background: var(--wb-green);
    }

    .wb-frame {
      width: var(--wb-frame);
      margin: 14px auto 0;
      overflow: clip;
      border: 1px solid var(--wb-line);
      border-radius: var(--wb-radius);
      background: var(--wb-line);
      box-shadow: 0 20px 70px rgba(33, 92, 82, .06);
    }
    .wb-frame + .wb-frame { margin-top: 14px; }
    .wb-frame.wb-sticky-frame {
      overflow: visible;
      border: 0;
      background: transparent;
      box-shadow: none;
    }
    .wb-sticky-frame .wb-system__header {
      border: 1px solid var(--wb-line);
      border-radius: var(--wb-radius) var(--wb-radius) 0 0;
    }
    .wb-sticky-frame .wb-system__layout {
      border: 1px solid var(--wb-line);
      border-top: 0;
      border-radius: 0 0 var(--wb-radius) var(--wb-radius);
    }
    .wb-sticky-frame.wb-faq .wb-faq__grid {
      border: 1px solid var(--wb-line);
      border-radius: var(--wb-radius);
    }
    .wb-sticky-frame.wb-answers .wb-answers__grid {
      border: 1px solid var(--wb-line);
      border-radius: var(--wb-radius);
    }
    .wb-sticky-frame.wb-answers .wb-answers__intro { border-radius: var(--wb-radius) 0 0 var(--wb-radius); }
    .wb-sticky-frame.wb-answers .wb-answers__list { border-radius: 0 var(--wb-radius) var(--wb-radius) 0; }
    .wb-sticky-frame.wb-faq .wb-faq__intro { border-radius: var(--wb-radius) 0 0 var(--wb-radius); }
    .wb-sticky-frame.wb-faq .wb-faq__list { border-radius: 0 var(--wb-radius) var(--wb-radius) 0; }
    .wb-cell { background: var(--wb-paper); }
    .wb-kicker {
      color: var(--wb-muted);
      font-size: .72rem;
      font-weight: 600;
      letter-spacing: .09em;
      text-transform: uppercase;
    }
    .wb-kicker b { color: var(--wb-green); font-weight: 700; }
    .wb-serif { font-family: var(--wb-serif); font-style: italic; font-weight: 500; }
    .wb-accent { color: var(--wb-teal); }
    .wb-dot {
      display: inline-block;
      width: 8px;
      height: 8px;
      margin-right: 8px;
      border-radius: 2px;
      background: var(--wb-green);
      transform: rotate(45deg);
    }

    .wb-nav {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      min-height: 66px;
      padding: 8px 14px 8px 22px;
      border-bottom: 1px solid var(--wb-line);
      background: var(--wb-paper);
    }
    .wb-brand {
      display: inline-flex;
      width: max-content;
      align-items: center;
      gap: 10px;
      font-weight: 700;
      letter-spacing: -.035em;
      text-decoration: none;
    }
    .wb-brand i {
      display: grid;
      width: 27px;
      aspect-ratio: 1;
      place-items: center;
      border-radius: 8px;
      background: var(--wb-teal);
      color: white;
      font-style: normal;
      font-size: .72rem;
    }
    .wb-nav__links { display: flex; justify-content: center; gap: 25px; }
    .wb-nav__links a {
      color: var(--wb-muted);
      font-size: .8rem;
      font-weight: 600;
      text-decoration: none;
    }
    .wb-nav__links a:hover { color: var(--wb-ink); }
    .wb-nav__actions { display: flex; justify-self: end; align-items: center; gap: 9px; }
    .wb-nav__cta {
      display: inline-flex;
      min-height: 42px;
      align-items: center;
      padding: 0 17px;
      border-radius: 12px;
      background: var(--wb-yellow);
      font-size: .76rem;
      font-weight: 700;
      text-decoration: none;
      transition: transform .25s var(--wb-ease), box-shadow .25s ease;
    }
    .wb-nav__cta:hover { transform: translateY(-2px); box-shadow: 0 7px 18px rgba(54,95,92,.14); }
    .wb-menu { display: none; position: relative; }
    .wb-menu summary { display: grid; width: 42px; aspect-ratio: 1; place-items: center; border: 1px solid var(--wb-line); border-radius: 12px; background: var(--wb-paper-soft); cursor: pointer; font-size: .76rem; font-weight: 700; list-style: none; }
    .wb-menu summary::-webkit-details-marker { display: none; }
    .wb-menu__panel { position: absolute; z-index: 40; top: 48px; right: 0; display: grid; width: 210px; padding: 8px; border: 1px solid var(--wb-line); border-radius: 13px; background: var(--wb-paper); box-shadow: 0 18px 40px rgba(54,95,92,.16); }
    .wb-menu__panel a { padding: 10px 11px; border-radius: 8px; color: var(--wb-muted); font-size: .76rem; font-weight: 600; text-decoration: none; }
    .wb-menu__panel a:hover { background: var(--wb-paper-soft); color: var(--wb-ink); }
    .wb-motion {
      display: inline-flex;
      min-height: 42px;
      align-items: center;
      gap: 9px;
      padding: 0 15px;
      border: 1px solid var(--wb-line);
      border-radius: 12px;
      background: var(--wb-paper-soft);
      cursor: pointer;
    }
    .wb-motion i {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--wb-green);
    }
    .wb-motion[aria-pressed="false"] i { background: #9daaa8; }

    .wb-hero-grid {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: 1px;
    }
    .wb-hero__copy {
      grid-column: span 7;
      min-height: 620px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: clamp(30px, 4vw, 68px);
    }
    .wb-hero__headline { max-width: 1000px; }
    .wb-hero h1 {
      margin-top: 26px;
      font-size: clamp(3rem, 5.2vw, 6.4rem);
      line-height: 1.03;
      letter-spacing: -.065em;
    }
    .wb-hero__intro {
      max-width: 850px;
      margin-top: 30px;
      color: var(--wb-muted);
      font-size: clamp(1rem, 1.25vw, 1.23rem);
    }
    .wb-hero__intro strong { color: var(--wb-ink); font-weight: 600; }
    .wb-hero__bottom {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 30px;
      margin-top: 70px;
    }
    .wb-cta {
      display: inline-flex;
      min-height: 52px;
      align-items: center;
      gap: 12px;
      padding: 0 19px;
      border-radius: 11px;
      background: var(--wb-ink);
      color: white;
      font-size: .86rem;
      font-weight: 600;
      text-decoration: none;
      transition: transform .25s var(--wb-ease), background .25s ease;
    }
    .wb-cta::after { content: "↗"; }
    .wb-cta:hover { transform: translateY(-3px); background: var(--wb-teal); }
    .wb-hero__signal {
      color: var(--wb-muted);
      font-size: .8rem;
    }
    .wb-hero__signal strong { color: var(--wb-teal); font-weight: 600; }
    .wb-caret {
      display: inline-block;
      width: 7px;
      height: 17px;
      margin-left: 4px;
      background: var(--wb-muted);
      vertical-align: -3px;
      animation: wb-blink 1.1s steps(1) infinite;
    }
    @keyframes wb-blink { 50% { opacity: 0; } }

    .wb-hero__visual {
      --wb-mx: 50%;
      --wb-my: 50%;
      --wb-tilt-x: 0deg;
      --wb-tilt-y: 0deg;
      position: relative;
      grid-column: span 5;
      min-height: 620px;
      overflow: hidden;
      padding: clamp(26px, 3vw, 48px);
      background:
        radial-gradient(circle at var(--wb-mx) var(--wb-my), rgba(255,255,255,.16), transparent 30%),
        var(--wb-teal);
      color: white;
      transition: background-position .25s ease;
    }
    .wb-hero__visual::before {
      position: absolute;
      inset: 0;
      content: "";
      opacity: .16;
      background-image:
        linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px);
      background-size: 54px 54px;
    }
    .wb-visual__label {
      position: relative;
      z-index: 2;
      display: flex;
      justify-content: space-between;
      color: rgba(255,255,255,.72);
      font-size: .68rem;
      font-weight: 600;
      letter-spacing: .09em;
      text-transform: uppercase;
    }
    .wb-search-scene {
      --wb-hero-y: 0px;
      position: relative;
      z-index: 2;
      min-height: 490px;
      display: grid;
      place-items: center;
      transform: translate3d(0,var(--wb-hero-y),0);
      will-change: transform;
    }
    .wb-search-beam {
      position: absolute;
      z-index: -1;
      width: min(82vw,560px);
      aspect-ratio: 1;
      border-radius: 50%;
      background: conic-gradient(from 0deg,transparent 0 72%,rgba(255,198,64,.4) 84%,transparent 94%);
      filter: blur(1px);
      transform: rotate(0deg);
      transform-origin: center;
      will-change: transform;
    }
    .wb-search-beam::after { position: absolute; inset: 20%; border: 1px solid rgba(255,255,255,.26); border-radius: inherit; content: ""; }
    .wb-search-window {
      position: relative;
      width: min(100%,590px);
      overflow: hidden;
      border: 2px solid rgba(255,255,255,.8);
      border-radius: 18px;
      background: var(--wb-paper);
      color: var(--wb-ink);
      box-shadow: 18px 22px 0 rgba(5,47,40,.36);
      transform: perspective(1100px) rotateX(var(--wb-tilt-x)) rotateY(var(--wb-tilt-y));
      transform-style: preserve-3d;
      transition: transform .35s var(--wb-ease),box-shadow .35s ease;
    }
    .wb-search-window__bar { display: flex; align-items: center; gap: 7px; min-height: 42px; padding: 0 14px; border-bottom: 1px solid var(--wb-line); background: var(--wb-paper-soft); }
    .wb-search-window__bar i { width: 8px; height: 8px; border-radius: 50%; background: var(--wb-orange); }
    .wb-search-window__bar i:nth-child(2) { background: var(--wb-yellow); }
    .wb-search-window__bar i:nth-child(3) { background: var(--wb-green); }
    .wb-query { margin: 18px; padding: 13px 16px; border: 1px solid var(--wb-line); border-radius: 10px; color: var(--wb-muted); font-size: .83rem; }
    .wb-query b { color: var(--wb-ink); font-weight: 600; }
    .wb-results { display: grid; gap: 11px; padding: 0 18px 20px; }
    .wb-result { display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; align-items: center; padding: 13px; border: 1px solid var(--wb-line); border-radius: 11px; background: white; transition: transform .35s var(--wb-ease),border-color .35s ease; }
    .wb-result i { display: grid; width: 34px; aspect-ratio: 1; place-items: center; border-radius: 8px; background: var(--wb-paper-soft); color: var(--wb-teal); font-style: normal; font-size: .72rem; font-weight: 700; }
    .wb-result b { display: block; font-size: .78rem; font-weight: 650; }
    .wb-result span { display: block; color: var(--wb-muted); font-size: .65rem; }
    .wb-result em { color: var(--wb-green); font-style: normal; font-size: .66rem; font-weight: 700; }
    .wb-result.is-found { transform: translateX(-10px); border-color: var(--wb-orange); }
    .wb-pulse { position: absolute; z-index: -1; width: 310px; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.46); border-radius: 50%; animation: wb-pulse 3.4s ease-out infinite; }
    .wb-pulse:nth-child(2) { animation-delay: 1.15s; }
    .wb-pulse:nth-child(3) { animation-delay: 2.3s; }
    @keyframes wb-pulse { from { transform: scale(.45); opacity: 1; } to { transform: scale(1.7); opacity: 0; } }

    .wb-hero__stat {
      grid-column: span 3;
      min-height: 210px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 28px 32px;
    }
    .wb-hero__stat--wide { grid-column: span 6; }
    .wb-stat__value {
      font-size: clamp(2.8rem, 4.3vw, 5.2rem);
      font-weight: 500;
      line-height: 1;
      letter-spacing: -.07em;
    }
    .wb-stat__value span { font-family: var(--wb-serif); color: var(--wb-orange); font-style: italic; }
    .wb-stat__copy { max-width: 500px; color: var(--wb-muted); font-size: .8rem; }
    .wb-dot-matrix {
      display: grid;
      grid-template-columns: repeat(7, 8px);
      gap: 5px;
      width: max-content;
    }
    .wb-dot-matrix i { width: 8px; height: 8px; border-radius: 2px; background: var(--wb-line); }
    .wb-dot-matrix i:nth-child(2), .wb-dot-matrix i:nth-child(7), .wb-dot-matrix i:nth-child(9), .wb-dot-matrix i:nth-child(11), .wb-dot-matrix i:nth-child(15), .wb-dot-matrix i:nth-child(16), .wb-dot-matrix i:nth-child(17), .wb-dot-matrix i:nth-child(23), .wb-dot-matrix i:nth-child(28) { background: var(--wb-green); }

    .wb-system__header {
      padding: clamp(34px, 4vw, 64px);
      border-bottom: 1px solid var(--wb-line);
      background: var(--wb-paper);
    }
    .wb-system__header h2 {
      max-width: 900px;
      margin-top: 18px;
      font-size: clamp(2.25rem, 3.25vw, 4rem);
      line-height: 1.08;
    }
    .wb-system__header p {
      max-width: 760px;
      margin-top: 22px;
      color: var(--wb-muted);
      font-size: 1rem;
    }
    .wb-system__layout {
      display: grid;
      grid-template-columns: minmax(0, 7fr) minmax(390px, 5fr);
      gap: 1px;
      background: var(--wb-line);
    }
    .wb-system__steps { background: var(--wb-paper); }
    .wb-step {
      min-height: 62vh;
      display: grid;
      grid-template-columns: 64px minmax(0, 1fr);
      gap: 26px;
      align-content: center;
      padding: clamp(42px, 6vw, 92px);
      border-bottom: 1px solid var(--wb-line);
      opacity: 1;
      transition: opacity .35s ease, background .35s ease;
    }
    .wb-motion-ready .wb-step { opacity: .34; }
    .wb-step:last-child { border-bottom: 0; }
    .wb-step.is-active,
    .wb-motion-ready .wb-step.is-active { opacity: 1; background: var(--wb-paper-soft); }
    .wb-step__number {
      color: var(--wb-green);
      font-size: .73rem;
      font-weight: 650;
      letter-spacing: .1em;
    }
    .wb-step h3 {
      max-width: 700px;
      font-size: clamp(1.7rem, 2.45vw, 3rem);
      line-height: 1.08;
    }
    .wb-step p { max-width: 720px; margin-top: 20px; color: var(--wb-muted); }
    .wb-step p + p { margin-top: 14px; }
    .wb-step a { text-decoration-color: var(--wb-green); text-underline-offset: 4px; }

    .wb-system__stage-wrap { position: relative; background: var(--wb-paper); }
    .wb-stage {
      --wb-mx: 50%;
      --wb-my: 50%;
      --wb-tilt-x: 0deg;
      --wb-tilt-y: 0deg;
      position: sticky;
      top: 14px;
      height: calc(100vh - 28px);
      min-height: 650px;
      overflow: hidden;
      background:
        radial-gradient(circle at var(--wb-mx) var(--wb-my), rgba(255,255,255,.12), transparent 29%),
        var(--wb-teal);
      color: white;
    }
    .wb-stage__top {
      position: absolute;
      z-index: 10;
      top: 26px;
      right: 26px;
      left: 26px;
      display: flex;
      justify-content: space-between;
      color: rgba(255,255,255,.7);
      font-size: .68rem;
      font-weight: 650;
      letter-spacing: .1em;
      text-transform: uppercase;
    }
    .wb-stage__meter {
      position: absolute;
      z-index: 12;
      top: 72px;
      right: 25px;
      bottom: 76px;
      width: 2px;
      overflow: hidden;
      border-radius: 99px;
      background: rgba(255,255,255,.2);
    }
    .wb-stage__meter i {
      display: block;
      width: 100%;
      height: 100%;
      transform: scaleY(var(--wb-process-progress, 0));
      transform-origin: top;
      border-radius: inherit;
      background: var(--wb-yellow);
      will-change: transform;
    }
    .wb-stage__scene {
      position: absolute;
      inset: 0;
      display: grid;
      grid-template-rows: minmax(0, 1fr) auto;
      align-items: center;
      gap: 22px;
      padding: 88px 44px 32px;
      opacity: 0;
      transform: translateY(30px) scale(.98);
      transition: opacity .55s ease, transform .7s var(--wb-ease);
      pointer-events: none;
    }
    .wb-stage__scene.is-active { opacity: 1; transform: none; }
    .wb-stage__scene > div {
      align-self: center;
    }
    .wb-stage__scene h4 {
      position: static;
      align-self: end;
      width: 100%;
      margin: 0;
      padding-right: 32px;
      font-family: var(--wb-serif);
      font-size: clamp(1.15rem, 1.75vw, 1.85rem);
      line-height: 1.08;
      font-style: italic;
      font-weight: 500;
    }
    .wb-tool {
      width: min(100%, 570px);
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.46);
      border-radius: 18px;
      background: rgba(31, 70, 67, .72);
      box-shadow: none;
    }
    .wb-tool__head {
      display: flex;
      min-height: 48px;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 0 17px;
      border-bottom: 1px solid rgba(255,255,255,.2);
      color: rgba(255,255,255,.72);
      font-size: .62rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .wb-tool__head b { color: var(--wb-yellow); font-size: .68rem; }

    .wb-iso-rig {
      display: block;
      width: 100%;
      height: auto;
      overflow: visible;
      transform: perspective(980px) rotateX(var(--wb-tilt-x)) rotateY(var(--wb-tilt-y));
      transform-style: preserve-3d;
      transform-origin: 50% 52%;
      transition: transform .32s var(--wb-ease);
      will-change: transform;
    }
    .wb-iso-rig .iso-shadow { fill: rgba(3,31,27,.38); }
    .wb-iso-rig .iso-top { fill: #1aa18b; }
    .wb-iso-rig .iso-left { fill: #0c7568; }
    .wb-iso-rig .iso-right { fill: #075c53; }
    .wb-iso-rig .iso-cube-top { fill: #6fe0c9; }
    .wb-iso-rig .iso-cube-left { fill: #32b69e; }
    .wb-iso-rig .iso-cube-right { fill: #168f7d; }
    .wb-iso-rig .iso-cube-top--focus { fill: #ffe08a; }
    .wb-iso-rig .iso-cube-left--focus { fill: #e7b52e; }
    .wb-iso-rig .iso-cube-right--focus { fill: #bd8412; }
    .wb-iso-rig .iso-cube-top--warn { fill: #ff9a78; }
    .wb-iso-rig .iso-cube-left--warn { fill: #ee6844; }
    .wb-iso-rig .iso-cube-right--warn { fill: #bd452b; }
    .wb-iso-rig .iso-route { fill: none; stroke: rgba(255,255,255,.52); stroke-width: 2; stroke-dasharray: 5 7; }
    .wb-iso-rig .iso-route--accent { stroke: #ffc640; }
    .wb-iso-rig .iso-orbit { fill: none; stroke-width: 2; stroke-dasharray: 5 8; }
    .wb-iso-rig text { fill: rgba(255,255,255,.82); font-family: var(--wb-sans); font-size: 12px; font-weight: 600; }
    .wb-iso-rig .iso-label { fill: white; font-size: 13px; }
    .wb-iso-rig .iso-small { fill: rgba(255,255,255,.62); font-size: 10px; font-weight: 500; }
    .wb-iso-rig .iso-accent { fill: #ffc640; }
    .wb-iso-rig .iso-dark { fill: #0a1412; }
    .wb-iso-rig .iso-node { transform-box: fill-box; transform-origin: center; transition: transform .4s var(--wb-ease), filter .4s ease; }
    .wb-stage__scene.is-active .iso-node { animation: wb-node-float 3.8s ease-in-out infinite; }
    .wb-stage__scene.is-active .iso-node:nth-of-type(even) { animation-delay: -.9s; }
    @keyframes wb-node-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }

    /* Purposeful flat process diagrams. Keep the retired pseudo-3D artwork out of
       the layout even if WordPress or an embed adds an extra wrapper. */
    .wb-stage__scene .wb-tool,
    .wb-stage__scene .wb-iso-rig { display: none !important; }
    .wb-flat {
      width: min(100%, 570px);
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.46);
      border-radius: 18px;
      background: rgba(31,70,67,.72);
      box-shadow: none;
    }
    .wb-flat__head {
      display: flex;
      min-height: 48px;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 0 17px;
      border-bottom: 1px solid rgba(255,255,255,.2);
      color: rgba(255,255,255,.72);
      font-size: .62rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .wb-flat__head b { color: var(--wb-yellow); font-size: .68rem; }
    .wb-flat__note {
      padding: 11px 17px;
      border-top: 1px solid rgba(255,255,255,.16);
      color: rgba(255,255,255,.58);
      font-size: .61rem;
    }
    .wb-foundation-map { position: relative; min-height: 320px; }
    .wb-foundation-map::before,
    .wb-foundation-map::after {
      content: "";
      position: absolute;
      inset: 50% auto auto 50%;
      z-index: 0;
      background: rgba(255,255,255,.22);
      transform: translate(-50%,-50%);
    }
    .wb-foundation-map::before { width: 72%; height: 1px; }
    .wb-foundation-map::after { width: 1px; height: 72%; }
    .wb-foundation-map__core,
    .wb-foundation-map__node {
      position: absolute;
      z-index: 2;
      display: grid;
      place-items: center;
      text-align: center;
    }
    .wb-foundation-map__core {
      inset: 50% auto auto 50%;
      width: 104px;
      aspect-ratio: 1;
      padding: 12px;
      border-radius: 26px;
      background: var(--wb-yellow);
      color: var(--wb-ink);
      font-size: .75rem;
      font-weight: 750;
      transform: translate(-50%,-50%);
      box-shadow: 0 0 0 13px rgba(255,198,64,.12);
    }
    .wb-foundation-map__node {
      width: 98px;
      min-height: 64px;
      border: 1px solid rgba(255,255,255,.42);
      border-radius: 15px;
      background: rgba(4,61,54,.74);
      color: #fff;
      font-size: .72rem;
      font-weight: 700;
    }
    .wb-foundation-map__node small { display: block; color: rgba(255,255,255,.55); font-size: .52rem; font-weight: 500; }
    .wb-foundation-map__node--crawl { top: 28px; left: 18px; }
    .wb-foundation-map__node--index { top: 28px; right: 18px; }
    .wb-foundation-map__node--mobile { bottom: 28px; left: 18px; }
    .wb-foundation-map__node--speed { right: 18px; bottom: 28px; }
    .wb-route-list { display: grid; gap: 10px; padding: 22px 18px; }
    .wb-route {
      display: grid;
      grid-template-columns: minmax(0,1fr) 30px minmax(0,1fr);
      align-items: center;
      gap: 10px;
    }
    .wb-route > span,
    .wb-route > b {
      min-height: 66px;
      display: grid;
      align-content: center;
      padding: 10px 12px;
      border: 1px solid rgba(255,255,255,.3);
      border-radius: 13px;
      background: rgba(255,255,255,.05);
      color: #fff;
      font-size: .7rem;
    }
    .wb-route > span small { display: block; margin-top: 4px; color: rgba(255,255,255,.5); font-size: .52rem; }
    .wb-route > b { border-color: rgba(255,198,64,.65); }
    .wb-route > i { color: var(--wb-yellow); font-size: 1.1rem; font-style: normal; text-align: center; }
    .wb-local-rings { position: relative; min-height: 320px; }
    .wb-local-rings__ring,
    .wb-local-rings__core,
    .wb-local-rings__signal { position: absolute; }
    .wb-local-rings__ring {
      inset: 50% auto auto 50%;
      border: 1px solid rgba(255,255,255,.25);
      border-radius: 50%;
      transform: translate(-50%,-50%);
    }
    .wb-local-rings__ring--1 { width: 42%; height: 96px; border-color: #75dfc9; }
    .wb-local-rings__ring--2 { width: 68%; height: 160px; border-color: var(--wb-yellow); }
    .wb-local-rings__ring--3 { width: 92%; height: 224px; border-color: #ff8464; }
    .wb-local-rings__core {
      inset: 50% auto auto 50%;
      display: grid;
      width: 120px;
      aspect-ratio: 1;
      place-items: center;
      border-radius: 50%;
      background: var(--wb-yellow);
      color: var(--wb-ink);
      font-size: .74rem;
      font-weight: 750;
      text-align: center;
      transform: translate(-50%,-50%);
      box-shadow: 0 0 0 12px rgba(255,198,64,.11);
    }
    .wb-local-rings__signal { color: rgba(255,255,255,.8); font-size: .65rem; font-weight: 650; }
    .wb-local-rings__signal--profile { top: 38px; left: 46px; }
    .wb-local-rings__signal--reviews { top: 50px; right: 42px; }
    .wb-local-rings__signal--citations { bottom: 42px; left: 48px; }
    .wb-local-rings__signal--pages { right: 42px; bottom: 42px; }
    .wb-funnel-flat { display: grid; justify-items: center; gap: 8px; min-height: 300px; align-content: center; padding: 22px; }
    .wb-funnel-flat__layer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 48px;
      padding: 0 18px;
      color: var(--wb-ink);
      font-size: .68rem;
      font-weight: 750;
      clip-path: polygon(7% 0,93% 0,100% 100%,0 100%);
    }
    .wb-funnel-flat__layer small { font-size: .51rem; font-weight: 600; opacity: .72; }
    .wb-funnel-flat__layer--1 { width: 88%; background: #1aa18b; }
    .wb-funnel-flat__layer--2 { width: 70%; background: #65d8c1; }
    .wb-funnel-flat__layer--3 { width: 53%; background: #ffd76a; }
    .wb-funnel-flat__layer--4 { width: 36%; background: #ffe69d; }

    /* The former isometric experiments remain in the prototype source only as a
       rollback reference. They must never participate in layout or rendering. */
    .wb-stage__scene .wb-tool,
    .wb-stage__scene .wb-iso-rig { display: none !important; visibility: hidden !important; }

    @keyframes wb-core-breathe {
      0%, 100% { box-shadow: 0 0 0 11px rgba(255,198,64,.09); }
      50% { box-shadow: 0 0 0 20px rgba(255,198,64,.18); }
    }
    @keyframes wb-route-travel {
      0%, 100% { transform: translateX(-3px); opacity: .55; }
      50% { transform: translateX(4px); opacity: 1; }
    }
    @keyframes wb-ring-breathe {
      0%, 100% { opacity: .45; }
      50% { opacity: 1; }
    }
    @keyframes wb-layer-signal {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-4px); }
    }
    .wb-stage__scene.is-active .wb-foundation-map__core { animation: wb-core-breathe 2.8s ease-in-out infinite; }
    .wb-stage__scene.is-active .wb-route > i { animation: wb-route-travel 1.7s ease-in-out infinite; }
    .wb-stage__scene.is-active .wb-local-rings__ring { animation: wb-ring-breathe 3.2s ease-in-out infinite; }
    .wb-stage__scene.is-active .wb-local-rings__ring--2 { animation-delay: .32s; }
    .wb-stage__scene.is-active .wb-local-rings__ring--3 { animation-delay: .64s; }
    .wb-stage__scene.is-active .wb-funnel-flat__layer { animation: wb-layer-signal 3s ease-in-out infinite; }
    .wb-stage__scene.is-active .wb-funnel-flat__layer--2 { animation-delay: .14s; }
    .wb-stage__scene.is-active .wb-funnel-flat__layer--3 { animation-delay: .28s; }
    .wb-stage__scene.is-active .wb-funnel-flat__layer--4 { animation-delay: .42s; }

    /* V6 editorial process display: a quiet, held "work surface" rather than a
       dashboard. The shared hand is inline SVG, so this adds no image request. */
    .wb-stage {
      background:
        radial-gradient(circle at var(--wb-mx) var(--wb-my), rgba(8,125,109,.08), transparent 28%),
        #eaf6f3;
      color: var(--wb-ink);
    }
    .wb-stage__top { z-index: 30; color: rgba(5,47,40,.66); }
    .wb-stage__meter { background: rgba(8,125,109,.18); }
    .wb-stage__meter i { background: var(--wb-green); }
    .wb-stage__scene {
      gap: 24px;
      padding: 112px 52px 42px;
    }
    .wb-stage__scene h4 {
      color: var(--wb-teal);
      font-size: clamp(1.25rem, 1.9vw, 2rem);
    }
    .wb-stage__hand {
      position: absolute;
      z-index: 20;
      top: -22px;
      right: clamp(52px, 11%, 108px);
      width: clamp(112px, 15vw, 164px);
      filter: drop-shadow(0 10px 12px rgba(5,47,40,.13));
      pointer-events: none;
    }
    .wb-stage__hand svg { display: block; width: 100%; height: auto; overflow: visible; }
    .wb-stage__hand .wb-hand-fill { fill: #fff9ef; stroke: var(--wb-teal); stroke-width: 2.4; }
    .wb-stage__hand .wb-hand-detail { fill: none; stroke: rgba(8,125,109,.45); stroke-width: 1.8; stroke-linecap: round; }
    .wb-flat {
      width: min(100%, 540px);
      border: 1px solid rgba(8,125,109,.28);
      border-radius: 20px;
      background: rgba(255,255,255,.94);
      box-shadow: 0 22px 55px rgba(5,47,40,.1);
    }
    .wb-flat__head {
      min-height: 52px;
      border-bottom-color: rgba(8,125,109,.18);
      color: rgba(5,47,40,.62);
    }
    .wb-flat__head b { color: #a86d00; }
    .wb-flat__note {
      border-top-color: rgba(8,125,109,.16);
      color: rgba(5,47,40,.58);
    }
    .wb-foundation-map::before,
    .wb-foundation-map::after { background: rgba(8,125,109,.22); }
    .wb-foundation-map__node {
      border-color: rgba(8,125,109,.38);
      background: #f5fbf9;
      color: var(--wb-teal);
    }
    .wb-foundation-map__node small { color: rgba(5,47,40,.52); }
    .wb-route > span,
    .wb-route > b {
      border-color: rgba(8,125,109,.28);
      background: #f5fbf9;
      color: var(--wb-teal);
    }
    .wb-route > span small { color: rgba(5,47,40,.52); }
    .wb-route > b { border-color: rgba(191,132,18,.62); background: #fffaf0; }
    .wb-local-rings__ring { border-color: rgba(8,125,109,.25); }
    .wb-local-rings__signal { color: rgba(5,47,40,.76); }
    .wb-funnel-flat__layer--1 { background: #168f7d; color: #fff; }
    .wb-funnel-flat__layer--2 { background: #62d2bd; }
    .wb-funnel-flat__layer--3 { background: #ffd66b; }
    .wb-funnel-flat__layer--4 { background: #fff0b7; }

    .wb-proof__header,
    .wb-section__header {
      padding: clamp(34px, 4vw, 64px);
      border-bottom: 1px solid var(--wb-line);
      background: var(--wb-paper);
    }
    .wb-proof__header h2,
    .wb-section__header h2 {
      max-width: 1000px;
      margin-top: 18px;
      font-size: clamp(2.25rem, 3.8vw, 4.6rem);
      line-height: 1.08;
    }
    .wb-proof__header p,
    .wb-section__header p { max-width: 780px; margin-top: 20px; color: var(--wb-muted); }
    .wb-proof__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--wb-line); }
    .wb-case {
      min-height: 420px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: clamp(28px, 3.4vw, 50px);
      background: var(--wb-paper);
      text-decoration: none;
      transition: background .3s ease, transform .35s var(--wb-ease);
    }
    .wb-case:hover { background: var(--wb-paper-soft); transform: translateY(-4px); }
    .wb-case__top { display: flex; justify-content: space-between; color: var(--wb-muted); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
    .wb-case__metric { display: block; margin-top: 60px; font-family: var(--wb-serif); color: var(--wb-teal); font-size: clamp(3.7rem, 5.5vw, 6.5rem); font-style: italic; font-weight: 500; line-height: 1; letter-spacing: -.07em; transition: transform .35s var(--wb-ease); }
    .wb-case:hover .wb-case__metric { transform: translateY(-6px) rotate(-1deg); }
    .wb-case h3 { margin-top: 18px; font-size: clamp(1.35rem, 2vw, 2.25rem); line-height: 1.1; }
    .wb-case p { margin-top: 17px; color: var(--wb-muted); font-size: .88rem; }
    .wb-case__link { margin-top: 32px; font-size: .77rem; font-weight: 650; text-decoration: underline; text-underline-offset: 5px; }
    .wb-proof__note { padding: 18px 28px; border-top: 1px solid var(--wb-line); background: var(--wb-paper); color: var(--wb-muted); font-size: .7rem; }

    .wb-local__grid {
      display: grid;
      grid-template-columns: minmax(300px, 5fr) minmax(0, 7fr);
      gap: 1px;
      background: var(--wb-line);
    }
    .wb-local__intro {
      min-height: 510px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: clamp(34px, 4vw, 64px);
      background: var(--wb-teal);
      color: white;
    }
    .wb-local__intro h2 {
      max-width: 680px;
      margin-top: 18px;
      font-size: clamp(2.15rem, 3.1vw, 3.8rem);
      line-height: 1.08;
    }
    .wb-local__intro .wb-kicker { color: rgba(255,255,255,.7); }
    .wb-local__intro p:last-child { max-width: 600px; color: rgba(255,255,255,.75); }
    .wb-local__points { background: var(--wb-paper); }
    .wb-local__point {
      min-height: 170px;
      display: grid;
      grid-template-columns: 70px minmax(0, 1fr);
      gap: 22px;
      align-content: center;
      padding: clamp(28px, 3.5vw, 52px);
      border-bottom: 1px solid var(--wb-line);
      transition: background .3s ease, padding-left .35s var(--wb-ease);
    }
    .wb-local__point:last-child { border-bottom: 0; }
    .wb-local__point:hover { padding-left: calc(clamp(28px, 3.5vw, 52px) + 7px); background: var(--wb-paper-soft); }
    .wb-local__point span { color: var(--wb-green); font-size: .7rem; font-weight: 700; letter-spacing: .1em; }
    .wb-local__point h3 { font-size: clamp(1.25rem, 1.7vw, 1.8rem); line-height: 1.15; }
    .wb-local__point p { max-width: 760px; margin-top: 12px; color: var(--wb-muted); }
    .wb-local__point a { text-decoration-color: var(--wb-green); text-underline-offset: 4px; }

    .wb-answers__grid,
    .wb-faq__grid { display: grid; grid-template-columns: minmax(300px, 4fr) minmax(0, 8fr); gap: 1px; background: var(--wb-line); }
    .wb-answers__intro,
    .wb-faq__intro { position: sticky; top: 14px; height: max-content; align-self: start; padding: clamp(34px, 4vw, 64px); background: var(--wb-paper); }
    .wb-answers__intro h2 { margin-top: 18px; font-size: clamp(2.6rem, 4.25vw, 5.2rem); line-height: 1.04; }
    .wb-faq__intro h2 { margin-top: 18px; font-size: clamp(2.1rem, 3vw, 3.65rem); line-height: 1.07; }
    .wb-answers__intro p,
    .wb-faq__intro p { margin-top: 22px; color: var(--wb-muted); }
    .wb-answers__list { background: var(--wb-paper); }
    .wb-answer { display: grid; grid-template-columns: minmax(200px, .42fr) 1fr; gap: clamp(28px, 5vw, 70px); padding: clamp(36px, 5vw, 70px); border-bottom: 1px solid var(--wb-line); }
    .wb-answer:last-child { border-bottom: 0; }
    .wb-answer h3 { font-size: clamp(1.35rem, 2.1vw, 2.35rem); line-height: 1.12; }
    .wb-answer__body { color: var(--wb-muted); }
    .wb-answer__body p + p { margin-top: 15px; }
    .wb-answer__body strong { color: var(--wb-ink); font-weight: 600; }
    .wb-answer__body a, .wb-faq a { text-decoration-color: var(--wb-green); text-underline-offset: 4px; }

    .wb-faq__list { background: var(--wb-paper); }
    .wb-faq details { border-bottom: 1px solid var(--wb-line); }
    .wb-faq details:last-child { border-bottom: 0; }
    .wb-faq summary {
      position: relative;
      display: flex;
      min-height: 92px;
      align-items: center;
      padding: 24px 66px 24px 34px;
      cursor: pointer;
      font-size: clamp(1rem, 1.3vw, 1.2rem);
      font-weight: 600;
      list-style: none;
    }
    .wb-faq summary::-webkit-details-marker { display: none; }
    .wb-faq summary:hover { background: var(--wb-paper-soft); }
    .wb-faq summary::after {
      position: absolute;
      right: 28px;
      display: grid;
      width: 34px;
      aspect-ratio: 1;
      place-items: center;
      border: 1px solid var(--wb-line);
      border-radius: 9px;
      content: "+";
      transition: transform .25s var(--wb-ease), background .25s ease;
    }
    .wb-faq details[open] summary::after { transform: rotate(45deg); background: var(--wb-yellow); }
    .wb-faq__answer { max-width: 900px; padding: 0 70px 32px 34px; color: var(--wb-muted); }

    .wb-final {
      display: grid;
      grid-template-columns: 7fr 5fr;
      gap: 1px;
      background: var(--wb-line);
    }
    .wb-final__copy { min-height: 440px; display: flex; flex-direction: column; justify-content: flex-start; padding: clamp(36px, 5vw, 76px); background: var(--wb-paper); }
    .wb-final h2 { max-width: 950px; margin-top: clamp(22px, 3vw, 38px); padding-bottom: .15em; overflow: visible; font-size: clamp(2.5rem, 4.4vw, 5.5rem); line-height: 1.08; }
    .wb-final__copy > p:last-child { max-width: 680px; margin-top: clamp(28px, 3.4vw, 48px); color: var(--wb-muted); }
    .wb-final__action { display: grid; align-content: center; gap: 22px; padding: clamp(34px, 4vw, 64px); background: var(--wb-teal); color: white; }
    .wb-review-map { overflow: hidden; border: 1px solid rgba(255,255,255,.42); border-radius: 16px; background: rgba(255,255,255,.07); }
    .wb-review-map__head { display: flex; justify-content: space-between; gap: 20px; padding: 16px 18px; border-bottom: 1px solid rgba(255,255,255,.22); color: rgba(255,255,255,.66); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
    .wb-review-map__row { display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; align-items: center; min-height: 73px; padding: 11px 18px; border-bottom: 1px solid rgba(255,255,255,.16); }
    .wb-review-map__row:last-child { border-bottom: 0; }
    .wb-review-map__row i { display: grid; width: 32px; aspect-ratio: 1; place-items: center; border-radius: 9px; background: rgba(255,255,255,.12); color: var(--wb-yellow); font-style: normal; font-size: .65rem; font-weight: 700; }
    .wb-review-map__row b { display: block; font-size: .76rem; }
    .wb-review-map__row span { display: block; color: rgba(255,255,255,.62); font-size: .59rem; }
    .wb-review-map__row em { color: var(--wb-yellow); font-style: normal; font-size: .58rem; font-weight: 700; }
    .wb-final__action .wb-cta { width: 100%; justify-content: space-between; background: var(--wb-yellow); color: var(--wb-ink); }

    .wb-footer { padding: clamp(38px, 4vw, 64px); border-top: 1px solid var(--wb-line); background: var(--wb-paper); }
    .wb-footer__grid { display: grid; grid-template-columns: minmax(260px, 1.6fr) repeat(3, minmax(140px, 1fr)); gap: clamp(34px, 4vw, 72px); }
    .wb-footer h2, .wb-footer h3 { font-size: .86rem; letter-spacing: -.02em; }
    .wb-footer__about p { max-width: 470px; margin-top: 16px; color: var(--wb-muted); font-size: .78rem; }
    .wb-footer__contact { display: grid; gap: 8px; margin-top: 22px; font-size: .72rem; }
    .wb-footer__contact a { width: max-content; color: var(--wb-teal); font-weight: 650; text-decoration: none; }
    .wb-footer__links { display: grid; align-content: start; gap: 11px; margin-top: 17px; }
    .wb-footer__links a { width: max-content; color: var(--wb-muted); font-size: .72rem; text-decoration: none; }
    .wb-footer__links a:hover { color: var(--wb-ink); text-decoration: underline; text-underline-offset: 4px; }
    .wb-footer__start p { margin-top: 16px; color: var(--wb-muted); font-size: .76rem; }
    .wb-footer__start .wb-cta { margin-top: 22px; }
    .wb-footer__bottom { display: flex; justify-content: space-between; gap: 26px; margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--wb-line); color: var(--wb-muted); font-size: .64rem; }
    .wb-footer__bottom a { text-decoration: none; }

    .wb-reveal { opacity: 1; transform: none; transition: opacity .75s ease, transform .8s var(--wb-ease); }
    .wb-motion-ready .wb-reveal { opacity: 0; transform: translateY(24px); }
    .wb-motion-ready .wb-reveal.is-visible { opacity: 1; transform: none; }
    /* Headings remain visually stable. Motion is reserved for the process state
       change and small card entrances, not for masking readable text. */
    .wb-text-reveal { position: relative; }
    .wb-color-reveal { color: var(--wb-teal); }

    @media (max-width: 1100px) {
      .wb-hero__copy, .wb-hero__visual { grid-column: span 12; }
      .wb-hero__copy { min-height: 560px; }
      .wb-hero__visual { min-height: 600px; }
      .wb-hero__stat { grid-column: span 6; }
      .wb-system__layout { grid-template-columns: 1fr; }
      .wb-system__stage-wrap { display: none; }
      .wb-step,
      .wb-motion-ready .wb-step { min-height: auto; opacity: 1; padding-block: 58px; }
      .wb-proof__grid { grid-template-columns: 1fr 1fr; }
      .wb-case:last-child { grid-column: 1 / -1; }
      .wb-local__grid { grid-template-columns: 1fr; }
      .wb-local__intro { min-height: 360px; }
      .wb-answers__grid, .wb-faq__grid { grid-template-columns: 1fr; }
      .wb-answers__intro, .wb-faq__intro { position: static; }
      .wb-sticky-frame.wb-answers .wb-answers__intro { border-radius: var(--wb-radius) var(--wb-radius) 0 0; }
      .wb-sticky-frame.wb-answers .wb-answers__list { border-radius: 0 0 var(--wb-radius) var(--wb-radius); }
      .wb-sticky-frame.wb-faq .wb-faq__intro { border-radius: var(--wb-radius) var(--wb-radius) 0 0; }
      .wb-sticky-frame.wb-faq .wb-faq__list { border-radius: 0 0 var(--wb-radius) var(--wb-radius); }
      .wb-footer__grid { grid-template-columns: 1.5fr repeat(2, 1fr); }
      .wb-footer__start { grid-column: 2 / -1; }
    }

    @media (max-width: 760px) {
      :root { --wb-frame: calc(100vw - 16px); --wb-radius: 13px; }
      .wb-frame { margin-top: 8px; }
      .wb-frame + .wb-frame { margin-top: 8px; }
      .wb-nav { grid-template-columns: 1fr auto; min-height: 58px; }
      .wb-nav__links { display: none; }
      .wb-nav__cta { display: none; }
      .wb-menu { display: block; }
      .wb-motion span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
      .wb-motion { width: 42px; justify-content: center; padding: 0; }
      .wb-hero__copy { min-height: auto; padding: 34px 22px 30px; }
      .wb-hero h1 { margin-top: 20px; font-size: clamp(2.35rem, 11vw, 3.4rem); line-height: 1.02; }
      .wb-hero__intro { margin-top: 24px; font-size: .98rem; line-height: 1.58; }
      .wb-hero__bottom { align-items: flex-start; flex-direction: column; gap: 16px; margin-top: 26px; }
      .wb-hero__bottom .wb-cta { width: 100%; justify-content: space-between; }
      .wb-hero__visual { min-height: 310px; padding: 14px; }
      .wb-visual__label { gap: 8px; font-size: .48rem; letter-spacing: .045em; white-space: nowrap; }
      .wb-search-scene { min-height: 260px; padding-top: 10px; }
      .wb-search-beam, .wb-pulse { display: none; }
      .wb-search-window { width: min(100%, 286px); max-width: 286px; border-width: 1px; border-radius: 14px; box-shadow: 6px 7px 0 rgba(5,47,40,.2); transform: none !important; }
      .wb-search-window__bar { min-height: 28px; padding: 0 10px; }
      .wb-search-window__bar i { width: 6px; height: 6px; }
      .wb-query { margin: 10px; padding: 9px 10px; border-radius: 8px; font-size: .66rem; white-space: normal; }
      .wb-results { display: block; padding: 0 10px 11px; }
      .wb-result { min-height: 94px; grid-template-columns: 32px 1fr; gap: 10px; padding: 11px; border-radius: 9px; text-align: left; transform: none !important; }
      .wb-result:nth-child(n+2) { display: none; }
      .wb-result i { width: 32px; margin: 0; font-size: .62rem; }
      .wb-result b { font-size: .7rem; line-height: 1.2; }
      .wb-result span { display: block; margin-top: 3px; font-size: .57rem; line-height: 1.35; }
      .wb-result em { grid-column: 2; display: block; margin-top: -5px; font-size: .56rem; }
      .wb-hero__stat, .wb-hero__stat--wide { grid-column: span 12; min-height: 180px; }
      .wb-system__header, .wb-proof__header, .wb-section__header { padding: 34px 24px; }
      .wb-step,
      .wb-motion-ready .wb-step { display: block; padding: 34px 22px; opacity: 1; }
      .wb-step__number { display: block; margin: 0 0 8px; }
      .wb-step > div { min-width: 0; }
      .wb-step h3 { font-size: clamp(1.75rem, 8.5vw, 2.45rem); line-height: 1.04; }
      .wb-step p { margin-top: 18px; font-size: .96rem; line-height: 1.62; }
      .wb-step p + p { margin-top: 13px; }
      .wb-proof__grid { grid-template-columns: 1fr; }
      .wb-case:last-child { grid-column: auto; }
      .wb-case { min-height: 380px; padding: 32px 24px; }
      .wb-local__intro { min-height: 330px; padding: 38px 24px; }
      .wb-local__intro h2 { margin-bottom: 24px; }
      .wb-local__intro p:last-child { margin-top: 2px; }
      .wb-local__point { grid-template-columns: 1fr; gap: 8px; padding: 34px 24px; }
      .wb-local__point > span { display: block; margin-bottom: 2px; }
      .wb-local__point:hover { padding-left: 24px; }
      .wb-answer { grid-template-columns: 1fr; padding: 38px 24px; }
      .wb-answers__intro, .wb-faq__intro { padding: 38px 24px; }
      .wb-faq summary { padding-left: 24px; }
      .wb-faq__answer { padding-left: 24px; }
      .wb-final { grid-template-columns: 1fr; }
      .wb-final__copy { min-height: 0; padding: 38px 22px 40px; }
      .wb-final h2 { margin-top: 20px; padding-bottom: .18em; font-size: clamp(2.05rem, 10vw, 2.75rem); line-height: 1.08; }
      .wb-final h2 br { display: none; }
      .wb-final__copy > p:last-child { margin-top: 24px; font-size: .95rem; line-height: 1.6; }
      .wb-final__action { min-height: 0; gap: 18px; padding: 30px 22px; }
      .wb-review-map__head { padding: 14px; }
      .wb-review-map__row { grid-template-columns: 32px 1fr; min-height: 78px; padding: 12px 14px; }
      .wb-review-map__row em { grid-column: 2; margin-top: -7px; }
      .wb-final__action .wb-cta { min-height: 54px; }
      .wb-footer { padding: 38px 24px; }
      .wb-footer__grid { grid-template-columns: 1fr 1fr; gap: 34px 22px; }
      .wb-footer__about, .wb-footer__start { grid-column: 1 / -1; }
      .wb-footer__bottom { align-items: flex-start; flex-direction: column; }
    }

    @media (prefers-reduced-motion: reduce) { body.webbies-landing-page { scroll-behavior: auto; } }
    .wb-page.wb-motion-off *, .wb-page.wb-motion-off *::before, .wb-page.wb-motion-off *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
    .wb-page.wb-motion-off .wb-reveal { opacity: 1; transform: none; }
    .wb-page.wb-motion-off .wb-search-window,
    .wb-page.wb-motion-off .wb-iso-rig { transform: none !important; }
/* =========================================================
   WEBBIES EDITORIAL TEMPLATE — REMOVE ASTRA WIDTH CONSTRAINTS
   ========================================================= */

body.page-template-webbies-editorial,
body.page-template-webbies-editorial #page,
body.page-template-webbies-editorial #content,
body.page-template-webbies-editorial .site-content {
	width:100%;
	max-width:none;
	margin:0;
	padding-left:0;
	padding-right:0;
}

body.page-template-webbies-editorial .site-content > .ast-container {
	display:block !important;
	width:100% !important;
	max-width:none !important;
	margin:0 !important;
	padding:0 !important;
}

body.page-template-webbies-editorial .wb-page {
	display:block;
	width:100%;
	max-width:none;
	margin:0;
	padding:0;
	overflow:visible;
}

/* Keep sticky sections working while preventing sideways overflow */
html,
body.page-template-webbies-editorial {
	overflow-x:clip;
}

body.page-template-webbies-editorial #page,
body.page-template-webbies-editorial #content,
body.page-template-webbies-editorial .site-content,
body.page-template-webbies-editorial .site-content > .ast-container,
body.page-template-webbies-editorial .wb-page,
body.page-template-webbies-editorial .wb-page main {
	overflow-y:visible !important;
}

body.page-template-webbies-editorial .wb-page main {
	display:block;
	width:100%;
	max-width:none;
	margin:0;
	padding:0;
}

/* Prevent full-width frames from inheriting Astra offsets */
body.page-template-webbies-editorial .wb-frame {
	width:100%;
	max-width:none;
	margin-left:0;
	margin-right:0;
}

/* =========================================================
   HAMILTON SEO — EDITORIAL CANVAS AND SPACING POLISH
   Paste at the very end of the stylesheet
   ========================================================= */

/*
 * Desktop page frame
 * Restores intentional space around the content after the
 * Astra full-width reset.
 */
@media (min-width: 1101px) {

  body.page-template-webbies-editorial {
    --wb-editorial-gutter: clamp(22px, 2.25vw, 42px);
    --wb-editorial-top-space: clamp(24px, 3vw, 46px);
    --wb-editorial-section-gap: clamp(18px, 1.7vw, 28px);
    --wb-frame: min(
      1820px,
      calc(100vw - (var(--wb-editorial-gutter) * 2))
    );
    --wb-radius: 22px;
  }

  /*
   * Keep the page canvas clean.
   * The outer whitespace remains, but the disconnected
   * gutter guide lines are removed.
   */
  body.page-template-webbies-editorial .wb-page {
    position: relative;
    padding-top: var(--wb-editorial-top-space);
    padding-bottom: var(--wb-editorial-section-gap);
    background: transparent;
  }

  /*
   * Override the earlier Astra rule that forces every frame
   * all the way to the viewport edges.
   */
  body.page-template-webbies-editorial .wb-frame {
    width: var(--wb-frame);
    max-width: var(--wb-frame);
    margin-right: auto;
    margin-left: auto;
    margin-top: var(--wb-editorial-section-gap);
    box-shadow:
      0 18px 55px rgba(33, 92, 82, 0.045),
      0 1px 0 rgba(255, 255, 255, 0.65) inset;
  }

  body.page-template-webbies-editorial main > .wb-frame:first-child {
    margin-top: 0;
  }

  body.page-template-webbies-editorial .wb-frame + .wb-frame {
    margin-top: var(--wb-editorial-section-gap);
  }

  body.page-template-webbies-editorial .wb-frame.wb-sticky-frame {
    box-shadow: none;
  }

  /*
   * More consistent breathing room in major introductory
   * content areas without altering the structural layout.
   */
  body.page-template-webbies-editorial .wb-system__header,
  body.page-template-webbies-editorial .wb-proof__header,
  body.page-template-webbies-editorial .wb-section__header {
    padding-top: clamp(58px, 5vw, 88px);
    padding-bottom: clamp(58px, 5vw, 88px);
  }

  body.page-template-webbies-editorial .wb-answers__intro,
  body.page-template-webbies-editorial .wb-faq__intro {
    padding-top: clamp(58px, 5vw, 84px);
    padding-bottom: clamp(58px, 5vw, 84px);
  }

  /*
   * Preserve the sticky offset while matching the larger
   * space between framed sections.
   */
  body.page-template-webbies-editorial .wb-stage,
  body.page-template-webbies-editorial .wb-answers__intro,
  body.page-template-webbies-editorial .wb-faq__intro {
    top: var(--wb-editorial-section-gap);
  }

  body.page-template-webbies-editorial .wb-stage {
    height: calc(
      100vh - (var(--wb-editorial-section-gap) * 2)
    );
  }
}

/* Tablet keeps visible gutters but avoids oversized whitespace. */
@media (min-width: 761px) and (max-width: 1100px) {

  body.page-template-webbies-editorial {
    --wb-frame: calc(100vw - 32px);
    --wb-radius: 18px;
  }

  body.page-template-webbies-editorial .wb-page {
    padding-top: 20px;
    padding-bottom: 18px;
    background: transparent;
  }

  body.page-template-webbies-editorial .wb-frame {
    width: var(--wb-frame);
    max-width: var(--wb-frame);
    margin-right: auto;
    margin-left: auto;
  }

  body.page-template-webbies-editorial .wb-frame,
  body.page-template-webbies-editorial .wb-frame + .wb-frame {
    margin-top: 16px;
  }

  body.page-template-webbies-editorial main > .wb-frame:first-child {
    margin-top: 0;
  }
}

/*
 * Mobile remains compact.
 * No decorative guide lines because they would reduce the
 * already limited reading width.
 */
@media (max-width: 760px) {

  body.page-template-webbies-editorial .wb-page {
    padding-top: 8px;
    padding-bottom: 8px;
    background: transparent;
  }

  body.page-template-webbies-editorial .wb-frame {
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    margin-right: auto;
    margin-left: auto;
  }
}

/* =========================================================
   HAMILTON SEO — CONTENT AND VISUAL REFINEMENTS
   Keep this block at the very end of hamilton-seo.css
   ========================================================= */

/* ---------------------------------------------------------
   HERO SPACING
   --------------------------------------------------------- */

/*
 * Use padding instead of margin so the visual gap remains clear
 * below the oversized italic Lora text in the H1.
 */
.wb-hero h1 + .wb-hero__intro {
	margin-top:0 !important;
	padding-top:42px;
}

/* Keep the main hero button readable on every device. */
.wb-hero__bottom .wb-cta,
.wb-hero__bottom .wb-cta:link,
.wb-hero__bottom .wb-cta:visited,
.wb-hero__bottom .wb-cta:hover,
.wb-hero__bottom .wb-cta:focus-visible {
	color:#fff !important;
}

/* ---------------------------------------------------------
   PROCESS SECTION
   --------------------------------------------------------- */

/* Remove the decorative hand from the sticky process visual. */
.wb-stage__hand {
	display:none !important;
}

/* ---------------------------------------------------------
   HAMILTON MARKET SECTION
   --------------------------------------------------------- */

/* “One city.” stays white; the nested serif line remains yellow. */
.wb-local__intro h2 {
	color:#fff;
}

/* ---------------------------------------------------------
   INLINE CONTENT LINKS
   --------------------------------------------------------- */

/*
 * Apply the original blue link colour only to inline editorial links.
 * Navigation, CTA buttons and full-card case-study links remain unchanged.
 */
.wb-step p a,
.wb-local__point p a,
.wb-answer__body a,
.wb-faq__answer a,
.wb-proof__note a,
.wb-system__header p a,
.wb-hero__intro a {
	color:#0066cc !important;
	text-decoration-color:#0066cc !important;
	text-decoration-thickness:1px;
	text-underline-offset:4px;
}

.wb-step p a:hover,
.wb-local__point p a:hover,
.wb-answer__body a:hover,
.wb-faq__answer a:hover,
.wb-proof__note a:hover,
.wb-system__header p a:hover,
.wb-hero__intro a:hover {
	color:#004c99 !important;
	text-decoration-color:#004c99 !important;
}

/* ---------------------------------------------------------
   RESPONSIVE HERO ADJUSTMENTS
   --------------------------------------------------------- */

/* Desktop: more heading-to-copy space, less copy-to-button space. */
@media (min-width:1101px) {

	.wb-hero h1 + .wb-hero__intro {
		padding-top:48px;
	}

	.wb-hero__copy {
		justify-content:flex-start;
	}

	.wb-hero__bottom {
		margin-top:38px;
	}
}

/* Tablet */
@media (min-width:761px) and (max-width:1100px) {

	.wb-hero h1 + .wb-hero__intro {
		padding-top:40px;
	}
}

/* Mobile */
@media (max-width:760px) {

	.wb-hero h1 + .wb-hero__intro {
		margin-top:0 !important;
		padding-top:34px;
	}
}

/* =========================================================
   HAMILTON SEO — PERSON BEHIND THE STRATEGY
   ========================================================= */
.wb-founder__grid {
  display:grid;
  grid-template-columns:minmax(0, 7fr) minmax(400px, 5fr);
  gap:1px;
  background:var(--wb-line);
}
.wb-founder__copy {
  min-height:620px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(42px, 5vw, 78px);
}
.wb-founder__title {
  max-width:760px;
  margin:0;
  color:var(--wb-ink);
  font-size:clamp(2.65rem, 4.6vw, 5.1rem);
  font-weight:600;
  line-height:.94;
  letter-spacing:-.055em;
}
.wb-founder__body {
  max-width:860px;
  margin-top:36px;
  color:var(--wb-muted);
  font-size:clamp(.98rem, 1.08vw, 1.12rem);
  line-height:1.72;
}
.wb-founder__body p + p { margin-top:21px; }
.wb-founder__lead {
  color:var(--wb-ink);
  font-size:clamp(1.08rem, 1.3vw, 1.32rem);
  line-height:1.58;
}
.wb-founder__lead span,
.wb-founder__accountability span { color:#087b69; }
.wb-founder__lead strong { font-weight:700; }
.wb-founder__accountability {
  max-width:700px;
  margin-top:34px;
  padding-top:24px;
  border-top:1px solid var(--wb-line);
  color:var(--wb-ink);
  font-size:.93rem;
}
.wb-founder__visual {
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(26px, 3.3vw, 52px);
  background:linear-gradient(145deg, #eef6f4, #f8fcfb);
}
.wb-founder__portrait {
  position:relative;
  width:min(100%, 600px);
  aspect-ratio:1;
  margin:0 auto;
  overflow:hidden;
  border:1px solid var(--wb-line);
  border-radius:20px;
  background:#e8f1ef;
  box-shadow:0 22px 55px rgba(33,92,82,.09);
}
.wb-founder__portrait img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  filter:none;
  transform:none;
  transition:opacity 1.15s cubic-bezier(.22,.61,.36,1);
  will-change:opacity;
}
.wb-founder__portrait img.is-active {
  opacity:1;
  filter:none;
  transform:none;
}

/* Compact control bar inspired by the reference */
.wb-founder__controls {
  width:min(100%, 600px);
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:10px;
  margin:14px auto 0;
  padding:7px 9px;
  border:1px solid rgba(76,174,159,.38);
  border-radius:9px;
  background:#08a487;
}
.wb-founder__play {
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  padding:0;
  border:0;
  border-radius:5px;
  background:#f8fbfa;
  color:#08a487;
  cursor:pointer;
  font-size:14px;
  font-weight:800;
  line-height:1;
}
.wb-founder__play:hover {
  transform:none;
  background:#fff;
}
.wb-founder__track {
  position:relative;
  height:20px;
  cursor:pointer;
  touch-action:none;
}
.wb-founder__track::before {
  position:absolute;
  top:50%;
  right:0;
  left:0;
  height:4px;
  border-radius:99px;
  background:rgba(255,255,255,.7);
  content:"";
  transform:translateY(-50%);
}
.wb-founder__track span {
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  height:4px;
  border-radius:99px;
  background:#fff;
  transform:translateY(-50%) scaleX(0);
  transform-origin:left;
}
.wb-founder__track i {
  position:absolute;
  top:50%;
  left:0;
  width:16px;
  height:16px;
  border:0;
  border-radius:50%;
  background:#fff;
  box-shadow:none;
  transform:translate(-50%,-50%);
}
.wb-founder__count { display:none; }
.wb-founder__caption {
  width:min(100%, 600px);
  min-height:54px;
  margin:13px auto 0;
  text-align:left;
}
.wb-founder__caption strong {
  display:block;
  color:var(--wb-ink);
  font-size:.86rem;
  letter-spacing:.01em;
}
.wb-founder__caption span {
  display:block;
  margin-top:3px;
  color:var(--wb-muted);
  font-size:.73rem;
  line-height:1.45;
}
@media (max-width:1100px) {
  .wb-founder__grid { grid-template-columns:1fr; }
  .wb-founder__copy { min-height:auto; }
  .wb-founder__visual { padding-block:42px; }
}
@media (max-width:760px) {
  .wb-founder__copy { padding:38px 24px; }
  .wb-founder__title {
    font-size:clamp(2.55rem, 13vw, 4rem);
    line-height:.96;
  }
  .wb-founder__body {
    margin-top:28px;
    font-size:.95rem;
    line-height:1.66;
  }
  .wb-founder__lead {
    font-size:1.04rem;
    line-height:1.55;
  }
  .wb-founder__body p + p { margin-top:18px; }
  .wb-founder__visual { padding:22px; }
  .wb-founder__portrait { border-radius:14px; }
  .wb-founder__controls {
    width:100%;
    grid-template-columns:34px minmax(0,1fr);
    gap:9px;
    padding:6px 8px;
  }
  .wb-founder__play {
    width:30px;
    height:30px;
    font-size:12px;
  }
  .wb-founder__caption {
    min-height:48px;
    margin-top:10px;
  }
}
@media (prefers-reduced-motion:reduce) {
  .wb-founder__portrait img { transition:none; }
}

/* =========================================================
   WEB DESIGN HAMILTON FINAL POLISH
   Smaller proof-card headings and founder CTA button parity.
   ========================================================= */

/* These proof statements are longer than the Hamilton SEO case-study titles,
   so keep them secondary to the large evidence metrics. */
.wb-proof .wb-case h3,
.wb-case-grid .wb-case h3,
.wb-case h3 {
  font-size:clamp(1.12rem,1.42vw,1.62rem) !important;
  line-height:1.16 !important;
  letter-spacing:-.035em !important;
  max-width:470px;
}

/* Use the exact readable treatment of the hero CTA in the founder/video CTA. */
.wb-founder__accountability .wb-cta,
.wb-founder__accountability .wb-cta:link,
.wb-founder__accountability .wb-cta:visited,
.wb-founder__accountability .wb-cta:hover,
.wb-founder__accountability .wb-cta:focus-visible {
  color:#fff !important;
}

@media (max-width:700px) {
  .wb-proof .wb-case h3,
  .wb-case-grid .wb-case h3,
  .wb-case h3 {
    font-size:clamp(1.28rem,6.4vw,1.72rem) !important;
  }
}

/* =========================================================
   WEB DESIGN HAMILTON v2.1.0 CONTENT-BUILD SUPPORT
   ========================================================= */

.wb-case__metric--label {
  max-width: 100%;
  font-size: clamp(2.25rem, 3.8vw, 4.6rem);
  line-height: .98;
  letter-spacing: -.055em;
}

.wb-local__point p + p {
  margin-top: 14px;
}

@media (max-width: 700px) {
  .wb-case__metric--label {
    font-size: clamp(2.25rem, 11vw, 3.45rem);
  }
}
