/* ── src/00-quiet-0.3.css ── */
/* Picato v2 Bentec package 0.3.0 (ADR-032) — Picato Clarity Quiet.
 *
 * The host owns markup and reviewed presenters; this immutable stylesheet is
 * copied into the static export and linked after package resolution.
 *
 * 0.2.1: narrow/zoom reflow, CTA contrast, orange utility ink, focus rings.
 * 0.2.3: homeInfographic presenter styles.
 * 0.3.0: Quiet expression — solid CTAs, calmer tracking/type, section rhythm,
 *        softer carrier, no hero ring, card services, soft proof, centered contact.
 *
 * 0.4.0: WHAT IS LEFT OF 0.3. Up to 0.3.1 the host rendered the sections and this file dressed the
 *        host's markup (.dynamic-section__*). From 0.4.0 the package brings its own templates, so
 *        those 89 rules matched nothing — and two of them still did harm (a 100vw full-bleed that
 *        overflowed the page by the scrollbar's width, and font names that no longer exist). They are
 *        gone. What remains dresses markup the package does not template yet: the host's header, the
 *        video hero and row containers. Those rules were written as a layer ON the host stylesheet,
 *        which an engine-2 package switches off — so they are incomplete on their own, and the header
 *        and footer are the open item of Phase 3b. Do not grow this file; replace it.
 */

:root {
  --picato-v2-orange: #fe8149;
  --picato-v2-orange-ink: #b84e12;
  --picato-v2-red: #ff5722;
  --picato-v2-yellow: #ff9800;
  --picato-v2-cta-stop: #ff6a33;
  --picato-v2-green: #16321d;
  --picato-v2-green-raised: #1d4227;
  --picato-v2-blue: #024385;
  --picato-v2-paper: #f5f5f5;
  --picato-v2-white: #ffffff;
  --picato-v2-paper-raised: #ffffff;
  --picato-v2-on-dark: #ffffff;
  --picato-v2-text: #232323;
  --picato-v2-muted: #656565;
  --picato-v2-on-accent: #16321d;
  --picato-v2-gutter: clamp(1.25rem, 4vw, 5rem);
  --picato-v2-max: 1440px;
  --picato-v2-section: clamp(3.5rem, 7vw, 7rem);
  --picato-v2-focus: #232323;
  --picato-v2-focus-on-dark: #ffffff;
}

#theme-picato-native-alternative {
  --text-light: var(--picato-v2-muted);
}

/* Header: Quiet uses an opaque green nav pill (host SCSS) so AA does not
 * depend on which hero frame shows. Keep a soft top wash for brand/logo. */
#theme-picato-native-alternative .basic-layout__header {
  background: linear-gradient(
    to bottom,
    rgba(10, 24, 14, 0.28),
    rgba(10, 24, 14, 0)
  );
}

#theme-picato-native-alternative .basic-layout__nav {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  padding: 0.2rem;
  border-radius: 999px;
  background-color: var(--picato-v2-green, #16321d);
}

#theme-picato-native-alternative .basic-layout__navLink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.65rem 0.95rem;
  border-radius: 999px;
  font-size: clamp(0.75rem, 0.72vw, 0.8125rem);
  letter-spacing: 0.065em;
  color: var(--picato-v2-on-dark);
}

#theme-picato-native-alternative
  .basic-layout__navItem:last-child
  > .basic-layout__navLink {
  padding: 0.78rem 1.15rem;
  min-height: 2.75rem;
  background: var(--picato-v2-paper-raised);
  color: var(--picato-v2-green);
}

/* Hero: content grows the cell; CTA lives inside the argument. */
#theme-picato-native-alternative .video-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(100svh, max-content);
  overflow-x: clip;
  overflow-y: visible;
}

#theme-picato-native-alternative .video-hero__media,
#theme-picato-native-alternative .video-hero__overlay {
  grid-area: 1 / 1;
}

#theme-picato-native-alternative .video-hero__content {
  grid-area: 1 / 1;
  position: relative;
  z-index: 4;
  align-self: end;
  justify-self: start;
  max-width: 100%;
  overflow: visible;
  padding-bottom: clamp(3rem, 5vw, 5.5rem);
}

/* Quiet: softer carrier edge; hide decorative ring (one ornamental device). */
#theme-picato-native-alternative .video-hero__content {
  border-radius: 0 52% 0 0 / 0 64% 0 0;
}

#theme-picato-native-alternative .video-hero__oculus {
  display: none;
}

#theme-picato-native-alternative .video-hero__introduction {
  font-size: clamp(0.75rem, 0.75vw, 0.8125rem);
  letter-spacing: 0.1em;
}

#theme-picato-native-alternative .video-hero__title {
  max-width: none;
  font-size: clamp(2.6rem, 5.2vw, 5.25rem);
  line-height: 1.02;
  letter-spacing: -0.03em;
  overflow-wrap: break-word;
  text-wrap: balance;
}

#theme-picato-native-alternative .video-hero__cta {
  position: static;
  display: inline-flex;
  align-self: flex-start;
  margin: 1.75rem 0 0;
}

#theme-picato-native-alternative .video-hero__cue {
  font-size: 0.75rem;
  letter-spacing: 0.1em;
}

/* Primary actions: Quiet solid yellow + dark ink (AA). */
#theme-picato-native-alternative .btn-primary,
#theme-picato-native-alternative .video-hero__cta,
#theme-picato-native-alternative
  .dynamic-section__contact
  .dynamic-section__action {
  background: var(--picato-v2-yellow);
  color: var(--picato-v2-on-accent);
}

#theme-picato-native-alternative .btn-primary:hover,
#theme-picato-native-alternative .video-hero__cta:hover,
#theme-picato-native-alternative
  .dynamic-section__contact
  .dynamic-section__action:hover {
  background: var(--picato-v2-cta-stop);
  color: var(--picato-v2-on-accent);
}

#theme-picato-native-alternative
  .row-container.home-services
  .teaser-block__content
  p,
#theme-picato-native-alternative
  .row-container.home-services
  .teaser-block__subtitle,
#theme-picato-native-alternative
  .row-container.home-intro
  .teaser-block__content
  p,
#theme-picato-native-alternative
  .row-container.home-intro
  .teaser-block__subtitle {
  color: var(--picato-v2-muted);
}

#theme-picato-native-alternative
  .row-container.home-services
  > .row-container__column {
  position: relative;
  transition: background-color 180ms ease;
}

#theme-picato-native-alternative
  .row-container.home-services
  > .row-container__column:hover,
#theme-picato-native-alternative
  .row-container.home-services
  > .row-container__column:focus-within {
  background: var(--picato-v2-white);
}

/* Keyboard focus: high-contrast ring on every interactive theme control. */
#theme-picato-native-alternative a:focus-visible,
#theme-picato-native-alternative button:focus-visible,
#theme-picato-native-alternative .btn:focus-visible,
#theme-picato-native-alternative .basic-layout__navLink:focus-visible,
#theme-picato-native-alternative .dynamic-section__service:focus-visible,
#theme-picato-native-alternative .dynamic-section__action:focus-visible {
  outline: 3px solid var(--picato-v2-focus);
  outline-offset: 3px;
}

#theme-picato-native-alternative .video-hero a:focus-visible,
#theme-picato-native-alternative .video-hero .btn:focus-visible,
#theme-picato-native-alternative .basic-layout__header a:focus-visible,
#theme-picato-native-alternative .dynamic-section--homePractice a:focus-visible,
#theme-picato-native-alternative .dynamic-section--homeProof a:focus-visible,
#theme-picato-native-alternative .dynamic-section--homeContact a:focus-visible {
  outline-color: var(--picato-v2-focus-on-dark);
}

@media (max-width: 720px) {
  #theme-picato-native-alternative .video-hero__content {
    width: 94vw;
    min-height: 0;
    height: auto;
    max-width: 100%;
    padding: 2.5rem var(--picato-v2-gutter) 2.5rem;
    border-radius: 0 46% 0 0 / 0 34% 0 0;
  }

  #theme-picato-native-alternative .video-hero__title {
    max-width: none;
    font-size: clamp(2.1rem, 9.5vw, 3.4rem);
    letter-spacing: -0.02em;
  }

  #theme-picato-native-alternative .video-hero__subtitle {
    max-width: 38ch;
    margin-top: 1.25rem;
    font-size: 1rem;
  }

  #theme-picato-native-alternative .video-hero__cta {
    margin-top: 1.5rem;
  }
}

@media (max-width: 380px) {
  #theme-picato-native-alternative .video-hero__content {
    width: 100%;
    border-radius: 0 34% 0 0 / 0 22% 0 0;
    padding: 2rem 1.1rem 2rem;
  }

  #theme-picato-native-alternative .video-hero__title {
    font-size: clamp(1.85rem, 8.5vw, 2.35rem);
    line-height: 1.08;
    letter-spacing: -0.015em;
  }

  #theme-picato-native-alternative .video-hero__introduction {
    letter-spacing: 0.1em;
  }
}

/* Text zoom: the hero grid row already grows with content. */

@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .dynamic-section__action::after,
  #theme-picato-native-alternative
    .row-container.home-services
    > .row-container__column {
    transition: none;
  }
}

/* ── src/05-fonts.css ── */
/*
 * Fonts ship in the package (assets/fonts, WOFF2 only — the host serves nothing else) so a pinned
 * version looks the same on every host. The asset prefix in the url()s below is stamped by
 * scripts/build-css.mjs with the path from the PUBLISHED stylesheet
 * (/theme-packages/<name>/<version>.css) to its assets (/theme-packages/<name>/<version>/assets/).
 *
 * Lora, Raleway and DM Sans are licensed under the SIL Open Font License 1.1; see README.md.
 */
@font-face {
  font-family: "Picato Display";
  src: url("./0.4.2/assets/fonts/lora-variable.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}
@font-face {
  font-family: "Picato Caps";
  src: url("./0.4.2/assets/fonts/raleway-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Picato Body";
  src: url("./0.4.2/assets/fonts/dm-sans-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

/* ── src/10-airy-home.css ── */
#theme-picato-native-alternative {
  --quiet-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --quiet-dur: 560ms;
}

/*
 * Airy home sections — imported once from the Airy prototype (picato-monorepo
 * docs/prototypes/picato-clarity-variations.html) rule by rule, in the prototype's order, with only
 * the selectors rewritten: .quiet / .quiet-v1 -> the OS page root, unscoped base rules -> :where(root)
 * (zero specificity), every class prefixed pq-. Maintained by hand from here on.
 */

#theme-picato-native-alternative {
  --orange: #fe8149;
  --orange-ink: #b84e12;
  --yellow: #ff9800;
  --cta-stop: #ff6a33;
  --green: #16321d;
  --green-raised: #1d4227;
  --ink: #232323;
  --muted: #656565;
  --paper: #f5f5f5;
  --white: #ffffff;
  --on-accent: #16321d;
  --gutter: clamp(1.25rem, 4vw, 5rem);
  --section: clamp(3.5rem, 7vw, 7rem);
  --max: 1440px;
  --radius: 12px;
}

:where(#theme-picato-native-alternative) * {
  box-sizing: border-box;
}

:where(#theme-picato-native-alternative) a {
  font: inherit;
}

:where(#theme-picato-native-alternative) .pq-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(100svh, max-content);
  min-height: 100svh;
  overflow-x: clip;
  color: var(--white);
}

:where(#theme-picato-native-alternative) .pq-hero-media {
  grid-area: 1 / 1;
  position: relative;
  min-height: 100%;
  overflow: hidden;
}

:where(#theme-picato-native-alternative) .pq-hero-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.78) contrast(.94) brightness(.97);
  transform: scale(1.03);
}

:where(#theme-picato-native-alternative) .pq-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
        to bottom,
        rgba(10, 24, 14, .28),
        rgba(10, 24, 14, .06) 40%,
        rgba(10, 24, 14, .22)
      );
}

:where(#theme-picato-native-alternative) .pq-carrier {
  grid-area: 1 / 1;
  position: relative;
  z-index: 4;
  display: flex;
  width: clamp(30rem, 48vw, 52rem);
  max-width: 100%;
  min-height: clamp(28rem, 62svh, 44rem);
  flex-direction: column;
  justify-content: flex-end;
  align-self: end;
  justify-self: start;
  padding: clamp(2.75rem, 4.5vw, 4.75rem) var(--gutter);
  background: var(--green);
}

:where(#theme-picato-native-alternative) .pq-copy {
  max-width: 34rem;
}

:where(#theme-picato-native-alternative) .pq-eyebrow {
  margin: 0 0 1.1rem;
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) h1,
:where(#theme-picato-native-alternative) .pq-hero-title {
  margin: 0;
  max-width: 18ch;
  font-family: "Picato Display", serif;
  font-weight: 400;
  font-size: clamp(2.5rem, 5.6vw, 5.75rem);
  letter-spacing: -.03em;
  line-height: 1.05;
  overflow-wrap: break-word;
  text-wrap: balance;
}

:where(#theme-picato-native-alternative) .pq-lede {
  max-width: 46ch;
  margin: 1.5rem 0 0;
  color: rgba(255, 255, 255, .84);
  line-height: 1.55;
  font-size: clamp(1rem, 1.15vw, 1.125rem);
}

:where(#theme-picato-native-alternative) .pq-primary-cta {
  display: inline-flex;
  align-items: center;
  gap: .85rem;
  margin-top: 1.75rem;
  padding: .95rem 1.35rem;
  border-radius: 999px;
  color: var(--on-accent);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) .pq-primary-cta::after {
  content: "→";
  font-family: sans-serif;
}

:where(#theme-picato-native-alternative) .pq-arc-mark {
  display: none;
  grid-area: 1 / 1;
  position: relative;
  z-index: 5;
  justify-self: end;
  align-self: start;
  margin-top: 22%;
  margin-right: clamp(-2rem, -4vw, -5rem);
  width: clamp(12rem, 16vw, 16rem);
  aspect-ratio: 1;
  border-radius: 50%;
  pointer-events: none;
}

:where(#theme-picato-native-alternative) a:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 3px;
}

:where(#theme-picato-native-alternative) .pq-hero a:focus-visible {
  outline-color: var(--white);
}

#theme-picato-native-alternative .pq-carrier {
  width: clamp(32rem, 52vw, 56rem);
  border-radius: 0 52% 0 0 / 0 64% 0 0;
  padding-block: clamp(2.5rem, 4vw, 4.25rem);
}

#theme-picato-native-alternative .pq-copy {
  max-width: 36rem;
}

