@import url("./tokens.css");

@font-face {
  font-family: "Schibsted Grotesk";
  src: url("../fonts/SchibstedGrotesk.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
}
@font-face {
  font-family: "Schibsted Grotesk";
  src: url("../fonts/SchibstedGrotesk-Italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400 900;
  font-display: swap;
}


/* Medidas de referencia convertidas a rem normales. La raíz no escala con vw. */
*, *::before, *::after { box-sizing: border-box; }
html { font-family: var(--font); background: var(--paper); color: var(--ink); -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body {
  --page-gutter: clamp(1.25rem, .321429rem + 3.809524vw, 3.75rem);
  --section-space: clamp(2.5rem, 2.035714rem + 1.904762vw, 3.75rem);
  --section-title: clamp(1.875rem, 1.596429rem + 1.142857vw, 2.625rem);
  --row-title: 1.125rem;
  --button-radius: clamp(.1875rem, .273214rem - .095238vw, .25rem);
  --tag-radius: clamp(.28125rem, .409821rem - .142857vw, .375rem);
  --web-rule: color-mix(in srgb, var(--muted) 65%, var(--paper));
  --glass: color-mix(in srgb, var(--white) 14.12%, transparent);
  margin: 0; font-size: var(--t-body); font-weight: var(--w-text); line-height: 1.4;
}
h1, h2, h3, p, figure, ul, ol, dl, dd { margin: 0; }
h1, h2, h3 { color: inherit; text-wrap: balance; overflow-wrap: break-word; }
h1, h2 { font-weight: var(--w-medium); letter-spacing: var(--track-display); line-height: 1.15; }
h1 { font-size: var(--t-h1); }
h2 { font-size: var(--t-h2); }
h3 { font-size: var(--t-h3); font-weight: var(--w-title); line-height: 1.3; letter-spacing: var(--track-title); }
p { max-inline-size: var(--measure); color: var(--muted); text-wrap: pretty; }
ul, ol { padding: 0; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; text-decoration-skip-ink: auto; }
button { font: inherit; }
img, svg { display: block; max-inline-size: 100%; }
img { block-size: auto; }
[hidden] { display: none !important; }
[id] { scroll-margin-block-start: var(--section-space); }
.wrap { inline-size: calc(100% - var(--page-gutter) * 2); margin-inline: auto; }
.section { padding-block: var(--section-space); }
.headline { font-size: var(--section-title); }
.lede { font-size: var(--t-lede); line-height: 1.3; }
.on-dark { background: var(--ink); color: var(--white); }
.on-dark p { color: var(--muted-dark); }
.skip-link { position: fixed; inset-block-start: 1rem; inset-inline-start: 1rem; z-index: 20; padding: 1rem 1.5rem; border-radius: var(--button-radius); background: var(--sage); color: var(--ink); font-weight: var(--w-title); transform: translateY(-200%); }
.skip-link:focus { transform: none; }

/* Navegación y botones compartidos; se conservan el HTML y la interacción del menú. */
.site-header { position: relative; z-index: 5; }
.site-header__inner, .site-nav, .site-nav__links { display: flex; align-items: center; }
.site-header__inner { min-block-size: 6.625rem; justify-content: space-between; gap: 2rem; padding-block: 1.875rem; }
.wordmark { display: inline-flex; align-items: center; gap: .625rem; flex-shrink: 0; font-size: 1.125rem; font-weight: var(--w-title); line-height: 1.2; text-decoration: none; white-space: nowrap; }
.wordmark::before { content: ""; inline-size: .5rem; block-size: .5rem; flex-shrink: 0; border-radius: 50%; background: var(--sage); }
.site-nav { gap: 2.5rem; }
.site-nav__links { list-style: none; gap: 1.5rem; }
.site-nav__links a { display: inline-flex; align-items: center; min-block-size: 2.75rem; font-size: var(--t-small); font-weight: var(--w-medium); text-decoration: none; }
.site-nav__links a:hover, .site-nav__links a[aria-current="page"] { text-decoration: underline; text-underline-offset: .45em; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.40625rem; inline-size: max-content; min-block-size: 3.9375rem; max-inline-size: 100%; padding: .65625rem .65625rem .65625rem 1.265625rem; border: 0; border-radius: var(--button-radius); background: var(--white); color: var(--ink); font-size: clamp(.9375rem, 1.023214rem - .095238vw, 1rem); font-weight: var(--w-title); line-height: 1.3; text-decoration: none; cursor: pointer; transition: background-color .2s var(--ease), color .2s var(--ease); }
.button > svg, .text-link svg, .path-nav svg { inline-size: 1.40625rem; block-size: 1.40625rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.button > svg { box-sizing: content-box; padding: .609375rem; border-radius: var(--button-radius); background: var(--blue); color: var(--white); }
.button > svg path { transform-box: view-box; transform-origin: center; transition: transform .2s var(--ease); }
.button:hover { background: var(--blue); color: var(--white); }
.button:hover > svg path { transform: rotate(-45deg); }
.site-nav .button { min-block-size: 2.875rem; gap: 1rem; padding: .6875rem; font-size: var(--t-small); }
.site-nav .button > svg { inline-size: 1rem; block-size: 1rem; padding: .25rem; }
.menu-toggle { min-block-size: 2.75rem; gap: .75rem; padding: .625rem .75rem; background: var(--ink-2); color: var(--white); font-size: var(--t-small); }
.menu-toggle > svg { inline-size: 1.25rem; block-size: 1.25rem; padding: 0; background: transparent; color: inherit; }
.menu-toggle:hover { background: var(--white); color: var(--ink); }
.menu-toggle:hover > svg path { transform: none; }
.menu-toggle[aria-expanded="true"] .menu-icon__middle { display: none; }
.text-link { display: inline-flex; align-items: center; gap: 1rem; min-block-size: 2.75rem; font-size: var(--t-body); font-weight: var(--w-title); }

/* Foto a sangre, título arriba, lede y acciones al pie mediante margin-bottom: auto. */
.home .site-header,
.has-banner .site-header { position: absolute; inset: 0 0 auto; background: transparent; }
.hero { --hero-bottom-pad: 3.9375rem; --hero-fade: 3rem; position: relative; overflow: hidden; isolation: isolate; }
.hero__background { position: absolute; inset: 0; z-index: -2; }
.hero__background img { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 50% 50%; }
/* Velo de tinta solo en la franja superior, donde caen header, etiquetas y titular: sostiene 4,5:1
   contra blanco sobre el cielo y las cumbres, y se apaga antes de la ciudad. Las paradas van en rem,
   ancladas a la zona del texto (el titular termina cerca de los 23 rem a 1440 y a 390) y no al alto
   del hero, que crece con el viewport. Medido a 1440×750, 768, 800 y 900 y a 390×844 (percentil 95
   de luminancia bajo cada texto). */
.hero__background::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, color-mix(in srgb, var(--ink) 72%, transparent) 0, color-mix(in srgb, var(--ink) 52%, transparent) 21rem, color-mix(in srgb, var(--ink) 46%, transparent) 23.5rem, transparent 30rem); pointer-events: none; }
/* El fondo de apoyo sigue la altura real del lede, incluso cuando aumenta el texto. */
.hero__bottom { position: relative; margin-block-start: var(--hero-fade); }
.hero__bottom::before { content: ""; position: absolute; inset: calc(-1 * var(--hero-fade)) calc(-1 * var(--page-gutter)) calc(-1 * var(--hero-bottom-pad)); z-index: -1; background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--ink) 70%, transparent) var(--hero-fade), color-mix(in srgb, var(--ink) 76%, transparent)); pointer-events: none; }
.hero__layout { display: flex; flex-direction: column; min-block-size: 46.875rem; padding-block: 10.78125rem var(--hero-bottom-pad); }
.hero__credentials { display: flex; flex-wrap: wrap; gap: .9375rem; margin-block-end: .75rem; list-style: none; }
.hero__credentials li { display: flex; align-items: center; gap: .375rem; max-inline-size: 100%; padding: .28125rem .46875rem; border-radius: var(--tag-radius); background: var(--glass); color: var(--white); font-size: var(--t-meta); line-height: 1.3; }
.hero__credentials svg { inline-size: .75rem; block-size: .75rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.hero h1 { max-inline-size: 32.484375rem; margin-block-end: auto; font-size: var(--t-display); font-weight: var(--w-title); line-height: 1.18; text-wrap: initial; }
.hero .hero__text { max-inline-size: 30rem; margin-block-end: 1.875rem; color: var(--white); font-size: var(--t-lede); line-height: 1.3; }
.hero__actions { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.button--glass { padding: 1.265625rem; background: var(--glass); color: var(--white); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.button--glass > svg { padding: 0; background: transparent; color: inherit; }
.button--glass:hover { background: var(--white); color: var(--ink); }

/* Grilla 267 / 669 / 384 px a 1440, con texto de 248 px. Ambos caminos pesan lo mismo. */
.service-block { margin-block: var(--section-space); }
.section-heading { display: grid; gap: .75rem; max-inline-size: 33.375rem; margin-block-end: 4.21875rem; }
.section-heading h2 { font-size: var(--section-title); }
.section-heading .lede { max-inline-size: 33rem; color: var(--ink); }
.service-list { display: grid; gap: 1.40625rem; list-style: none; }
.service-row { display: grid; grid-template-columns: minmax(0, 267fr) minmax(0, 384fr) minmax(0, 669fr); align-items: center; padding-block-end: 1.40625rem; border-block-end: .5px solid var(--web-rule); }
.service-icon { inline-size: 2.8125rem; block-size: 2.8125rem; fill: none; stroke: var(--blue); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
/* El verde agua base queda en 1,94:1 sobre papel y se apaga frente a los azules; el hover del acento lo sostiene. */
.service-block--family .service-icon { stroke: var(--sage-deep); }
.service-row h3 { max-inline-size: 14.15625rem; font-size: var(--row-title); font-weight: var(--w-medium); line-height: 1.2; text-wrap: initial; }
.service-row h3 a { display: inline-block; padding-block: .5rem; text-decoration: none; }
.service-row h3 a:hover { text-decoration: underline; }
/* La flecha del sitio, siempre visible y del color del texto, dice en reposo que el título es un enlace.
   Va pegada a la última palabra: Chrome corta antes de un svg aunque medie un espacio duro. */
.service-row__arrow { white-space: nowrap; }
.service-row__arrow svg { display: inline-block; inline-size: 1em; block-size: 1em; vertical-align: -.15em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.service-row p { max-inline-size: 100%; font-size: var(--t-body); line-height: var(--lh-body); }

/* Thomas firma la manera de trabajar después de los dos bloques. */
/* Sin retrato la columna izquierda solo lleva titulo y firma: se angosta para no dejar un vacio de media banda. */
.work__layout { display: grid; grid-template-columns: minmax(0, 267fr) minmax(0, 1053fr); gap: var(--section-space); padding-block: var(--section-space); }
/* Sin retrato, el nombre y el enlace bajan al pie para equilibrar la banda. */
.work__profile { display: flex; flex-direction: column; min-inline-size: 0; }
/* Foto sobre la banda de tinta: velo fuerte para que no compita con el texto
   ni rompa el mundo oscuro de la seccion. */
.work__figure { position: relative; margin-block: 1.875rem 1.5rem; overflow: hidden; }
.work__figure img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; filter: grayscale(.35) brightness(.62) contrast(1.05); }
.work__figure::after { content: ""; position: absolute; inset: 0; background: color-mix(in srgb, var(--ink) 34%, transparent); pointer-events: none; }

.work .work__name { margin-block-start: auto; padding-block-start: 1.875rem; border-block-start: .5px solid var(--line-dark); color: var(--white); font-size: var(--t-h2); font-weight: var(--w-medium); }
/* Cuatro compromisos en cuadricula de dos por dos, numerados como las etapas de
   Areas: la seccion gana ritmo sin necesidad de una foto decorativa. */
.work__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 3.75rem; list-style: none; }
.work__list li { padding-block: 1.875rem; border-block-start: .5px solid var(--line-dark); }
.work__list li:nth-child(-n+2) { padding-block-start: 0; border-block-start: 0; }
.work__num { display: block; margin-block-end: .5rem; color: var(--white); font-size: var(--t-h2); font-weight: var(--w-medium); font-variant-numeric: tabular-nums; line-height: 1; opacity: .45; }
.work__num--accent { color: var(--sage-soft); opacity: 1; }
.work__list p { max-inline-size: 100%; }
.work p { margin-block-start: .5rem; }
.work__next { padding-block-start: 1.875rem; border-block-start: .5px solid var(--line-dark); }
.work__next .button { margin-block-start: 0; }
.contact-strip { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--section-space); align-items: center; }
.contact-strip .lede { max-inline-size: 33rem; margin-block-start: .75rem; }
.contact-strip__actions { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; max-inline-size: 100%; }
.email-link { display: inline-block; max-inline-size: 100%; padding-block: .625rem; overflow-wrap: anywhere; }

/* Sobre mí: cabecera acotada, retrato sin tarjeta y datos en filas. */
.about-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: var(--section-space); }
.about-portrait { overflow: hidden; inline-size: min(100%, 28.125rem); background: var(--ink-2); aspect-ratio: 4 / 5; }
.about-portrait picture, .about-portrait img { display: block; inline-size: 100%; block-size: 100%; }
.about-portrait img { object-fit: cover; object-position: 50% 28%; }
.about-copy h1 { max-inline-size: 33.375rem; font-size: var(--t-h1); }
.prose { margin-block-start: .75rem; }
.prose p:first-child { max-inline-size: 33rem; font-size: var(--t-lede); line-height: 1.3; color: var(--ink); }
.prose p + p { margin-block-start: 1.5rem; }
.facts { margin-block-start: var(--section-space); }
.fact-group { display: grid; grid-template-columns: minmax(0, 267fr) minmax(0, 1053fr); padding-block: 1.875rem; border-block-start: .5px solid var(--web-rule); }
.fact-group:last-child { border-block-end: .5px solid var(--web-rule); }
.fact-list { list-style: none; }
.fact-list > li { display: grid; grid-template-columns: minmax(0, 669fr) minmax(0, 384fr); align-items: start; }
.fact-list > li + li { margin-block-start: 1.40625rem; padding-block-start: 1.40625rem; border-block-start: .5px solid var(--line); }
.fact-list h3 { max-inline-size: 21.5625rem; padding-inline-end: 1.5rem; font-weight: var(--w-medium); }
.fact-list p { max-inline-size: 100%; font-size: var(--t-small); }
.languages > div { display: grid; grid-template-columns: minmax(0, 669fr) minmax(0, 384fr); padding-block: 1rem; }
.languages > div:first-child { padding-block-start: 0; }
.languages > div + div { border-block-start: .5px solid var(--line); }
.languages dt { font-weight: var(--w-medium); }
.languages dd { color: var(--muted); }
.about-contact { padding-block-start: 0; }

/* Áreas: accesos discretos y lista abierta sobre el papel. */
/* Banda de portada de pagina interior: foto a sangre con velo de tinta, mismo
   recurso que el hero de la home. El velo sostiene el blanco sobre el cielo. */
.page-banner { position: relative; overflow: hidden; isolation: isolate; }
.page-banner__background { position: absolute; inset: 0; z-index: -2; }
.page-banner__background img { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 50% 50%; }
.page-banner__background::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, color-mix(in srgb, var(--ink) 74%, transparent) 0, color-mix(in srgb, var(--ink) 66%, transparent) 70%, color-mix(in srgb, var(--ink) 52%, transparent) 100%); pointer-events: none; }
.page-banner__layout { display: flex; flex-direction: column; justify-content: flex-end; min-block-size: min(62vh, 34rem); padding-block: 8.4375rem 3.75rem; }
.page-banner h1 { max-inline-size: 33.375rem; font-size: var(--t-h1); font-weight: var(--w-title); line-height: 1.18; }
.page-banner .lede { max-inline-size: 33rem; margin-block-start: .75rem; color: var(--white); }

