/* Contenido editorial: las mismas plantillas para ES, EN y FR. */
.contact-fields { margin: 0; padding: 0; border: 0; min-width: 0; }
/* Deshabilitado mientras no haya SMTP: se atenúan los campos, no la información legal. */
.contact-fields:disabled > :not(.contact-privacy-summary) { opacity: .7; }
.contact-fields .button { margin-top: 10px; }
/* La foto ya trae las esquinas redondeadas (transparencia), como en ydins.es. */
.contact-details .contact-installations { display: block; width: 100%; height: auto; max-width: 480px; }
.contact-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.editorial-page { width: min(1280px, max(64%, min(86%, 800px))); max-width: none; padding-bottom: 60px; }
.editorial-page-composed { width: 100%; padding-bottom: 60px; }
.home-intro-spacer { display: flex; align-items: center; padding-right: 0; }
.home-intro-spacer img { width: 100%; height: auto; }
/* Cinco familias, con introducción independiente y orden de lectura estable. */
.product-directory { width: 100%; padding-bottom: 0; }
.product-directory > .editorial-heading { text-align: center; }
.directory-intro { width: calc(64% - 30px); margin-left: 18%; text-align: center; }
.directory-intro .editorial-copy { font-size: 18px; line-height: 1.4285714286; margin-bottom: 40px; }
.directory-intro p { margin: 0 0 11px; }
.directory-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; width: calc(100% - 60px); margin: 0 auto 40px; }
.directory-band { scroll-margin-top: 120px; background: #f2f2f2; }
.directory-band .editorial-section { margin: 0; }
.directory-feature { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; text-align: left; }
.directory-feature > div:last-child { padding: clamp(28px, 4vw, 76px); }
.directory-feature h2 { margin-top: 0; }
/* Fase 5: los títulos de familia son h2 (antes h3, que saltaba del h1). Mismo aspecto que el h3:
   se fijan también peso e interlineado, que «.editorial-copy h2» cambiaría. */
.product-directory .directory-feature h2 { margin: 0 0 12px; font-size: 1.6rem; font-weight: 600; line-height: 1.1; }
.directory-feature p:last-child { margin-bottom: 0; }
.directory-feature > div:first-child { position: relative; min-height: 300px; }
.directory-feature > div:first-child a { display: block; position: absolute; inset: 0; }
.directory-feature > div:first-child img { display: block; width: 100%; height: 100%; max-height: none; object-fit: cover; }
.directory-feature > div:first-child p { margin: 0; }
.directory-band:nth-of-type(even) .directory-feature > div:first-child { order: 2; }
.product-banner { width: 100%; height: clamp(270px, 26.041667vw, 625px); object-fit: cover; }
.editorial-page > .editorial-heading, .product-directory > .editorial-heading {
    position: relative;
    left: 50%;
    width: min(var(--shell), calc(100vw - var(--shell-gutter) * 2));
    transform: translateX(-50%);
    text-align: center;
    text-transform: uppercase;
}
.editorial-page > .editorial-heading h1 { font-size: var(--font-size-interior-title); }
.editorial-heading { padding: 38px 0 28px; }
.editorial-page-composed > .editorial-heading { padding-bottom: 5px; }
.editorial-heading h1 { font-size: var(--font-size-interior-title); line-height: 1.12; margin-bottom: 20px; }
.product-directory > .editorial-heading { width: calc(100% - 30px); padding: 20px 0 22px; }
.product-directory > .editorial-heading h1 { margin: 0; padding: 10px 0; font-size: 41px; line-height: 1.1; }
.product-directory > .editorial-heading h1::after { height: 7px; margin: 0 auto; border-bottom: 2px solid var(--blue-900); background: transparent; }
@media (max-width: 767px) {
    .directory-intro { width: calc(100% - 30px); margin-inline: 15px; }
    .directory-links { width: calc(100% - 30px); padding-right: 0; }
}
/* Cierre común de fichas y artículos (ClosingCta.razor, 29-09-2026). En las fichas con composiciones va
   antes de la franja del catálogo PDF y con el ancho del contenido. */
.closing-cta { padding: 16px 0 56px; text-align: center; }
.closing-cta p { margin: 0 0 18px; color: var(--blue-900); font-size: 1.25rem; font-weight: 600; line-height: 1.3; }
.editorial-compositions > .closing-cta { width: min(1280px, max(64vw, min(86vw, 800px))); margin-inline: auto; padding-top: 40px; }
/* En el artículo, alineado con el texto, como el botón al que sustituye. */
.blog-article .closing-cta { padding: 8px 0 0; text-align: left; }
/* «Productos relacionados» al final de los artículos (RelatedProducts.razor, 29-09-2026). */
.related-products { margin: 8px 0 36px; }
.related-products h2 { margin: 0 0 16px; font-size: 1.5rem; }
.related-products ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.related-products a { display: flex; align-items: center; gap: 16px; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-media); background: var(--white); box-shadow: var(--shadow); color: var(--blue-900); font-size: 1.125rem; font-weight: 700; line-height: 1.25; text-decoration: none; }
.related-products a:hover, .related-products a:focus-visible { border-color: var(--blue-800); text-decoration: underline; }
.related-products img { flex: 0 0 96px; width: 96px; height: 72px; object-fit: cover; border-radius: var(--radius-control); }
/* «Artículos relacionados» al final de las fichas (RelatedArticles.razor, 02-10-2026): tarjetas del blog sin resumen,
   con el ancho de las composiciones y, en ellas, aire bajo la franja del catálogo PDF. El h3 copia el h2 de las tarjetas del blog. */