#theme-picato-native-alternative h1,
#theme-picato-native-alternative .pq-hero-title {
  max-width: 16ch;
  font-size: clamp(2.35rem, 4.6vw, 4.5rem);
  line-height: 1.04;
}

#theme-picato-native-alternative .pq-eyebrow {
  color: var(--orange);
  letter-spacing: .1em;
  margin-bottom: 1rem;
}

#theme-picato-native-alternative .pq-lede {
  max-width: 42ch;
  margin-top: 1.25rem;
  font-size: clamp(1rem, 1.05vw, 1.0625rem);
  line-height: 1.58;
}

#theme-picato-native-alternative .pq-primary-cta {
  background: var(--yellow);
  margin-top: 1.5rem;
}

#theme-picato-native-alternative .pq-proof-band {
  background: var(--green-raised);
  padding-block: var(--section);
}

#theme-picato-native-alternative .pq-proof-band .pq-fragment-kicker {
  color: rgba(255, 255, 255, .7);
  letter-spacing: .1em;
}

#theme-picato-native-alternative .pq-proof-band h2 {
  font-size: clamp(2rem, 3.2vw, 3.25rem);
  max-width: 11ch;
  line-height: 1.06;
}

#theme-picato-native-alternative .pq-proof-facts {
  border-top: 0;
  gap: 1rem;
}

#theme-picato-native-alternative .pq-proof-fact {
  padding: 1.25rem 1.15rem;
  border-right: 0;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, .06);
}

#theme-picato-native-alternative .pq-proof-fact dt {
  letter-spacing: .08em;
  color: rgba(255, 255, 255, .62);
}

#theme-picato-native-alternative .pq-proof-fact dd {
  margin-top: .55rem;
  max-width: 18ch;
  line-height: 1.4;
}

#theme-picato-native-alternative .pq-proof-band {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

#theme-picato-native-alternative .pq-proof-band::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: calc(-1 * clamp(9rem, 15vw, 16rem));
  bottom: calc(-1 * clamp(15rem, 25vw, 26rem));
  width: clamp(26rem, 42vw, 44rem);
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 50%;
  box-shadow: 0 0 0 clamp(2.5rem, 5vw, 5rem) rgba(255, 255, 255, .025), inset 0 0 0 clamp(2.5rem, 5vw, 5rem) rgba(255, 255, 255, .02);
  pointer-events: none;
}

#theme-picato-native-alternative .pq-proof-band-inner {
  width: min(100%, var(--max));
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  align-items: start;
}

#theme-picato-native-alternative .pq-proof-band .pq-fragment-kicker {
  color: var(--orange);
}

#theme-picato-native-alternative .pq-proof-band h2 {
  max-width: 11ch;
  font-size: clamp(2.25rem, 3.8vw, 4rem);
  line-height: 1.04;
  text-wrap: balance;
}

#theme-picato-native-alternative .pq-proof-facts {
  display: block;
  border-top: 0;
}

#theme-picato-native-alternative .pq-proof-fact {
  position: relative;
  display: grid;
  grid-template-columns: minmax(7rem, 11rem) minmax(0, 1fr);
  align-items: baseline;
  gap: clamp(1rem, 2vw, 2rem);
  padding: clamp(1.25rem, 2vw, 1.75rem) 0;
  border-top: 1px solid rgba(255, 255, 255, .16);
  border-radius: 0;
  background: none;
}

#theme-picato-native-alternative .pq-proof-fact:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, .16);
}

#theme-picato-native-alternative .pq-proof-fact::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  width: 2.5rem;
  height: 2px;
  background: var(--orange);
  transform-origin: left center;
}

#theme-picato-native-alternative .pq-proof-fact dt {
  color: rgba(255, 255, 255, .66);
}

#theme-picato-native-alternative .pq-proof-fact dd {
  margin: 0;
  max-width: none;
  color: var(--white);
  font-family: "Picato Display", serif;
  font-size: clamp(1.5rem, 2.3vw, 2.25rem);
  line-height: 1.15;
  text-wrap: balance;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-proof-band-inner {
    grid-template-columns: 1fr;
  }
  #theme-picato-native-alternative .pq-proof-band::before {
    left: auto;
    right: calc(-1 * clamp(9rem, 30vw, 16rem));
    bottom: auto;
    top: calc(-1 * clamp(12rem, 40vw, 20rem));
  }
}

@media (max-width: 560px) {
  #theme-picato-native-alternative .pq-proof-fact {
    grid-template-columns: 1fr;
    gap: .5rem;
  }
}

#theme-picato-native-alternative .pq-fragment-intro {
  border-radius: 0 0 6rem 0;
  background: var(--white);
  padding-block: var(--section);
}

#theme-picato-native-alternative .pq-fragment-intro .pq-fragment-kicker {
  letter-spacing: .1em;
}

#theme-picato-native-alternative .pq-fragment-intro h2 {
  max-width: 18ch;
  text-wrap: balance;
  font-size: clamp(1.95rem, 3.1vw, 3rem);
}

#theme-picato-native-alternative .pq-intro-copy {
  font-size: 1.0625rem;
  max-width: 40ch;
  line-height: 1.6;
}

#theme-picato-native-alternative .pq-text-link {
  letter-spacing: .08em;
  margin-top: 1rem;
  padding-block: .45rem .35rem;
  border-bottom: 1px solid rgba(22, 50, 29, .22);
}

#theme-picato-native-alternative .pq-text-link span {
  color: var(--muted);
}

#theme-picato-native-alternative .pq-fragment-services {
  background: var(--paper);
  padding-top: clamp(2rem, 4vw, 3.5rem);
  padding-bottom: var(--section);
}

#theme-picato-native-alternative .pq-service-list {
  gap: 1rem;
}

#theme-picato-native-alternative .pq-service {
  border-radius: var(--radius);
  background: var(--white);
  border: 1px solid rgba(18, 33, 26, .08);
  padding: 1.5rem 1.35rem 1.6rem;
}

#theme-picato-native-alternative .pq-service-index {
  color: var(--orange-ink);
  letter-spacing: .1em;
}

#theme-picato-native-alternative .pq-service h3 {
  margin-top: 1rem;
  font-size: 1.25rem;
  max-width: 22ch;
  min-height: 2.4em;
  text-wrap: balance;
}

#theme-picato-native-alternative .pq-service p {
  max-width: 36ch;
  font-size: .9375rem;
  line-height: 1.55;
}

#theme-picato-native-alternative .pq-service-list.pq-service-list--joined {
  --line: rgba(18, 33, 26, .09);
  --inset: clamp(1.35rem, 2vw, 1.85rem);
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: 0 28px 56px -32px rgba(18, 33, 26, .22);
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service {
  position: relative;
  padding: calc(var(--inset) + .35rem) var(--inset) calc(var(--inset) + 2.75rem);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: -1px 0 0 var(--line), 0 -1px 0 var(--line);
  transition: background-color 320ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service:hover,
#theme-picato-native-alternative .pq-service-list--joined .pq-service:focus-visible {
  transform: none;
  border-color: transparent;
  box-shadow: -1px 0 0 var(--line), 0 -1px 0 var(--line);
  background: rgba(22, 50, 29, .035);
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever)::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--inset);
  width: 2.5rem;
  height: 2px;
  background: var(--orange);
  transition: width 480ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever):hover::before,
#theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever):focus-visible::before {
  width: calc(100% - 2 * var(--inset));
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever)::after {
  content: "→";
  position: absolute;
  left: var(--inset);
  bottom: var(--inset);
  color: var(--muted);
  font-size: 1.125rem;
  line-height: 1;
  transition: transform 220ms var(--quiet-ease), color 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever):hover::after,
#theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever):focus-visible::after {
  transform: translateX(.3rem);
  color: var(--orange-ink);
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service h3 {
  font-size: 1.375rem;
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service.pq-service--lever {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  padding: clamp(1.75rem, 2.6vw, 2.5rem) 0;
  box-shadow: none;
  background:
        radial-gradient(70% 220% at 0% 0%, rgba(255, 255, 255, .08) 0%, rgba(255, 255, 255, 0) 60%),
        var(--green);
  color: var(--white);
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service.pq-service--lever:hover,
#theme-picato-native-alternative .pq-service-list--joined .pq-service.pq-service--lever:focus-visible {
  box-shadow: none;
  filter: brightness(1.08);
}

#theme-picato-native-alternative .pq-service--lever > * {
  padding-inline: var(--inset);
}

#theme-picato-native-alternative .pq-service--lever .pq-lever-body {
  grid-column: span 2;
}

#theme-picato-native-alternative .pq-service--lever .pq-service-index {
  color: var(--orange);
  letter-spacing: .1em;
  text-transform: uppercase;
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service--lever h3 {
  min-height: 0;
  max-width: 12ch;
  margin: .85rem 0 0;
  color: var(--white);
  font-size: clamp(1.5rem, 2.1vw, 2.125rem);
  line-height: 1.1;
}

#theme-picato-native-alternative .pq-service--lever p {
  max-width: 56ch;
  color: rgba(255, 255, 255, .86);
  font-size: 1rem;
  line-height: 1.6;
}

#theme-picato-native-alternative .pq-service--lever .pq-lever-points {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem 1.25rem;
  margin: 1.1rem 0 0;
  padding: 0;
  list-style: none;
}

#theme-picato-native-alternative .pq-service--lever .pq-lever-points li {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: rgba(255, 255, 255, .78);
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .04em;
}

#theme-picato-native-alternative .pq-service--lever .pq-lever-points li::before {
  content: "";
  width: .35rem;
  height: .35rem;
  border-radius: 50%;
  background: var(--orange);
}

#theme-picato-native-alternative .pq-service--lever .pq-lever-more {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  align-self: end;
  min-height: 2.75rem;
  font-size: .8125rem;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.35;
  text-transform: uppercase;
}

#theme-picato-native-alternative .pq-service--lever .pq-lever-more span {
  display: grid;
  place-items: center;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 50%;
  color: var(--orange);
  font-size: 1.125rem;
  transition: transform 220ms var(--quiet-ease), background-color 220ms var(--quiet-ease), color 220ms var(--quiet-ease), border-color 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-service--lever:hover .pq-lever-more span,
#theme-picato-native-alternative .pq-service--lever:focus-visible .pq-lever-more span {
  transform: translateX(.3rem);
  border-color: var(--orange);
  background: var(--orange);
  color: var(--green);
}

@media (max-width: 1100px) {
  #theme-picato-native-alternative .pq-service-list--joined .pq-service.pq-service--lever {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 1.5rem;
  }
  #theme-picato-native-alternative .pq-service--lever .pq-lever-body {
    grid-column: span 1;
  }
  #theme-picato-native-alternative .pq-service--lever .pq-lever-more {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  #theme-picato-native-alternative .pq-service-list--joined .pq-service.pq-service--lever {
    grid-template-columns: 1fr;
  }
  #theme-picato-native-alternative .pq-service--lever .pq-lever-more {
    justify-content: space-between;
  }
}

@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-service-list--joined .pq-service,
  #theme-picato-native-alternative .pq-service-list--joined .pq-service::before,
  #theme-picato-native-alternative .pq-service-list--joined .pq-service::after,
  #theme-picato-native-alternative .pq-service--lever .pq-lever-more span {
    transition: none;
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service:hover::after,
  #theme-picato-native-alternative .pq-service--lever:hover .pq-lever-more span {
    transform: none;
  }
}

#theme-picato-native-alternative .pq-service-list--joined .pq-service-ghost {
  display: none;
}

@media (min-width: 1101px) {
  #theme-picato-native-alternative .pq-fragment-services:has(.pq-service-list--joined) {
    display: grid;
    min-height: var(--fold);
    padding-block: calc(var(--fold-pad) * .4) calc(var(--fold-pad) * .7);
  }
  #theme-picato-native-alternative .pq-service-list.pq-service-list--joined {
    grid-template-rows: minmax(0, 1fr) auto;
  }
}