.page-intro { padding-block: var(--section-space); }
.page-intro h1 { max-inline-size: 33.375rem; }
.page-intro > .lede { max-inline-size: 33rem; margin-block-start: .75rem; color: var(--ink); }
.path-nav { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-block-start: 1.875rem; }
.path-nav a { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-block-size: 2.75rem; padding-block: .5rem; border-block-end: .5px solid var(--web-rule); font-size: var(--t-body); font-weight: var(--w-title); text-decoration: none; }
.path-nav svg { box-sizing: content-box; padding: .375rem; border-radius: var(--button-radius); background: var(--blue); color: var(--white); transform: rotate(90deg); }
.path-nav__family svg { background: var(--sage); color: var(--ink); }
.path-nav a:hover { text-decoration: underline; }
.practice-list { list-style: none; }
.practice-row { display: grid; grid-template-columns: minmax(0, 267fr) minmax(0, 384fr) minmax(0, 669fr); align-items: start; padding-block: 1.875rem; border-block-start: .5px solid var(--web-rule); }
.practice-row:last-child { border-block-end: .5px solid var(--web-rule); }
.step-number { display: inline-block; justify-self: start; padding-block-end: .375rem; color: var(--blue); font-size: 2.0625rem; font-weight: var(--w-medium); line-height: 1; font-variant-numeric: tabular-nums; }
.step-number--family { color: var(--ink); border-block-end: 3px solid var(--sage); }
.practice-row h2 { max-inline-size: 14.15625rem; font-size: var(--row-title); letter-spacing: var(--track-title); line-height: 1.2; text-wrap: initial; }
.practice-row > div { min-inline-size: 0; max-inline-size: 100%; }
/* Subambitos dentro de una etapa (Empresa y Patrimonio en Legado). */
.practice-row > div h3 { margin-block: 1.875rem .375rem; padding-block-start: 1.125rem; border-block-start: .5px solid var(--web-rule); color: var(--ink); font-size: var(--t-body); font-weight: var(--w-medium); }
.practice-row > div h3:first-of-type { margin-block-start: 1.5rem; }
.practice-row p { font-size: var(--t-body); line-height: var(--lh-body); }
.practice-row ul { list-style: none; margin-block-start: 1rem; }
.practice-row li { padding-block: .75rem; border-block-start: .5px solid var(--line); font-size: var(--t-small); text-wrap: pretty; }
.practice-row li:last-child { padding-block-end: 0; }