.related-articles { padding-top: 8px; }
.editorial-page-composed > .related-articles { width: min(1280px, max(64vw, min(86vw, 800px))); margin-inline: auto; padding-top: clamp(36px, 4vw, 56px); }
.related-articles > h2 { margin: 0 0 20px; font-size: 1.5rem; }
.related-articles .blog-card h3 { margin: 12px 0 16px; font-size: var(--font-size-card-title); line-height: 1.2; }
.related-articles .blog-card h3 a { text-decoration: none; }
.related-articles .blog-card h3 a:hover { text-decoration: underline; }
.editorial-sections { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 32px; }
.editorial-section { grid-column: 1 / -1; min-width: 0; margin-bottom: 36px; }
.editorial-composition { width: 100%; }
.editorial-composition-frame {
    width: min(1280px, max(64vw, min(86vw, 800px)));
    margin-inline: auto;
}
.editorial-composition-frame-edge-right .editorial-composition-frame { width: calc(50% + min(640px, max(32vw, min(43vw, 400px)))); margin-left: calc(50% - min(640px, max(32vw, min(43vw, 400px)))); margin-right: 0; }
.editorial-composition .editorial-sections { align-items: center; }
.editorial-composition .editorial-section { margin-bottom: 0; }
.editorial-composition-layout-split .editorial-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
/* Títulos, fotos y párrafos comparten filas, también con traducciones largas. */
.editorial-composition-layout-triptych .editorial-sections { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto auto; column-gap: 32px; row-gap: 16px; align-items: stretch; }
.editorial-composition-layout-split .editorial-section,
.editorial-composition-layout-triptych .editorial-section { grid-column: auto; }
.editorial-composition-layout-split .editorial-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.editorial-composition-layout-split .editorial-gallery:has(figure:only-child) { grid-template-columns: 1fr; }
.editorial-composition-layout-centered { text-align: center; }
.editorial-composition-layout-centered .button { margin-inline: auto; }
.editorial-composition-layout-triptych .editorial-copy,
.editorial-composition-layout-triptych .editorial-copy > div { display: grid; grid-row: span 3; grid-template-rows: subgrid; }
.editorial-composition-layout-triptych .editorial-copy h3 { margin: 0; align-self: end; }
.editorial-composition-layout-triptych .editorial-copy :is(p,img) { margin: 0; }
.editorial-composition-layout-triptych .editorial-copy img { display: block; width: 100%; max-height: none; aspect-ratio: 3 / 2; object-fit: cover; }
.editorial-composition-surface-muted { min-height: 220px; background: #eaeaea; }
.editorial-composition-surface-muted .editorial-sections { align-items: stretch; }
.editorial-composition-surface-muted .editorial-section { display: grid; align-content: center; }
.editorial-composition-surface-muted .editorial-copy { text-align: right; }
.editorial-composition-surface-muted .editorial-gallery { grid-template-columns: 1fr; justify-items: center; }
.editorial-composition-surface-muted .editorial-gallery img { max-height: 220px; }
[data-composition-key="quickcleats"] h2 a::after { display: inline-block; margin-left: 10px; content: "→"; text-decoration: none; }
[data-composition-key="galeria-fda"] .editorial-gallery img { aspect-ratio: auto; display: block; }
[data-composition-key="puntos-clave"] .editorial-sections { align-items: start; }
[data-composition-key="puntos-clave"] .editorial-copy li > :is(strong, span):first-child { font-weight: 700; text-transform: uppercase; }
[data-composition-key="puntos-clave"] .editorial-copy li > :is(strong, span):first-child::after { content: " "; }
.editorial-composition-before-none { padding-top: 0; }
.editorial-composition-before-xs { padding-top: 10px; }
.editorial-composition-before-sm { padding-top: 20px; }
.editorial-composition-before-md { padding-top: 32px; }
.editorial-composition-before-lg { padding-top: 40px; }
.editorial-composition-before-xl { padding-top: 56px; }
.editorial-composition-after-none { padding-bottom: 0; }
.editorial-composition-after-xs { padding-bottom: 10px; }
.editorial-composition-after-sm { padding-bottom: 20px; }
.editorial-composition-after-md { padding-bottom: 32px; }
.editorial-composition-after-lg { padding-bottom: 40px; }
.editorial-composition-after-xl { padding-bottom: 56px; }
.editorial-copy { font-size: 1.08rem; line-height: 1.48; overflow-wrap: anywhere; }
.editorial-copy h2 { margin: 32px 0 20px; font-size: var(--font-size-section-title); line-height: 1.2; }
/* Como la original: h3 a 28 px / 600; los h4 de la original (degradados a h3 por jerarquía) a 20 px. */
.editorial-copy h3 { margin: 22px 0 11px; font-size: 28px; font-weight: 600; line-height: 1.1; }
.editorial-copy h3.subtitulo { margin: 11px 0; font-size: 20px; font-weight: 400; line-height: 1.1; }
.editorial-copy h2 a:not(.button) { color: inherit; text-decoration: none; }
.editorial-copy h2 a:not(.button):is(:hover, :focus-visible) { text-decoration: underline; }
.editorial-composition-layout-triptych .editorial-copy { text-align: center; }
/* Viñeta de la original (chevrón en círculo) en fichas y artículos; los legales conservan la suya.
   Medidas de ydins.es: texto 18 px, interlineado 1,2 en listas y 15 px entre elementos. */
:where(.editorial-page, .blog-article) .editorial-copy { font-size: 18px; line-height: 1.4286; }
:where(.editorial-page, .blog-article) .editorial-copy p { margin: 0 0 11px; }
:where(.editorial-page, .blog-article) .editorial-copy h2 { margin: 22px 0 11px; line-height: 1.1; }
.editorial-page .editorial-copy h2:first-child { margin-top: 0; }
.editorial-copy li { margin-block: 6px; }
:where(.editorial-page, .blog-article) .editorial-copy ul { display: block; margin: 0 0 11px; padding: 0; list-style: none; }
:where(.editorial-page, .blog-article) .editorial-copy li { position: relative; margin: 0 0 15px; padding-left: 32px; line-height: 1.2; }
:where(.editorial-page, .blog-article) .editorial-copy li p { line-height: 1.2; }
:where(.editorial-page, .blog-article) .editorial-copy li::before {
    content: "›";
    position: absolute;
    left: 0;
    top: .05em;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    color: var(--white);
    background: var(--blue-900);
    font-weight: 700;
    line-height: 1;
}
/* Las listas de puntos clave conservan su densidad y tamaño de marcador. */
.editorial-composition-layout-feature-list li::before,
[data-composition-key="puntos-clave"] .editorial-copy li::before { font-size: 1.1rem; }
.editorial-composition-layout-feature-list li > h3:first-child,
[data-composition-key="puntos-clave"] .editorial-copy li > h3:first-child { margin-top: 0; }
.editorial-copy img { display: inline-block; max-width: 100%; width: auto; height: auto; max-height: 520px; object-fit: contain; vertical-align: middle; }
.editorial-copy a:not(.button) { color: var(--blue-800); text-underline-offset: 3px; }
/* Tablas técnicas de las fichas (29-09-2026): cabecera azul y filas alternas. En móvil caben sin
   desplazamiento horizontal: menos relleno y guiones por sílaba (hyphens usa el lang de la página). */
.editorial-copy table { width: 100%; margin: 6px 0 24px; border-collapse: collapse; font-size: 16px; line-height: 1.35; }
.editorial-copy th, .editorial-copy td { padding: 10px 14px; border: 1px solid var(--line); text-align: left; vertical-align: top; overflow-wrap: break-word; hyphens: auto; }
.editorial-copy thead th { color: var(--white); background: var(--blue-900); }
/* Los encabezados no se parten con guion: la primera columna toma el ancho de su palabra más larga. */
.editorial-copy th { hyphens: manual; }
.editorial-copy tbody th { color: var(--blue-900); }
.editorial-copy tbody tr:nth-child(even) { background: var(--surface); }
.editorial-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.editorial-gallery figure, .editorial-carousel figure { margin: 0; min-width: 0; }
.editorial-gallery img, .editorial-carousel img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: contain; background: var(--white); }
.editorial-gallery a, .editorial-carousel a { display: block; border: 1px solid var(--line); border-radius: var(--radius-media); overflow: hidden; }
.editorial-gallery a:hover, .editorial-carousel a:hover { border-color: var(--blue-800); }
.editorial-gallery figcaption, .editorial-carousel figcaption { padding: 12px 4px; text-align: center; color: var(--blue-900); font-weight: 600; }
.editorial-gallery figcaption small { display: block; color: var(--ink); font-size: .9em; font-weight: 400; }
.editorial-carousel figure { scroll-snap-align: start; }
.gallery-controls { display: flex; justify-content: flex-end; gap: 10px; margin: 0 0 4px; }
/* Galerías de una sola imagen visible (sistemas de unión; 01-10-2026, corrección de los compañeros): como en
   ydins.es, las flechas van dentro de la foto, a los lados y discretas, no encima de ella. Conservan la caja de
   44 px; el fondo azul al 65 % deja la flecha blanca a 4,2:1 incluso sobre blanco, y al pasar el ratón o con
   foco se vuelve opaco. */