@media (min-width: 1101px) and (min-height: 800px) {
  #theme-picato-native-alternative .pq-service-list.pq-service-list--joined {
    --inset: clamp(1.75rem, 2.4vw, 2.5rem);
    grid-template-rows: minmax(0, 1fr) auto;
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever) {
    --ghost: clamp(5rem, 13svh, 9.5rem);
    padding-top: calc(var(--inset) + 1rem);
    padding-bottom: calc(var(--inset) + var(--ghost) * .78);
    overflow: hidden;
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service h3 {
    margin-top: 1.5rem;
    max-width: none;
    font-size: clamp(1.375rem, 1.65vw, 1.5rem);
    line-height: 1.2;
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service:not(.pq-service--lever) p {
    margin-top: 1.25rem;
    max-width: 30ch;
    font-size: 1.0625rem;
    line-height: 1.6;
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service-ghost {
    display: block;
    position: absolute;
    right: var(--inset);
    bottom: calc(var(--inset) - 1.35rem);
    color: rgba(22, 50, 29, .06);
    font-family: "Picato Display", serif;
    font-size: var(--ghost);
    line-height: 1;
    letter-spacing: -.02em;
    pointer-events: none;
    transition: color 480ms var(--quiet-ease), transform 480ms var(--quiet-ease);
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service:hover .pq-service-ghost,
  #theme-picato-native-alternative .pq-service-list--joined .pq-service:focus-visible .pq-service-ghost {
    color: rgba(254, 129, 73, .22);
    transform: translateY(-.35rem);
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service.pq-service--lever {
    padding-block: clamp(2.25rem, 3.4vw, 3.25rem);
  }
  #theme-picato-native-alternative .pq-service-list--joined .pq-service--lever h3 {
    font-size: clamp(1.875rem, 2.5vw, 2.5rem);
  }
  #theme-picato-native-alternative .pq-service--lever p {
    font-size: 1.0625rem;
  }
  #theme-picato-native-alternative .pq-service--lever .pq-lever-points {
    margin-top: 1.4rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-service-list--joined .pq-service-ghost {
    transition: none;
    transform: none !important;
  }
}

#theme-picato-native-alternative .pq-practice-grid {
  width: min(100% - 2 * var(--gutter), var(--max));
  margin: 0 auto var(--section);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--white);
}

#theme-picato-native-alternative .pq-practice-media img {
  filter: saturate(.8) contrast(.96);
}

#theme-picato-native-alternative .pq-practice-copy {
  background: var(--white);
  padding: clamp(2.25rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 2.75rem);
}

#theme-picato-native-alternative .pq-practice-copy .pq-fragment-kicker {
  letter-spacing: .1em;
}

#theme-picato-native-alternative .pq-practice-copy .pq-text-link {
  align-self: flex-start;
}

#theme-picato-native-alternative .pq-practice-copy h2 {
  max-width: 12ch;
  font-size: clamp(1.95rem, 3vw, 2.85rem);
}

#theme-picato-native-alternative .pq-practice-copy p:not(.pq-fragment-kicker) {
  max-width: 38ch;
  margin-top: 1rem;
}

/*
 * The folds belong to a page LED BY THE CAROUSEL — in the prototype `.quiet-v1:not(.quiet-page)`, the
 * home as opposed to an inner page. The CMS has no page class, so the page is recognised by what it
 * starts with. (The import first dropped `:not(.quiet-page)` altogether: the folds then applied to
 * inner pages too, and lost a class of specificity against later base rules.)
 */
@media (min-width: 1101px) {
  #theme-picato-native-alternative {
    --fold: 90svh;
    --fold-pad: clamp(1.5rem, 14svh - 3.5rem, 8rem);
    --shell-w: min(100vw - 2 * var(--gutter), var(--max));
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-hero.pq-hero--carousel {
    grid-template-rows: minmax(var(--fold), max-content);
    min-height: var(--fold);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-proof-band,
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-fragment-intro {
    display: grid;
    align-content: center;
    padding-block: var(--fold-pad);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-proof-band {
    min-height: calc(var(--fold) * .52);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-fragment-intro {
    min-height: calc(var(--fold) * .48);
    align-content: end;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-fragment-infographic {
    padding-block: calc(var(--fold-pad) * .6) 0;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) .pq-infographic-shell {
    gap: clamp(2rem, 6svh, 4.5rem);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) .pq-infographic-stack,
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) .pq-infographic-pair {
    gap: var(--fold-pad);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) .pq-practice-grid {
    min-height: calc(var(--fold) - 2 * var(--fold-pad));
    margin-block: var(--fold-pad);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) .pq-practice-copy {
    justify-content: center;
    padding: clamp(3rem, 5vw, 5rem);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) .pq-practice-copy h2 {
    max-width: 13ch;
    font-size: clamp(2.5rem, 3.6vw, 3.5rem);
    line-height: 1.06;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) .pq-practice-copy p:not(.pq-fragment-kicker) {
    max-width: 42ch;
    margin-top: 1.5rem;
    font-size: 1.125rem;
    line-height: 1.65;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-fragment-contact {
    padding-block: calc(var(--fold-pad) + 2rem);
  }
}

@media (min-width: 1441px) {
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-hero.pq-hero--carousel {
    --z: clamp(1, min(tan(atan2(100vw, 1440px)), tan(atan2(100svh, 900px))), 2);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-hero.pq-hero--carousel .pq-carrier {
    zoom: var(--z);
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-hero.pq-hero--carousel .pq-carrier {
    width: calc(52vw / var(--z));
    min-height: calc(62svh / var(--z));
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section > .pq-hero.pq-hero--carousel::after {
    --sig: calc(11.7rem * var(--z));
  }
}

#theme-picato-native-alternative .pq-fragment-contact {
  background: var(--green-raised);
  text-align: center;
  padding-block: var(--section);
}

#theme-picato-native-alternative .pq-fragment-contact .pq-fragment-inner {
  max-width: 34rem;
  justify-items: center;
  gap: 0;
}

#theme-picato-native-alternative .pq-fragment-contact .pq-fragment-kicker {
  color: rgba(255, 255, 255, .7);
  letter-spacing: .1em;
}

#theme-picato-native-alternative .pq-fragment-contact h2 {
  max-width: 14ch;
  text-align: center;
  font-size: clamp(1.85rem, 2.8vw, 2.65rem);
  margin-top: 0;
}

#theme-picato-native-alternative .pq-fragment-contact p {
  text-align: center;
  max-width: 40ch;
  margin-top: 1rem;
}

#theme-picato-native-alternative .pq-fragment-contact .pq-primary-cta {
  background: var(--yellow);
  margin-top: 1.5rem;
}

@keyframes pq-quiet-hero-drift {
      from { transform: scale(1.02) translate3d(-0.25%, 0, 0); }
      to { transform: scale(1.045) translate3d(0.25%, -0.3%, 0); }
    }

@keyframes pq-quiet-claim-rise {
      from {
        opacity: 0;
        transform: translate3d(0, 0.55rem, 0);
      }
      to {
        opacity: 1;
        transform: none;
      }
    }

@keyframes pq-quiet-section-in {
      from {
        opacity: 0;
        transform: translate3d(0, 0.7rem, 0);
      }
      to {
        opacity: 1;
        transform: none;
      }
    }

#theme-picato-native-alternative .pq-primary-cta {
  transition:
        background-color 220ms var(--quiet-ease),
        color 220ms var(--quiet-ease),
        transform 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-primary-cta:hover,
#theme-picato-native-alternative .pq-primary-cta:focus-visible {
  background: var(--cta-stop);
  transform: translateY(-1px);
}

#theme-picato-native-alternative .pq-primary-cta::after {
  display: inline-block;
  transition: transform 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-primary-cta:hover::after,
#theme-picato-native-alternative .pq-primary-cta:focus-visible::after {
  transform: translateX(0.2rem);
}

@supports (animation-timeline: view()) {
  #theme-picato-native-alternative .pq-proof-band {
    animation: pq-quiet-section-in 600ms var(--quiet-ease) both;
    animation-timeline: view();
    animation-range: entry 0% entry 42%;
  }
}

#theme-picato-native-alternative .pq-hero--carousel {
  --slide-ms: 7000ms;
  --fade-ms: 600ms;
}

#theme-picato-native-alternative .pq-hero--carousel .pq-hero-slide-media {
  opacity: 0;
  animation: none;
  transform: scale(1.04);
  transition: opacity var(--fade-ms) var(--quiet-ease);
}

@keyframes pq-hero-zoom-in { from { transform: scale(1.04); } to { transform: scale(1.14); } }

@keyframes pq-hero-zoom-out { from { transform: scale(1.14); } to { transform: scale(1.04); } }

@keyframes pq-hero-pan-right { from { transform: scale(1.12) translate3d(-3%, 0, 0); } to { transform: scale(1.12) translate3d(3%, 0, 0); } }

@keyframes pq-hero-pan-left { from { transform: scale(1.12) translate3d(3%, 0, 0); } to { transform: scale(1.12) translate3d(-3%, 0, 0); } }

#theme-picato-native-alternative .pq-hero--carousel.is-running .pq-hero-slide-media.is-active,
#theme-picato-native-alternative .pq-hero--carousel.is-running .pq-hero-slide-media.is-leaving {
  animation-duration: calc(var(--slide-ms) + var(--fade-ms));
  animation-timing-function: linear;
  animation-fill-mode: both;
}

#theme-picato-native-alternative .pq-hero--carousel.is-running [data-motion="zoom-in"]:is(.is-active,
:where(#theme-picato-native-alternative) .is-leaving) {
  animation-name: pq-hero-zoom-in;
}

#theme-picato-native-alternative .pq-hero--carousel.is-running [data-motion="zoom-out"]:is(.is-active,
:where(#theme-picato-native-alternative) .is-leaving) {
  animation-name: pq-hero-zoom-out;
}

#theme-picato-native-alternative .pq-hero--carousel.is-running [data-motion="pan-right"]:is(.is-active,
:where(#theme-picato-native-alternative) .is-leaving) {
  animation-name: pq-hero-pan-right;
}

#theme-picato-native-alternative .pq-hero--carousel.is-running [data-motion="pan-left"]:is(.is-active,
:where(#theme-picato-native-alternative) .is-leaving) {
  animation-name: pq-hero-pan-left;
}

#theme-picato-native-alternative .pq-hero--carousel.is-paused .pq-hero-slide-media,
#theme-picato-native-alternative .pq-hero--carousel.is-paused .pq-hero-dot span {
  animation-play-state: paused;
}

#theme-picato-native-alternative .pq-hero--carousel .pq-hero-media::after {
  background: linear-gradient(to bottom, rgba(10, 24, 14, .5), rgba(10, 24, 14, .08) 38%, rgba(10, 24, 14, .22));
}

#theme-picato-native-alternative .pq-hero-slides {
  display: grid;
}

#theme-picato-native-alternative .pq-hero-slide {
  grid-area: 1 / 1;
  align-self: end;
  opacity: 0;
  visibility: hidden;
  transition: opacity 240ms var(--quiet-ease), visibility 0s linear 240ms;
}

#theme-picato-native-alternative .pq-hero-slide.is-active {
  opacity: 1;
  visibility: visible;
  transition: opacity 240ms var(--quiet-ease), visibility 0s;
}

#theme-picato-native-alternative .pq-hero-controls {
  display: flex;
  align-items: center;
  gap: .9rem;
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
}

#theme-picato-native-alternative .pq-hero-pause {
  display: inline-grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .38);
  border-radius: 999px;
  background: transparent;
  color: var(--white);
  cursor: pointer;
  transition: background-color 180ms var(--quiet-ease), border-color 180ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-hero-pause:hover {
  background: var(--green-raised);
  border-color: rgba(255, 255, 255, .7);
}

#theme-picato-native-alternative .pq-hero-pause:focus-visible,
#theme-picato-native-alternative .pq-hero-dot:focus-visible {
  outline: 3px solid var(--white);
  outline-offset: 3px;
}

#theme-picato-native-alternative .pq-hero-pause .pq-icon-play {
  display: none;
}

#theme-picato-native-alternative .pq-hero--carousel.is-stopped .pq-hero-pause .pq-icon-play {
  display: block;
}

#theme-picato-native-alternative .pq-hero--carousel.is-stopped .pq-hero-pause .pq-icon-pause {
  display: none;
}

#theme-picato-native-alternative .pq-hero-dots {
  display: flex;
  gap: .4rem;
}

#theme-picato-native-alternative .pq-hero-dot {
  display: grid;
  align-items: center;
  width: 3.25rem;
  height: 2.75rem;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

#theme-picato-native-alternative .pq-hero-dot::before,
#theme-picato-native-alternative .pq-hero-dot span {
  grid-area: 1 / 1;
  display: block;
  height: 3px;
  border-radius: 999px;
}

#theme-picato-native-alternative .pq-hero-dot::before {
  content: "";
  background: rgba(255, 255, 255, .3);
  transition: background-color 180ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-hero-dot:hover::before {
  background: rgba(255, 255, 255, .55);
}

#theme-picato-native-alternative .pq-hero-dot span {
  width: 100%;
  background: var(--orange);
  transform: scaleX(0);
  transform-origin: left center;
}

#theme-picato-native-alternative .pq-hero-dot.is-active span {
  transform: scaleX(1);
}

#theme-picato-native-alternative .pq-hero--carousel.is-stopped .pq-hero-dot.is-active span {
  animation: none;
}

@keyframes pq-hero-timer { from { transform: scaleX(0); } to { transform: scaleX(1); } }

#theme-picato-native-alternative .pq-hero--carousel.is-running:not(.is-stopped) .pq-hero-dot.is-active span {
  animation: pq-hero-timer var(--slide-ms) linear both;
}