/* Contacto: una fila para escribir o agendar, seguida de preguntas nativas. */
.contact-card { padding-block: 0 1.875rem; margin-block-end: var(--section-space); border-block-end: .5px solid var(--web-rule); }
/* Si despues de la tarjeta viene un grupo de datos, su filete superior duplicaria el de la tarjeta. */
.contact-card + .fact-group { border-block-start: 0; }
.contact-email { display: inline-block; max-inline-size: 100%; font-size: var(--t-h2); font-weight: var(--w-medium); line-height: 1.3; overflow-wrap: anywhere; }
.contact-card__bottom { display: flex; align-items: center; justify-content: space-between; gap: 1.875rem; margin-block-start: 1.875rem; }
.contact-card__bottom p { max-inline-size: 33rem; }
.contact-card__bottom .button { flex-shrink: 0; }
.faq { display: grid; grid-template-columns: minmax(0, 267fr) minmax(0, 1053fr); align-items: start; padding-block-end: var(--section-space); }
.faq h2 { max-inline-size: 12ch; }
.faq__list { min-inline-size: 0; }
.faq details { border-block-end: .5px solid var(--web-rule); }
.faq details:first-child { border-block-start: .5px solid var(--web-rule); }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: 1.40625rem; color: var(--ink); font-size: var(--t-h3); font-weight: var(--w-medium); line-height: 1.3; list-style: none; cursor: pointer; text-wrap: pretty; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary svg { inline-size: 1.25rem; block-size: 1.25rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.faq details[open] .faq-icon__vertical { display: none; }
.faq summary:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.faq details p { max-inline-size: var(--measure); padding-block-end: 1.40625rem; }

/* Pie idéntico en las cuatro páginas. */
.site-footer { padding-block: var(--section-space) 1.40625rem; }
.site-footer__top { display: flex; justify-content: space-between; align-items: start; gap: 1.875rem; }
.site-footer__identity { display: flex; flex-direction: column; align-items: start; gap: .75rem; min-inline-size: 0; }
.site-footer__nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 3.75rem; list-style: none; }
.site-footer__nav a { display: inline-block; padding-block: .625rem; color: var(--muted-dark); font-size: var(--t-small); text-decoration: none; }
.site-footer__nav a:hover { color: var(--white); text-decoration: underline; }
.site-footer__bottom { margin-block-start: var(--section-space); padding-block-start: 1.40625rem; border-block-start: .5px solid var(--line-dark); font-size: var(--t-meta); }