.editorial-carousel--single { position: relative; }
.editorial-carousel--single .gallery-controls { position: absolute; inset: 0; z-index: 2; justify-content: space-between; align-items: center; margin: 0; padding: 0 10px; pointer-events: none; }
.editorial-carousel--single .gallery-controls button { pointer-events: auto; background: rgb(32 55 97 / 65%); }
.editorial-carousel--single .gallery-controls button:not([aria-disabled="true"]):hover,
.editorial-carousel--single .gallery-controls button:focus-visible { background: var(--blue-900); }
.blog-index { width: min(1280px, 86%); padding: 8px 0 68px; }
.blog-card > a { display: block; }
.blog-card img { width: 100%; height: auto; aspect-ratio: 1.45; object-fit: cover; }
/* «Leer artículo» siempre al pie de la tarjeta, aunque los resúmenes midan distinto. */
.blog-card { display: flex; flex-direction: column; }
.blog-card > div { display: flex; flex: 1; flex-direction: column; padding: 20px 22px 24px; }
.blog-card .read-more { align-self: flex-start; margin-top: auto; }
.blog-card h2 { margin: 12px 0 16px; font-size: var(--font-size-card-title); line-height: 1.2; }
.blog-card p { color: var(--muted); }
.blog-card h2 a { text-decoration: none; }
.blog-card h2 a:hover { text-decoration: underline; }
.blog-card time, .editorial-heading time { display: block; color: var(--muted); margin-bottom: 16px; font-size: .9rem; }
.read-more { display: inline-flex; min-height: 44px; align-items: center; color: var(--blue-900); font-weight: 700; padding-block: 8px; }
.pagination { display: flex; justify-content: center; gap: 12px; margin-top: 40px; }
.pagination a { display: grid; place-items: center; min-width: 44px; min-height: 44px; border: 1px solid var(--line); border-radius: var(--radius-control); text-decoration: none; }
.pagination a[aria-current] { background: var(--blue-900); color: var(--white); }
/* Artículo: «Últimas noticias» a la izquierda (309 px) y el texto a la derecha.
   El texto no pasa de 760 px, como en lindis.com nueva (piero), y el conjunto se centra (01-10-2026): antes
   se estiraba con la pantalla (866 px a 1440 y 1279 a 1920, más de 150 caracteres por línea).
   En el HTML el artículo va primero, para lectores de pantalla y para móvil. */