#theme-picato-native-alternative .pq-hero--carousel.is-running.is-paused:not(.is-stopped) .pq-hero-dot.is-active span {
  animation-play-state: paused;
}

#theme-picato-native-alternative .pq-hero-count {
  margin-left: auto;
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .74);
}

#theme-picato-native-alternative .pq-hero-count b {
  color: var(--white);
  font-weight: 700;
}

#theme-picato-native-alternative .pq-infographic-figure .pq-plate-svg {
  display: block;
  width: 100%;
  height: auto;
}

:where(#theme-picato-native-alternative) .pq-infographic-figure picture {
  display: block;
}

#theme-picato-native-alternative .pq-infographic-figure .pq-plate-svg.pq-plate-narrow {
  display: none;
}

@media (max-width: 640px) {
  #theme-picato-native-alternative .pq-infographic-figure .pq-plate-svg.pq-plate-wide {
    display: none;
  }
  #theme-picato-native-alternative .pq-infographic-figure .pq-plate-svg.pq-plate-narrow {
    display: block;
  }
}

#theme-picato-native-alternative .pq-service {
  transition:
        transform 220ms var(--quiet-ease),
        box-shadow 220ms var(--quiet-ease),
        border-color 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-service:hover,
#theme-picato-native-alternative .pq-service:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 14px 32px rgba(18, 33, 26, .10);
  border-color: rgba(18, 33, 26, .22);
}

#theme-picato-native-alternative .pq-text-link span {
  display: inline-block;
  transition: transform 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-text-link:hover span,
#theme-picato-native-alternative .pq-text-link:focus-visible span {
  transform: translateX(.3rem);
}

#theme-picato-native-alternative .pq-practice-media {
  overflow: hidden;
}

#theme-picato-native-alternative .pq-practice-media img {
  transition: transform 600ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-fragment-practice:hover .pq-practice-media img {
  transform: scale(1.03);
}

#theme-picato-native-alternative .pq-hero--carousel::after {
  --sig: clamp(7.5rem, 13vw, 12.5rem);
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 3;
  width: var(--sig);
  height: var(--sig);
  border-radius: 100% 0 0 0;
  background: var(--orange);
  pointer-events: none;
  transform-origin: 100% 100%;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-hero--carousel::after {
    --sig: clamp(4.5rem, 20vw, 6rem);
  }
  #theme-picato-native-alternative .pq-hero--carousel::after {
    z-index: 5;
  }
  #theme-picato-native-alternative .pq-hero--carousel .pq-hero-controls {
    padding-right: 4.25rem;
  }
  #theme-picato-native-alternative .pq-hero--carousel .pq-hero-count {
    white-space: nowrap;
  }
  #theme-picato-native-alternative .pq-hero--carousel .pq-hero-pause {
    flex: none;
  }
}

@keyframes pq-quiet-signature-in {
      from { transform: scale(.35); opacity: 0; }
      to { transform: none; opacity: 1; }
    }

@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-hero--carousel::after {
    animation: none !important;
  }
}

#theme-picato-native-alternative .pq-value-line {
  margin-top: 1.25rem !important;
  padding-left: 1rem;
  border-left: 2px solid var(--orange);
  color: var(--green) !important;
  font-weight: 600;
}

#theme-picato-native-alternative .pq-service-list.pq-service-list--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#theme-picato-native-alternative .pq-service--static:hover {
  transform: none;
  box-shadow: none;
  border-color: rgba(18, 33, 26, .08);
}

#theme-picato-native-alternative .pq-service--static .pq-service-index {
  letter-spacing: .1em;
  text-transform: uppercase;
}

#theme-picato-native-alternative .pq-service--static h3 {
  max-width: 18ch;
}

#theme-picato-native-alternative .pq-service--static p {
  max-width: 42ch;
}

#theme-picato-native-alternative .pq-service--static .pq-value-line {
  font-size: .9375rem;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-service-list.pq-service-list--three {
    grid-template-columns: 1fr;
  }
}

:where(#theme-picato-native-alternative) .pq-fragment-infographic {
  padding: var(--section) var(--gutter);
  background: var(--paper);
}

#theme-picato-native-alternative .pq-fragment-infographic {
  padding-block: var(--section);
  background: var(--paper);
}

#theme-picato-native-alternative .pq-infographic-shell {
  gap: clamp(2.75rem, 5vw, 4.5rem);
}

#theme-picato-native-alternative .pq-infographic-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: end;
  max-width: none;
  width: 100%;
}

#theme-picato-native-alternative .pq-infographic-intro .pq-fragment-kicker {
  grid-column: 1 / -1;
  letter-spacing: .1em;
  margin: 0 0 .35rem;
}

#theme-picato-native-alternative .pq-infographic-intro h2 {
  max-width: 16ch;
  margin: 0;
  font-size: clamp(2rem, 3.4vw, 3.25rem);
}

#theme-picato-native-alternative .pq-infographic-intro p {
  max-width: 36ch;
  margin: 0;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ink);
}

#theme-picato-native-alternative .pq-infographic-stack {
  gap: clamp(1.15rem, 2.5vw, 1.75rem);
}

#theme-picato-native-alternative .pq-infographic-figure {
  background: var(--white);
  border: 1px solid rgba(18, 33, 26, .08);
  border-radius: var(--radius);
  overflow: hidden;
}

#theme-picato-native-alternative .pq-infographic-figure img {
  border-radius: 0;
}

#theme-picato-native-alternative .pq-infographic-figure figcaption {
  display: grid;
  gap: .35rem;
  max-width: none;
  padding: 1.1rem 1.35rem 1.25rem;
  background: var(--white);
  border-top: 1px solid rgba(18, 33, 26, .06);
  color: var(--ink);
  font-size: .9375rem;
  line-height: 1.45;
}

#theme-picato-native-alternative .pq-infographic-figure .pq-plate-index {
  margin: 0;
  font-family: "Picato Caps", sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--orange-ink);
}

#theme-picato-native-alternative .pq-infographic-figure figcaption p {
  margin: 0;
  max-width: 48ch;
  color: var(--muted);
  font-size: .875rem;
  line-height: 1.5;
}

#theme-picato-native-alternative .pq-infographic-pair {
  grid-template-columns: 1fr;
  gap: clamp(1.15rem, 2.5vw, 1.75rem);
  align-items: stretch;
}

#theme-picato-native-alternative .pq-infographic-figure figcaption {
  padding: 1.25rem 1.5rem 1.4rem;
}

#theme-picato-native-alternative .pq-infographic-figure .pq-plate-index {
  font-size: .75rem;
}

#theme-picato-native-alternative .pq-infographic-figure figcaption p {
  font-size: 1rem;
  line-height: 1.55;
  max-width: 52ch;
  color: var(--ink);
}

:where(#theme-picato-native-alternative) .pq-infographic-shell {
  width: min(100%, var(--max));
  margin: 0 auto;
  display: grid;
  gap: clamp(2.5rem, 5vw, 4rem);
}

:where(#theme-picato-native-alternative) .pq-infographic-intro {
  max-width: 36rem;
}

:where(#theme-picato-native-alternative) .pq-infographic-intro h2 {
  margin: 0;
  font-family: "Picato Display", serif;
  font-size: clamp(2.1rem, 3.6vw, 3.4rem);
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 1.06;
  color: var(--green);
}

:where(#theme-picato-native-alternative) .pq-infographic-intro p {
  margin: 1rem 0 0;
  max-width: 44ch;
  color: var(--muted);
  line-height: 1.55;
}

:where(#theme-picato-native-alternative) .pq-infographic-figure {
  margin: 0;
  overflow: hidden;
  background: transparent;
  border: 0;
}

:where(#theme-picato-native-alternative) .pq-infographic-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius);
}

:where(#theme-picato-native-alternative) .pq-infographic-figure figcaption {
  padding: .85rem 0 0;
  color: var(--muted);
  font-size: .875rem;
  line-height: 1.45;
  max-width: 52ch;
}

:where(#theme-picato-native-alternative) .pq-infographic-stack {
  display: grid;
  gap: clamp(1.75rem, 3vw, 2.5rem);
}

:where(#theme-picato-native-alternative) .pq-infographic-pair {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 1.25rem;
  align-items: start;
}

:where(#theme-picato-native-alternative) .pq-infographic-aside {
  display: grid;
  gap: 1rem;
  padding: 1.5rem 1.35rem;
  border-radius: var(--radius);
  background: var(--white);
  border: 1px solid rgba(18, 33, 26, .08);
  align-content: start;
}

:where(#theme-picato-native-alternative) .pq-infographic-aside h3 {
  margin: 0;
  font-family: "Picato Display", serif;
  font-size: 1.45rem;
  font-weight: 400;
  color: var(--green);
}

:where(#theme-picato-native-alternative) .pq-infographic-aside p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
  font-size: .98rem;
}

:where(#theme-picato-native-alternative) .pq-infographic-aside dl {
  margin: .35rem 0 0;
  display: grid;
  gap: .85rem;
}

:where(#theme-picato-native-alternative) .pq-infographic-aside dt {
  color: var(--orange-ink);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) .pq-infographic-aside dd {
  margin: .3rem 0 0;
  font-family: "Picato Display", serif;
  font-size: 1.15rem;
  color: var(--green);
}

@media (max-width: 900px) {
  :where(#theme-picato-native-alternative) .pq-infographic-pair {
    grid-template-columns: 1fr;
  }
  #theme-picato-native-alternative .pq-infographic-intro {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 1rem;
  }
  #theme-picato-native-alternative .pq-infographic-intro .pq-fragment-kicker {
    grid-column: auto;
  }
}

:where(#theme-picato-native-alternative) .pq-proof-band {
  padding: var(--section) var(--gutter);
  color: var(--white);
}

:where(#theme-picato-native-alternative) .pq-proof-band-inner {
  display: grid;
  width: min(100%, 78rem);
  margin: 0 auto;
  grid-template-columns: .75fr 1.25fr;
  gap: clamp(2.5rem, 6vw, 5rem);
  align-items: end;
}

:where(#theme-picato-native-alternative) .pq-proof-band h2 {
  max-width: 10ch;
  margin: 0;
  font-family: "Picato Display", serif;
  font-size: clamp(2.1rem, 3.6vw, 3.75rem);
  font-weight: 400;
  line-height: 1.05;
}

:where(#theme-picato-native-alternative) .pq-proof-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0;
  border-top: 1px solid rgba(255, 255, 255, .28);
}

:where(#theme-picato-native-alternative) .pq-proof-fact {
  padding: 1.35rem 1.25rem 0 0;
  border-right: 1px solid rgba(255, 255, 255, .22);
}

:where(#theme-picato-native-alternative) .pq-proof-fact:last-child {
  border-right: 0;
  padding-right: 0;
}

:where(#theme-picato-native-alternative) .pq-proof-fact dt {
  color: rgba(255, 255, 255, .72);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) .pq-proof-fact dd {
  margin: .65rem 0 0;
  font-size: 1.05rem;
  line-height: 1.35;
}

:where(#theme-picato-native-alternative) .pq-fragment {
  padding: var(--section) var(--gutter);
}

:where(#theme-picato-native-alternative) .pq-fragment-inner {
  display: grid;
  width: min(100%, var(--max));
  margin: 0 auto;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
}

:where(#theme-picato-native-alternative) .pq-fragment-kicker {
  margin: 0 0 .85rem;
  color: var(--orange-ink);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .12em;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) .pq-fragment h2 {
  margin: 0;
  max-width: 16ch;
  font-family: "Picato Display", serif;
  font-size: clamp(2rem, 3.4vw, 3.25rem);
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 1.08;
}

:where(#theme-picato-native-alternative) .pq-intro-copy {
  margin: 0;
  color: var(--muted);
  font-size: 1.0625rem;
  line-height: 1.6;
  max-width: 42ch;
}

:where(#theme-picato-native-alternative) .pq-text-link {
  display: inline-flex;
  gap: .5rem;
  margin-top: 1.5rem;
  color: var(--green);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) .pq-fragment-services {
  padding-top: calc(var(--section) * .55);
}

:where(#theme-picato-native-alternative) .pq-service-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
}

:where(#theme-picato-native-alternative) .pq-service {
  display: block;
  padding: 1.5rem;
  color: inherit;
  text-decoration: none;
}

:where(#theme-picato-native-alternative) .pq-service-index {
  color: var(--orange-ink);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  letter-spacing: .12em;
}

:where(#theme-picato-native-alternative) .pq-service h3 {
  margin: 1.25rem 0 .75rem;
  font-family: "Picato Display", serif;
  font-size: 1.35rem;
  font-weight: 400;
  line-height: 1.2;
}

:where(#theme-picato-native-alternative) .pq-service p {
  margin: 0;
  color: var(--muted);
  font-size: .95rem;
  line-height: 1.5;
}

:where(#theme-picato-native-alternative) .pq-fragment-practice {
  padding: 0;
}

:where(#theme-picato-native-alternative) .pq-practice-grid {
  display: grid;
  width: min(100%, var(--max));
  margin: 0 auto;
  grid-template-columns: 1.05fr .95fr;
  min-height: 28rem;
}

:where(#theme-picato-native-alternative) .pq-practice-media {
  min-height: 22rem;
  overflow: hidden;
}

:where(#theme-picato-native-alternative) .pq-practice-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.85);
}