/* Un viewport completo cuando cabe el contenido; puede crecer con el zoom de texto. */
@media (min-width: 75rem) { .hero__layout { min-block-size: max(100vh, 46.875rem); } }
@media (max-width: 74.999rem) {
  .site-nav { gap: 1.5rem; }
  .site-nav__links { gap: 1rem; }
  .service-row, .practice-row { grid-template-columns: minmax(0, .6fr) minmax(0, 1.1fr) minmax(0, 1.3fr); gap: 1.5rem; }
  .fact-group, .faq { grid-template-columns: minmax(0, .8fr) minmax(0, 2.2fr); gap: 1.5rem; }
  .fact-list > li, .languages > div { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
  .hero__layout { min-block-size: 100vh; }
}
/* Mismo breakpoint que main.js. Sin JS, la navegación ocupa espacio antes del hero. */
@media (max-width: 63.999rem) {
  .site-header__inner { min-block-size: 5.25rem; flex-wrap: wrap; gap: 1rem; padding-block: 1.25rem; }
  .site-nav { flex-basis: 100%; align-items: stretch; gap: 1rem; padding: 1rem; background: var(--ink); }
  .site-nav, .site-nav__links { flex-direction: column; }
  .site-nav__links { align-items: stretch; gap: 0; }
  .site-nav__links li { border-block-start: .5px solid var(--line-dark); }
  .site-nav__links a { inline-size: 100%; padding-block: 1rem; font-size: var(--t-body); }
  .site-nav .button { align-self: start; }
  .home .site-header:has(.menu-toggle[hidden]) { position: relative; background: var(--ink); }
  .hero__layout { padding-block-start: 8.5rem; }
  .service-row, .practice-row { grid-template-columns: 3rem minmax(0, .9fr) minmax(0, 1.4fr); }
}
@media (max-width: 47.999rem) {
  .site-header__inner > .wordmark { gap: .5rem; font-size: var(--t-body); }
  .hero { --hero-bottom-pad: 3.125rem; --hero-fade: 2.5rem; }
  .hero__layout { min-block-size: 100vh; padding-block: 8.5rem var(--hero-bottom-pad); }
  .hero__background img { object-position: 80% 50%; }
  .hero__credentials { justify-content: center; gap: .5rem; margin-block-end: .75rem; }
  .hero__credentials li { gap: .25rem; padding: .25rem .375rem; }
  .hero h1 { max-inline-size: none; text-align: center; }
  .hero .hero__text { margin-inline: auto; margin-block-end: 1.25rem; text-align: center; }
  .hero__actions { flex-direction: column-reverse; align-items: stretch; gap: .75rem; }
  .hero__actions .button { inline-size: 100%; }
  .section-heading { gap: .75rem; margin-block-end: 1.25rem; }
  .service-list { gap: .75rem; }
  .service-row { position: relative; grid-template-columns: minmax(0, 1fr); gap: .375rem; padding-inline-start: 2.875rem; padding-block-end: .75rem; }
  .service-icon { position: absolute; inset: .5rem auto auto 0; inline-size: 1.875rem; block-size: 1.875rem; }
  .service-row h3, .service-row p { max-inline-size: none; }
  .service-row h3 a { padding-block: .5rem .25rem; }
  .work__layout, .about-grid { grid-template-columns: minmax(0, 1fr); }
  .work__list { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .work__list li { padding-block: 1.40625rem; border-block-start: .5px solid var(--line-dark); }
  .work__list li:first-child { padding-block-start: 0; border-block-start: 0; }
  .work__list li:nth-child(2) { border-block-start: .5px solid var(--line-dark); padding-block-start: 1.40625rem; }
  .work__details { border-block-start: .5px solid var(--line-dark); padding-block-start: 1.40625rem; }
  .work__next .button { margin-block-start: 1.5rem; }
  .contact-strip { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .about-copy { grid-row: 1; }
  .about-portrait { max-inline-size: 25rem; }
  .fact-group, .faq { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .fact-list > li { grid-template-columns: minmax(0, 1fr); gap: .375rem; }
  .fact-list h3 { padding: 0; }
  .fact-list p { max-inline-size: none; font-size: var(--t-body); }
  .languages > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .path-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .path-nav a { min-inline-size: 0; gap: .5rem; }
  .path-nav svg { inline-size: 1rem; block-size: 1rem; }
  .practice-row { grid-template-columns: 1.875rem minmax(0, 1fr); gap: .75rem 1rem; }
  .step-number { font-size: var(--t-h2); }
  .practice-row h2 { max-inline-size: none; }
  .practice-row > div { grid-column: 2; max-inline-size: none; }
  .practice-row li { font-size: var(--t-body); }
  .contact-card__bottom { flex-direction: column; align-items: start; gap: 1.5rem; }
  .site-footer__top { flex-direction: column; }
  .site-footer__nav { gap: 0 2.5rem; }
}
@media (prefers-reduced-motion: reduce) { .button, .button > svg path { transition: none; } }
@media print {
  .site-header, .skip-link, .site-footer__nav, .menu-toggle { display: none !important; }
  .wrap { inline-size: 100%; max-inline-size: none; }
  .hero { background: var(--paper); color: var(--ink); }
  .hero__layout { min-block-size: 0; block-size: auto; padding-block: 1.875rem; }
  .hero__background, .hero__bottom::before { display: none; }
  .hero__credentials li, .hero .hero__text, .hero .button--glass { color: var(--ink); }
  .hero h1 { margin-block-end: 1.875rem; }
  .service-row, .practice-row, .fact-list > li, .work__list li, details { break-inside: avoid; }
  * { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}