.blog-layout { display: grid; grid-template-columns: 309px minmax(0, 760px); justify-content: center; column-gap: 63px; padding-bottom: 65px; }
.blog-article { grid-column: 2; grid-row: 1; min-width: 0; }
.blog-article > .editorial-heading { padding-bottom: 0; }
.blog-article > .editorial-heading h1 { margin-bottom: 31px; text-transform: uppercase; }
.blog-article > .editorial-heading time { margin-bottom: 18px; color: var(--blue-900); font-size: 16px; }
.article-cover { display: block; width: 50%; height: auto; margin-bottom: 30px; }
/* Galerías de artículo como en ydins.es: cada foto conserva su proporción y el ancho
   que le daba la original (style="width:NN%", aquí clase img-w-NN por la CSP). */
.editorial-copy .article-gallery { display: flex; align-items: flex-start; gap: 8px; margin-block: 4px; }
.editorial-copy img[class*="img-w-"] { flex: 0 1 auto; max-height: none; object-fit: fill; }
.editorial-copy .img-w-18 { width: 18%; }
.editorial-copy .img-w-27 { width: 27%; }
.editorial-copy .img-w-30 { width: 30%; }
.editorial-copy .img-w-40 { width: 40%; }
.editorial-copy .img-w-50 { width: 50%; }
.editorial-copy .img-w-60 { width: 60%; }
.editorial-copy .img-w-75 { width: 75%; }
.editorial-copy .img-w-100 { width: 100%; }
.blog-sidebar { grid-column: 1; grid-row: 1; padding-top: 88px; }
.blog-sidebar h2 { margin: 0 0 30px; color: var(--blue-900); font-size: 20px; line-height: 1.1; text-transform: uppercase; }
.blog-sidebar ul { margin: 0; padding: 0; list-style: none; }
.blog-sidebar li { margin-bottom: 20px; padding-bottom: 16px; border-bottom: 2px dotted #999; }
.blog-sidebar li a { display: block; color: var(--muted); font-size: 18px; font-weight: 600; line-height: 1; text-decoration: none; }
.blog-sidebar li a:is(:hover, :focus-visible), .blog-sidebar li a[aria-current] { color: var(--blue-900); }
.blog-sidebar li a:hover span { text-decoration: underline; }
.blog-sidebar time { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; font-weight: 400; text-align: right; }
.blog-sidebar .button { margin-top: 10px; }
/* Pie del artículo: compartir a la izquierda, anterior/siguiente a la derecha, como la original. */
.article-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 45px; }
.article-share { display: flex; flex-wrap: wrap; gap: 14px; }
.article-share-link { display: grid; place-items: center; width: 42px; height: 42px; color: var(--muted); border: 2px solid currentColor; border-radius: 12px; font-size: 20px; transition: color var(--motion-fast) ease, background-color var(--motion-fast) ease; }
.article-share-link:is(:hover, :focus-visible) { color: var(--white); border-color: var(--blue-900); background: var(--blue-900); }
.article-navigation { display: flex; gap: 10px; margin-left: auto; }
.article-navigation-link { display: grid; place-items: center; width: 48px; height: 48px; color: var(--white); border-radius: 10px; background: var(--blue-900); font-size: 20px; transition: background-color var(--motion-fast) ease; }
.article-navigation-link:is(:hover, :focus-visible) { background: var(--ink-strong); }
.lightbox-open,
.lightbox-open body { overflow: hidden; }
.lightbox {
    position: fixed;
    inset: 0;
    width: 100vw;
    max-width: none;
    height: 100dvh;
    max-height: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    color: var(--white);
    background: #000;
}
.lightbox::backdrop { background: #000; }
.lightbox-stage { position: absolute; inset: 0; display: grid; place-items: center; touch-action: pan-y pinch-zoom; }
.lightbox-image { display: block; width: auto; max-width: calc(100vw - 200px); height: auto; max-height: 100dvh; object-fit: contain; user-select: none; }
.lightbox-title { position: absolute; z-index: 3; top: 15px; left: 15px; margin: 0; color: rgb(255 255 255 / 80%); font-size: 1.25rem; font-weight: 600; line-height: 1.3; }
.lightbox-control {
    position: absolute;
    z-index: 4;
    display: grid;
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 8px;
    place-items: center;
    border: 2px solid rgb(255 255 255 / 56%);
    border-radius: 50%;
    color: rgb(255 255 255 / 72%);
    background: rgb(0 0 0 / 28%);
    cursor: pointer;
    transition: color var(--motion-fast) ease, border-color var(--motion-fast) ease, background-color var(--motion-fast) ease;
}
.lightbox-control:hover,
.lightbox-control:focus-visible { color: var(--white); border-color: var(--white); background: rgb(32 55 97 / 72%); }
.lightbox-control svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.7; }
.lightbox-previous,
.lightbox-next { top: 50%; transform: translateY(-50%); }
.lightbox-previous { left: 9px; }
.lightbox-next { right: 9px; }
.lightbox-close { top: 9px; right: 9px; border: 0; background: transparent; }
.lightbox-play { right: 9px; bottom: 9px; border: 0; background: transparent; }
.lightbox-play[aria-pressed="true"] { color: var(--white); }
.lightbox-play svg { fill: currentColor; stroke: none; }
.lightbox-indicators { position: absolute; z-index: 4; bottom: 13px; left: 50%; display: flex; width: max-content; max-width: calc(100vw - 150px); flex-wrap: wrap; justify-content: center; gap: 6px; transform: translateX(-50%); }
.lightbox-indicator { width: 12px; min-width: 12px; height: 12px; min-height: 12px; padding: 0; border: 1px solid transparent; border-radius: 50%; background: rgb(255 255 255 / 28%); cursor: pointer; }
.lightbox-indicator:hover,
.lightbox-indicator:focus-visible { background: rgb(255 255 255 / 70%); }
.lightbox-indicator[aria-current="true"] { border-color: var(--white); background: var(--blue-900); box-shadow: 0 0 0 1px rgb(0 0 0 / 45%); }
@media (max-width: 900px) {

    .home-intro-spacer { display: none; }
    .blog-layout { grid-template-columns: minmax(0, 1fr); }
    .blog-article, .blog-sidebar { grid-column: 1; grid-row: auto; }
    .blog-sidebar { margin-top: 40px; border-top: 1px solid var(--line); padding-top: 24px; }
    .editorial-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .product-banner { height: clamp(200px, 25svh, 280px); }
    .article-cover { width: 100%; }
    .directory-feature { grid-template-columns: minmax(0,1fr); gap: 0; }
    .directory-band:nth-of-type(even) .directory-feature > div:first-child { order: 0; }
    .directory-feature > div:last-child { padding: 28px 7%; }
    .directory-feature > div:first-child { min-height: 0; }
    .directory-feature > div:first-child a { position: static; }
    .directory-feature > div:first-child img { height: auto; }
    .editorial-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .editorial-sections { grid-template-columns: 1fr; column-gap: 0; }
    .editorial-composition-layout-split .editorial-sections { grid-template-columns: 1fr; gap: 24px; }
    .editorial-composition-layout-triptych .editorial-sections { grid-template-columns: 1fr; grid-template-rows: none; column-gap: 24px; row-gap: 16px; }
    .editorial-composition-layout-triptych .editorial-copy, .editorial-composition-layout-triptych .editorial-copy > div { display: block; grid-row: auto; }
    .editorial-composition-layout-triptych .editorial-copy h3, .editorial-composition-layout-triptych .editorial-copy p:has(img) { margin-bottom: 16px; }
    .editorial-composition-frame-edge-right .editorial-composition-frame { width: 86%; margin-inline: auto; }
    .editorial-composition-surface-muted .editorial-copy { text-align: center; }
    .editorial-heading { padding-top: 26px; }
    .editorial-copy img { max-height: 400px; }
    .article-footer { margin-top: 32px; }
    .lightbox-image { max-width: 100vw; max-height: calc(100dvh - 48px); }
    .lightbox-title { top: max(10px, env(safe-area-inset-top)); left: max(12px, env(safe-area-inset-left)); }
    .lightbox-close { top: max(4px, env(safe-area-inset-top)); right: max(4px, env(safe-area-inset-right)); }
    .lightbox-previous { left: 4px; }
    .lightbox-next { right: 4px; }
    .lightbox-play { right: max(4px, env(safe-area-inset-right)); bottom: max(4px, env(safe-area-inset-bottom)); }
    .lightbox-indicators { bottom: max(10px, env(safe-area-inset-bottom)); max-width: calc(100vw - 100px); gap: 5px; }
    .lightbox-indicator { width: 10px; min-width: 10px; height: 10px; min-height: 10px; }
    .editorial-copy table { font-size: 15px; }
    .editorial-copy th, .editorial-copy td { padding: 8px; }
}