:where(#theme-picato-native-alternative) .pq-practice-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2.5rem, 5vw, 4.5rem) var(--gutter);
  background: var(--white);
}

:where(#theme-picato-native-alternative) .pq-practice-copy p:not(.pq-fragment-kicker) {
  margin: 1.25rem 0 0;
  color: var(--muted);
  max-width: 40ch;
  line-height: 1.6;
}

:where(#theme-picato-native-alternative) .pq-fragment-contact {
  background: var(--green);
  color: var(--white);
}

:where(#theme-picato-native-alternative) .pq-fragment-contact .pq-fragment-inner {
  grid-template-columns: 1fr;
  max-width: 40rem;
  margin-left: auto;
  margin-right: auto;
}

:where(#theme-picato-native-alternative) .pq-fragment-contact .pq-fragment-kicker {
  color: var(--orange);
}

:where(#theme-picato-native-alternative) .pq-fragment-contact h2 {
  max-width: 18ch;
  color: var(--white);
}

:where(#theme-picato-native-alternative) .pq-fragment-contact p {
  margin: 1.25rem 0 0;
  color: rgba(255, 255, 255, .82);
  max-width: 42ch;
  line-height: 1.55;
}

@media (max-width: 1100px) {
  #theme-picato-native-alternative .pq-service-list,
  :where(#theme-picato-native-alternative) .pq-service-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  :where(#theme-picato-native-alternative) .pq-carrier {
    width: 100%;
    border-radius: 0 42% 0 0 / 0 28% 0 0;
    min-height: clamp(24rem, 70svh, 36rem);
  }
  #theme-picato-native-alternative .pq-carrier {
    width: 100%;
    border-radius: 0 46% 0 0 / 0 34% 0 0;
    min-height: 0;
    padding: 2.5rem var(--gutter) 2.5rem;
  }
  #theme-picato-native-alternative h1,
  #theme-picato-native-alternative .pq-hero-title {
    max-width: none;
    font-size: clamp(2.1rem, 9vw, 3.25rem);
  }
  #theme-picato-native-alternative .pq-lede {
    max-width: 38ch;
  }
  :where(#theme-picato-native-alternative) .pq-arc-mark {
    display: none !important;
  }
  :where(#theme-picato-native-alternative) .pq-proof-band-inner,
  :where(#theme-picato-native-alternative) .pq-fragment-inner,
  :where(#theme-picato-native-alternative) .pq-practice-grid {
    grid-template-columns: 1fr;
  }
  :where(#theme-picato-native-alternative) .pq-practice-media {
    height: min(52vw, 16rem);
    min-height: 0;
  }
  #theme-picato-native-alternative .pq-fragment-intro {
    border-radius: 0 0 3.5rem 0;
  }
  #theme-picato-native-alternative .pq-practice-copy {
    padding: clamp(2rem, 6vw, 3rem) clamp(1.25rem, 4vw, 2rem);
  }
}

@media (max-width: 720px) {
  #theme-picato-native-alternative .pq-service-list,
  :where(#theme-picato-native-alternative) .pq-service-list {
    grid-template-columns: 1fr;
  }
  #theme-picato-native-alternative .pq-proof-facts,
  :where(#theme-picato-native-alternative) .pq-proof-facts {
    grid-template-columns: 1fr;
  }
  #theme-picato-native-alternative .pq-proof-band,
  #theme-picato-native-alternative .pq-fragment-intro,
  #theme-picato-native-alternative .pq-fragment-services,
  #theme-picato-native-alternative .pq-fragment-contact,
  #theme-picato-native-alternative .pq-fragment-infographic {
    padding-block: clamp(3rem, 8vw, 4.5rem);
  }
  :where(#theme-picato-native-alternative) .pq-fragment {
    padding-inline: var(--gutter);
  }
}

@media (max-width: 380px) {
  #theme-picato-native-alternative .pq-carrier {
    width: 100%;
    border-radius: 0 34% 0 0 / 0 22% 0 0;
    padding: 2rem 1.1rem 2rem;
  }
  #theme-picato-native-alternative h1,
  #theme-picato-native-alternative .pq-hero-title {
    font-size: clamp(1.85rem, 8.5vw, 2.35rem);
    line-height: 1.08;
    letter-spacing: -.015em;
  }
}

@media (prefers-reduced-motion: reduce) {
  :where(#theme-picato-native-alternative) .pq-hero-media img {
    transform: none;
    animation: none;
  }
  #theme-picato-native-alternative .pq-hero--carousel .pq-hero-slide-media,
  #theme-picato-native-alternative .pq-hero-slide,
  #theme-picato-native-alternative .pq-hero-dot span {
    animation: none !important;
    transition: none !important;
  }
  :where(#theme-picato-native-alternative) [data-reveal],
  :where(#theme-picato-native-alternative) [data-reveal="media"] > img,
  :where(#theme-picato-native-alternative) .pq-plate-svg .pq-a-rise,
  :where(#theme-picato-native-alternative) .pq-plate-svg .pq-a-pop,
  :where(#theme-picato-native-alternative) .pq-plate-svg .pq-a-draw {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    stroke-dashoffset: 0 !important;
    transition: none !important;
  }
  #theme-picato-native-alternative .pq-service,
  #theme-picato-native-alternative .pq-text-link span,
  #theme-picato-native-alternative .pq-practice-media img {
    transition: none;
  }
  #theme-picato-native-alternative .pq-service:hover,
  #theme-picato-native-alternative .pq-fragment-practice:hover .pq-practice-media img {
    transform: none;
  }
  #theme-picato-native-alternative .pq-proof-band {
    animation: none !important;
    opacity: 1;
    transform: none;
  }
  #theme-picato-native-alternative .pq-primary-cta,
  #theme-picato-native-alternative .pq-primary-cta::after {
    transition: none;
  }
  #theme-picato-native-alternative .pq-primary-cta:hover,
  #theme-picato-native-alternative .pq-primary-cta:focus-visible {
    transform: none;
  }
}

/* ── src/12-airy-arrival.css ── */
/*
 * What the page does when it arrives. In the prototype these rules hang on `.quiet.is-active` — the
 * Studio shows one variant at a time — and the one-time import took a rule rooted at the variant
 * itself for prototype chrome and dropped it. A published page is always "active", so they apply
 * from the root. One of them is not motion at all: it is the rule that makes the active hero image
 * visible (0.4.0 drafts up to here rendered the hero without its picture).
 * Order and values are the prototype's; the keyframes live in src/10.
 */
#theme-picato-native-alternative .pq-hero-media img {
  transform: scale(1.02);
  animation: pq-quiet-hero-drift 28s var(--quiet-ease) infinite alternate;
}
#theme-picato-native-alternative .pq-copy > * {
  animation: pq-quiet-claim-rise var(--quiet-dur) var(--quiet-ease) both;
}
#theme-picato-native-alternative .pq-copy > *:nth-child(1) {
  animation-delay: 0ms;
}
#theme-picato-native-alternative .pq-copy > *:nth-child(2) {
  animation-delay: 70ms;
}
#theme-picato-native-alternative .pq-copy > *:nth-child(3) {
  animation-delay: 140ms;
}
#theme-picato-native-alternative .pq-copy > *:nth-child(4) {
  animation-delay: 200ms;
}
#theme-picato-native-alternative .pq-hero--carousel .pq-hero-media .pq-hero-slide-media {
  animation: none;
  transform: scale(1.04);
}
#theme-picato-native-alternative .pq-hero--carousel .pq-hero-slide-media.is-active {
  opacity: 1;
}
#theme-picato-native-alternative .pq-copy > .pq-hero-slides,
#theme-picato-native-alternative .pq-copy > .pq-hero-controls {
  animation: none;
}
#theme-picato-native-alternative .pq-hero-slide.is-active > * {
  animation: pq-quiet-claim-rise var(--quiet-dur) var(--quiet-ease) both;
}
#theme-picato-native-alternative .pq-hero-slide.is-active > *:nth-child(1) {
  animation-delay: 120ms;
}
#theme-picato-native-alternative .pq-hero-slide.is-active > *:nth-child(2) {
  animation-delay: 190ms;
}
#theme-picato-native-alternative .pq-hero-slide.is-active > *:nth-child(3) {
  animation-delay: 260ms;
}
#theme-picato-native-alternative .pq-hero-slide.is-active > *:nth-child(4) {
  animation-delay: 320ms;
}
#theme-picato-native-alternative .pq-hero--carousel::after,
#theme-picato-native-alternative .pq-page-hero::after {
  animation: pq-quiet-signature-in 600ms var(--quiet-ease) 180ms both;
}
#theme-picato-native-alternative .pq-page-hero-inner > * {
  animation: pq-quiet-claim-rise var(--quiet-dur) var(--quiet-ease) both;
}
#theme-picato-native-alternative .pq-page-hero-inner > *:nth-child(2) {
  animation-delay: 70ms;
}
#theme-picato-native-alternative .pq-page-hero-inner > *:nth-child(3) {
  animation-delay: 140ms;
}
@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-page-hero-inner > *,
  #theme-picato-native-alternative .pq-hero-slide.is-active > *,
  #theme-picato-native-alternative .pq-hero-media img,
  #theme-picato-native-alternative .pq-copy > * {
    animation: none !important;
    opacity: 1;
    transform: none;
  }
  #theme-picato-native-alternative .pq-hero--carousel::after,
  #theme-picato-native-alternative .pq-page-hero::after {
    animation: none !important;
  }
}

/* ── src/15-airy-chrome.css ── */
/*
 * Header and footer (host Phase 3b: layout/header.hbs, layout/footer.hbs). Imported from the prototype
 * like src/10 — rules and order kept, selectors rewritten — with three differences that come from
 * where the chrome lives: the header is a sibling of the page, not a child of the hero; the phone menu
 * collapses only under .has-nav-toggle (set by the host's behaviour), so without script the
 * navigation is simply there; and the open state is .is-nav-open / html.theme-nav-open.
 */
#theme-picato-native-alternative .basic-layout {
  position: relative;
}
#theme-picato-native-alternative .pq-site-header {
  color: var(--white);
}
/* The host's skip link: off screen until it has focus. */
#theme-picato-native-alternative .basic-layout__skip-link {
  position: absolute;
  z-index: 30;
  top: .5rem;
  left: .5rem;
  padding: .7rem 1rem;
  border-radius: 999px;
  background: var(--white);
  color: var(--green);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
  transform: translateY(-200%);
}
#theme-picato-native-alternative .basic-layout__skip-link:focus {
  transform: none;
}

:where(#theme-picato-native-alternative) .pq-site-header {
  position: absolute;
  z-index: 20;
  top: 0;
  left: 50%;
  display: grid;
  width: min(100%, var(--max));
  grid-template-columns: 11rem 1fr auto;
  align-items: center;
  padding: 1.5rem var(--gutter);
  transform: translateX(-50%);
}

:where(#theme-picato-native-alternative) .pq-brand {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  color: inherit;
  text-decoration: none;
}

/* A logo is whatever shape the site uploaded — a wide wordmark as readily as a square mark. Fix the
   height and let the width follow, so the whole logo is shown; `cover` on a square box cropped a
   500x258 wordmark down to its left third. `max-width` keeps it inside the header's first column. */
:where(#theme-picato-native-alternative) .pq-brand img {
  width: auto;
  height: 2.25rem;
  max-width: 100%;
  object-fit: contain;
  object-position: left;
}

:where(#theme-picato-native-alternative) .pq-brand span {
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) .pq-site-header nav {
  display: flex;
  justify-content: center;
  gap: clamp(1.4rem, 3vw, 3rem);
}

:where(#theme-picato-native-alternative) .pq-site-header a:not(.pq-brand),
:where(#theme-picato-native-alternative) .pq-header-cta {
  color: inherit;
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}

:where(#theme-picato-native-alternative) .pq-header-cta {
  padding: .7rem 1.05rem;
  border-radius: 999px;
}

:where(#theme-picato-native-alternative) .pq-site-header a:focus-visible {
  outline-color: var(--white);
}

#theme-picato-native-alternative .pq-site-header {
  padding-block: 1.25rem;
}

#theme-picato-native-alternative .pq-site-header nav {
  gap: 0.15rem;
  padding: 0.2rem;
  border-radius: 999px;
  background-color: var(--green);
}

#theme-picato-native-alternative .pq-site-header nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.65rem 0.95rem;
  color: var(--white);
  border-radius: 999px;
}

#theme-picato-native-alternative .pq-site-header nav a:hover {
  background: var(--green-raised);
}

#theme-picato-native-alternative .pq-header-cta {
  background: var(--white);
  color: var(--green);
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
}

#theme-picato-native-alternative .pq-site-header a.pq-header-cta {
  color: var(--green);
}

@media (min-width: 1441px) {
  /* In the prototype the header sits inside the hero and scales with it. Here it is a sibling of the
     page, so it carries the hero's zoom factor itself. */
  #theme-picato-native-alternative .pq-site-header {
    --z: clamp(1, min(tan(atan2(100vw, 1440px)), tan(atan2(100svh, 900px))), 2);
    zoom: var(--z);
    width: 100%;
  }
}

#theme-picato-native-alternative .pq-site-footer {
  background: #232323;
  padding: clamp(3rem, 5vw, 4.5rem) var(--gutter) clamp(2.5rem, 4vw, 3.5rem);
}

#theme-picato-native-alternative .pq-footer-grid {
  gap: clamp(1.75rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 2.75rem);
  align-items: start;
}

