/* porvoosauna, page-specific blocks (owner: PAGES). Loaded after main.css, into
 * the same @layer components, so it only ADDS blocks and never restyles the
 * core. Every core class (.wrap .section .card .button .grid .split .accordion
 * .checkline .steps .form-*) is THEME-CORE's and is consumed, not redefined.
 *
 * rem everywhere (px only for hairlines), mobile first, grid children get
 * min-width: 0, breakpoints 479 / 767 / 991 to match main.css. Card grids go
 * multi-column at 992, not 767 (SPEC 4b: Finnish titles cramp).
 * Sizing lives on the .icon SPAN, never on the raw <svg>.
 */

@layer components {

  /* =====================================================================
     shared
     ===================================================================== */

  .breadcrumbs { margin-bottom: var(--ps-space-5); }

  /* An email address is never uppercased and never hyphenated mid-address. */
  a[href^="mailto:"] { text-transform: none; hyphens: none; overflow-wrap: anywhere; }

  .form__legend { margin-top: var(--ps-space-4); color: var(--ps-color-text); }
  .form__legend .req,
  .form-field__label .req,
  .form-check__label .req { color: var(--ps-color-accent); }
  .form__note { margin-top: var(--ps-space-4); color: var(--ps-color-text); text-wrap: pretty; }
  .form__note a,
  .form-check__label a { color: var(--ps-color-text-strong); text-decoration: underline; text-underline-offset: 0.15em; }
  .form__note a:hover,
  .form-check__label a:hover { color: var(--ps-color-accent); }

  /* consent row: the box keeps a 44px hit area without pushing the label down */
  .form-field--checkbox { margin-top: var(--ps-space-2); }
  .form-check { display: flex; align-items: start; gap: var(--ps-space-3); }
  .form-check__input { flex: none; margin-block-start: 0.15em; }
  .form-check__label { min-width: 0; font-size: var(--ps-fs-sm); line-height: var(--ps-lh-body); text-wrap: pretty; }

  /* a long Finnish label must wrap inside a button instead of overflowing */
  @media (max-width: 479px) {
    /* safety net owned by PAGES until THEME-CORE folds it into .button */
    .button { white-space: normal; max-width: 100%; text-align: center; }
  }

  /* =====================================================================
     /tilat: gallery
     ===================================================================== */

  .gallery {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--ps-gap);
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .gallery > * { min-width: 0; }

  .gallery__link {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: var(--ps-color-tint);
    border: var(--ps-border) solid var(--ps-color-border);
  }
  .gallery__image {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    transition: transform var(--ps-dur-slow) var(--ps-ease);
  }
  .gallery__link:is(:hover, :focus-visible) .gallery__image { transform: scale(1.05); }

  .gallery__zoom {
    position: absolute;
    inset-block-end: var(--ps-space-4);
    inset-inline-end: var(--ps-space-4);
    opacity: 0;
    transform: translateY(0.5rem);
    transition: opacity var(--ps-dur) var(--ps-ease), transform var(--ps-dur) var(--ps-ease);
    pointer-events: none;
  }
  .gallery__link:is(:hover, :focus-visible) .gallery__zoom { opacity: 1; transform: none; }
  @media (prefers-reduced-motion: reduce) {
    .gallery__image,
    .gallery__zoom { transition: none; }
    .gallery__zoom { opacity: 1; transform: none; }
  }

  .gallery__note {
    margin-top: var(--ps-space-5);
    color: var(--ps-color-text);
    text-wrap: pretty;
  }

  @media (min-width: 768px) {
    .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (min-width: 992px) {
    .gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    /* the lead photo takes two columns and two rows (mosaic) */
    .gallery__item--lead { grid-column: span 2; grid-row: span 2; }
    .gallery__item--lead .gallery__link { aspect-ratio: auto; block-size: 100%; min-block-size: 20rem; }
  }

  /* =====================================================================
     /tilat: room rows and varustelu
     ===================================================================== */

  .tila-list__rows {
    display: grid;
    gap: var(--ps-section-pad-tight);
  }
  .tila-list__rows > * { min-width: 0; }

  .tila-row__media { position: relative; background: var(--ps-color-tint); }
  .tila-row__placeholder {
    display: grid;
    place-items: center;
    block-size: 100%;
    color: var(--ps-color-accent);
  }
  .tila-row__placeholder .icon { inline-size: 3rem; block-size: 3rem; }

  .tila-row__num {
    font-family: var(--ps-font-head, var(--ps-font, serif));
    font-size: var(--ps-fs-h4);
    line-height: 1;
    color: var(--ps-color-accent);
  }
  .tila-row__title { margin-top: var(--ps-space-2); }
  .tila-row__text { color: var(--ps-color-text); text-wrap: pretty; }
  .tila-row__body > * + * { margin-top: var(--ps-space-3); }

  .varustelu__grid {
    display: grid;
    gap: var(--ps-gap-lg);
  }
  .varustelu__grid > * { min-width: 0; }
  .varustelu__head { margin-bottom: 0; }
  .varustelu__pohja { margin-top: var(--ps-space-7); }
  .varustelu__pohja-text { margin-top: var(--ps-space-3); color: var(--ps-color-text); text-wrap: pretty; }
  .varustelu__list { margin-bottom: var(--ps-space-7); }
  .varustelu__actions { margin-top: var(--ps-space-6); }

  @media (min-width: 992px) {
    .varustelu__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: start; }
  }

  /* =====================================================================
     /hinnasto: price tables
     ===================================================================== */

  .pricing-hero__nav {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ps-space-3);
    margin-top: var(--ps-space-6);
  }
  .pricing-hero__chip { text-decoration: none; transition: background-color var(--ps-dur), color var(--ps-dur); }
  .pricing-hero__chip:hover, .pricing-hero__chip:focus-visible { background: var(--ps-color-white); color: var(--ps-color-olive); }

  .pricing-groups > .wrap > * + * { margin-top: var(--ps-section-pad-tight); }
  .price-group__heading { scroll-margin-top: calc(var(--ps-nav-h) + var(--ps-space-6)); }
  .price-group { scroll-margin-top: calc(var(--ps-nav-h) + var(--ps-space-6)); }
  .price-group__note { margin-top: var(--ps-space-3); color: var(--ps-color-text); }

  /* The table scrolls inside its own box; the page body never scrolls sideways. */
  .price-table__scroll {
    margin-top: var(--ps-space-6);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }
  .price-table__scroll:focus-visible { outline: 2px solid var(--ps-color-accent); outline-offset: 3px; }

  .price-table {
    inline-size: 100%;
    min-inline-size: 34rem;
    border-collapse: collapse;
    text-align: start;
  }
  .price-table__th {
    padding: 0 0 var(--ps-space-3);
    border-block-end: var(--ps-border) solid var(--ps-color-accent);
    font-family: var(--ps-font-body, var(--ps-font, sans-serif));
    font-size: var(--ps-fs-xs);
    font-weight: var(--ps-fw-medium);
    letter-spacing: var(--ps-tracking-label, 0.12em);
    text-transform: uppercase;
    color: var(--ps-color-text-strong);
    text-align: start;
  }
  .price-table__th--price { inline-size: 8.5rem; }
  .price-table__th--note  { inline-size: 42%; }

  .price-table__row > * {
    padding-block: var(--ps-space-5);
    border-block-end: var(--ps-border) solid var(--ps-color-border);
    vertical-align: baseline;
  }
  .price-table__service {
    padding-inline-end: var(--ps-space-5);
    font-family: var(--ps-font-head, var(--ps-font, serif));
    font-size: var(--ps-fs-card-title, 1.5rem);
    font-weight: var(--ps-fw-regular);
    line-height: var(--ps-lh-heading);
    color: var(--ps-color-heading);
    text-align: start;
  }
  .price-table__price {
    padding-inline-end: var(--ps-space-5);
    font-size: var(--ps-fs-lg);
    color: var(--ps-color-text-strong);
  }
  .price-table__value { font-weight: var(--ps-fw-medium); }
  .price-table__note {
    font-size: var(--ps-fs-sm);
    color: var(--ps-color-text);
    text-wrap: pretty;
  }
  .price-table__row:last-child > * { border-block-end: 0; }

  .pricing-groups__note { margin-top: var(--ps-space-6); color: var(--ps-color-text); }

  .pricing-terms__grid {
    display: grid;
    gap: var(--ps-gap);
  }
  .pricing-terms__grid > * { min-width: 0; }
  .pricing-terms__icon { display: inline-flex; align-items: center; justify-content: center; inline-size: 1.75rem; block-size: 1.75rem; color: var(--ps-color-accent); }
  .pricing-terms__icon .icon { inline-size: 1.75rem; block-size: 1.75rem; }
  .pricing-terms__title { margin-top: var(--ps-space-4); }
  .pricing-terms__text { margin-top: var(--ps-space-3); color: var(--ps-color-text); text-wrap: pretty; }
  .pricing-terms__list,
  .pricing-terms__rules { margin-top: var(--ps-space-5); }
  .pricing-terms__rule { color: var(--ps-color-text); text-wrap: pretty; }

  @media (min-width: 992px) {
    .pricing-terms__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  .pricing-promise .actions { margin-top: var(--ps-space-6); }

  /* =====================================================================
     /varaus: steps, form, availability
     ===================================================================== */

  .booking-hero__actions { margin-top: var(--ps-space-6); }
  .booking-steps__list { margin-top: 0; }

  .booking__grid {
    display: grid;
    gap: var(--ps-gap-lg);
  }
  .booking__grid > * { min-width: 0; }

  .booking-form__head { margin-bottom: var(--ps-space-6); }
  .booking-form__text { margin-top: var(--ps-space-4); color: var(--ps-color-text); text-wrap: pretty; }

  .booking-aside {
    display: grid;
    gap: var(--ps-gap);
    align-content: start;
  }
  .booking-aside > * { min-width: 0; }

  .booking-hours__icon { display: inline-flex; align-items: center; justify-content: center; inline-size: 2rem; block-size: 2rem; color: currentColor; opacity: 0.85; }
  .booking-hours__icon .icon { inline-size: 2rem; block-size: 2rem; }
  .booking-hours__heading { margin-top: var(--ps-space-4); }
  .booking-hours__text { margin-top: var(--ps-space-4); text-wrap: pretty; }
  .booking-hours__note {
    margin-top: var(--ps-space-5);
    padding-top: var(--ps-space-4);
    border-top: var(--ps-border) solid var(--ps-color-border-on-dark);
    color: var(--ps-color-on-dark-muted, inherit);
    text-wrap: pretty;
  }

  .booking-promise__text { margin-top: var(--ps-space-4); color: var(--ps-color-text); text-wrap: pretty; }
  .booking-promise__list { margin-top: var(--ps-space-5); }
  .booking-promise__link { margin-top: var(--ps-space-5); }

  @media (min-width: 992px) {
    .booking__grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; }
  }

  /* =====================================================================
     /yhteystiedot
     ===================================================================== */

  .contact-form { display: grid; gap: var(--ps-space-6) var(--ps-gap-lg); align-items: start; }
  .contact-form > * { min-width: 0; }
  .contact-form__head { margin-bottom: 0; }
  @media (min-width: 992px) {
    .contact-form { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }
    .contact-form__head { position: sticky; top: calc(var(--ps-nav-h) + var(--ps-space-6)); }
  }
  .contact-form__text { margin-top: var(--ps-space-4); color: var(--ps-color-text); text-wrap: pretty; }

  .contact-info__grid {
    display: grid;
    gap: var(--ps-gap);
    align-items: start;
  }
  .contact-info__grid > * { min-width: 0; }

  .contact-card__nap { margin-top: var(--ps-space-5); font-style: normal; }
  .contact-card__row {
    display: flex;
    align-items: start;
    gap: var(--ps-space-3);
    padding-block: var(--ps-space-3);
    border-block-end: var(--ps-border) solid var(--ps-color-border);
  }
  .contact-card__row:last-child { border-block-end: 0; }
  .contact-card__row > span { min-width: 0; }
  .contact-card__icon { flex: none; margin-block-start: 0.15em; color: var(--ps-color-accent); }
  .contact-card__icon.icon { inline-size: 1.25rem; block-size: 1.25rem; }
  .contact-card__name { font-weight: var(--ps-fw-medium); color: var(--ps-color-text-strong); }
  .contact-card__link { color: var(--ps-color-text-strong); text-decoration: underline; text-underline-offset: 0.15em; }
  .contact-card__link:hover { color: var(--ps-color-accent); }
  .contact-card__subheading { margin-top: var(--ps-space-6); }
  .contact-card__hours { margin-top: var(--ps-space-4); }
  .contact-card__hours--single { color: var(--ps-color-text); }
  .contact-card__hours-row {
    display: flex;
    justify-content: space-between;
    gap: var(--ps-space-4);
    padding-block: var(--ps-space-2);
    border-block-end: var(--ps-border) solid var(--ps-color-border);
  }
  .contact-card__note { margin-top: var(--ps-space-4); color: var(--ps-color-text); }
  .contact-card__actions { margin-top: var(--ps-space-6); }
  .contact-card__legal {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ps-space-2) var(--ps-space-4);
    margin-top: var(--ps-space-5);
    padding-top: var(--ps-space-4);
    border-top: var(--ps-border) solid var(--ps-color-border);
    color: var(--ps-color-text);
  }

  /* click-to-load map: nothing is requested from Google before the click */
  .contact-map { block-size: 100%; }
  .contact-map__consent,
  .contact-map__placeholder {
    display: grid;
    place-content: center;
    justify-items: center;
    gap: var(--ps-space-3);
    min-block-size: 22rem;
    block-size: 100%;
    padding: var(--ps-card-pad);
    background: var(--ps-color-surface-alt);
    border: var(--ps-border) solid var(--ps-color-border);
    text-align: center;
  }
  .contact-map__icon { color: var(--ps-color-accent); }
  .contact-map__icon.icon { inline-size: 2rem; block-size: 2rem; }
  .contact-map__address { color: var(--ps-color-text-strong); }
  .contact-map__note { max-inline-size: 26rem; color: var(--ps-color-text); text-wrap: pretty; }
  .contact-map__actions { margin-top: var(--ps-space-3); }
  .contact-map__frame {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    min-block-size: 22rem;
    border: var(--ps-border) solid var(--ps-color-border);
  }

  .contact-directions {
    margin-top: var(--ps-block-gap);
    padding-top: var(--ps-space-7);
    border-top: var(--ps-border) solid var(--ps-color-border);
    max-inline-size: var(--ps-measure-lead, 58rem);
  }
  .contact-directions__text { margin-top: var(--ps-space-4); color: var(--ps-color-text); text-wrap: pretty; }

  @media (min-width: 992px) {
    .contact-info__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  }

  /* =====================================================================
     FAQ section (the .accordion inside is THEME-CORE's)
     ===================================================================== */

  .faq__grid {
    display: grid;
    gap: var(--ps-gap-lg);
    align-items: start;
  }
  .faq__grid > * { min-width: 0; }
  .faq__head { margin-bottom: 0; }
  .faq__q { margin: 0; font: inherit; }
  .faq__head-btn { inline-size: 100%; }
  .faq__a > * + * { margin-top: var(--ps-space-3); }

  @media (min-width: 992px) {
    .faq__grid { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); }
  }

  /* =====================================================================
     /blogi: cards, grid, pagination
     ===================================================================== */

  .post-grid { align-items: stretch; }

  .post-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--ps-color-surface-alt);
  }
  .post-card__image {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: var(--ps-color-tint);
  }
  .post-card__image img,
  .post-card__img {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    transition: transform var(--ps-dur-slow) var(--ps-ease);
  }
  .post-card:hover .post-card__img { transform: scale(1.05); }
  .post-card__placeholder { display: grid; place-items: center; block-size: 100%; color: var(--ps-color-accent); }
  .post-card__placeholder-icon.icon { inline-size: 2.5rem; block-size: 2.5rem; }

  .post-card__disc {
    position: absolute;
    inset-block-end: 0;
    inset-inline-end: 0;
    opacity: 0;
    transform: translate(0.5rem, 0.5rem);
    transition: opacity var(--ps-dur) var(--ps-ease), transform var(--ps-dur) var(--ps-ease);
    pointer-events: none;
  }
  .post-card:hover .post-card__disc,
  .post-card:focus-within .post-card__disc { opacity: 1; transform: none; }

  .post-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: var(--ps-space-3);
    padding: var(--ps-card-pad);
    border: var(--ps-border) solid var(--ps-color-border);
    border-block-start: 0;
  }
  .post-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--ps-space-3);
    font-size: var(--ps-fs-sm);
    color: var(--ps-color-text);
  }
  .post-card__num {
    font-family: var(--ps-font-head, var(--ps-font, serif));
    font-size: var(--ps-fs-h5);
    line-height: 1;
    color: var(--ps-color-accent);
  }
  .post-card__title { margin: 0; }
  .post-card__link { color: inherit; text-decoration: none; }
  /* the whole card is clickable, the link text stays the accessible name */
  .post-card__link::after { content: ""; position: absolute; inset: 0; }
  .post-card { position: relative; }
  .post-card__link:focus-visible { outline: none; }
  .post-card:focus-within { outline: 2px solid var(--ps-color-accent); outline-offset: 3px; }
  .post-card__text { color: var(--ps-color-text); text-wrap: pretty; }

  @media (prefers-reduced-motion: reduce) {
    .post-card__img,
    .post-card__disc { transition: none; }
    .post-card__disc { opacity: 1; transform: none; }
  }

  .pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--ps-space-4) var(--ps-space-6);
    margin-top: var(--ps-block-gap);
  }
  .pagination__status { color: var(--ps-color-text); order: -1; inline-size: 100%; text-align: center; }
  @media (min-width: 480px) {
    .pagination__status { order: 0; inline-size: auto; }
  }

  .blog-list__empty { color: var(--ps-color-text); }

  /* =====================================================================
     /blogi/<slug>: article
     ===================================================================== */

  .post-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ps-space-3) var(--ps-space-6);
    margin-top: var(--ps-space-4);
    padding-top: var(--ps-space-4);
    border-top: var(--ps-border) solid var(--ps-color-border-on-dark);
    color: var(--ps-color-on-dark-soft);
  }
  .post-hero__meta-item { display: inline-flex; align-items: center; gap: var(--ps-space-2); }
  .post-hero__meta-icon { color: var(--ps-color-on-dark-soft); }
  .post-hero__meta-icon.icon { inline-size: 1rem; block-size: 1rem; }

  .post-nav {
    display: grid;
    gap: var(--ps-gap);
    margin-top: var(--ps-block-gap);
    padding-top: var(--ps-space-7);
    border-top: var(--ps-border) solid var(--ps-color-border);
  }
  .post-nav > * { min-width: 0; }
  .post-nav__link {
    display: grid;
    gap: var(--ps-space-2);
    padding: var(--ps-space-5);
    border: var(--ps-border) solid var(--ps-color-border);
    color: inherit;
    text-decoration: none;
    transition: border-color var(--ps-dur) var(--ps-ease), background-color var(--ps-dur) var(--ps-ease);
  }
  .post-nav__link:hover { border-color: var(--ps-color-accent); background: var(--ps-color-tint); }
  .post-nav__label {
    display: inline-flex;
    align-items: center;
    gap: var(--ps-space-2);
    font-size: var(--ps-fs-xs);
    letter-spacing: var(--ps-tracking-label, 0.12em);
    text-transform: uppercase;
    color: var(--ps-color-accent);
  }
  .post-nav__icon.icon { inline-size: 1rem; block-size: 1rem; }
  .post-nav__title {
    font-family: var(--ps-font-head, var(--ps-font, serif));
    font-size: var(--ps-fs-h5);
    line-height: var(--ps-lh-heading);
    color: var(--ps-color-heading);
    text-wrap: pretty;
  }
  .post-nav__link--next { text-align: end; }
  .post-nav__link--next .post-nav__label { justify-content: end; }
  .post-back { margin-top: var(--ps-space-7); }

  @media (min-width: 768px) {
    .post-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    /* a lone "next" card stays in the right column */
    .post-nav__link--next:only-child { grid-column: 2; }
  }

  /* =====================================================================
     prose: markdown body for /tietosuoja and every blog post
     ===================================================================== */

  .prose {
    color: var(--ps-color-text);
    font-size: var(--ps-fs-body);
    line-height: var(--ps-lh-body);
    text-wrap: pretty;
  }
  .prose > * + * { margin-top: var(--ps-space-5); }
  .prose :is(h2, h3, h4) {
    color: var(--ps-color-heading);
    text-wrap: balance;
  }
  .prose > :is(h2, h3, h4) { margin-top: var(--ps-space-9); }
  .prose > :first-child { margin-top: 0; }
  .prose h2 { font-size: var(--ps-fs-h3); }
  .prose h3 { font-size: var(--ps-fs-h4); }
  .prose h4 { font-size: var(--ps-fs-h5); }
  .prose :is(ul, ol) { padding-inline-start: 1.25rem; }
  .prose :is(ul, ol) > li + li { margin-top: var(--ps-space-2); }
  .prose li::marker { color: var(--ps-color-accent); }
  .prose a { color: var(--ps-color-text-strong); text-decoration: underline; text-underline-offset: 0.15em; }
  .prose a:hover { color: var(--ps-color-accent); }
  .prose strong { font-weight: var(--ps-fw-medium); color: var(--ps-color-text-strong); }
  .prose img {
    display: block;
    inline-size: 100%;
    block-size: auto;
    border: var(--ps-border) solid var(--ps-color-border);
  }
  .prose blockquote {
    margin: 0;
    padding-inline-start: var(--ps-space-6);
    border-inline-start: 2px solid var(--ps-color-accent);
    font-family: var(--ps-font-head, var(--ps-font, serif));
    font-size: var(--ps-fs-card-title, 1.5rem);
    line-height: var(--ps-lh-heading);
    color: var(--ps-color-heading);
  }
  .prose hr {
    block-size: 0;
    margin-block: var(--ps-space-8);
    border: 0;
    border-top: var(--ps-border) solid var(--ps-color-border);
  }
  .prose table { inline-size: 100%; border-collapse: collapse; }
  .prose :is(th, td) {
    padding: var(--ps-space-3) var(--ps-space-4);
    border-block-end: var(--ps-border) solid var(--ps-color-border);
    text-align: start;
  }
  /* a long URL or e-mail in prose breaks instead of widening the page */
  .prose :is(a, code) { overflow-wrap: anywhere; }

  .post-body { max-inline-size: var(--ps-container-narrow, 50rem); }

  /* tietosuoja: the rekisterinpitäjä table above the body */
  .prose-controller {
    display: grid;
    gap: 0;
    margin-bottom: var(--ps-space-8);
    border: var(--ps-border) solid var(--ps-color-border);
  }
  .prose-controller__row {
    display: grid;
    gap: var(--ps-space-1);
    padding: var(--ps-space-4) var(--ps-space-5);
    border-block-end: var(--ps-border) solid var(--ps-color-border);
  }
  .prose-controller__row:last-child { border-block-end: 0; }
  .prose-controller dt {
    font-size: var(--ps-fs-xs);
    letter-spacing: var(--ps-tracking-label, 0.12em);
    text-transform: uppercase;
    color: var(--ps-color-accent);
  }
  .prose-controller dd { margin: 0; color: var(--ps-color-text-strong); }
  .prose-controller a { color: inherit; text-decoration: underline; text-underline-offset: 0.15em; }

  @media (min-width: 768px) {
    .prose-controller__row { grid-template-columns: 12rem minmax(0, 1fr); gap: var(--ps-space-5); align-items: baseline; }
  }

  .page-hero__updated { margin-top: var(--ps-space-3); color: var(--ps-color-on-dark-soft); }
}