#theme-picato-native-alternative .pq-footer-brand {
  max-width: 28ch;
}

#theme-picato-native-alternative .pq-footer-brand strong {
  letter-spacing: .1em;
  margin-bottom: 1rem;
}

#theme-picato-native-alternative .pq-footer-brand p {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, .62);
}

#theme-picato-native-alternative .pq-footer-column h3 {
  letter-spacing: .08em;
  color: rgba(255, 255, 255, .88);
  margin-bottom: .85rem;
}

#theme-picato-native-alternative .pq-footer-column a {
  margin-bottom: 0;
  padding-block: .25rem;
  color: rgba(255, 255, 255, .62);
  transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

#theme-picato-native-alternative .pq-footer-column a:hover {
  color: var(--white);
}

#theme-picato-native-alternative .pq-footer-legal {
  margin-top: 2rem;
  padding-top: 1.15rem;
  border-top-color: rgba(255, 255, 255, .1);
  color: rgba(255, 255, 255, .48);
  gap: 1rem;
  flex-wrap: wrap;
}

#theme-picato-native-alternative .pq-site-header nav a,
#theme-picato-native-alternative .pq-header-cta {
  transition:
        background-color 220ms var(--quiet-ease),
        color 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-menu-toggle {
  display: none;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-site-header {
    left: 0;
    width: 100%;
    transform: none;
    grid-template-columns: 1fr auto auto;
    gap: .5rem;
  }
  #theme-picato-native-alternative .pq-site-header .pq-brand,
  #theme-picato-native-alternative .pq-site-header .pq-header-cta,
  #theme-picato-native-alternative .pq-menu-toggle {
    position: relative;
    z-index: 1;
  }
  #theme-picato-native-alternative .pq-menu-toggle {
    display: inline-grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 50%;
    background: transparent;
    color: var(--white);
    cursor: pointer;
  }
  #theme-picato-native-alternative .pq-menu-toggle:focus-visible {
    outline: 2px solid var(--orange);
    outline-offset: 2px;
  }
  #theme-picato-native-alternative .pq-menu-toggle span {
    grid-area: 1 / 1;
    width: 1.05rem;
    height: 1.5px;
    border-radius: 1px;
    background: currentColor;
    transition: transform 240ms var(--quiet-ease);
  }
  #theme-picato-native-alternative .pq-menu-toggle span:first-child {
    transform: translateY(-3.5px);
  }
  #theme-picato-native-alternative .pq-menu-toggle span:last-child {
    transform: translateY(3.5px);
  }
  #theme-picato-native-alternative .pq-site-header.is-nav-open .pq-menu-toggle span:first-child {
    transform: rotate(45deg);
  }
  #theme-picato-native-alternative .pq-site-header.is-nav-open .pq-menu-toggle span:last-child {
    transform: rotate(-45deg);
  }
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle nav {
    position: fixed;
    z-index: 0;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: .25rem;
    padding: 6rem var(--gutter) 3rem;
    border-radius: 0;
    background-color: var(--green);
    visibility: hidden;
    opacity: 0;
    transition: opacity 240ms var(--quiet-ease), visibility 0s linear 240ms;
  }
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle.is-nav-open nav {
    visibility: visible;
    opacity: 1;
    transition: opacity 240ms var(--quiet-ease), visibility 0s;
  }
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle nav a {
    justify-content: flex-start;
    min-height: 3.5rem;
    padding: .35rem 0;
    border-radius: 0;
    font-family: "Picato Display", serif;
    font-size: clamp(1.9rem, 8vw, 2.5rem);
    font-weight: 400;
    letter-spacing: -.01em;
    text-transform: none;
    opacity: 0;
    transform: translateY(.6rem);
    transition: opacity 320ms var(--quiet-ease), transform 320ms var(--quiet-ease), color 180ms var(--quiet-ease);
  }
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle.is-nav-open nav a {
    opacity: 1;
    transform: none;
    transition-delay: calc(60ms + var(--i, 0) * 45ms);
  }
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle nav a:hover {
    background: none;
    color: var(--orange);
  }
}

@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle nav,
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle nav a,
  #theme-picato-native-alternative .pq-menu-toggle span {
    transition: none !important;
  }
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle nav a {
    transform: none;
  }
}

:where(#theme-picato-native-alternative) .pq-site-footer {
  padding: 3rem var(--gutter) 3.5rem;
  background: var(--ink);
  color: rgba(255, 255, 255, .78);
}

:where(#theme-picato-native-alternative) .pq-footer-grid {
  display: grid;
  width: min(100%, var(--max));
  margin: 0 auto;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 2rem;
}

:where(#theme-picato-native-alternative) .pq-footer-brand strong {
  display: block;
  margin-bottom: .75rem;
  color: var(--white);
  font-family: "Picato Caps", sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .75rem;
}

:where(#theme-picato-native-alternative) .pq-footer-column h3 {
  margin: 0 0 1rem;
  color: var(--white);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 650;
}

:where(#theme-picato-native-alternative) .pq-footer-column a {
  display: block;
  margin-bottom: .55rem;
  color: inherit;
  text-decoration: none;
  font-size: .95rem;
}

:where(#theme-picato-native-alternative) .pq-footer-legal {
  display: flex;
  justify-content: space-between;
  width: min(100%, var(--max));
  margin: 2.5rem auto 0;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, .14);
  font-size: .8125rem;
}

@media (max-width: 1100px) {
  #theme-picato-native-alternative .pq-footer-grid,
  :where(#theme-picato-native-alternative) .pq-footer-grid {
    grid-template-columns: 1.2fr 1fr 1fr;
  }
  #theme-picato-native-alternative .pq-footer-grid .pq-footer-column:last-child {
    grid-column: 2 / 4;
  }
}

@media (max-width: 900px) {
  :where(#theme-picato-native-alternative) .pq-site-header {
    grid-template-columns: auto 1fr;
  }
  #theme-picato-native-alternative .pq-footer-grid,
  :where(#theme-picato-native-alternative) .pq-footer-grid {
    grid-template-columns: 1fr;
  }
  #theme-picato-native-alternative .pq-footer-grid .pq-footer-column:last-child {
    grid-column: auto;
  }
}

@media (max-width: 720px) {
  #theme-picato-native-alternative .pq-site-header {
    padding-block: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-site-header nav a,
  #theme-picato-native-alternative .pq-header-cta {
    transition: none;
  }
}

/* `hidden` is the rendered state of the menu button; a display rule must not undo it. */
#theme-picato-native-alternative .pq-menu-toggle[hidden] {
  display: none;
}
#theme-picato-native-alternative .pq-site-header nav a:is([aria-current="page"], .is-trail) {
  background: var(--green-raised);
}
/* A footer navigation without groups: one column; with groups only: no empty box. */
#theme-picato-native-alternative .pq-footer-column--flat:not(:has(a)) {
  display: none;
}
@media (max-width: 900px) {
  /* Without the behaviour (no script): the navigation wraps under the brand instead of vanishing. */
  #theme-picato-native-alternative .pq-site-header:not(.has-nav-toggle) nav {
    grid-column: 1 / -1;
    grid-row: 2;
    flex-wrap: wrap;
    justify-content: flex-start;
    border-radius: 1.5rem;
  }
  /* The menu's links arrive one after the other; the prototype's script numbered them. */
  #theme-picato-native-alternative .pq-site-header nav a:nth-child(2) { --i: 1; }
  #theme-picato-native-alternative .pq-site-header nav a:nth-child(3) { --i: 2; }
  #theme-picato-native-alternative .pq-site-header nav a:nth-child(4) { --i: 3; }
  #theme-picato-native-alternative .pq-site-header nav a:nth-child(5) { --i: 4; }
  #theme-picato-native-alternative .pq-site-header nav a:nth-child(6) { --i: 5; }
  #theme-picato-native-alternative .pq-site-header nav a:nth-child(7) { --i: 6; }
  #theme-picato-native-alternative .pq-site-header nav a:nth-child(8) { --i: 7; }
  #theme-picato-native-alternative .pq-site-header.has-nav-toggle.is-nav-open nav a:is([aria-current="page"], .is-trail) {
    background: none;
    color: var(--orange);
  }
}
/* The page behind an open menu does not scroll. The class is the host's (nav-toggle). */
html.theme-nav-open,
html.theme-nav-open body {
  overflow: hidden;
}

/* ── src/20-reveal.css ── */
/*
 * Scroll reveals. The host's `reveal` behaviour marks a container `will-reveal` when it WILL animate
 * and `is-revealed` once it has entered the viewport, and numbers its `[data-reveal="item"]`s (--i).
 * Without script, with reduced motion, in an automated browser or on a host without the behaviour
 * neither class ever appears - so nothing here can hide content for good: every hiding rule needs
 * `.will-reveal`.
 *
 * The prototype did this with transitions and an `is-settled` class its script added 1.4 s later, so
 * the reveal's delay would not slow a card's hover. The host sets no such class. An ANIMATION needs
 * none: it fills backwards (hidden through its delay), and when it ends the element is back on its
 * own styles, hover transitions included. Same curve, same duration, same 80 ms step.
 */
@keyframes pq-rise {
  from {
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
  }
}
@keyframes pq-rule {
  from {
    transform: scaleX(0);
  }
}
@keyframes pq-unveil {
  from {
    clip-path: inset(0 0 100% 0);
  }
}
#theme-picato-native-alternative .will-reveal:not(.is-revealed) [data-reveal="item"] {
  opacity: 0;
}
#theme-picato-native-alternative .will-reveal.is-revealed [data-reveal="item"] {
  animation: pq-rise var(--quiet-dur) var(--quiet-ease) calc(var(--i, 0) * 80ms) backwards;
}
/* The rule above a proof fact draws itself after the fact has arrived. */
#theme-picato-native-alternative .will-reveal:not(.is-revealed) .pq-proof-fact::before {
  transform: scaleX(0);
}
#theme-picato-native-alternative .will-reveal.is-revealed .pq-proof-fact::before {
  animation: pq-rule 600ms var(--quiet-ease) calc(var(--i, 0) * 80ms + 240ms) backwards;
}
/* The practice image is unveiled, not moved: the box keeps its size, the picture is wiped in. */
#theme-picato-native-alternative .will-reveal:not(.is-revealed) .pq-practice-media > img {
  clip-path: inset(0 0 100% 0);
}
#theme-picato-native-alternative .will-reveal.is-revealed .pq-practice-media > img {
  animation: pq-unveil 600ms var(--quiet-ease) backwards;
}
/* Paper never scrolls: a section that has not entered the viewport would print as a blank. And the
   host decides about reduced motion once, when it attaches — a preference switched on afterwards
   must still win. */
@media print, (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .will-reveal [data-reveal="item"],
  #theme-picato-native-alternative .will-reveal .pq-proof-fact::before,
  #theme-picato-native-alternative .will-reveal .pq-practice-media > img {
    opacity: 1;
    transform: none;
    clip-path: none;
    animation: none;
  }
}

/* ── src/30-airy-page-hero.css ── */
/*
 * The hero of an inner page (block page-hero). Imported from the prototype like src/10. The campaign
 * variant (the KMU page with its drawn scene) is not here yet — it comes with that page; the
 * :not(.pq-page-hero--campaign) in the selectors below is the prototype's and already leaves room.
 */
#theme-picato-native-alternative .pq-page-hero:not(.pq-page-hero--campaign)::after {
  --sig: clamp(7.5rem, 13vw, 12.5rem);
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 3;
  width: var(--sig);
  height: var(--sig);
  border-radius: 100% 0 0 0;
  background: var(--orange);
  pointer-events: none;
  transform-origin: 100% 100%;
}

#theme-picato-native-alternative .pq-page-hero:not(.pq-page-hero--campaign) {
  border-bottom-right-radius: 0;
}

#theme-picato-native-alternative .pq-page-hero:not(.pq-page-hero--campaign)::after {
  z-index: 1;
}

#theme-picato-native-alternative .pq-page-hero--legal::after {
  --sig: clamp(5.5rem, 9vw, 8.5rem);
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-page-hero:not(.pq-page-hero--campaign)::after {
    --sig: clamp(4.5rem, 20vw, 6rem);
  }
  #theme-picato-native-alternative .pq-page-hero:not(.pq-page-hero--campaign):not(.pq-page-hero--legal) {
    padding-bottom: 6.75rem;
  }
  #theme-picato-native-alternative .pq-page-hero--legal::after {
    --sig: 4rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-page-hero::after {
    animation: none !important;
  }
}

#theme-picato-native-alternative .pq-page-hero {
  position: relative;
  padding: clamp(8.5rem, 13vw, 12rem) var(--gutter) clamp(3rem, 6vw, 5.5rem);
  border-radius: 0 0 6rem 0;
  background: var(--green);
  color: var(--white);
}

#theme-picato-native-alternative .pq-page-hero-inner {
  width: min(100%, var(--max));
  margin: 0 auto;
}

#theme-picato-native-alternative .pq-page-hero h1 {
  max-width: 22ch;
  font-size: clamp(2.1rem, 3.8vw, 3.75rem);
  line-height: 1.06;
}

#theme-picato-native-alternative .pq-page-hero .pq-lede {
  max-width: 60ch;
}

#theme-picato-native-alternative .pq-page-hero--legal {
  padding-bottom: clamp(2.25rem, 4vw, 3.5rem);
}

#theme-picato-native-alternative .pq-page-hero--post h1 {
  max-width: 20ch;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-page-hero {
    border-radius: 0 0 3.5rem 0;
  }
}

/* ── src/40-airy-detail.css ── */
/* service-detail: one row per service (name left, what it does right), or with `steps` three
 * numbered steps on one line. Imported from the prototype's `.quiet-page` rules (detail rows,
 * "Picato Vorgehen", open note), selectors rewritten only. The prototype scopes them to inner pages;
 * here the block itself is the scope, because a block looks the same on whichever page carries it. */

#theme-picato-native-alternative .pq-fragment-detail {
  background: var(--paper);
}

#theme-picato-native-alternative .pq-detail-list {
  display: grid;
  gap: 1rem;
  width: min(100%, var(--max));
  margin: 0 auto;
}

#theme-picato-native-alternative .pq-detail-row {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(1.5rem, 4vw, 4rem);
  padding: clamp(1.75rem, 3.2vw, 3rem);
  border: 1px solid rgba(18, 33, 26, .08);
  border-radius: var(--radius);
  background: var(--white);
  scroll-margin-top: 1.5rem;
}

#theme-picato-native-alternative .pq-detail-head .pq-service-index {
  display: block;
  margin-bottom: 1.5rem;
}

#theme-picato-native-alternative .pq-detail-head .pq-fragment-kicker {
  color: var(--muted);
  letter-spacing: .1em;
}

#theme-picato-native-alternative .pq-detail-row h2 {
  max-width: 100%;
  hyphens: manual;
  font-size: clamp(1.75rem, 2.6vw, 2.5rem);
  text-wrap: balance;
}

#theme-picato-native-alternative .pq-detail-body p {
  margin: 0;
  max-width: 56ch;
  color: var(--ink);
  font-size: 1.0625rem;
  line-height: 1.65;
}

/* A detail row may lead to its own page (item linkLabel + linkHref). */
#theme-picato-native-alternative .pq-detail-more {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 2.75rem;
  margin-top: 1.5rem;
  color: var(--green);
  font-size: .8125rem;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
}

/* The draft marker: copy that is a proposal says so on the page. */
#theme-picato-native-alternative .pq-fragment-detail > .pq-open-note,
#theme-picato-native-alternative .pq-fragment-steps > .pq-open-note {
  width: min(100%, var(--max));
  margin: 0 auto 1.5rem;
}

#theme-picato-native-alternative .pq-open-note {
  padding: .85rem 1rem;
  border: 1px dashed rgba(184, 78, 18, .55);
  border-radius: var(--radius);
  background: rgba(254, 129, 73, .06);
  font-size: .9375rem !important;
}

#theme-picato-native-alternative .pq-open-note strong {
  color: var(--orange-ink);
}

#theme-picato-native-alternative .pq-fragment-steps {
  background: var(--paper);
  padding-top: clamp(2rem, 4vw, 3.5rem);
}

#theme-picato-native-alternative .pq-step-list {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  width: min(100%, var(--max));
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

#theme-picato-native-alternative .pq-step {
  padding: clamp(1.5rem, 2.6vw, 2.25rem);
  border: 1px solid rgba(18, 33, 26, .08);
  border-radius: var(--radius);
  background: var(--white);
}

#theme-picato-native-alternative .pq-step-index {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--green);
  color: var(--white);
  font-weight: 650;
}

#theme-picato-native-alternative .pq-step h3 {
  margin: 1.5rem 0 0;
  color: var(--green);
  font-family: "Picato Display", serif;
  font-size: clamp(1.35rem, 1.8vw, 1.7rem);
  font-weight: 400;
  line-height: 1.2;
}

#theme-picato-native-alternative .pq-step p {
  max-width: 40ch;
  margin: .85rem 0 0;
  color: var(--ink);
  line-height: 1.6;
}

#theme-picato-native-alternative .pq-step .pq-value-line {
  font-size: .9375rem;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-step-list {
    grid-template-columns: 1fr;
  }

  #theme-picato-native-alternative .pq-detail-row {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  #theme-picato-native-alternative .pq-detail-head .pq-service-index {
    margin-bottom: 1rem;
  }
}

/* ── src/45-airy-inner.css ── */
/* Inner pages that reuse the home's blocks (Über Picato). The prototype marks these with classes on
 * the section (`fragment-intro--plain`, `service-list--three`) and scopes them to `.quiet-page`. In
 * the CMS an editor would have to remember those classes, so here they follow from the page's shape:
 * an inner page is one that does not open with the carousel, a plain intro is an intro followed by
 * service cards, and a three-card list is one with exactly three cards. Declarations are the
 * prototype's, unchanged. */

/* Three stance cards: one line of three (the prototype's service-list--three). */
#theme-picato-native-alternative .pq-service-list:not(.pq-service-list--joined):has(> .pq-service:nth-child(3):last-child) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* An intro that introduces cards or steps sits flush on the paper, and cards follow it closely
 * (steps bring their own top spacing). */
#theme-picato-native-alternative .page-container:not(:has(> .dynamic-section > .pq-hero--carousel)) > .dynamic-section:has(> .pq-fragment-intro):has(+ .dynamic-section > :is(.pq-fragment-services, .pq-fragment-steps)) > .pq-fragment-intro {
  border-radius: 0;
  background: var(--paper);
  padding-bottom: 0;
}

#theme-picato-native-alternative .page-container:not(:has(> .dynamic-section > .pq-hero--carousel)) > .dynamic-section:has(> .pq-fragment-intro) + .dynamic-section > .pq-fragment-services {
  padding-top: clamp(2rem, 4vw, 3.5rem);
}

#theme-picato-native-alternative .page-container:not(:has(> .dynamic-section > .pq-hero--carousel)) .pq-practice-grid {
  margin-block: var(--section) 0;
  scroll-margin-top: 1.5rem;
}

/* Facts band and contact band are both green: a hairline keeps them two sections. */
#theme-picato-native-alternative .page-container:not(:has(> .dynamic-section > .pq-hero--carousel)) > .dynamic-section:has(> .pq-proof-band) + .dynamic-section > .pq-fragment-contact {
  background:
    linear-gradient(rgba(255, 255, 255, .14), rgba(255, 255, 255, .14)) top center / min(100% - 2 * var(--gutter), var(--max)) 1px no-repeat,
    var(--green-raised);
}

/* On a phone the prototype's phone spacing for intros comes later in its cascade and wins again. */
@media (max-width: 720px) {
  #theme-picato-native-alternative .page-container:not(:has(> .dynamic-section > .pq-hero--carousel)) > .dynamic-section:has(> .pq-fragment-intro):has(+ .dynamic-section > :is(.pq-fragment-services, .pq-fragment-steps)) > .pq-fragment-intro {
    padding-bottom: clamp(3rem, 8vw, 4.5rem);
  }
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-service-list:not(.pq-service-list--joined):has(> .pq-service:nth-child(3):last-child) {
    grid-template-columns: 1fr;
  }
}

/* ── src/50-airy-contact.css ── */
/* contact-channels: the channels are the page (Kontakt). Imported from the prototype's
 * `.quiet-page` rules, selectors rewritten only; the block is its own scope. The address variant
 * (dd.is-address) is not imported: the
 * postal address never goes into a contact block. */

#theme-picato-native-alternative .pq-fragment-channels {
  background: var(--paper);
}

#theme-picato-native-alternative .pq-contact-channels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: 1rem;
  width: min(100%, var(--max));
  margin: 0 auto;
}

#theme-picato-native-alternative .pq-contact-channel {
  margin: 0;
  padding: clamp(1.5rem, 2.6vw, 2.25rem);
  border: 1px solid rgba(18, 33, 26, .08);
  border-radius: var(--radius);
  background: var(--white);
}

#theme-picato-native-alternative .pq-contact-channel dt {
  color: var(--orange-ink);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .1em;
  text-transform: uppercase;
}

#theme-picato-native-alternative .pq-contact-channel dd {
  margin: 1.25rem 0 0;
  color: var(--green);
  font-family: "Picato Display", serif;
  font-size: clamp(1.35rem, 1.9vw, 1.75rem);
  line-height: 1.3;
}

#theme-picato-native-alternative .pq-contact-channel a {
  display: inline-block;
  padding-block: .35rem;
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(22, 50, 29, .22);
  transition: border-color 180ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-contact-channel a:hover {
  border-color: var(--orange);
}

#theme-picato-native-alternative .pq-fragment-channels h2 {
  width: min(100%, var(--max));
  max-width: none;
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(1.85rem, 2.8vw, 2.65rem);
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-contact-channels {
    grid-template-columns: 1fr;
  }
}

/* ── src/55-airy-legal.css ── */
/* legal-text: Impressum / Datenschutz as one calm reading column. Imported from the prototype's
 * `.quiet-page .legal` rules, selectors rewritten only; the block is its own scope. The prototype sets
 * the address in <address>; here it is a paragraph, which these rules style the same. */

#theme-picato-native-alternative .pq-fragment-legal {
  background: var(--paper);
}

#theme-picato-native-alternative .pq-legal {
  width: min(100%, 52rem);
  margin: 0 auto;
  padding: clamp(1.75rem, 4vw, 3.5rem);
  border: 1px solid rgba(18, 33, 26, .08);
  border-radius: var(--radius);
  background: var(--white);
}

#theme-picato-native-alternative .pq-legal-section + .pq-legal-section {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(18, 33, 26, .1);
}

#theme-picato-native-alternative .pq-legal h2 {
  max-width: none;
  font-size: 1.375rem;
  letter-spacing: -.01em;
  line-height: 1.25;
}

#theme-picato-native-alternative .pq-legal p,
#theme-picato-native-alternative .pq-legal li {
  max-width: 68ch;
  color: var(--ink);
  font-size: 1rem;
  font-style: normal;
  line-height: 1.65;
}

#theme-picato-native-alternative .pq-legal p,
#theme-picato-native-alternative .pq-legal ul {
  margin: .85rem 0 0;
}

#theme-picato-native-alternative .pq-legal ul {
  padding-left: 1.15rem;
}

#theme-picato-native-alternative .pq-legal a {
  color: var(--green);
  text-underline-offset: .2em;
}

#theme-picato-native-alternative .pq-legal-stand {
  margin-top: 2rem !important;
  color: var(--muted) !important;
  font-size: .9375rem !important;
}

#theme-picato-native-alternative .pq-legal > .pq-open-note {
  margin: 0 0 2rem;
}

/* ── src/60-airy-campaign.css ── */
/* The KMU campaign page: the campaign hero (page-hero, variant campaign), situation-list and
 * campaign-note. Imported from the prototype's `.quiet-page` campaign rules, selectors rewritten only.
 * Two differences, both from what a template can carry: the header is the package's layout slot,
 * not a child of the hero, so the prototype's `> .site-header { z-index }` has nothing to hold; and
 * the arc of the situation rows comes from the row's position here (it was an inline --arc there). */

#theme-picato-native-alternative .pq-page-hero--campaign {
  /* The scene follows the width but never more than half the window height, so the whole hero —
     claim, button and boat — fits the first screen on a laptop. */
  --scene-h: min(clamp(17rem, 36vw, 35rem), 48vh);
  --scene-h: min(clamp(17rem, 36vw, 35rem), 48svh);
  overflow: hidden;
  padding-top: max(6.5rem, min(clamp(7.5rem, 10vw, 9.5rem), 13vh));
  /* Almost the scene's height: only the air above the mast may reach into the text zone. */
  padding-bottom: calc(var(--scene-h) - 2.5rem);
}

#theme-picato-native-alternative .pq-page-hero--campaign > .pq-page-hero-inner {
  position: relative;
  z-index: 1;
}

#theme-picato-native-alternative .pq-page-hero--campaign .pq-campaign-scene {
  position: absolute;
  inset: auto 0 0 0;
  width: 100%;
  height: var(--scene-h);
  /* The drawing fills this box itself: waves stretch, the boat keeps its shape and is never cropped. */
  object-fit: fill;
  pointer-events: none;
}

#theme-picato-native-alternative .pq-campaign-question {
  max-width: 26ch;
  margin: 0 0 1.25rem;
  color: rgba(255, 255, 255, .88);
  font-size: clamp(1.25rem, 1.9vw, 1.75rem);
  line-height: 1.3;
}

#theme-picato-native-alternative .pq-page-hero--campaign h1 {
  max-width: 14ch;
  font-size: clamp(2.5rem, 5vw, 4.75rem);
}

#theme-picato-native-alternative .pq-campaign-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  margin-top: 2.25rem;
}

#theme-picato-native-alternative .pq-campaign-terms {
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* "Kommt Ihnen das bekannt vor?" — the rows keep the flyer's arc: indented towards both ends. */
#theme-picato-native-alternative .pq-fragment-situations {
  background: var(--paper);
}

#theme-picato-native-alternative .pq-situations-inner {
  width: min(100%, 62rem);
  margin: 0 auto;
}

#theme-picato-native-alternative .pq-fragment-situations h2 {
  max-width: none;
  margin: 0 0 clamp(2rem, 4vw, 3.5rem);
  text-align: center;
  font-size: clamp(2rem, 3.4vw, 3.25rem);
}

#theme-picato-native-alternative .pq-situation-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

#theme-picato-native-alternative .pq-situation {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  align-items: baseline;
  gap: .35rem clamp(1rem, 3vw, 3rem);
  margin-left: calc(var(--arc, 0) * 1.75rem);
  padding: 1.15rem 0;
  border-bottom: 1px solid rgba(18, 33, 26, .14);
}

/* The arc from the position: 3 · 2 · 1 from either end, 0 in the middle (seven rows = the flyer's). */
#theme-picato-native-alternative .pq-situation:is(:nth-child(3), :nth-last-child(3)) { --arc: 1; }
#theme-picato-native-alternative .pq-situation:is(:nth-child(2), :nth-last-child(2)) { --arc: 2; }
#theme-picato-native-alternative .pq-situation:is(:first-child, :last-child) { --arc: 3; }

#theme-picato-native-alternative .pq-situation p {
  margin: 0;
}

#theme-picato-native-alternative .pq-situation-when {
  color: var(--ink);
  font-size: 1.0625rem;
  line-height: 1.45;
}

#theme-picato-native-alternative .pq-situation-ask {
  color: var(--orange-ink);
  font-family: "Picato Display", serif;
  font-size: clamp(1.25rem, 1.7vw, 1.625rem);
  line-height: 1.25;
}

#theme-picato-native-alternative .pq-situation-closing {
  margin-top: clamp(2.5rem, 5vw, 4.5rem);
  padding: clamp(1.75rem, 3.6vw, 3.25rem);
  border-radius: var(--radius) var(--radius) 3.5rem var(--radius);
  background: var(--green);
  color: var(--white);
  text-align: center;
}

#theme-picato-native-alternative .pq-situation-closing h3 {
  max-width: 24ch;
  margin: 0 auto;
  color: var(--white);
  font-family: "Picato Display", serif;
  font-size: clamp(1.5rem, 2.4vw, 2.25rem);
  font-weight: 400;
  line-height: 1.15;
  text-wrap: balance;
}

#theme-picato-native-alternative .pq-situation-closing p {
  max-width: 52ch;
  margin: 1.1rem auto 0;
  color: rgba(255, 255, 255, .86);
  font-size: 1.0625rem;
  line-height: 1.6;
}

#theme-picato-native-alternative .pq-situation-closing p strong {
  color: var(--white);
  font-weight: 600;
}

#theme-picato-native-alternative .pq-fragment-note {
  background: var(--paper);
  padding-top: 0;
}

#theme-picato-native-alternative .pq-campaign-note {
  width: min(100%, 52rem);
  margin: 0 auto;
  padding-left: clamp(1rem, 2vw, 1.75rem);
  border-left: 2px solid var(--orange);
}

#theme-picato-native-alternative .pq-campaign-note p {
  margin: 0;
  color: var(--green);
  font-family: "Picato Display", serif;
  font-size: clamp(1.15rem, 1.5vw, 1.4rem);
  line-height: 1.5;
}

#theme-picato-native-alternative .pq-campaign-note p + p {
  margin-top: .85rem;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-situation {
    grid-template-columns: 1fr;
    margin-left: 0;
  }

  #theme-picato-native-alternative .pq-page-hero--campaign {
    --scene-h: 17rem;
    padding-bottom: 17.25rem;
  }
}

/* ── src/65-airy-references.css ── */
/* reference-list: client cards, three to a row. Imported from the prototype's `.quiet-page` reference
 * rules, selectors rewritten only; the block is its own scope. Not imported: the story row
 * (.reference--story with situation / work / quote, tags and facts) — the prototype shows none, and
 * it comes with a schema field when a client's story is cleared for publication. */

#theme-picato-native-alternative .pq-fragment-references {
  background: var(--paper);
}

#theme-picato-native-alternative .pq-fragment-references > .pq-open-note {
  width: min(100%, var(--max));
  margin: 0 auto 1.5rem;
}

#theme-picato-native-alternative .pq-reference-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  width: min(100%, var(--max));
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

#theme-picato-native-alternative .pq-reference {
  --pad: clamp(1.75rem, 2.6vw, 2.5rem);
  display: grid;
  grid-template-rows: auto auto auto auto 1fr auto;
  align-content: start;
  gap: .85rem;
  padding: clamp(1.75rem, 2.6vw, 2.5rem);
  overflow: hidden;
  border: 1px solid rgba(18, 33, 26, .08);
  border-radius: var(--radius);
  background: var(--white);
  transition:
    transform 320ms var(--quiet-ease),
    box-shadow 320ms var(--quiet-ease),
    border-color 320ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-reference:hover,
#theme-picato-native-alternative .pq-reference:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(18, 33, 26, .10);
  border-color: rgba(18, 33, 26, .16);
}

/* The card's stage: a plate edge to edge across the top, a soft light from the top left, a hairline
 * below. A logo is soft grey whatever the file's colours; on hover the card lifts, the logo comes up and
 * an orange hairline draws along the plate's foot. */
#theme-picato-native-alternative .pq-reference-logo {
  position: relative;
  display: grid;
  place-items: center;
  height: clamp(10.5rem, 13vw, 12.5rem);
  margin: calc(-1 * var(--pad)) calc(-1 * var(--pad)) 1.5rem;
  padding: 2.5rem;
  overflow: hidden;
  border-bottom: 1px solid rgba(18, 33, 26, .08);
  background: radial-gradient(130% 150% at 0% 0%, var(--white) 0%, var(--paper) 62%, #eceeea 100%);
}

#theme-picato-native-alternative .pq-reference-logo::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px 0;
  height: 2px;
  background: var(--orange);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 480ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-reference:hover .pq-reference-logo::after,
#theme-picato-native-alternative .pq-reference:focus-within .pq-reference-logo::after {
  transform: scaleX(1);
}

#theme-picato-native-alternative .pq-reference-logo img {
  /* A fixed box + contain: an SVG without its own size would otherwise grow past the plate. */
  display: block;
  width: min(10.5rem, 62%);
  height: 100%;
  min-height: 0;
  object-fit: contain;
  filter: grayscale(1);
  mix-blend-mode: multiply;
  opacity: .55;
  transition: opacity 320ms var(--quiet-ease), transform 480ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-reference:hover .pq-reference-logo img,
#theme-picato-native-alternative .pq-reference:focus-within .pq-reference-logo img {
  opacity: .9;
  transform: scale(1.03);
}

#theme-picato-native-alternative .pq-reference-about {
  max-width: 40ch;
  margin: .5rem 0 0;
  color: var(--ink);
  font-size: 1.0625rem;
  line-height: 1.6;
}

#theme-picato-native-alternative .pq-reference > .pq-reference-more {
  align-self: end;
  margin-top: .5rem;
}

#theme-picato-native-alternative .pq-reference-sector {
  margin: 0;
  color: var(--orange-ink);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .1em;
  text-transform: uppercase;
}

#theme-picato-native-alternative .pq-reference h2 {
  max-width: 18ch;
  margin: 0;
  font-size: clamp(1.6rem, 2.3vw, 2.25rem);
  line-height: 1.12;
  text-wrap: balance;
}

#theme-picato-native-alternative .pq-reference-client {
  margin: 0;
  color: var(--muted);
  font-size: .9875rem;
}

#theme-picato-native-alternative .pq-reference-more {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 2.75rem;
  justify-self: start;
  color: var(--green);
  font-family: "Picato Caps", sans-serif;
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}

#theme-picato-native-alternative .pq-reference-more span {
  display: inline-block;
  color: var(--muted);
  transition: transform 220ms var(--quiet-ease);
}

#theme-picato-native-alternative .pq-reference-more:hover span {
  transform: translateX(.3rem);
}

#theme-picato-native-alternative .pq-reference-more:focus-visible {
  outline: 2px solid var(--orange);
  outline-offset: 2px;
}

@media (max-width: 900px) {
  #theme-picato-native-alternative .pq-reference-list {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  #theme-picato-native-alternative .pq-reference,
  #theme-picato-native-alternative .pq-reference-logo::after,
  #theme-picato-native-alternative .pq-reference-logo img,
  #theme-picato-native-alternative .pq-reference-more span {
    transition: none;
  }

  #theme-picato-native-alternative .pq-reference:hover,
  #theme-picato-native-alternative .pq-reference:hover .pq-reference-logo img {
    transform: none;
  }
}

/* ── src/90-host-glue.css ── */
/*
 * Where the prototype's page and the OS page differ. The prototype's sections are direct children of
 * the page; in the OS each one sits in `section.dynamic-section` inside the layout's centred
 * `.container`. Airy sections are full-bleed, so the wrappers step out of the way.
 */
/*
 * The host reserves 3rem above and below the page for its own header:
 *     .basic-layout__content { flex: 1 1; padding: 3rem 0 }
 * and takes it back again for the theme that ships with the host:
 *     #theme-picato-native .basic-layout__content { padding: 0 }
 * That second rule names ONE id, and this package renders under
 * `#theme-picato-native-alternative`, so the 48px stayed. The hero is full-bleed and the site header
 * is absolutely positioned over it, so the gap shows as a strip of the host's body background
 * (#f8f9fa) across the top of every page, behind the menu. Same fix, this package's id.
 */
#theme-picato-native-alternative .basic-layout__content {
  padding: 0;
}
#theme-picato-native-alternative .basic-layout__content > .container {
  max-width: none;
  padding: 0;
}
#theme-picato-native-alternative .dynamic-section[data-rendered-by="template"] {
  margin: 0;
  padding: 0;
  max-width: none;
  background: none;
}
#theme-picato-native-alternative .dynamic-section[data-rendered-by="template"] * {
  box-sizing: border-box;
}
/*
 * The prototype sets these on html/body. A package never styles the document — it owns what is inside
 * its root — so the same base lives on the root. Without it body copy falls back to the browser's
 * serif: every rule that names a font names it for a heading or a label, and relies on this for text.
 */
#theme-picato-native-alternative {
  color: var(--ink);
  font-family: "Picato Body", sans-serif;
  -webkit-font-smoothing: antialiased;
}
:where(#theme-picato-native-alternative) button,
:where(#theme-picato-native-alternative) a {
  font: inherit;
}
/* The count's separator is the stylesheet's: without script the total is empty and nothing is shown. */
#theme-picato-native-alternative .pq-hero-count [data-carousel="total"]:not(:empty)::before {
  content: " / ";
}
/* A plate is a drawing of the step list: with a plate present the list is for assistive tech only. */
#theme-picato-native-alternative .pq-infographic-shell:has(.pq-infographic-figure) .pq-infographic-steps,
#theme-picato-native-alternative .pq-infographic-shell:has(.pq-infographic-figure) .pq-infographic-intro {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/*
 * The "aus einer Hand" chapter. In the prototype it is ONE section: a heading, then the three plates
 * in a stack. In the CMS it is four blocks — one home-intro and three home-infographic — so the
 * chapter is recognised by its shape (an intro directly followed by a plate; a plate directly
 * followed by a plate), never by a class an editor would have to remember to type.
 * The chapter is the home's (the page that opens with the carousel): on an inner page a plate is a
 * plate on its own, and these rules would override its phone spacing.
 * Measured against the prototype at 1440×900: 42 px above the heading, 54 px to the first plate,
 * 70 px between plates, plates 1310 px wide.
 */
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro {
  display: block;
  min-height: 0;
  padding-block: var(--section) 0;
  background: var(--paper);
}
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro .pq-fragment-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: end;
  width: min(100%, var(--max));
  max-width: none;
  margin-inline: auto;
}
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro .pq-fragment-kicker {
  letter-spacing: .1em;
  /* The prototype's kicker is a grid row of its own above the heading; here it shares the heading's
     cell, so the row gap becomes its margin. */
  margin: 0 0 calc(.35rem + clamp(1.5rem, 4vw, 3.5rem));
}
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro h2 {
  max-width: 16ch;
  margin: 0;
  font-size: clamp(2rem, 3.4vw, 3.25rem);
}
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro .pq-intro-copy {
  max-width: 36ch;
  margin: 0;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ink);
}
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(> .pq-fragment-intro) + .dynamic-section > .pq-fragment-infographic {
  padding-block: clamp(2.75rem, 5vw, 4.5rem) 0;
}
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(> .pq-fragment-infographic) + .dynamic-section > .pq-fragment-infographic {
  padding-block: clamp(1.15rem, 2.5vw, 1.75rem) 0;
}
/* The chapter closes with the section's own bottom space — below 1101 px; above, the next fold brings it. */
#theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(> .pq-fragment-infographic):not(:has(+ .dynamic-section > .pq-fragment-infographic)) > .pq-fragment-infographic {
  padding-bottom: var(--section);
}
@media (max-width: 900px) {
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro .pq-fragment-inner {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 1rem;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro .pq-fragment-kicker {
    margin-bottom: 1.35rem;
  }
}
@media (min-width: 1101px) {
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(+ .dynamic-section > .pq-fragment-infographic) > .pq-fragment-intro {
    padding-block: calc(var(--fold-pad) * .6) 0;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(> .pq-fragment-intro) + .dynamic-section > .pq-fragment-infographic {
    padding-block: clamp(2rem, 6svh, 4.5rem) 0;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(> .pq-fragment-infographic) + .dynamic-section > .pq-fragment-infographic {
    padding-block: var(--fold-pad) 0;
  }
  #theme-picato-native-alternative .page-container:has(> .dynamic-section > .pq-hero--carousel) > .dynamic-section:has(> .pq-fragment-infographic):not(:has(+ .dynamic-section > .pq-fragment-infographic)) > .pq-fragment-infographic {
    padding-bottom: 0;
  }
}