:root {
  --paper:#e8ddd5;
  --paper-soft:#ede5de;
  --ink:#111111;
  --body-copy:#463A33;
  --accent:#8a7463;
  --hover:#8a7463;
  --rule:rgba(138,116,99,.34);
  --content-copy-size:clamp(13px,.96vw,16px);
  --desktop-nav-max:1220px;
  --desktop-content-max:1210px;
}

* { box-sizing:border-box; }

html,
body {
  margin:0;
  width:100%;
  height:100%;
  background:linear-gradient(135deg,var(--paper) 0%,var(--paper-soft) 100%);
  color:var(--ink);
  overflow:hidden;
}

body { font-family:"Archivo",Arial,sans-serif; }
button,a { font:inherit; }

.page {
  width:min(1580px,calc(100% - 28px));
  height:100dvh;
  min-height:100dvh;
  margin:0 auto;
  padding:14px 0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

/* ── banner ─────────────────────────────────────────────── */
.brand-banner {
  --banner-h:clamp(51px,5.3vw,81px);
  position:relative;
  display:block;
  width:calc(var(--banner-h) * 7.4473);
  max-width:100%;
  height:var(--banner-h);
  line-height:0;
  margin:0 0 5px;
  overflow:hidden;
}

.brand-banner-base {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:left center;
}

.brand-role {
  position:absolute;
  left:55.8%;
  top:17.5%;
  color:#7d5c3e;
  font-size:calc(var(--banner-h) * .18);
  font-weight:600;
  line-height:1;
  letter-spacing:.19em;
  white-space:nowrap;
  text-transform:lowercase;
}

html[lang="fr"] .brand-role,
html[lang="en"] .brand-role {
  font-size:calc(var(--banner-h) * .166);
  letter-spacing:.15em;
}

.brand-banner-wave-window {
  position:absolute;
  left:21.5%;
  top:35%;
  width:55%;
  height:51.5%;
  overflow:hidden;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 1.8%,#000 98.2%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 1.8%,#000 98.2%,transparent 100%);
}

.brand-banner-wave-track {
  position:absolute;
  inset:0 auto 0 0;
  display:flex;
  width:200%;
  height:100%;
  animation:bannerWaveScroll 8.0s linear infinite;
  will-change:transform;
}

.brand-banner-wave-track img {
  flex:0 0 50%;
  width:50%;
  height:100%;
  object-fit:fill;
  opacity:.68;
  mix-blend-mode:multiply;
}

@keyframes bannerWaveScroll { to { transform:translateX(-50%); } }


.mobile-brand-name,
.mobile-home-role,
.mobile-home-signature,
.mobile-etoiles,
.footer-link-label,
.phone-portrait-menu-only,
.contact-visual-inline { display:none; }

/* ── navigation ─────────────────────────────────────────── */
.topline {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
}

.menu-horizontal {
  min-width:0;
  width:min(var(--desktop-nav-max),calc(100% - 32px));
  max-width:var(--desktop-nav-max);
  overflow:hidden;
}

.menu-horizontal nav {
  display:flex;
  flex-wrap:nowrap;
  min-width:max-content;
  white-space:nowrap;
  align-items:center;
  padding-left:clamp(14px,1.5vw,24px);
}

.menu-horizontal a,
.menu-horizontal .menu-item-disabled,
.menu-columns a,
.menu-columns .menu-item-disabled,
.lang-wide button,
.lang-current,
.lang-options button,
.menu-current {
  font-family:"Archivo",Arial,sans-serif;
}

.menu-horizontal a,
.menu-horizontal .menu-item-disabled,
.menu-columns a,
.menu-columns .menu-item-disabled {
  display:inline-block;
  color:var(--ink);
  text-decoration:none;
  font-weight:700;
  text-transform:uppercase;
  transition:color .16s ease,transform .16s ease;
}

.menu-horizontal a,
.menu-horizontal .menu-item-disabled {
  font-size:clamp(10.5px,.79vw,12.8px);
  letter-spacing:clamp(.055em,.075vw,.11em);
  padding:4px 0;
  flex:0 0 auto;
}

/* Desktop separators are visual only: they sit in the gap between items and
   never enlarge either neighbour's clickable area. */
.menu-horizontal nav > a,
.menu-horizontal nav > .menu-item-disabled { position:relative; }
.menu-horizontal nav > a:not(:first-child),
.menu-horizontal nav > .menu-item-disabled:not(:first-child) {
  margin-left:calc(var(--menu-separator-margin,clamp(6px,.64vw,11px)) + var(--menu-separator-margin,clamp(6px,.64vw,11px)) + .35em);
}
.menu-horizontal nav > a::before,
.menu-horizontal nav > .menu-item-disabled::before {
  content:"·";
  position:absolute;
  right:calc(100% + var(--menu-separator-margin,clamp(6px,.64vw,11px)));
  top:50%;
  width:.35em;
  transform:translateY(-50%);
  color:var(--accent);
  text-align:center;
  pointer-events:none;
}
.menu-horizontal nav > a:first-child::before,
.menu-horizontal nav > .menu-item-disabled:first-child::before { content:none; }
.menu-horizontal .menu-label{display:inline-block;pointer-events:none;transition:color .16s ease,transform .16s ease;}

.menu-contact-link {
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-width:20px;
  color:var(--ink);
  text-decoration:none;
}

.contact-envelope {
  width:18px;
  height:18px;
  overflow:visible;
}

.contact-envelope path {
  fill:none;
  stroke:currentColor;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.menu-contact-text { display:none; }



.top-contact-compact {
  display:none;
  align-items:center;
  justify-content:center;
  color:var(--ink);
  text-decoration:none;
  font-family:"Archivo",Arial,sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
  transition:color .16s ease,transform .16s ease;
}

.menu-contact-link:hover,
.menu-contact-link:focus-visible,
.top-contact-compact:hover,
.top-contact-compact:focus-visible { color:var(--hover); outline:none; }
.menu-contact-link[aria-current="page"],
.top-contact-compact[aria-current="page"] { color:var(--accent); }

.menu-horizontal a:hover,
.menu-horizontal a:focus-visible,
.menu-columns a:hover,
.menu-columns a:focus-visible {
  color:var(--hover);
  outline:none;
}

.menu-horizontal a[aria-current="page"],
.menu-columns a[aria-current="page"] { color:var(--accent); }
.menu-horizontal a[aria-current="page"]{transform:none;}
.menu-horizontal a[aria-current="page"] .menu-label{
  transform:scale(1.27);
  transform-origin:center center;
  text-decoration-line:underline;
  text-decoration-color:currentColor;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  text-decoration-skip-ink:auto;
}
.menu-columns a[aria-current="page"] {
  transform:scale(1.27);
  text-decoration-line:underline;
  text-decoration-color:currentColor;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  text-decoration-skip-ink:auto;
}
.menu-item-disabled {
  color:rgba(17,17,17,.52) !important;
  cursor:default;
  user-select:none;
  pointer-events:none;
  transform:none !important;
}

.menu-columns a[aria-current="page"] { transform-origin:left center; }

.lang-wide {
  display:flex;
  border:1px solid var(--accent);
  flex:0 0 auto;
}

.lang-wide button {
  min-width:58px;
  height:38px;
  border:0;
  border-right:1px solid var(--accent);
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-size:10px;
  font-weight:700;
  letter-spacing:.14em;
}

.lang-wide button:last-child { border-right:0; }
.lang-wide button[aria-pressed="true"] { background:var(--ink); color:var(--paper); }

.lang-compact,
.menu-compact-control {
  display:none;
  position:relative;
  width:max-content;
  flex:0 0 auto;
}

.lang-compact { justify-self:end; }
.menu-compact-control { justify-self:start; }

.lang-current,
.menu-current {
  min-width:64px;
  height:38px;
  padding:0 12px;
  border:1px solid var(--accent);
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.menu-current { min-width:72px; }

.lang-current[aria-expanded="true"],
.menu-current[aria-expanded="true"] {
  background:var(--ink);
  color:var(--paper);
}

.lang-options {
  display:none;
  position:absolute;
  z-index:90;
  top:calc(100% + 5px);
  left:0;
  width:72px;
  border:1px solid var(--accent);
  background:var(--paper);
}

.lang-options.open { display:block; }

.lang-options button {
  width:100%;
  height:34px;
  border:0;
  border-bottom:1px solid var(--rule);
  background:transparent;
  cursor:pointer;
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
}

.lang-options button:last-child { border-bottom:0; }
.lang-options button:hover,
.lang-options button:focus-visible { color:var(--hover); outline:none; }

.menu-columns {
  display:none;
  margin-top:10px;
  border:1px solid var(--accent);
  background:var(--paper);
  padding:8px 12px 10px 14px;
  overflow:hidden;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:18px;
}

.menu-columns a,
.menu-columns .menu-item-disabled {
  font-size:9.7px;
  letter-spacing:.06em;
  line-height:1.2;
  padding:8px 4px;
  border-bottom:1px solid var(--rule);
  min-width:0;
}

.menu-columns [data-k="bio"] { grid-column:1; grid-row:1; }
.menu-columns [data-k="imagenes"] { grid-column:1; grid-row:2; }
.menu-columns [data-k="obras"] { grid-column:1; grid-row:3; }
.menu-columns [data-k="espacializacion"] { grid-column:1; grid-row:4; }
.menu-columns [data-k="curaduria"] { grid-column:2; grid-row:1; }
.menu-columns [data-k="docencia"] { grid-column:2; grid-row:2; }
.menu-columns [data-k="textos"] { grid-column:2; grid-row:3; }
.menu-columns [data-k="software"] { grid-column:2; grid-row:4; }

/* ── central frame ──────────────────────────────────────── */
.hero {
  flex:1 1 auto;
  min-height:0;
  margin-top:10px;
  border:1px solid var(--accent);
  overflow:hidden;
}

/* ── footer ─────────────────────────────────────────────── */
.site-footer {
  flex:0 0 auto;
  min-height:42px;
  margin-top:10px;
  border:1px solid var(--accent);
  padding:0 14px;
  display:grid;
  
  align-items:center;
  column-gap:18px;
  font-size:10px;
  font-weight:500;
  letter-spacing:.065em;
  text-transform:none;
}


.footer-links {
  
  
  display:flex;
  align-items:center;
  
  
  min-width:0;
}

.footer-icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  
  
  
  text-decoration:none;
  transition:color .16s ease,transform .16s ease;
}

.footer-icon svg {   overflow:visible; }
.footer-bandcamp path {  stroke:none; }

.footer-youtube .play {  stroke:none; }
.footer-icon:hover,
.footer-icon:focus-visible {  transform:translateY(-1px); outline:none; }
.footer-icon-disabled {  cursor:default; }
.footer-icon-disabled:hover {  transform:none; }

.footer-meta {
  
  
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  min-width:0;
  white-space:nowrap;
  text-align:right;
}

.footer-copyright,
.footer-update { white-space:nowrap; }

/* ── HOME ───────────────────────────────────────────────── */
.home-hero {
  position:relative;
  padding:0;
  background:transparent;
}

.collage-home {
  --wave-left:37.4%;
  --schaeffer-field-left:43%;
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(125deg,rgba(255,255,255,.11),rgba(255,255,255,0) 55%);
}


.collage-grid {
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.24;
  background-image:
    linear-gradient(rgba(138,116,99,.10) 1px,transparent 1px),
    linear-gradient(90deg,rgba(138,116,99,.10) 1px,transparent 1px),
    linear-gradient(rgba(138,116,99,.12) 1px,transparent 1px),
    linear-gradient(90deg,rgba(138,116,99,.12) 1px,transparent 1px);
  background-size:18px 18px,18px 18px,90px 90px,90px 90px;
}

.collage-layer {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}

.collage-table {
  z-index:1;
  top:0;
  bottom:0;
  left:auto;
  right:0;
  width:auto;
  max-width:none;
  height:100%;
  object-fit:contain;
  object-position:right center;
  transform:none;
  opacity:.345;
  filter:grayscale(1) sepia(.12) contrast(1.13) brightness(.97);
}

.collage-speaker-field {
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
}

.speaker-slot {
  position:absolute;
  pointer-events:none;
}

.speaker-unit {
  position:relative;
  width:100%;
  opacity:var(--speaker-opacity,.16);
}

/* The tree keeps its full pole but never shows the circular floor base. */
.speaker-slot.hide-base .speaker-unit {
  clip-path:inset(0 0 7.8% 0);
}

.speaker-body,
.speaker-cone img {
  display:block;
  width:100%;
  height:auto;
  filter:grayscale(1) sepia(.18) contrast(1.30) brightness(var(--speaker-brightness,.80));
  mix-blend-mode:multiply;
}

.speaker-cone {
  position:absolute;
  inset:0;
  clip-path:circle(var(--cr) at var(--cx) var(--cy));
  transform-origin:var(--cx) var(--cy);
  pointer-events:none;
  animation:conePulse var(--cone-speed,2.2s) ease-in-out var(--cone-delay,0s) infinite;
}

.speaker-cone img {
  position:absolute;
  inset:0;
}

@keyframes conePulse {
  0%,100% { transform:scale(1); filter:brightness(1); }
  18% { transform:scale(1.027); filter:brightness(1.035); }
  34% { transform:scale(.989); filter:brightness(.985); }
  54% { transform:scale(1.035); filter:brightness(1.045); }
  76% { transform:scale(.995); filter:brightness(.995); }
}

.collage-wave-canvas {
  position:absolute;
  top:0;
  right:auto;
  bottom:0;
  left:var(--wave-left);
  z-index:4;
  width:calc(100% - var(--wave-left));
  height:100%;
  pointer-events:none;
}

.collage-medin-wrap {
  position:absolute;
  inset:0;
  z-index:6;
  pointer-events:none;
}

.collage-medin-drift,
.collage-medin-glitch {
  position:absolute;
  inset:0;
}



.collage-medin {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:left bottom;
  filter:grayscale(1) sepia(.03) contrast(1.045);
  transform:scaleX(.96);
  transform-origin:left center;
}

.collage-medin-glitch-copy {
  opacity:0;
  pointer-events:none;
}

.collage-medin-glitch-a { clip-path:polygon(0 18%,100% 18%,100% 38%,0 38%); }
.collage-medin-glitch-b { clip-path:polygon(0 54%,100% 54%,100% 77%,0 77%); }

.collage-medin-noise {
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
  transform:scaleX(.96);
  transform-origin:left center;
  background-image:
    repeating-linear-gradient(0deg,rgba(30,25,21,.22) 0 1px,rgba(245,239,233,.12) 1px 2px,transparent 2px 4px),
    repeating-linear-gradient(90deg,rgba(60,49,41,.10) 0 1px,transparent 1px 3px);
  background-size:100% 4px,3px 100%;
  mix-blend-mode:multiply;
  -webkit-mask-image:url("../assets/home-collage/medin.png");
  -webkit-mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:left bottom;
  mask-image:url("../assets/home-collage/medin.png");
  mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:left bottom;
}

.collage-medin-glitch.is-disrupted .collage-medin:not(.collage-medin-glitch-copy) {
  animation:medinDisruptMain var(--medin-glitch-ms,520ms) steps(8,end) 1;
}
.collage-medin-glitch.is-disrupted .collage-medin-glitch-a {
  animation:medinDisruptA var(--medin-glitch-ms,520ms) steps(7,end) 1;
}
.collage-medin-glitch.is-disrupted .collage-medin-glitch-b {
  animation:medinDisruptB var(--medin-glitch-ms,520ms) steps(7,end) 1;
}
.collage-medin-glitch.is-disrupted .collage-medin-noise {
  animation:medinNoise var(--medin-glitch-ms,520ms) steps(9,end) 1;
}


@keyframes medinDisruptMain {
  0%,100% { filter:grayscale(1) sepia(.03) contrast(1.045) blur(0); opacity:1; }
  22% { filter:grayscale(1) sepia(.03) contrast(.99) blur(calc(var(--medin-glitch-blur,1.9px) * .62)); opacity:.92; }
  46% { filter:grayscale(1) sepia(.02) contrast(.92) blur(var(--medin-glitch-blur,1.9px)); opacity:.77; }
  67% { filter:grayscale(1) sepia(.03) contrast(.97) blur(calc(var(--medin-glitch-blur,1.9px) * .78)); opacity:.87; }
}

@keyframes medinDisruptA {
  0%,100% { opacity:0; transform:scaleX(.96) translateX(0) skewX(0deg) scaleY(1); }
  24% { opacity:.50; transform:scaleX(.96) translateX(var(--medin-glitch-shift,5.6px)) skewX(-.55deg) scaleY(1.025); }
  48% { opacity:.39; transform:scaleX(.96) translateX(calc(var(--medin-glitch-shift,5.6px) * -1.05)) skewX(.65deg) scaleY(.975); }
  72% { opacity:.26; transform:scaleX(.96) translateX(calc(var(--medin-glitch-shift,5.6px) * .58)) skewX(-.28deg) scaleY(1.012); }
}

@keyframes medinDisruptB {
  0%,100% { opacity:0; transform:scaleX(.96) translateX(0) skewX(0deg) scaleY(1); }
  18% { opacity:.31; transform:scaleX(.96) translateX(calc(var(--medin-glitch-shift,5.6px) * -.82)) skewX(.42deg) scaleY(.982); }
  44% { opacity:.46; transform:scaleX(.96) translateX(calc(var(--medin-glitch-shift,5.6px) * 1.12)) skewX(-.62deg) scaleY(1.03); }
  70% { opacity:.23; transform:scaleX(.96) translateX(calc(var(--medin-glitch-shift,5.6px) * -.48)) skewX(.25deg) scaleY(.99); }
}

@keyframes medinNoise {
  0%,100% { opacity:0; background-position:0 0,0 0; }
  24% { opacity:.12; background-position:0 1px,1px 0; }
  47% { opacity:.27; background-position:0 -3px,-2px 0; }
  68% { opacity:.15; background-position:0 2px,2px 0; }
}

/* Full HOME field for Schaeffer symbols/terms. The portrait sits above it. */
.collage-schaeffer-field {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:7;
  pointer-events:none;
}

/* Portrait framing may change independently from the Schaeffer field. */
.collage-home.is-portrait-layout .collage-medin { object-position:left top; }
.collage-home.is-portrait-layout .collage-medin-noise {
  -webkit-mask-position:left top;
  mask-position:left top;
}
.collage-home.is-portrait-layout .collage-medin-glitch-a { clip-path:polygon(0 3%,100% 3%,100% 14%,0 14%); }
.collage-home.is-portrait-layout .collage-medin-glitch-b { clip-path:polygon(0 16%,100% 16%,100% 27%,0 27%); }

.schaeffer-item {
  position:absolute;
  opacity:0;
  color:rgba(67,56,47,.84);
  font-family:Georgia,"Times New Roman",serif;
  font-size:var(--schaeffer-size,18px);
  font-weight:400;
  letter-spacing:.055em;
  white-space:nowrap;
  transition:opacity .46s ease;
  will-change:left,top,opacity;
}

.schaeffer-item.is-symbol {
  font-size:var(--schaeffer-size,26px);
  letter-spacing:.035em;
}

.schaeffer-item.is-symbol sub {
  font-size:.58em;
  line-height:0;
  vertical-align:-.30em;
  letter-spacing:0;
  margin-left:.02em;
}

.schaeffer-item.is-term {
  text-transform:lowercase;
}

.schaeffer-item.is-visible { opacity:.54; }
.schaeffer-item.is-changing { pointer-events:none; }



/* ── BIO / CONTACT shared frame ─────────────────────────── */
.bio-page .page,
.contact-page .page,
.texts-page .page { width:100%; }

.bio-page .topbar,
.bio-page .site-footer,
.contact-page .topbar,
.contact-page .site-footer,
.texts-page .topbar,
.texts-page .site-footer {
  width:min(1580px,calc(100% - 28px));
  margin-left:auto;
  margin-right:auto;
}

.bio-main,
.contact-main,
.texts-main {
  position:relative;
  flex:1 1 auto;
  min-height:0;
  width:100%;
  margin-top:10px;
  padding:0;
  border:0;
  overflow:hidden;
  --section-copy-top:clamp(12px,1.1vw,18px);
}

.bio-main::before,
.contact-main::before,
.texts-main::before {
  content:"";
  position:absolute;
  z-index:5;
  top:0;
  bottom:0;
  left:max(14px,calc((100vw - 1580px) / 2));
  right:max(14px,calc((100vw - 1580px) / 2));
  border:1px solid var(--accent);
  pointer-events:none;
}

.bio-layout,
.contact-layout,
.texts-layout {
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
  /* Text geometry is primary and CSS-driven. 1210px is a maximum, never a
     forced width; the copy contracts fluidly with the viewport. */
  --section-copy-left:max(46px,calc((100vw - 1580px) / 2 + 46px));
  --section-frame-right:max(14px,calc((100vw - 1580px) / 2));
  --section-copy-width:min(var(--desktop-content-max),calc(100vw - var(--section-copy-left) - var(--section-frame-right) - 24px));
}

.bio-text-scroll {
  position:absolute;
  inset:0;
  z-index:1;
  overflow-y:auto;
  overflow-x:hidden;
  padding:var(--section-copy-top) 0 28px;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:var(--accent) transparent;
}

.bio-text-scroll::-webkit-scrollbar,
.contact-form-scroll::-webkit-scrollbar,
.texts-publications-scroll::-webkit-scrollbar { width:8px; }
.bio-text-scroll::-webkit-scrollbar-track,
.contact-form-scroll::-webkit-scrollbar-track,
.texts-publications-scroll::-webkit-scrollbar-track { background:transparent; }
.bio-text-scroll::-webkit-scrollbar-thumb,
.contact-form-scroll::-webkit-scrollbar-thumb,
.texts-publications-scroll::-webkit-scrollbar-thumb { background:var(--accent); }

.bio-content {
  margin-left:var(--section-copy-left);
  margin-right:0;
  width:var(--section-copy-width);
  padding:0 0 16px;
}

.bio-layout {
  --bio-visual-right:max(42px,calc((100vw - 1580px) / 2 + 50px));
  /* Decoration receives only the residual strip after the text has its width. */
  --bio-visual-width:clamp(120px,calc(100vw - var(--section-copy-left) - var(--section-copy-width) - var(--bio-visual-right) - 24px),500px);
}
.bio-lang[hidden] { display:none; }

.bio-lang p,
.contact-intro,
.texts-intro {
  margin:0 0 1.45em;
  max-width:100%;
  font-size:var(--content-copy-size);
  font-weight:500;
  line-height:1.62;
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
}

.bio-lang p:first-child { margin-top:0; }
.bio-lang p:last-of-type { margin-bottom:0; }
.bio-lang em { font-style:italic; }

.bio-actions {
  margin:clamp(20px,3vh,34px) 0 8px;
  padding-top:12px;
  border-top:1px solid var(--rule);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:0;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.bio-actions a,
.bio-copy {
  color:var(--accent);
  text-decoration:none;
  transition:color .16s ease;
}

.bio-copy {
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  font:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
}

.bio-actions a:hover,
.bio-actions a:focus-visible,
.bio-copy:hover,
.bio-copy:focus-visible { color:var(--ink); outline:none; }
.bio-action-sep { color:var(--rule); margin:0 2.5ch; }

.bio-visuals {
  position:absolute;
  z-index:2;
  top:50%;
  right:var(--bio-visual-right);
  transform:translateY(-50%);
  height:calc(100% - 24px);
  max-height:100%;
  overflow:hidden;
  pointer-events:none;
  width:var(--bio-visual-width);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:clamp(14px,2vh,24px);
}

.bio-visual {
  margin:0;
  width:92%;
  height:calc((100% - 24px) / 2);
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}

.bio-visual img {
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  opacity:1;
  filter:none;
}

.bio-visual-profesores { transform:translateX(clamp(8px,1vw,16px)); }

.bio-visuals-inline {
  display:none;
  width:100%;
  margin:clamp(18px,3vh,30px) 0 8px;
  padding-top:clamp(14px,2.5vh,24px);
  border-top:1px solid var(--rule);
}

.bio-inline-visual {
  margin:0;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.bio-inline-visual img {
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:320px;
  object-fit:contain;
}



/* BIO narrative cutouts: part of the text flow, never part of copied text. */
.bio-story-visuals {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:clamp(28px,6vw,92px);
  width:100%;
  margin:clamp(18px,2.7vh,30px) 0 clamp(20px,3vh,34px);
  padding:0;
  line-height:0;
}
.bio-story-visual {
  flex:0 1 43%;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.bio-story-visual img {
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:contain;
}
@media (max-width:700px) {
  .bio-story-visuals {
    flex-direction:column;
    align-items:stretch;
    width:min(100%,520px);
    gap:14px;
    margin:18px auto 22px;
  }
  .bio-story-visual img { width:min(100%,480px); }
}

/* ── TEXTOS ─────────────────────────────────────────────── */
.texts-layout {
  --texts-copy-left:var(--section-copy-left);
  --texts-copy-width:var(--section-copy-width);
  --texts-table-width:var(--texts-copy-width);
  --texts-label-size:var(--content-copy-size);
  --texts-entry-size:calc(var(--content-copy-size) - 1px);
  --texts-meta-size:var(--texts-entry-size);
  --texts-long-size:var(--texts-entry-size);
  --texts-title-reserve:clamp(16px,3.2vw,40px);
}

/* The contextual introduction is outside the scrolling catalogue. Header and
   body share one semantic table, so all four column tracks remain identical. */
.texts-content {
  position:absolute;
  inset:0;
  z-index:1;
  min-height:0;
  overflow:hidden;
}

.texts-lang {
  width:100%;
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.texts-lang[hidden] { display:none; }

.texts-fixed {
  position:relative;
  z-index:4;
  flex:0 0 auto;
  width:100%;
  margin:0;
  padding:var(--section-copy-top) 0 0;
  background:transparent;
}
.texts-intro {
  width:var(--texts-copy-width);
  margin:0 0 clamp(28px,4.2vh,46px) var(--texts-copy-left);
}

/* Column labels are structurally fixed with the introduction. They are not
   inside the scrolling publication list. */
.texts-table-head-wrap {
  width:var(--texts-table-width);
  margin-left:var(--texts-copy-left);
  margin-right:0;
}

.texts-publications-scroll {
  position:relative;
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  padding:0 0 28px;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:var(--accent) transparent;
}

.texts-publications-inner {
  width:var(--texts-table-width);
  margin-left:var(--texts-copy-left);
  margin-right:0;
  padding:0 0 16px;
}

.texts-table {
  width:100%;
  table-layout:fixed;
  border-collapse:collapse;
  border-spacing:0;
  color:var(--ink);
  font-family:"Archivo",Arial,sans-serif;
}

/* Proportions taken from the refined reference image. Percentages are kept
   relative so the table compresses without changing its visual hierarchy. */
.texts-table col:nth-child(1) { width:33%; }
.texts-table col:nth-child(2) { width:7.3%; }
.texts-table col:nth-child(3) { width:18.3%; }
.texts-table col:nth-child(4) { width:41.4%; }

.texts-table th,
.texts-table td {
  min-width:0;
  margin:0;
  border:0;
  padding-left:0;
  padding-right:12px;
  text-align:left;
  vertical-align:top;
}
.texts-table th:last-child,
.texts-table td:last-child { padding-right:0; }

.texts-table th {
  overflow:hidden;
  position:static;
  padding-top:0;
  padding-bottom:clamp(10px,1.5vh,16px);
  background:transparent;
  color:var(--accent);
  font-family:"Archivo",Arial,sans-serif;
  font-size:var(--texts-label-size);
  font-weight:500;
  line-height:1.3;
  letter-spacing:.012em;
  text-transform:none;
  white-space:nowrap;
}

.texts-table td {
  padding-top:0;
  padding-bottom:0;
  font-size:var(--texts-meta-size);
  font-weight:500;
  line-height:1.5;
}

.texts-entry + .texts-entry td { padding-top:clamp(22px,3.2vh,36px); }
.texts-title-cell,
.texts-entry-summary-cell { min-width:0; }

.texts-title-line {
  margin:0;
  min-width:0;
  width:calc(100% - var(--texts-title-reserve));
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
}

.texts-entry-title,
.texts-entry-summary {
  margin:0;
  color:inherit;
  font-family:inherit;
  font-size:var(--texts-long-size);
  line-height:1.5;
  font-weight:500;
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
  overflow-wrap:break-word;
}
.texts-entry-title { font-style:italic; }
.texts-entry-summary { font-style:normal; }

.texts-entry-year,
.texts-entry-type {
  font-family:inherit;
  font-size:var(--texts-meta-size);
  line-height:1.5;
  font-style:normal;
  font-weight:500;
}
.texts-entry-year { white-space:nowrap; }
.texts-mobile-meta { display:none; }

.texts-download {
  display:inline-flex;
  width:22px;
  height:22px;
  margin-left:5px;
  vertical-align:-5px;
  align-items:center;
  justify-content:center;
  color:var(--accent);
  text-decoration:none;
  transition:color .16s ease,transform .16s ease;
}
.texts-download svg {
  display:block;
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.texts-download:hover,
.texts-download:focus-visible {
  color:var(--ink);
  outline:none;
  transform:translateY(1px);
}
.texts-download-mobile { display:none; }

/* ── CONTACT ────────────────────────────────────────────── */
.contact-layout {
  --contact-frame-side:max(14px,calc((100vw - 1580px) / 2));
  --contact-copy-left:var(--section-copy-left);
  --contact-copy-width:var(--section-copy-width);
  --contact-visual-right:max(42px,calc((100vw - 1580px) / 2 + 50px));
  --contact-visual-width:clamp(120px,calc(100vw - var(--contact-copy-left) - var(--contact-copy-width) - var(--contact-visual-right) - 24px),210px);
  --contact-visual-nudge-y:clamp(4px,.40vw,7px);
  display:flex;
  flex-direction:column;
}

.contact-intro-fixed {
  flex:0 0 auto;
  margin:0;
  padding:var(--section-copy-top) 0 0;
}

.contact-intro {
  margin:0 0 0 var(--contact-copy-left);
  width:var(--contact-copy-width);
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
}

.contact-workspace {
  position:relative;
  flex:1 1 auto;
  min-height:0;
  margin:clamp(16px,2.4vh,26px) var(--contact-frame-side) 0;
}

.contact-form-scroll {
  position:absolute;
  inset:0;
  z-index:1;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 0 28px;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:var(--accent) transparent;
}

.contact-scroll-grid {
  min-height:100%;
  padding:0 0 28px;
}

.contact-content {
  width:var(--contact-copy-width);
  margin-left:calc(var(--contact-copy-left) - var(--contact-frame-side));
  padding:0;
}


.contact-visual {
  position:absolute;
  z-index:2;
  top:calc(50% - var(--contact-visual-nudge-y));
  left:auto;
  right:calc(var(--contact-visual-right) - var(--contact-frame-side));
  width:var(--contact-visual-width);
  height:auto;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:visible;
  pointer-events:none;
  transform:translateY(-50%);
}

.contact-visual img {
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:contain;
  object-position:left center;
  filter:grayscale(1) contrast(1.02);
  opacity:.96;
}

.contact-form {
  width:100%;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 20px;
}

.contact-form label {
  display:flex;
  flex-direction:column;
  gap:7px;
  font-size:10px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:lowercase;
}

.contact-form label:nth-of-type(3),
.contact-message,
.turnstile-slot,
.contact-actions { grid-column:1 / -1; }

.contact-form input,
.contact-form textarea {
  width:100%;
  border:1px solid var(--rule);
  border-radius:0;
  background:rgba(255,255,255,.14);
  color:var(--ink);
  font:400 var(--content-copy-size)/1.45 "Archivo",Arial,sans-serif;
  padding:10px 11px;
  outline:none;
  transition:border-color .16s ease,background .16s ease;
}

.contact-form textarea { resize:none; min-height:48px; max-height:42vh; overflow-y:hidden; }
.contact-form input:focus,
.contact-form textarea:focus { border-color:var(--accent); background:rgba(255,255,255,.22); }

.contact-honeypot {
  position:absolute !important;
  left:-10000px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.contact-actions {
  display:flex;
  align-items:center;
  gap:16px;
  min-height:42px;
}

.contact-actions button {
  min-width:108px;
  height:36px;
  border:1px solid var(--accent);
  background:transparent;
  color:var(--ink);
  font-size:10px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:lowercase;
  cursor:pointer;
}

.contact-actions button:hover,
.contact-actions button:focus-visible { background:var(--ink); color:var(--paper); outline:none; }
.contact-actions button:disabled { opacity:.45; cursor:wait; }
.contact-status { margin:0; font-size:11px; letter-spacing:.03em; }
.turnstile-slot { min-height:0; max-width:100%; overflow:visible; transform-origin:left top; }

@media (max-width:1180px) {
  .lang-wide { display:none; }
  .lang-compact { display:block; }
}

@media (max-width:1045px) {
  .topbar { position:relative; z-index:30; }
  .topline { grid-template-columns:auto 1fr auto; gap:8px; }
  .menu-horizontal { display:none; }
  .menu-compact-control { display:block; grid-column:1; }
  /* Once navigation is compact, CONTACTO belongs only to the dropdown. */
  
  .lang-compact { display:block; grid-column:3; }
  .menu-columns {
    display:none !important;
    position:absolute;
    z-index:80;
    top:calc(100% + 4px);
    left:0;
    width:min(620px,calc(100vw - 28px));
    margin:0;
    padding:8px 12px 10px 14px;
    background:var(--paper);
    box-shadow:0 8px 24px rgba(17,17,17,.08);
  }
  .menu-columns.open { display:grid !important; }
  
  .menu-columns [data-k="home"] { grid-column:1; grid-row:1; }
  .menu-columns [data-k="bio"] { grid-column:1; grid-row:2; }
  .menu-columns [data-k="imagenes"] { grid-column:1; grid-row:3; }
  .menu-columns [data-k="obras"] { grid-column:1; grid-row:4; }
  .menu-columns [data-k="espacializacion"] { grid-column:1; grid-row:5; }
  .menu-columns [data-k="curaduria"] { grid-column:2; grid-row:1; }
  .menu-columns [data-k="docencia"] { grid-column:2; grid-row:2; }
  .menu-columns [data-k="textos"] { grid-column:2; grid-row:3; }
  .menu-columns [data-k="software"] { grid-column:2; grid-row:4; }
  .menu-columns [data-k="contacto"] { grid-column:2; grid-row:5; }
}

@media (max-width:1559px) and (min-width:901px) {
  /* When the residual side strip becomes too small, decoration moves into the
     scroll flow rather than narrowing the copy. */
  .bio-visuals,
  .contact-visual { display:none; }
  .bio-visuals-inline {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:clamp(18px,3vw,32px);
  }
  .contact-visual-inline {
    display:flex;
    width:min(32%,235px);
    margin:26px auto 4px;
    padding-top:18px;
    border-top:1px solid var(--rule);
    align-items:center;
    justify-content:center;
  }
  .contact-visual-inline img {
    display:block;
    width:100%;
    height:auto;
    max-height:260px;
    object-fit:contain;
    filter:grayscale(1) contrast(1.02);
    opacity:.96;
  }
  .contact-content {
    width:var(--contact-copy-width);
    margin-left:calc(var(--contact-copy-left) - var(--contact-frame-side));
  }
}

@media (max-width:1045px) and (min-width:901px) {
  .bio-layout,
  .contact-layout,
  .texts-layout {
    --section-copy-left:34px;
    --section-copy-width:min(var(--desktop-content-max),calc(100vw - 68px));
  }
  .bio-content { margin-left:var(--section-copy-left); width:var(--section-copy-width); }
  .contact-layout { --contact-copy-left:var(--section-copy-left); --contact-copy-width:var(--section-copy-width); }
  .texts-layout {
    --texts-copy-left:var(--section-copy-left);
    --texts-copy-width:var(--section-copy-width);
    --texts-table-width:var(--texts-copy-width);
  }
}

@media (max-width:900px) {
  .bio-content {
    width:min(var(--desktop-content-max),calc(100vw - 68px));
    margin-left:34px;
    margin-right:34px;
  }

  .bio-visuals,
  .contact-visual { display:none; }

  .bio-visuals-inline { display:none; }

  .contact-layout { --contact-copy-left:34px; --contact-copy-width:min(var(--desktop-content-max),calc(100vw - 68px)); }
  .texts-layout {
    --texts-copy-left:34px;
    --texts-copy-width:min(var(--desktop-content-max),calc(100vw - 68px));
    --texts-table-width:var(--texts-copy-width);
  }
  .contact-content {
    width:var(--contact-copy-width);
    margin-left:calc(var(--contact-copy-left) - var(--contact-frame-side));
  }
}

@media (max-width:900px) and (min-width:701px) {
  /* Keep the catalogue at the same type size as the introduction; only the
     inter-column padding tightens before the mobile block layout takes over. */
  .texts-table th:not(:last-child),
  .texts-table td:not(:last-child) { padding-right:6px; }
}

@media (max-height:680px) and (min-width:901px) {
  .bio-visuals { width:min(29vw,390px); height:calc(100% - 18px); gap:8px; }
  .bio-visual { height:calc((100% - 8px) / 2); }
  .contact-layout { --contact-visual-width:150px; }
}

@media (max-height:540px) and (min-width:901px) {
  .bio-visuals,
  .contact-visual { display:none; }

  .bio-content { width:min(var(--desktop-content-max),calc(100vw - 110px)); }
  .contact-content {
    width:var(--contact-copy-width);
    margin-left:calc(var(--contact-copy-left) - var(--contact-frame-side));
  }

  .bio-visuals-inline { display:none; }
}

@media (max-width:700px) {
  .page { width:calc(100% - 16px); padding:10px 0; }
  .brand-banner { --banner-h:clamp(44px,9.5vw,61px); margin-bottom:4px; }
  .menu-columns a, .menu-columns .menu-item-disabled { font-size:9.35px; letter-spacing:.055em; }
  .topline { gap:5px; }
  .top-contact-compact { padding:0 2px; font-size:9.4px; letter-spacing:.065em; }

  .hero { margin-top:12px; }

  .site-footer {
    min-height:40px;
    padding:0 9px;
    column-gap:6px;
    font-size:8.4px;
    letter-spacing:.025em;
  }
  .footer-links { gap:3px; }
  .footer-icon { width:32px; height:32px; }
  .footer-icon svg { width:21px; height:18px; }
  .footer-meta { gap:7px; white-space:normal; line-height:1.13; }
  .footer-copyright, .footer-update { white-space:normal; }

  .bio-page .topbar,
  .bio-page .site-footer,
  .contact-page .topbar,
  .contact-page .site-footer,
  .texts-page .topbar,
  .texts-page .site-footer { width:calc(100% - 16px); }

  .bio-main::before,
  .contact-main::before,
  .texts-main::before { left:8px; right:8px; }

  .bio-main, .contact-main, .texts-main { --section-copy-top:10px; }
  .bio-content { width:calc(100% - 36px); margin-left:18px; margin-right:18px; }
  .bio-lang p { font-size:12.5px; line-height:1.58; text-align:left; text-justify:auto; hyphens:none; }
  .contact-intro,
  .texts-intro { font-size:12.5px; line-height:1.58; text-align:justify; text-justify:inter-word; hyphens:auto; }
  .bio-actions { gap:0; font-size:10px; }

  .bio-visuals-inline { grid-template-columns:1fr; gap:22px; }
  .bio-inline-visual img { max-height:280px; }

  .contact-layout { --contact-frame-side:8px; --contact-copy-left:18px; --contact-copy-width:calc(100% - 36px); }
  .texts-layout {
    --texts-copy-left:18px;
    --texts-copy-width:calc(100% - 36px);
    --texts-table-width:var(--texts-copy-width);
    --texts-label-size:12.5px;
    --texts-entry-size:11.5px;
    --texts-meta-size:var(--texts-entry-size);
    --texts-long-size:var(--texts-entry-size);
    --texts-title-reserve:0px;
  }
  .contact-workspace { margin-top:13px; }
  .contact-form-scroll { padding-bottom:18px; }
  .contact-scroll-grid { padding-bottom:18px; }
  .contact-form { grid-template-columns:1fr; }
  .contact-form label { grid-column:1 / -1; }

  .texts-fixed { padding-bottom:0; }
  .texts-intro { margin-bottom:26px; }
  .texts-table-head-wrap { display:none; }
  .texts-publications-scroll { padding-bottom:18px; }
  .texts-publications-inner { padding-bottom:0; }
  .texts-table,
  .texts-table tbody,
  .texts-entry,
  .texts-table td { display:block; width:100%; }
  .texts-table thead { display:none; }
  .texts-table td { padding:0; }
  .texts-entry + .texts-entry td { padding-top:0; }
  .texts-entry:not(:last-child) {
    margin-bottom:20px;
    padding-bottom:18px;
    border-bottom:1px solid var(--rule);
  }
  .texts-title-cell,
  .texts-entry-summary-cell { display:block; }
  .texts-title-line {
    display:block;
    text-align:justify;
    text-justify:inter-word;
    hyphens:auto;
  }
  .texts-entry-title { display:inline; }
  .texts-mobile-meta {
    display:inline;
    font-family:"Archivo",Arial,sans-serif;
    font-size:var(--texts-meta-size);
    font-style:normal;
    font-weight:500;
    white-space:normal;
  }
  .texts-entry-year,
  .texts-entry-type,
  .texts-download-desktop { display:none !important; }
  .texts-entry-summary {
    display:block;
    margin-top:9px;
  }
  .texts-summary-tail { white-space:nowrap; }
  .texts-download-mobile {
    display:inline-flex;
    margin-left:5px;
    vertical-align:-5px;
  }

  /* Phone layout keeps the narrower scrollbar. */
  .bio-text-scroll::-webkit-scrollbar,
  .contact-form-scroll::-webkit-scrollbar,
  .texts-publications-scroll::-webkit-scrollbar { width:7px; }
}

@media (max-width:420px) {
  .site-footer { font-size:7.8px; letter-spacing:.02em; padding:0 7px; }
  .footer-links { gap:1px; }
  .footer-meta { max-width:45vw; gap:5px; }
  .menu-columns a, .menu-columns .menu-item-disabled { font-size:9.1px; letter-spacing:.05em; }
  .menu-current { min-width:64px; padding:0 8px; font-size:9.4px; }
  .lang-current { min-width:56px; padding:0 8px; font-size:9.3px; }
  .top-contact-compact { font-size:8.9px; letter-spacing:.045em; }
  .turnstile-slot { transform:scale(.90); width:111%; margin-bottom:-6px; }
}



/* ── phone portrait composition ─────────────────────────── */
@media (max-width:520px) and (orientation:portrait) {
  /* HOME header: identity first, then compact navigation. */
  

  
  
  body[data-page-key="home"] .mobile-brand-name {
    
    color:var(--ink);
    font-family:"Archivo",Arial,sans-serif;
    font-size:clamp(43px,13.2vw,62px);
    font-weight:400;
    line-height:1;
    letter-spacing:.105em;
    white-space:nowrap;
    
  }

  body[data-page-key="home"] .topline {
    
    grid-template-columns:auto 1fr auto;
    
  }
  body[data-page-key="home"] .menu-compact-control { grid-column:1; }
  body[data-page-key="home"] .top-contact-compact { display:none !important; }
  body[data-page-key="home"] .lang-compact { grid-column:3; }
  
  body[data-page-key="home"] .lang-current { min-width:70px; }

  /* Two columns × five rows, only in phone portrait. */
  body[data-page-key="home"] .phone-portrait-menu-only { display:block; }
  body[data-page-key="home"] .menu-columns {
    
    
    width:100%;
    padding:6px 10px 7px;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:18px;
    row-gap:0;
  }
  body[data-page-key="home"] .menu-columns a,
  body[data-page-key="home"] .menu-columns .menu-item-disabled {
    padding:6px 4px;
    font-size:9.2px;
    line-height:1.12;
  }
  body[data-page-key="home"] .menu-columns [data-k="home"] { grid-column:1; grid-row:1; }
  body[data-page-key="home"] .menu-columns [data-k="bio"] { grid-column:1; grid-row:2; }
  body[data-page-key="home"] .menu-columns [data-k="imagenes"] { grid-column:1; grid-row:3; }
  body[data-page-key="home"] .menu-columns [data-k="obras"] { grid-column:1; grid-row:4; }
  body[data-page-key="home"] .menu-columns [data-k="espacializacion"] { grid-column:1; grid-row:5; }
  body[data-page-key="home"] .menu-columns [data-k="curaduria"] { grid-column:2; grid-row:1; }
  body[data-page-key="home"] .menu-columns [data-k="docencia"] { grid-column:2; grid-row:2; }
  body[data-page-key="home"] .menu-columns [data-k="textos"] { grid-column:2; grid-row:3; }
  body[data-page-key="home"] .menu-columns [data-k="software"] { grid-column:2; grid-row:4; }
  body[data-page-key="home"] .menu-columns [data-k="contacto"] { grid-column:2; grid-row:5; }

  /* Full typomorphological table, stretched only in portrait phone so the
     complete table fills the intermediate frame and remains centered. */
  

  /* Only Arbre + Étoile remain visible in portrait phone; the complete speaker
     composition is retained for wider layouts. */
  body[data-page-key="home"] .speaker-slot[data-model="left2"],
  body[data-page-key="home"] .speaker-slot[data-model="right2"] { display:none !important; }
  body[data-page-key="home"] .speaker-slot[data-model="center1"] {
    display:block;
    left:1.5% !important;
    top:14% !important;
    width:39% !important;
  }
  body[data-page-key="home"] .speaker-slot[data-model="right1"] {
    display:block;
    left:72% !important;
    top:20.5% !important;
    width:25.2% !important;
  }

  /* Schaeffer vocabulary is above table/speakers, but below the portrait. */
  

  /* Portrait asset including microphone. */
  
  
  

  /* Same animated waveform engine as desktop/tablet; only its portrait-phone
     geometry changes. */
  

  body[data-page-key="home"] .mobile-home-role {
    
    
    
    
    
    
    
    
    
    border-top:1px solid var(--accent);
    
    
    
    
    
    
    
    
  }

  /* HOME footer: links, update, copyright; all centered. */
  body[data-page-key="home"] .site-footer {
    
    
    
    
    
    flex-direction:column;
    justify-content:center;
    
    
    
    
    
  }
  body[data-page-key="home"] .footer-links {
    
    
    
    justify-content:center;
  }
  
  
  body[data-page-key="home"] .footer-link-label {
    display:inline;
    font-size:9px;
    font-weight:600;
    letter-spacing:.10em;
    text-transform:uppercase;
  }
  
  
  
  

  /* BIO: decorative images return only after the biography text/actions. */
  .bio-page .bio-visuals-inline {
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
    margin-top:22px;
    padding-top:18px;
  }
  .bio-page .bio-inline-visual img { max-height:270px; }

  /* CONTACT: Schaeffer visual comes after the form/status in the scroll flow. */
  
  
}

/* Phone / small-device landscape: menu overlays instead of consuming height. */
@media (orientation:landscape) and (max-height:620px) and (max-width:1000px) {
  .page { width:calc(100% - 10px); height:100dvh; min-height:100dvh; padding:4px 0; }
  .topbar { position:relative; z-index:30; padding:2px 6px 3px; }
  .brand-banner { margin-bottom:0; }
  .topline { grid-template-columns:auto 1fr auto auto; gap:6px; min-height:38px; }
  .menu-compact-control { display:block; grid-column:1; }
  .menu-horizontal,
  .lang-wide { display:none !important; }
  .top-contact-compact {  grid-column:3; padding:0 3px; }
  .lang-compact { display:block; grid-column:4; }
  .menu-current,
  .lang-current { height:36px; }

  .menu-columns {
    display:none !important;
    position:absolute;
    z-index:80;
    top:calc(100% + 4px);
    left:6px;
    width:min(620px,calc(100vw - 22px));
    margin:0;
    padding:6px 10px 8px;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:18px;
    background:var(--paper);
    box-shadow:0 8px 24px rgba(17,17,17,.08);
  }
  .menu-columns.open { display:grid !important; }
  .menu-columns a, .menu-columns .menu-item-disabled { font-size:9.1px; letter-spacing:.05em; padding:7px 4px; }

  .hero,
  .bio-main,
  .contact-main { margin-top:4px; }

  .site-footer {
    min-height:30px;
    height:30px;
    margin-top:4px;
    padding:0 8px;
    column-gap:5px;
    font-size:7.4px;
    letter-spacing:.035em;
  }

  .footer-links { gap:2px; }
  .collage-home:not(.is-portrait-layout) .collage-medin { object-position:left center; }
  .collage-home:not(.is-portrait-layout) .collage-medin-noise { -webkit-mask-position:left center; mask-position:left center; }

  .bio-page .topbar,
  .bio-page .site-footer,
  .contact-page .topbar,
  .contact-page .site-footer,
  .texts-page .topbar,
  .texts-page .site-footer { width:calc(100% - 10px); }

  .bio-main::before,
  .contact-main::before,
  .texts-main::before { left:5px; right:5px; }

  .bio-main, .contact-main, .texts-main { --section-copy-top:6px; }
  .bio-text-scroll { padding-bottom:14px; }
  .texts-publications-scroll { padding-bottom:14px; }
  .bio-text-scroll::-webkit-scrollbar,
  .contact-form-scroll::-webkit-scrollbar,
  .texts-publications-scroll::-webkit-scrollbar { width:7px; }
  .bio-content {
    width:calc(100% - 34px);
    margin-left:17px;
    margin-right:17px;
    padding-bottom:8px;
  }
  .bio-lang p,
  .contact-intro,
  .texts-intro { line-height:1.48; }
  .bio-actions { margin-top:16px; padding-top:9px; }

  .bio-visuals,
  .contact-visual { display:none !important; }
  .bio-visuals-inline { display:none; }
  .bio-inline-visual img { max-height:220px; }

  .contact-layout { --contact-frame-side:5px; --contact-copy-left:17px; --contact-copy-width:calc(100% - 34px); }
  .texts-layout {
    --texts-copy-left:17px;
    --texts-copy-width:calc(100% - 34px);
    --texts-table-width:var(--texts-copy-width);
  }
  .contact-workspace { margin-top:10px; }
  .contact-scroll-grid { padding-bottom:12px; }
 .contact-content { width:var(--contact-copy-width); margin-left:calc(var(--contact-copy-left) - var(--contact-frame-side)); }
  .contact-form { gap:7px 12px; }
  .contact-form label { gap:3px; }
  .contact-form input,
  .contact-form textarea { padding:5px 8px; }
  .contact-form textarea { min-height:44px; }
  .contact-actions { min-height:32px; }
  .contact-actions button { height:30px; }
}

@media (orientation:landscape) and (max-height:460px) and (max-width:1000px) {
  .page { padding:2px 0; }
  .topbar { padding-top:1px; padding-bottom:1px; }
  .topline { min-height:34px; }
  .menu-current,
  .lang-current { height:32px; }
  .site-footer { min-height:28px; height:28px; margin-top:3px; }
  .hero,
  .bio-main,
  .contact-main,
  .texts-main { margin-top:3px; }
  .bio-main, .contact-main, .texts-main { --section-copy-top:4px; }
  .contact-workspace { margin-top:7px; }
  .contact-form textarea { min-height:44px; }
  .contact-actions button { height:30px; }
  .turnstile-slot { transform:scale(.86); transform-origin:left top; }
}


/* ── phone/footer refinements ───────────────────────────── */

/* The portrait no longer floats on any device. The independent disruption,
   blur, fragmentation and noise effects remain active. */
.collage-medin-drift {
  animation:none !important;
  transform:none !important;
  will-change:auto;
}

/* Brand banner remains a link without native visited-link decoration. */
.brand-banner,
.brand-banner:link,
.brand-banner:visited { text-decoration:none; color:inherit; }

/* Icon-only circular footer controls in the site palette. */
.footer-link-label { display:none !important; }
.footer-icon {
  width:30px;
  height:30px;
  border-radius:50%;
  background:rgba(138,116,99,.78);
  color:var(--paper-soft);
}
.footer-icon svg { width:18px; height:15px; }
.footer-bandcamp path { fill:currentColor; }
.footer-youtube rect { fill:none; stroke:currentColor; stroke-width:1.65; }
.footer-youtube .play { fill:currentColor; }
.footer-icon:hover,
.footer-icon:focus-visible { background:rgba(138,116,99,.95); color:#fff; }
.footer-icon-disabled { opacity:.72; }
.footer-icon-disabled:hover { background:rgba(138,116,99,.78); color:var(--paper-soft); }

/* Requested doubling of the desktop spacing between copyright and update. */
@media (min-width:901px) {
  .footer-meta { gap:36px; }
}

/* Phone portrait menus on every page use the same 2 × 5 structure. */
@media (max-width:520px) and (orientation:portrait) {
  
  
  
  
  
  
  
  
  
  
  
  
  

  /* Deliberate clean phone-portrait composition. */
  
  body[data-page-key="home"] .topbar {
    position:relative;
    z-index:30;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:5px;
    align-items:center;
    
    
  }
  body[data-page-key="home"] .brand-banner {
    grid-column:1;
    grid-row:1;
    width:100%;
    max-width:none;
    min-width:0;
    
    
    border:0;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:flex-start;
  }
  body[data-page-key="home"] .brand-banner-base,
  body[data-page-key="home"] .brand-banner-wave-window,
  body[data-page-key="home"] .brand-role { display:none !important; }
  body[data-page-key="home"] .mobile-brand-name {
    display:block;
    width:100%;
    height:auto;
    
    object-fit:contain;
    object-position:left center;
    transform:none;
  }
  body[data-page-key="home"] .topline {
    grid-column:2;
    grid-row:1;
    display:flex;
    align-items:center;
    
    min-height:0;
  }
  body[data-page-key="home"] .menu-compact-control,
  body[data-page-key="home"] .lang-compact { display:block; }
  body[data-page-key="home"] .top-contact-compact,
  body[data-page-key="home"] .menu-horizontal,
  body[data-page-key="home"] .lang-wide { display:none !important; }
  body[data-page-key="home"] .menu-current,
  body[data-page-key="home"] .lang-current {
    min-width:0;
    height:34px;
    padding:0 8px;
    border-color:rgba(138,116,99,.58);
    background:transparent;
    font-size:8.8px;
    letter-spacing:.07em;
  }
  body[data-page-key="home"] .lang-current { padding-left:7px; padding-right:7px; }
  body[data-page-key="home"] .menu-columns {
    top:calc(100% + 4px);
    left:0;
  }

  
  
  body[data-page-key="home"] .collage-grid,
  body[data-page-key="home"] .collage-table,
  body[data-page-key="home"] .collage-speaker-field,
  body[data-page-key="home"] .collage-schaeffer-field { display:none !important; }

  /* Main animated waveform uses the shared .36/.40 engine. */
  

  /* Real portrait asset with microphone; all non-floating disruption effects remain. */
  
  
  

  

  /* Clean mobile footer: small circular icons left, update + copyright right. */
  
  body[data-page-key="home"] .footer-links {
    
    order:initial;
    
    
    
  }
  
  
  body[data-page-key="home"] .footer-meta {
    
    order:initial;
    
    
    
    
    
    
    max-width:none;
    
    
  }
  body[data-page-key="home"] .footer-update { order:1; white-space:nowrap; }
  body[data-page-key="home"] .footer-copyright { order:2; white-space:nowrap; }
  
}

/* Compact/landscape menus may wrap a long item, but SOFTWARE is supplied by
   JavaScript for compact menus so this is normally a single-line fallback. */
@media (orientation:landscape) and (max-height:620px) and (max-width:1000px) {
  .menu-columns a,
  .menu-columns .menu-item-disabled { white-space:normal; }
  .footer-icon { width:25px; height:25px; }
  .footer-icon svg { width:15px; height:13px; }
}



/* ── portrait effects + mobile refinements ──────────────── */
@font-face {
  font-family:"LackRegular";
  src:url("../assets/fonts/lack-regular.otf") format("opentype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@media (min-width:701px) {
  .footer-meta { gap:36px; }
}

/* Shared portrait transform variables used only by the disruption slices.
   Position and zoom are now controlled by the final device-specific geometry. */
body[data-page-key="home"] .collage-home {
  --medin-scale-x:.96;
  --medin-scale-y:1;
}

@keyframes medinDisruptA {
  0%,100% { opacity:0; transform:scaleX(var(--medin-scale-x,.96)) scaleY(var(--medin-scale-y,1)) translateX(0) skewX(0deg); }
  24% { opacity:.50; transform:scaleX(var(--medin-scale-x,.96)) scaleY(calc(var(--medin-scale-y,1) * 1.025)) translateX(var(--medin-glitch-shift,5.6px)) skewX(-.55deg); }
  48% { opacity:.39; transform:scaleX(var(--medin-scale-x,.96)) scaleY(calc(var(--medin-scale-y,1) * .975)) translateX(calc(var(--medin-glitch-shift,5.6px) * -1.05)) skewX(.65deg); }
  72% { opacity:.26; transform:scaleX(var(--medin-scale-x,.96)) scaleY(calc(var(--medin-scale-y,1) * 1.012)) translateX(calc(var(--medin-glitch-shift,5.6px) * .58)) skewX(-.28deg); }
}
@keyframes medinDisruptB {
  0%,100% { opacity:0; transform:scaleX(var(--medin-scale-x,.96)) scaleY(var(--medin-scale-y,1)) translateX(0) skewX(0deg); }
  18% { opacity:.31; transform:scaleX(var(--medin-scale-x,.96)) scaleY(calc(var(--medin-scale-y,1) * .982)) translateX(calc(var(--medin-glitch-shift,5.6px) * -.82)) skewX(.42deg); }
  44% { opacity:.46; transform:scaleX(var(--medin-scale-x,.96)) scaleY(calc(var(--medin-scale-y,1) * 1.03)) translateX(calc(var(--medin-glitch-shift,5.6px) * 1.12)) skewX(-.62deg); }
  70% { opacity:.23; transform:scaleX(var(--medin-scale-x,.96)) scaleY(calc(var(--medin-scale-y,1) * .99)) translateX(calc(var(--medin-glitch-shift,5.6px) * -.48)) skewX(.25deg); }
}


@media (max-width:520px) and (orientation:portrait) {
  .page { width:calc(100% - 16px); padding:8px 0; }
  .topbar {
    position:relative;
    z-index:30;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;
    column-gap:8px;
    row-gap:6px;
    align-items:center;
  }
  .brand-banner {
    grid-column:1;
    grid-row:1;
    width:100%;
    max-width:none;
    min-width:0;
    height:40px;
    margin:0;
    border:0;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:flex-start;
  }
  
  .mobile-brand-name {
    display:block;
    width:100%;
    height:auto;
    max-height:36px;
    object-fit:contain;
    object-position:left center;
    transform:none;
  }
  .topline {
    grid-column:2;
    grid-row:1;
    display:flex;
    align-items:center;
    gap:4px;
    min-height:0;
  }
  
  .top-contact-compact,
  .menu-horizontal,
  .lang-wide { display:none !important; }
  .menu-current,
  .lang-current {
    
    
    height:34px;
    padding:0 8px;
    border-color:rgba(138,116,99,.58);
    background:transparent;
    
    letter-spacing:.07em;
  }
  .lang-options {
    top:calc(100% + 4px);
    
    
    
  }
  .menu-columns {
    
    
    
    margin:0;
    
    
    
    
    background:var(--paper);
    box-shadow:0 8px 24px rgba(17,17,17,.08);
  }
  
  .phone-portrait-menu-only { display:inline-block; }
  .menu-columns [data-k="home"] { grid-column:1; grid-row:1; }
  .menu-columns [data-k="bio"] { grid-column:1; grid-row:2; }
  .menu-columns [data-k="imagenes"] { grid-column:1; grid-row:3; }
  .menu-columns [data-k="obras"] { grid-column:1; grid-row:4; }
  .menu-columns [data-k="espacializacion"] { grid-column:1; grid-row:5; }
  .menu-columns [data-k="curaduria"] { grid-column:2; grid-row:1; }
  .menu-columns [data-k="docencia"] { grid-column:2; grid-row:2; }
  .menu-columns [data-k="textos"] { grid-column:2; grid-row:3; }
  .menu-columns [data-k="software"] { grid-column:2; grid-row:4; }
  .menu-columns [data-k="contacto"] { grid-column:2; grid-row:5; }

  .bio-page .bio-lang p,
  .contact-page .contact-intro {
    text-align:justify !important;
    text-justify:inter-word;
    hyphens:auto;
  }

  
  
  body[data-page-key="home"] .collage-grid,
  body[data-page-key="home"] .collage-speaker-field { display:none !important; }
  body[data-page-key="home"] .collage-table {
    display:block !important;
    inset:0;
    width:100%;
    height:100%;
    object-fit:fill;
    object-position:center center;
    opacity:.30;
    transform:none;
  }
  body[data-page-key="home"] .collage-schaeffer-field {
    
    inset:auto 0 0 0;
    
    
    
  }
  
  

  
  body[data-page-key="home"] .collage-medin-wrap {
    inset:14% -10% auto -10%;
    
    
    
  }
  
  

  body[data-page-key="home"] .mobile-home-role {
    
    
    
    inset:auto 0 0 0;
    
    
    
    
    
    
    
    
    
    
    
    
    
  }

  body[data-page-key="home"] .site-footer {
    min-height:42px;
    height:42px;
    margin-top:3px;
    padding:0 6px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:8px;
    font-size:clamp(6.1px,1.75vw,7.2px);
    line-height:1;
    text-align:left;
  }
  body[data-page-key="home"] .footer-links {
    grid-column:1;
    justify-self:start;
    display:flex;
    gap:7px;
  }
  body[data-page-key="home"] .footer-icon {
    width:19px;
    height:19px;
    gap:0;
  }
  body[data-page-key="home"] .footer-icon svg { width:11px; height:9.5px; }
  body[data-page-key="home"] .footer-meta {
    grid-column:2;
    justify-self:end;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    white-space:nowrap;
    text-align:right;
  }
  
}

/* ── portrait/mobile correction pass ────────────────────── */
/* Desktop is identified by pointing capability, not CSS viewport width. This
   keeps the portrait geometry active on desktop machines using OS/browser zoom. */
@media (min-width:901px) and (hover:hover) and (pointer:fine) {
  body[data-page-key="home"] .collage-home .collage-medin-wrap {
    left:var(--medin-desktop-left,0px);
    right:auto;
    top:50%;
    bottom:auto;
    width:var(--medin-desktop-width,58%);
    height:var(--medin-desktop-height,100%);
    aspect-ratio:auto;
    transform:translateY(-50%);
  }
  body[data-page-key="home"] .collage-medin-drift,
  body[data-page-key="home"] .collage-medin-glitch {
    transform:none !important;
  }
  body[data-page-key="home"] .collage-home .collage-medin,
  body[data-page-key="home"] .collage-home .collage-medin-noise {
    object-position:left center;
    -webkit-mask-position:left center;
    mask-position:left center;
    transform:scaleX(.96);
    transform-origin:left center;
  }
}

/* Schaeffer is vertically anchored to the fixed CONTACT workspace and does not
   follow the scrolling/growing message field. JS writes the exact top in px. */
@media (min-width:901px) {
  .contact-visual {
    top:50%;
    transform:translateY(-50%);
  }
}

/* Footer: external-service icons belong to the left edge on every layout. */
.site-footer {
  grid-template-columns:auto minmax(0,1fr);
}
.footer-links {
  grid-column:1;
  justify-self:start;
  justify-content:flex-start;
  gap:20px;
}
.footer-meta {
  grid-column:2;
  justify-self:end;
}

@media (max-width:520px) and (orientation:portrait) {
  /* Compact controls remain equal, but stop consuming unnecessary header width. */
  .menu-current,
  .lang-current {
    width:78px;
    min-width:78px;
    padding-left:6px;
    padding-right:6px;
    font-size:8.5px;
  }
  

  /* HOME portrait phone: absolutely no typomorphological table or random speakers. */
  body[data-page-key="home"] .collage-table,
  body[data-page-key="home"] .collage-speaker-field { display:none !important; }

  /* Main waveform: raised again while preserving the same .36/.40 animation. */
  

  /* Portrait: slightly larger, optically centered, with a small right
     nudge so the hand + microphone lose less material at the left edge. */
  
  
  

  /* Schaeffer field starts under the waveform and ends before the footer because
     it is clipped by HOME itself. It remains behind portrait and title. */
  
  
  

  /* Free pink area below the portrait. */
  

  /* Mobile footer icons: same left alignment, slightly more breathing room. */
  

  /* CONTACT mobile uses one normal vertical flow inside the main scroll area:
     intro -> form -> status -> Schaeffer. No absolute inner scroller. */
  .contact-page .contact-main {
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
  }
  .contact-page .contact-layout {
    height:auto;
    min-height:100%;
    display:block;
    padding-bottom:20px;
  }
  .contact-page .contact-workspace {
    position:relative;
    min-height:0;
    height:auto;
    margin-top:13px;
  }
  .contact-page .contact-form-scroll {
    position:relative;
    inset:auto;
    overflow:visible;
    padding:0 0 12px;
    scrollbar-gutter:auto;
  }
  .contact-page .contact-scroll-grid {
    display:flex;
    flex-direction:column;
    min-height:0;
    padding-bottom:12px;
  }
  .contact-page .contact-content { flex:0 0 auto; }
  .contact-page .contact-visual-inline {
    display:flex !important;
    flex:0 0 auto;
    width:min(74%,300px);
    margin:28px auto 8px;
    padding-top:18px;
    border-top:1px solid var(--rule);
    align-items:center;
    justify-content:center;
  }
  .contact-page .contact-visual-inline img {
    display:block;
    width:100%;
    height:auto;
    max-height:300px;
    object-fit:contain;
    filter:grayscale(1) contrast(1.02);
    opacity:.96;
  }
}


/* ── desktop HOME framing ───────────────────────────────── */
/* Desktop/intermediate: JavaScript computes one geometric portrait frame.
   The portrait enlarges whenever the viewport allows it,
   stays vertically centred, may cross the medial line slightly, and limits the
   left crop to the outer arm area so the hand and microphone remain visible. */
@media (min-width:901px) {
  body[data-page-key="home"] .collage-home .collage-medin-wrap {
    left:0px;
    right:auto;
    top:50%;
    bottom:auto;
    width:58%;
    height:100%;
    aspect-ratio:auto;
    transform:translateY(-50%);
  }
  body[data-page-key="home"] .collage-medin-drift,
  body[data-page-key="home"] .collage-medin-glitch {
    position:absolute;
    inset:0;
    transform:none !important;
  }
  body[data-page-key="home"] .collage-home .collage-medin,
  body[data-page-key="home"] .collage-home .collage-medin-noise {
    object-fit:contain;
    object-position:right center;
    -webkit-mask-position:right center;
    mask-position:right center;
    transform:scaleX(.96);
    transform-origin:right center;
  }
}

/* Phone portrait: a single authoritative layout. All geometry is constrained
   inside HOME; no negative top offsets can enter the header. */
@media (max-width:520px) and (orientation:portrait) {
  body[data-page-key="home"] .page {
    width:calc(100% - 8px);
    padding:4px 0;
  }

  body[data-page-key="home"] .topbar {
    min-height:40px;
    padding:0;
    row-gap:0;
  }
  body[data-page-key="home"] .brand-banner {
    height:40px;
    margin:0;
  }
  body[data-page-key="home"] .mobile-brand-name {
    max-height:36px;
  }
  body[data-page-key="home"] .topline {
    gap:4px;
  }

  /* Language is intentionally narrower, leaving more room for the active menu
     label. JavaScript only abbreviates after a tighter font still overflows. */
  .menu-current {
    
    
    
    
    
    
    
    
    
    text-overflow:clip;
  }
  
  
  

  /* Only a few pixels separate the menu line from the beginning of HOME. */
  
  body[data-page-key="home"] .collage-home {
    --mobile-wave-end:14%;
    --mobile-lower-start:74%;
    background:none;
    
  }

  /* Retire every legacy phone-only background layer. */
  

  /* Band 1: waveform. top:0 means it is physically unable to enter the header. */
  

  /* Band 2: portrait. It is centred in both axes and intentionally wider than
     HOME so a small, symmetrical amount may disappear at the side edges. */
  
  
  
  

  /* Band 3: the ONLY phone-portrait area in which Schaeffer vocabulary exists. */
  
  
  

  /* Same lower band, foreground layer; slightly above its mathematical centre. */
  

  /* Preserve footer alignment and spacing. */
  .site-footer .footer-links,
  body[data-page-key="home"] .footer-links {
    grid-column:1;
    justify-self:start;
    justify-content:flex-start;
    gap:11px;
  }
}


/* ── responsive HOME portrait geometry ──────────────────── */
/* Desktop + intermediate + phone landscape share JS-driven frame variables. */
@media (min-width:521px), (orientation:landscape) {
  body[data-page-key="home"] .collage-home .collage-medin-wrap {
    left:var(--medin-responsive-left,0px) !important;
    right:auto !important;
    top:var(--medin-responsive-top,50%) !important;
    bottom:auto !important;
    width:var(--medin-responsive-width,58%) !important;
    height:var(--medin-responsive-height,100%) !important;
    aspect-ratio:auto !important;
    transform:translateY(-50%) !important;
  }
  body[data-page-key="home"] .collage-medin-drift,
  body[data-page-key="home"] .collage-medin-glitch {
    position:absolute;
    inset:0;
    transform:none !important;
  }
  body[data-page-key="home"] .collage-home .collage-medin,
  body[data-page-key="home"] .collage-home .collage-medin-noise {
    object-fit:contain;
    object-position:right center;
    -webkit-mask-position:right center;
    mask-position:right center;
    transform:scaleX(.96);
    transform-origin:right center;
  }
}

/* In every compact navigation regime CONTACT belongs to the dropdown, never as
   a third independent control. Later landscape legacy rules cannot re-enable it. */
@media (max-width:1045px) {
  .top-contact-compact { display:none !important; }
  .menu-columns .phone-portrait-menu-only { display:block !important; }
}

/* Phone portrait banner is deliberately IDENTICAL on HOME, BIO, CONTACTO and
   future sections. Only the active text inside .menu-current is allowed to change. */
@media (max-width:520px) and (orientation:portrait) {
  .page,
  body[data-page-key="home"] .page,
  .bio-page .page,
  .contact-page .page {
    width:calc(100% - 8px) !important;
    padding:4px 0 !important;
  }
  .topbar,
  body[data-page-key="home"] .topbar,
  .bio-page .topbar,
  .contact-page .topbar {
    position:relative;
    z-index:30;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:40px !important;
    column-gap:4px !important;
    row-gap:0 !important;
    align-items:center;
    width:100% !important;
    min-height:40px !important;
    height:40px !important;
    margin:0 !important;
    padding:0 !important;
  }
  .brand-banner,
  body[data-page-key="home"] .brand-banner {
    grid-column:1 !important;
    grid-row:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:40px !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }
  .brand-banner-base,
  .brand-banner-wave-window,
  .brand-role { display:none !important; }
  .mobile-brand-name,
  body[data-page-key="home"] .mobile-brand-name {
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-width:100% !important;
    max-height:34px !important;
    object-fit:contain !important;
    object-position:left center !important;
    transform:none !important;
  }
  .topline,
  body[data-page-key="home"] .topline {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:4px !important;
    min-height:0 !important;
    width:auto !important;
  }
  .menu-compact-control, .lang-compact { display:block !important; }
  .menu-horizontal, .lang-wide, .top-contact-compact { display:none !important; }
  .menu-current {
    width:83px !important;
    min-width:83px !important;
    max-width:83px !important;
    height:34px !important;
    padding:0 6px !important;
    font-size:7.7px !important;
    line-height:1 !important;
    letter-spacing:.055em !important;
    white-space:nowrap !important;
    overflow:hidden !important;
  }
  .menu-current.is-tight { font-size:6.4px !important; letter-spacing:.025em !important; }
  .lang-current {
    width:83px !important;
    min-width:83px !important;
    max-width:83px !important;
    height:34px !important;
    padding:0 4px !important;
    font-size:8px !important;
  }
  .lang-options {
    width:83px !important;
    min-width:83px !important;
    left:auto !important;
    right:0 !important;
  }
  .menu-columns { top:calc(100% + 3px) !important; }

  /* HOME begins only 2 px below the common banner. The HOME and collage allow
     only the deliberately raised waveform to paint into the header; the page
     itself still clips the viewport and the header remains a higher layer. */
  body[data-page-key="home"] .hero {
    margin-top:2px !important;
    border:0 !important;
    overflow:visible !important;
  }
  body[data-page-key="home"] .collage-home {
    overflow:visible !important;
  }
  body[data-page-key="home"] .collage-grid,
  body[data-page-key="home"] .collage-table,
  body[data-page-key="home"] .collage-speaker-field { display:none !important; }

  /* The HOME waveform rises slightly behind the compact controls. Its lower edge
     stays where it was, so portrait geometry below it is unchanged. */
  body[data-page-key="home"] .collage-wave-canvas {
    display:block !important;
    left:0 !important;
    right:0 !important;
    top:-26px !important;
    bottom:auto !important;
    width:100% !important;
    height:calc(var(--mobile-wave-height,84px) + 26px) !important;
    overflow:hidden !important;
    pointer-events:none !important;
  }

  /* Portrait: true centre X, JS centre/size in Y, controlled symmetrical overscan. */
  body[data-page-key="home"] .collage-medin-wrap {
    left:50% !important;
    right:auto !important;
    top:var(--mobile-portrait-top,120px) !important;
    bottom:auto !important;
    width:var(--mobile-portrait-width,114%) !important;
    height:var(--mobile-portrait-height,auto) !important;
    aspect-ratio:auto !important;
    transform:translateX(-50%) !important;
    
  }
  body[data-page-key="home"] .collage-medin-drift,
  body[data-page-key="home"] .collage-medin-glitch { position:absolute; inset:0; }
  body[data-page-key="home"] .collage-home.is-portrait-layout .collage-medin,
  body[data-page-key="home"] .collage-medin {
    object-fit:contain !important;
    object-position:center center !important;
    transform:scaleX(.96) !important;
    transform-origin:center center !important;
  }
  body[data-page-key="home"] .collage-medin-noise {
    -webkit-mask-position:center center !important;
    mask-position:center center !important;
    transform:scaleX(.96) !important;
    transform-origin:center center !important;
  }

  /* Only this lower band can contain Schaeffer terms/symbols. */
  
  
  

  /* Same exact lower band, foreground. The text is mathematically centred
     between the visible portrait bottom and the footer boundary. */
  body[data-page-key="home"] .mobile-home-role {
    display:flex !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:var(--mobile-lower-start,72%) !important;
    bottom:0 !important;
    height:auto !important;
    align-items:center !important;
    justify-content:center !important;
    transform:none !important;
    
    border:0 !important;
    background:transparent !important;
    color:var(--ink) !important;
    font-family:"LackRegular","Lack",Arial,sans-serif !important;
    font-size:clamp(29px,8.35vw,37px) !important;
    font-weight:400 !important;
    line-height:1 !important;
    letter-spacing:.012em !important;
    white-space:nowrap !important;
    text-transform:lowercase !important;
  }
}

/* Horizontal phones: bigger portrait and visibly nearer the centre. */
@media (orientation:landscape) and (max-height:620px) and (max-width:1000px) {
  .top-contact-compact { display:none !important; }
  .menu-columns .phone-portrait-menu-only { display:block !important; }
  body[data-page-key="home"] .collage-home .collage-medin-wrap {
    left:var(--medin-responsive-left,12%) !important;
    top:var(--medin-responsive-top,51.5%) !important;
    width:var(--medin-responsive-width,62%) !important;
    height:var(--medin-responsive-height,112%) !important;
    transform:translateY(-50%) !important;
  }
}


/* ── compact-state + density refinements ────────────────── */
@media (max-width:520px) and (orientation:portrait) {
  /* Slightly larger 2 × 5 menu for legibility; active entry remains marked by
     the existing aria-current enlargement. */
  
  

  /* Compact language dropdown keeps the current language visibly active. */
  .lang-options button[aria-pressed="true"] {
    color:var(--accent) !important;
    font-size:10.8px !important;
    font-weight:700 !important;
    transform:scale(1.08);
    transform-origin:center center;
  }

  /* 17–24 Schaeffer items are deliberately denser and can overlap slightly. */
  
}


/* ── layering + compact menu + high-density mobile pass ─── */
/* Desktop/intermediate hierarchy: table + speakers -> waveform -> Schaeffer -> portrait. */
body[data-page-key="home"] .collage-schaeffer-field {
  z-index:5;
}

@media (max-width:520px) and (orientation:portrait) {
  /* One-column compact navigation. Normal phones show all ten rows; only an
     exceptionally short viewport falls back to internal scrolling. */
  .topbar {
    --compact-row-h:clamp(30px,calc((100dvh - 72px) / 10),40px);
  }
  .menu-columns {
    left:auto !important;
    right:54px !important;
    width:min(76vw,320px) !important;
    max-width:calc(100vw - 62px) !important;
    max-height:calc(100dvh - 48px) !important;
    padding:6px 10px !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-auto-rows:var(--compact-row-h) !important;
    column-gap:0 !important;
    row-gap:0 !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
  }
  .menu-columns a,
  .menu-columns .menu-item-disabled {
    grid-column:1 !important;
    grid-row:auto !important;
    display:flex !important;
    align-items:center !important;
    width:100% !important;
    height:var(--compact-row-h) !important;
    min-height:var(--compact-row-h) !important;
    box-sizing:border-box !important;
    padding:0 6px !important;
    font-size:11.1px !important;
    line-height:1 !important;
    letter-spacing:.055em !important;
    white-space:nowrap !important;
  }
  .menu-columns a[aria-current="page"] {
    transform:scale(1.16) !important;
    transform-origin:left center !important;
  }
  .menu-columns [data-k="software"] {
    white-space:nowrap !important;
  }

  /* Language rows share EXACTLY the same row height as the menu. */
  .lang-options {
    max-height:calc(100dvh - 48px) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
  .lang-options button {
    height:var(--compact-row-h) !important;
    min-height:var(--compact-row-h) !important;
    box-sizing:border-box !important;
  }

  /* Schaeffer vocabulary now fills the whole intermediate HOME frame. It sits
     in front of the waveform, but always behind portrait and role title. */
  body[data-page-key="home"] .collage-schaeffer-field {
    display:block !important;
    left:0 !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:100% !important;
    height:auto !important;
    z-index:5 !important;
    overflow:hidden !important;
  }
  body[data-page-key="home"] .schaeffer-item {
    color:rgba(67,56,47,.80) !important;
    will-change:opacity !important;
  }
  
  body[data-page-key="home"] .collage-wave-canvas { z-index:4 !important; }
  body[data-page-key="home"] .collage-medin-wrap { z-index:6 !important; }
  body[data-page-key="home"] .mobile-home-role { z-index:12 !important; }
}


/* ── mobile state + menu-row corrections ────────────────── */
@media (max-width:520px) and (orientation:portrait) {
  /* Opening either selector must keep its current label visible, including HOME
     where older rules intentionally use a transparent closed-state background. */
  .menu-current[aria-expanded="true"],
  .lang-current[aria-expanded="true"],
  body[data-page-key="home"] .menu-current[aria-expanded="true"],
  body[data-page-key="home"] .lang-current[aria-expanded="true"] {
    background:var(--ink) !important;
    color:var(--paper) !important;
  }

  /* HOME and CONTACTO inherited phone-portrait-menu-only. In the new 1×10
     menu they must use exactly the same flex row box as the other eight items. */
  .menu-columns .phone-portrait-menu-only,
  .menu-columns a.phone-portrait-menu-only {
    display:flex !important;
    align-items:center !important;
    width:100% !important;
    height:var(--compact-row-h) !important;
    min-height:var(--compact-row-h) !important;
    box-sizing:border-box !important;
    padding:0 6px !important;
    line-height:1 !important;
  }
}


/* ── selector + mobile-footer refinements ───────────────── */
.lang-current,
.menu-current {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.48em;
}
.selector-label { min-width:0; }
.selector-chevron {
  display:inline-block;
  flex:0 0 auto;
  font-size:1.22em;
  line-height:.72;
  font-weight:700;
  transform:translateY(-.015em);
}

@media (max-width:520px) and (orientation:portrait) {
  /* The disclosure mark needs to read as a control, not punctuation. */
  .menu-current .selector-chevron,
  .lang-current .selector-chevron {
    font-size:1.27em;
  }

  /* One compact footer line: icons left; copyright + update right. Neither
     textual block is allowed to wrap. */
  .site-footer,
  body[data-page-key="home"] .site-footer,
  .bio-page .site-footer,
  .contact-page .site-footer {
    min-height:32px !important;
    height:32px !important;
    margin-top:4px !important;
    padding:0 6px !important;
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) !important;
    grid-template-rows:1fr !important;
    align-items:center !important;
    justify-content:stretch !important;
    column-gap:7px !important;
    row-gap:0 !important;
    font-size:6.9px !important;
    line-height:1 !important;
    letter-spacing:.008em !important;
    text-align:right !important;
  }
  .footer-links,
  body[data-page-key="home"] .footer-links {
    grid-column:1 !important;
    grid-row:1 !important;
    order:initial !important;
    justify-self:start !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:4px !important;
    min-width:max-content !important;
  }
  .footer-icon,
  body[data-page-key="home"] .footer-icon {
    width:21px !important;
    height:21px !important;
    min-width:21px !important;
  }
  .footer-icon svg,
  body[data-page-key="home"] .footer-icon svg {
    width:13px !important;
    height:12px !important;
  }
  .footer-meta,
  body[data-page-key="home"] .footer-meta {
    grid-column:2 !important;
    grid-row:1 !important;
    order:initial !important;
    justify-self:end !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:9px !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    white-space:nowrap !important;
    text-align:right !important;
  }
  .footer-copyright,
  .footer-update,
  body[data-page-key="home"] .footer-copyright,
  body[data-page-key="home"] .footer-update {
    display:inline-block !important;
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }
  body[data-page-key="home"] .footer-copyright-name {
    display:inline !important;
  }
  .footer-copyright,
  body[data-page-key="home"] .footer-copyright { order:1 !important; }
  .footer-update,
  body[data-page-key="home"] .footer-update { order:2 !important; }
}

@media (max-width:360px) and (orientation:portrait) {
  .site-footer,
  body[data-page-key="home"] .site-footer,
  .bio-page .site-footer,
  .contact-page .site-footer {
    padding-left:5px !important;
    padding-right:5px !important;
    column-gap:5px !important;
    font-size:6.35px !important;
    letter-spacing:0 !important;
  }
  .footer-meta,
  body[data-page-key="home"] .footer-meta { gap:6px !important; }
  .footer-links,
  body[data-page-key="home"] .footer-links { gap:3px !important; }
}


/* ── TEXTOS + collision-free Schaeffer mobile field ─────── */
@media (max-width:520px) and (orientation:portrait) {
  body[data-page-key="home"] .schaeffer-item.is-visible { opacity:.58 !important; }
}


/* ── text-first desktop geometry + TEXTOS typography ───────
   - BIO / CONTACTO / TEXTOS share a fluid copy width capped at 1210px.
   - Desktop navigation has its own 1220px maximum plus a language-selector safety strip.
   - Decoration uses only residual lateral space and moves into flow before narrowing copy.
   - TEXTOS labels use page size; publication values are 1px smaller.
────────────────────────────────────────────────────────────────────── */


/* ── TEXTOS: editorial desktop + natural mobile flow ───────
   - Desktop: Título | Año | Tipo de publicación | Resumen; labels never wrap.
   - Download is integrated after the title, not a separate column.
   - All publication values are 1px below body copy.
   - Mobile: Título (año, tipo) → resumen + download icon.
────────────────────────────────────────────────────────────────────── */

/* v75 structural split: fixed labels above, rows only in the scroller. */
.texts-table-head { margin:0; }
.texts-table-body { margin:0; }


/* Legacy v78 accordion rules removed in v80: TEXTOS is permanently visible editorial copy. */

/* Desktop portrait interaction hit area. */
@media (min-width:901px) {
  body[data-page-key="home"] .collage-medin-wrap { pointer-events:auto; }
}

/* Phone portrait uses one structural shell on every section so the lower frame
   cannot jump when navigating HOME/BIO/CONTACTO/TEXTOS. */
@media (max-width:520px) and (orientation:portrait) {
  .page,
  body[data-page-key="home"] .page,
  .bio-page .page,
  .contact-page .page,
  .texts-page .page {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:40px minmax(0,1fr) 32px !important;
    gap:4px !important;
    width:calc(100% - 8px) !important;
    height:100dvh !important;
    min-height:100dvh !important;
    margin:0 auto !important;
    padding:4px 0 !important;
    overflow:hidden !important;
  }
  .topbar,
  body[data-page-key="home"] .topbar,
  .bio-page .topbar,
  .contact-page .topbar,
  .texts-page .topbar {
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    height:40px !important;
    min-height:40px !important;
    margin:0 !important;
  }
  .hero,
  body[data-page-key="home"] .hero,
  .bio-page .hero,
  .contact-page .hero,
  .texts-page .hero {
    grid-column:1 !important;
    grid-row:2 !important;
    min-height:0 !important;
    margin:0 !important;
  }
  .site-footer,
  body[data-page-key="home"] .site-footer,
  .bio-page .site-footer,
  .contact-page .site-footer,
  .texts-page .site-footer {
    grid-column:1 !important;
    grid-row:3 !important;
    width:100% !important;
    min-height:32px !important;
    height:32px !important;
    margin:0 !important;
  }

  /* Closed compact controls get only a very slight tonal separation. */
  .menu-current:not([aria-expanded="true"]),
  .lang-current:not([aria-expanded="true"]),
  body[data-page-key="home"] .menu-current:not([aria-expanded="true"]),
  body[data-page-key="home"] .lang-current:not([aria-expanded="true"]) {
    background:#e2d7cf !important;
  }

  /* The waveform extends into the common header but remains a lower layer.
     JavaScript positions the real waveform bbox so its animated positive peak
     stays a few pixels below the viewport edge. */
  body[data-page-key="home"] .hero { overflow:visible !important; }
  body[data-page-key="home"] .collage-home { overflow:visible !important; }
  body[data-page-key="home"] .collage-wave-canvas {
    top:-44px !important;
    height:calc(var(--mobile-wave-height,84px) + 44px) !important;
    z-index:4 !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .topbar { z-index:30 !important; }
  body[data-page-key="home"] .mobile-brand-name,
  body[data-page-key="home"] .menu-current,
  body[data-page-key="home"] .lang-current { position:relative; z-index:31; }

  /* HOME lower signature: same textual treatment, plus three independent
     vintage Étoile fronts. Speakers are deliberately behind Schaeffer vocabulary. */
  body[data-page-key="home"] .mobile-home-signature {
    display:flex !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:var(--mobile-lower-start,72%) !important;
    bottom:0 !important;
    z-index:auto !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:clamp(7px,2.2vw,11px) !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .mobile-home-role {
    position:relative !important;
    inset:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:auto !important;
    height:auto !important;
    flex:0 0 auto !important;
    display:block !important;
    z-index:12 !important;
    transform:none !important;
    font-size:clamp(29px,8.35vw,37px) !important;
    line-height:1 !important;
  }
  body[data-page-key="home"] .mobile-etoiles {
    position:relative !important;
    z-index:4 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:min(70vw,270px) !important;
    max-width:70% !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .mobile-etoile {
    display:block !important;
    width:clamp(43px,14vw,58px) !important;
    height:auto !important;
    opacity:.22 !important;
    filter:grayscale(1) sepia(.10) contrast(.96) !important;
    mix-blend-mode:multiply !important;
  }
  body[data-page-key="home"] .collage-schaeffer-field { display:block !important; z-index:5 !important; }
  body[data-page-key="home"] .collage-medin-wrap { z-index:6 !important; }

  /* Social controls keep their left alignment, but are now touchable. */
  .footer-links,
  body[data-page-key="home"] .footer-links { gap:9px !important; }
  .footer-icon,
  body[data-page-key="home"] .footer-icon {
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
  }
  .footer-icon svg,
  body[data-page-key="home"] .footer-icon svg {
    width:20px !important;
    height:18px !important;
  }

  /* Same accordion structure on phone; only the copy measure changes. */
  .texts-publication-summary,
  .texts-publication-panel { font-size:11.5px; }
  .texts-publication-summary { gap:.42em; }
  .texts-publication-panel {
    margin-top:8px;
    margin-left:6px;
    padding-left:10px;
  }
  .texts-publication-row { margin-bottom:7px; }
}

/* ── v79: unified desktop rail + editorial TEXTOS + HOME phone hierarchy ── */

.mobile-home-brand-large { display:none; }

/* Desktop menu/content now share one left-hand rail. The content rail always
   ends at least 40px before the effective horizontal menu rail. */
@media (min-width:1046px) {
  :root { --desktop-nav-inset:clamp(32px,calc(32px + (100vw - 1500px) * .12963),46px); }
  .menu-horizontal {
    margin-left:var(--desktop-nav-inset);
    width:min(var(--desktop-nav-max),calc(100% - var(--desktop-nav-inset)));
    max-width:var(--desktop-nav-max);
  }
  .bio-layout,
  .contact-layout,
  .texts-layout {
    --desktop-lang-reserve:78px;
    --section-copy-left:calc(var(--section-frame-right) + var(--desktop-nav-inset));
    --section-copy-width:min(
      var(--desktop-content-max),
      calc(100vw - var(--section-copy-left) - var(--section-frame-right) - var(--desktop-lang-reserve) - 40px)
    );
  }
}
@media (min-width:1181px) {
  .bio-layout,
  .contact-layout,
  .texts-layout { --desktop-lang-reserve:188px; }
}

/* With 1210px copy there is enough residual space to keep the decorative
   imagery lateral down to 1500px. Decoration never narrows the text rail. */
@media (min-width:1500px) {
  .bio-visuals { display:flex; }
  .bio-visuals-inline { display:none; }

  .contact-visual-inline { display:none !important; }
  .contact-visual {
    display:flex !important;
    left:24px;
    right:auto;
    width:clamp(220px,15vw,240px);
    max-width:240px;
    z-index:2;
  }
  .contact-content {
    --contact-form-offset:280px;
    margin-left:calc(var(--contact-copy-left) - var(--contact-frame-side) + var(--contact-form-offset));
    width:max(0px,calc(var(--contact-copy-width) - var(--contact-form-offset)));
  }
}
@media (max-width:1499px) and (min-width:901px) {
  .bio-visuals,
  .contact-visual { display:none !important; }
  .bio-visuals-inline { display:grid; }
  .contact-visual-inline { display:flex; }
}

/* TEXTOS: permanently visible editorial entries, no table, disclosure or
   accordion. Title + (author, year) + generic download action stay on the first
   line; the indented ficha contains only publication type, language and summary. */
.texts-publications-inner { width:var(--texts-copy-width); }
.texts-publications-list { width:100%; margin:0; padding:0 0 20px; }
.texts-publication {
  display:block;
  margin:0;
  padding:0;
  border:0;
  font-family:"Archivo",Arial,sans-serif;
  font-size:var(--texts-entry-size);
  font-weight:500;
  line-height:1.32;
}
.texts-publication + .texts-publication {
  margin-top:clamp(20px,3vh,32px);
  padding-top:clamp(18px,2.6vh,28px);
  border-top:1px solid var(--rule);
}
.texts-publication-heading {
  display:block;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  line-height:1.34;
}
.texts-publication-title { font-style:italic; font-weight:500; }
.texts-publication-byline {
  display:inline;
  font-style:normal;
  font-weight:400;
  white-space:nowrap;
}
.texts-heading-download {
  width:21px;
  height:21px;
  margin-left:3px;
  vertical-align:-5px;
}
.texts-heading-download svg { width:18px; height:18px; }
.texts-publication-panel {
  display:block;
  margin:6px 0 0 clamp(12px,1.35vw,20px);
  padding:2px 0 2px clamp(11px,1.25vw,18px);
  border-left:1px solid var(--rule);
  font:inherit;
  line-height:1.27;
}
.texts-publication-row {
  margin:0 0 3px;
  max-width:min(100%,1080px);
  line-height:1.27;
}
.texts-publication-row:last-child { margin-bottom:0; }
.texts-publication-label { color:var(--ink); font-weight:700; }
.texts-publication-value { color:var(--ink); font-weight:500; }
.texts-publication-summary-text {
  line-height:1.23;
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
}
.texts-publication-summary,
.texts-disclosure,
.texts-publication-download-row { display:none !important; }

/* CONTACT desktop: Schaeffer occupies the fixed decorative field at left of
   the form and lives outside the scrolling form container. */
@media (min-width:1500px) {
  .contact-visual {
    top:50%;
    transform:translateY(-50%);
    align-items:center;
    justify-content:center;
  }
  .contact-visual img {
    width:100%;
    max-width:240px;
    object-position:center center;
  }
}

@media (max-width:520px) and (orientation:portrait) {
  .hero { touch-action:pan-y; }
  /* MENU and language keep exactly the common mobile-header geometry on HOME
     and inner pages. Their closed/open buttons are transparent; dropdown panels
     retain their opaque paper background. */
  .topbar,
  body[data-page-key="home"] .topbar {
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:auto auto !important;
    column-gap:8px !important;
    row-gap:6px !important;
  }
  .brand-banner,
  body[data-page-key="home"] .brand-banner {
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    height:40px !important;
    margin:0 !important;
  }
  .topline,
  body[data-page-key="home"] .topline {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:4px !important;
    width:auto !important;
    min-height:0 !important;
  }
  .menu-current,
  .lang-current,
  body[data-page-key="home"] .menu-current,
  body[data-page-key="home"] .lang-current,
  .menu-current[aria-expanded="true"],
  .lang-current[aria-expanded="true"] {
    background:var(--paper) !important;
    color:var(--ink) !important;
  }

  /* HOME alone suppresses the small header name visually, keeping its structural
     column so MENU/language never move. A large identity line belongs to HOME. */
  body[data-page-key="home"] .brand-banner .mobile-brand-name {
    opacity:0 !important;
    visibility:hidden !important;
  }
  body[data-page-key="home"] .mobile-home-brand-large {
    display:block !important;
    position:absolute !important;
    z-index:12 !important;
    left:50% !important;
    top:var(--mobile-home-brand-top,5px) !important;
    width:var(--mobile-home-brand-width,94%) !important;
    height:auto !important;
    transform:translateX(-50%) !important;
    object-fit:contain !important;
    pointer-events:none !important;
  }

  /* The moving waveform starts halfway down the large name and remains behind it. */
  body[data-page-key="home"] .hero,
  body[data-page-key="home"] .collage-home { overflow:visible !important; }
  body[data-page-key="home"] .collage-wave-canvas {
    display:block !important;
    top:var(--mobile-wave-top,34px) !important;
    bottom:auto !important;
    height:var(--mobile-wave-height,98px) !important;
    z-index:4 !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .collage-schaeffer-field {
    display:block !important;
    top:-44px !important;
    bottom:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:auto !important;
    z-index:5 !important;
    overflow:hidden !important;
  }
  body[data-page-key="home"] .collage-medin-wrap { z-index:6 !important; }
  body[data-page-key="home"] .mobile-home-brand-large,
  body[data-page-key="home"] .mobile-home-role { z-index:12 !important; }
  body[data-page-key="home"] .mobile-home-role {
    font-size:var(--mobile-role-font-size,36px) !important;
    transform:translateY(-5px) !important;
  }

  /* Étoiles stay behind Schaeffer terms/symbols. Only their individual cones
     breathe; the metal front remains fixed. */
  body[data-page-key="home"] .mobile-etoiles {
    z-index:4 !important;
    transform:translateY(5px) !important;
  }
  body[data-page-key="home"] .mobile-etoile {
    position:relative !important;
    flex:0 0 auto !important;
    width:clamp(45px,14.7vw,61px) !important;
    aspect-ratio:1 / 1 !important;
    opacity:.25 !important;
    filter:grayscale(1) sepia(.10) contrast(.96) !important;
    mix-blend-mode:multiply !important;
  }
  body[data-page-key="home"] .mobile-etoile-base {
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }
  body[data-page-key="home"] .etoile-cone {
    position:absolute;
    inset:0;
    background-image:var(--etoile-image);
    background-repeat:no-repeat;
    background-position:center;
    background-size:100% 100%;
    clip-path:circle(var(--cr) at var(--cx) var(--cy));
    transform-origin:var(--cx) var(--cy);
    animation:etoileConeVibration var(--dur) ease-in-out var(--delay) infinite alternate;
    will-change:transform,filter;
    pointer-events:none;
  }

  /* TEXTOS keeps exactly the same editorial structure on phone. */
  .texts-publication { font-size:11.5px; }
  .texts-publication-heading {
    text-align:justify;
    text-justify:inter-word;
    hyphens:auto;
  }
  .texts-publication-panel {
    margin-top:6px;
    margin-left:6px;
    padding-left:10px;
    line-height:1.24;
  }
  .texts-publication-row { margin-bottom:3px; line-height:1.24; }
  .texts-publication-summary-text { line-height:1.20; }

  /* CONTACT mobile: enough scroll tail to place all of Schaeffer safely above
     the fixed lower gold frame at the end of the page. */
  .contact-page .contact-layout { padding-bottom:84px !important; }
  .contact-page .contact-scroll-grid { padding-bottom:84px !important; }
  .contact-page .contact-visual-inline { margin-bottom:44px !important; }
}

@keyframes etoileConeVibration {
  0%   { transform:scale(.994); filter:brightness(.98) contrast(1); }
  50%  { transform:scale(1.014); filter:brightness(.92) contrast(1.04); }
  100% { transform:scale(1.002); filter:brightness(.96) contrast(1.02); }
}



/* ─────────────────────────────────────────────────────────────
   v82 — phone portrait refinements + BIO/TEXTOS corrections
   - MENU and language selectors have identical width on portrait phones.
   - Inner-page Medín Peirón yields the required space; HOME large identity is independent.
   - HOME large identity sits slightly lower over the waveform.
   - TEXTOS ficha reaches the common right copy edge and uses regular, justified copy.
───────────────────────────────────────────────────────────── */
.texts-publication-panel {
  width:auto;
  max-width:none;
}
.texts-publication-row {
  width:100%;
  max-width:none;
  text-align:justify;
  text-align-last:auto;
  text-justify:inter-word;
  hyphens:auto;
}
.texts-publication-label,
.texts-publication-value {
  font-weight:400;
}

@media (max-width:520px) and (orientation:portrait) {
  .menu-current,
  .lang-current,
  body[data-page-key="home"] .menu-current,
  body[data-page-key="home"] .lang-current,
  .menu-current[aria-expanded="true"],
  .lang-current[aria-expanded="true"] {
    width:83px !important;
    min-width:83px !important;
    max-width:83px !important;
  }
  .lang-options {
    width:83px !important;
    min-width:83px !important;
    max-width:83px !important;
    left:auto !important;
    right:0 !important;
  }

  /* The inner-page wordmark lives in the flexible first grid column, so the
     equal selectors reduce it naturally. HOME uses the separate large identity. */
  body:not([data-page-key="home"]) .mobile-brand-name {
    width:100% !important;
    max-width:100% !important;
    object-fit:contain !important;
    object-position:left center !important;
  }

  /* Lower only the large HOME wordmark relative to the waveform. */
  body[data-page-key="home"] .mobile-home-brand-large {
    transform:translate(-50%,11px) !important;
  }
}


/* TEXTOS: one compact heading line. The +/− toggles the indented ficha;
   the download action is independent and always visible. */
.texts-publication-heading { line-height:1.38; }
.texts-publication-byline {
  display:inline;
  margin-left:.32em;
  font-style:normal;
  font-weight:400;
  white-space:nowrap;
}
.texts-publication-actions {
  display:inline-flex;
  align-items:center;
  gap:3px;
  margin-left:6px;
  white-space:nowrap;
  vertical-align:middle;
}
.texts-disclosure {
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-family:"Archivo",Arial,sans-serif;
  font-size:18px;
  font-weight:400;
  line-height:1;
  vertical-align:middle;
  transition:color .14s ease, transform .14s ease;
}
.texts-disclosure:hover,
.texts-disclosure:focus-visible { color:var(--accent); outline:none; }
.texts-disclosure:focus-visible { box-shadow:0 0 0 1px var(--accent); }
.texts-heading-download { margin-left:0; }
.texts-publication-panel[hidden] { display:none !important; }

@media (min-width:901px) {
  .texts-publication-byline { margin-left:.32em; }
}

/* CONTACT phone portrait: the gold frame ends after the form. Schaeffer is a
   separate image immediately below that lower border, never a background. */
.contact-visual-mobile { display:none; }
@media (max-width:520px) and (orientation:portrait) {
  .contact-page .contact-main::before { display:none !important; }
  .contact-page .contact-layout {
    position:relative;
    min-height:0 !important;
    padding-bottom:16px !important;
  }
  .contact-page .contact-layout::before {
    content:"";
    position:absolute;
    z-index:5;
    top:0;
    bottom:0;
    left:8px;
    right:8px;
    border:1px solid var(--accent);
    pointer-events:none;
  }
  .contact-page .contact-form-scroll,
  .contact-page .contact-scroll-grid { padding-bottom:0 !important; }
  .contact-page .contact-visual-inline { display:none !important; }
  .contact-page .contact-visual-mobile {
    display:flex;
    width:min(74%,300px);
    margin:22px auto 16px;
    align-items:center;
    justify-content:center;
  }
  .contact-page .contact-visual-mobile img {
    display:block;
    width:100%;
    height:auto;
    max-height:300px;
    object-fit:contain;
    filter:grayscale(1) contrast(1.02);
    opacity:.96;
  }
}


/* Full-resolution viewer: the retro treatment never reaches the opened image. */


/* CONTACT: on phone portrait the framed area is a true in-flow wrapper.
   Schaeffer follows it and therefore cannot inherit any vertical frame line. */
.contact-mobile-frame { display:contents; }
@media (max-width:520px) and (orientation:portrait) {
  .contact-page .contact-main {
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch;
  }
  .contact-page .contact-layout {
    height:auto !important;
    min-height:0 !important;
    flex:0 0 auto !important;
    padding:0 !important;
  }
  .contact-page .contact-layout::before { display:none !important; }
  .contact-page .contact-mobile-frame {
    display:block;
    position:relative;
    margin:0 5px;
    padding:0 0 12px;
    border:1px solid var(--accent);
  }
  .contact-page .contact-intro-fixed { padding-top:var(--section-copy-top); }
  .contact-page .contact-intro {
    margin-left:12px;
    width:calc(100% - 24px);
  }
  .contact-page .contact-workspace {
    position:relative;
    flex:none;
    min-height:0;
    margin:10px 0 0;
  }
  .contact-page .contact-form-scroll {
    position:relative;
    inset:auto;
    overflow:visible;
    padding:0;
    scrollbar-gutter:auto;
  }
  .contact-page .contact-scroll-grid {
    min-height:0;
    padding:0;
  }
  .contact-page .contact-content {
    width:calc(100% - 24px);
    margin-left:12px;
  }
  .contact-page .contact-visual-mobile {
    margin-top:18px;
    margin-bottom:14px;
  }
}


/* Retro graphite is baked into the thumbnails; CSS no longer recolours them. */


/* Viewer palette: same paper and line language as the site. */


@media (max-width:520px) and (orientation:portrait) {
  body[data-page-key="home"] .mobile-home-brand-large { transform:translate(-50%,14px) !important; }
  body[data-page-key="home"] .mobile-home-role { transform:translateY(2px) !important; }
  
  
  
  
  
  
  
  
}


/* The fallback is deliberately one-way: it never opens another fallback window. */


@media (max-width:520px) and (orientation:portrait) {
  body[data-page-key="home"] .mobile-home-role { transform:translateY(12px) !important; }
  
  
  
  
  
}

/* v86 guard: normal spacing between publication title and author/year. */
.texts-item-meta, .text-entry-meta, [data-text-meta] { margin-left:.32em; }


/* v87 — no extra gap between publication title and author/year. */
.texts-item-meta, .text-entry-meta, [data-text-meta] { margin-left:0 !important; }


/* ─────────────────────────────────────────────────────────────
   v88 — internal-page frame refinements
   + HOME tablet portrait / phone portrait position corrections
───────────────────────────────────────────────────────────── */

/* HOME: portrait tablet keeps the portrait truly centred on X and anchored to
   the lower edge. JS supplies the exact frame size/position variables. */
@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  body[data-page-key="home"] .collage-home .collage-medin-wrap {
    left:var(--medin-responsive-left,50%) !important;
    top:var(--medin-responsive-top,50%) !important;
    width:var(--medin-responsive-width,114%) !important;
    height:var(--medin-responsive-height,auto) !important;
    transform:translateY(-50%) !important;
  }
  body[data-page-key="home"] .collage-home .collage-medin,
  body[data-page-key="home"] .collage-home .collage-medin-noise {
    object-fit:contain !important;
    object-position:center bottom !important;
    -webkit-mask-position:center bottom !important;
    mask-position:center bottom !important;
    transform:scaleX(.96) !important;
    transform-origin:center bottom !important;
  }
}

/* HOME portrait phone: both identity lines sit a little lower than v87. */
@media (max-width:520px) and (orientation:portrait) {
  body[data-page-key="home"] .mobile-home-brand-large {
    transform:translate(-50%,18px) !important;
  }
  body[data-page-key="home"] .mobile-home-role {
    transform:translateY(16px) !important;
  }
}


/* Phone portrait identity can sit a little lower still. */
@media (max-width:520px) and (orientation:portrait) {
  body[data-page-key="home"] .mobile-home-brand-large { transform:translate(-50%,26px) !important; }
  body[data-page-key="home"] .mobile-home-role { transform:translateY(24px) !important; }
}


/* ─────────────────────────────────────────────────────────────
   v91 — contextual BIO footer tools
───────────────────────────────────────────────────────────── */
.site-footer { position:relative; }
.footer-page-tools {
  position:absolute;
  z-index:8;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0;
  background:transparent;
  border:0;
}
.footer-tool-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  margin:0;
  padding:4px;
  border:0;
  border-radius:50%;
  background:rgba(138,116,99,.78);
  color:var(--paper-soft);
  cursor:pointer;
  transition:background .16s ease,color .16s ease,opacity .16s ease,transform .16s ease;
}
.footer-tool-button:hover,
.footer-tool-button:focus-visible {
  background:rgba(138,116,99,.95);
  color:#fff;
  transform:translateY(-1px);
  outline:none;
}
.footer-tool-button[aria-pressed="true"] { background:rgba(138,116,99,.95); color:#fff; opacity:1; }
.footer-tool-button[aria-pressed="false"] { opacity:.72; }
.footer-tool-icon {
  display:block;
  width:18px;
  height:18px;
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-width:1.70;
  stroke-linecap:round;
  stroke-linejoin:round;
}
/* Footer tools are page-specific; other pages keep the original footer untouched. */
body:not(.bio-page) .footer-page-tools { display:none !important; }

/* BIO narrative cutouts use the full text measure on wide layouts. */
@media (min-width:701px) {
  .bio-story-visuals { width:100% !important; justify-content:space-between !important; }
}

/* Portrait phone: compact BIO footer tools. */
@media (max-width:520px) and (orientation:portrait) {
  .bio-page .footer-page-tools {
    gap:5px;
    padding:0;
  }
  .bio-page .footer-tool-button { width:24px; height:24px; padding:3px; }
  .bio-page .footer-tool-icon { width:14.5px; height:14.5px; }
}

@media (min-width:521px) and (max-width:1045px) {
  .menu-columns a,
  .menu-columns .menu-item-disabled {
    font-size:10px !important;
    line-height:1.15 !important;
    padding:7.5px 5px !important;
  }
}


/* ─────────────────────────────────────────────────────────────
   v93 — tablet portrait refinement + robust contextual footer
───────────────────────────────────────────────────────────── */

/* Contextual tools occupy a real centre column whenever horizontal room is tight.
   Metadata becomes a two-line, right-aligned block so it can never collide with
   BIO actions. */
@media (max-width:1045px) {
  .bio-page .site-footer {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;
    grid-template-rows:1fr !important;
    align-items:center !important;
    column-gap:8px !important;
  }
  .bio-page .footer-links {
    grid-column:1 !important;
    grid-row:1 !important;
    justify-self:start !important;
  }
  .bio-page .footer-page-tools {
    position:static !important;
    grid-column:2 !important;
    grid-row:1 !important;
    justify-self:center !important;
    transform:none !important;
  }
  .bio-page .footer-meta {
    grid-column:3 !important;
    grid-row:1 !important;
    justify-self:end !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-end !important;
    justify-content:center !important;
    gap:2px !important;
    width:auto !important;
    max-width:none !important;
    white-space:nowrap !important;
    text-align:right !important;
    line-height:1.05 !important;
  }
  .bio-page .footer-copyright,
  .bio-page .footer-update {
    display:block !important;
    white-space:nowrap !important;
  }
}


/* ─────────────────────────────────────────────────────────────
   v95 — vertical HOME unification + reliable compact controls
───────────────────────────────────────────────────────────── */

/* Selector children never steal the pointer target from their button. */
.selector-label,
.selector-chevron { pointer-events:none !important; }
.menu-current,
.lang-current {
  touch-action:manipulation;
  user-select:none;
  -webkit-user-select:none;
}

/* Page-to-page swipe is active on every portrait touch layout. */
@media (max-width:1045px) and (orientation:portrait) {
  .hero { touch-action:pan-y !important; }
}

/* Portrait tablet uses the same compact header language as portrait phone:
   wordmark | MENU | language. INDEX keeps the header wordmark invisible because
   its large identity belongs inside the HOME composition. */
@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  .topbar,
  body[data-page-key="home"] .topbar {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:40px !important;
    column-gap:8px !important;
    row-gap:0 !important;
    align-items:center !important;
    min-height:40px !important;
    height:40px !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
  .brand-banner,
  body[data-page-key="home"] .brand-banner {
    grid-column:1 !important;
    grid-row:1 !important;
    justify-self:stretch !important;
    width:100% !important;
    max-width:none !important;
    height:40px !important;
    margin:0 !important;
    overflow:visible !important;
    transform:none !important;
  }
  .brand-banner-base,
  .brand-banner-wave-window,
  .brand-role { display:none !important; }
  .mobile-brand-name {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:left center !important;
  }
  .topline,
  body[data-page-key="home"] .topline {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:4px !important;
    width:auto !important;
    min-height:0 !important;
  }
  .menu-compact-control,
  .lang-compact { display:block !important; grid-column:auto !important; grid-row:auto !important; }
  .menu-horizontal,
  .lang-wide,
  .top-contact-compact { display:none !important; }
  .menu-current,
  .lang-current,
  body[data-page-key="home"] .menu-current,
  body[data-page-key="home"] .lang-current {
    width:83px !important;
    min-width:83px !important;
    max-width:83px !important;
    height:34px !important;
    padding:0 6px !important;
    background:var(--paper) !important;
    color:var(--ink) !important;
    font-size:8.8px !important;
  }
  .lang-options {
    width:83px !important;
    min-width:83px !important;
    max-width:83px !important;
    left:auto !important;
    right:0 !important;
  }
  body[data-page-key="home"] .brand-banner .mobile-brand-name {
    opacity:0 !important;
    visibility:hidden !important;
  }

  /* Same one-column menu as portrait phone, just with the tablet's available height. */
  .topbar { --tablet-menu-row-h:clamp(31px,4.2dvh,36px); }
  .menu-columns {
    left:0 !important;
    right:auto !important;
    width:min(78vw,340px) !important;
    max-width:calc(100vw - 28px) !important;
    max-height:calc(100dvh - 56px) !important;
    padding:6px 10px !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-auto-rows:var(--tablet-menu-row-h) !important;
    column-gap:0 !important;
    row-gap:0 !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
  }
  .menu-columns a,
  .menu-columns .menu-item-disabled,
  .menu-columns .phone-portrait-menu-only,
  .menu-columns a.phone-portrait-menu-only {
    grid-column:1 !important;
    grid-row:auto !important;
    display:flex !important;
    align-items:center !important;
    width:100% !important;
    height:var(--tablet-menu-row-h) !important;
    min-height:var(--tablet-menu-row-h) !important;
    box-sizing:border-box !important;
    padding:0 6px !important;
    font-size:11.1px !important;
    line-height:1 !important;
    letter-spacing:.055em !important;
    white-space:nowrap !important;
  }
  .menu-columns a[aria-current="page"] {
    transform:scale(1.16) !important;
    transform-origin:left center !important;
  }

  /* CONTACT keeps the existing decorative Schaeffer image after ENVIAR. */
  .contact-page .contact-visual { display:none !important; }
  .contact-page .contact-visual-inline {
    display:flex !important;
    width:min(34%,250px) !important;
    margin:28px auto 8px !important;
    padding-top:18px !important;
    border-top:1px solid var(--rule) !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .contact-page .contact-visual-inline img {
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-height:280px !important;
    object-fit:contain !important;
    filter:grayscale(1) contrast(1.02) !important;
    opacity:.96 !important;
  }
}

/* Tablet portrait INDEX is now the same visual system as portrait phone.
   The old table and conventional loudspeaker field are intentionally absent. */
@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  body[data-page-key="home"] .hero,
  body[data-page-key="home"] .collage-home { overflow:visible !important; }
  body[data-page-key="home"] .collage-grid,
  body[data-page-key="home"] .collage-table,
  body[data-page-key="home"] .collage-speaker-field { display:none !important; }

  body[data-page-key="home"] .mobile-home-brand-large {
    display:block !important;
    position:absolute !important;
    z-index:12 !important;
    left:50% !important;
    top:var(--mobile-home-brand-top,12px) !important;
    width:var(--mobile-home-brand-width,89%) !important;
    height:auto !important;
    transform:translateX(-50%) !important;
    object-fit:contain !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .collage-wave-canvas {
    display:block !important;
    left:0 !important;
    right:0 !important;
    top:var(--mobile-wave-top,44px) !important;
    bottom:auto !important;
    width:100% !important;
    height:var(--mobile-wave-height,150px) !important;
    z-index:4 !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .collage-schaeffer-field {
    display:block !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    z-index:5 !important;
    overflow:hidden !important;
  }
  body[data-page-key="home"] .schaeffer-item.is-visible { opacity:.58 !important; }
  body[data-page-key="home"] .collage-home .collage-medin-wrap {
    display:block !important;
    left:50% !important;
    right:auto !important;
    top:var(--mobile-portrait-top,180px) !important;
    bottom:auto !important;
    width:var(--mobile-portrait-width,114%) !important;
    height:var(--mobile-portrait-height,auto) !important;
    aspect-ratio:auto !important;
    transform:translateX(-50%) !important;
    z-index:6 !important;
  }
  body[data-page-key="home"] .collage-medin-drift,
  body[data-page-key="home"] .collage-medin-glitch { position:absolute !important; inset:0 !important; }
  body[data-page-key="home"] .collage-home .collage-medin,
  body[data-page-key="home"] .collage-home .collage-medin-noise {
    object-fit:contain !important;
    object-position:center center !important;
    -webkit-mask-position:center center !important;
    mask-position:center center !important;
    transform:scaleX(.96) !important;
    transform-origin:center center !important;
  }
  body[data-page-key="home"] .mobile-home-signature {
    display:flex !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:var(--mobile-lower-start,72%) !important;
    bottom:0 !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:clamp(12px,2.2vw,24px) !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .mobile-home-role {
    position:relative !important;
    inset:auto !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    z-index:12 !important;
    font-size:var(--mobile-role-font-size,68px) !important;
    line-height:1 !important;
    transform:none !important;
  }
  body[data-page-key="home"] .mobile-etoiles {
    position:relative !important;
    z-index:4 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:70% !important;
    max-width:none !important;
    transform:none !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .mobile-etoile {
    position:relative !important;
    display:block !important;
    flex:0 0 auto !important;
    width:21% !important;
    height:auto !important;
    aspect-ratio:1 / 1 !important;
    opacity:.25 !important;
    filter:grayscale(1) sepia(.10) contrast(.96) !important;
    mix-blend-mode:multiply !important;
  }
  body[data-page-key="home"] .mobile-etoile-base {
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }
  body[data-page-key="home"] .etoile-cone {
    position:absolute !important;
    inset:0 !important;
    background-image:var(--etoile-image) !important;
    background-repeat:no-repeat !important;
    background-position:center !important;
    background-size:100% 100% !important;
    clip-path:circle(var(--cr) at var(--cx) var(--cy)) !important;
    transform-origin:var(--cx) var(--cy) !important;
    animation:etoileConeVibration var(--dur) ease-in-out var(--delay) infinite alternate !important;
    will-change:transform,filter !important;
    pointer-events:none !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   v96 — unified portrait tablet HOME + refined scratch language
───────────────────────────────────────────────────────────── */

/* HOME portrait scratch: restore the pre-v97 two-band geometry. The base
   A/B clip paths above are authoritative; timing is sparse in main.js so the
   portrait remains completely clean for long intervals between events. */

/* Portrait tablet inner pages: larger compact controls and a substantially more
   readable single-column menu. INDEX intentionally keeps its smaller controls. */
@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  body:not([data-page-key="home"]) .topbar {
    grid-template-rows:46px !important;
    min-height:46px !important;
    height:46px !important;
  }
  body:not([data-page-key="home"]) .brand-banner {
    height:46px !important;
  }
  body:not([data-page-key="home"]) .mobile-brand-name {
    height:100% !important;
    max-height:43px !important;
  }
  body:not([data-page-key="home"]) .menu-current,
  body:not([data-page-key="home"]) .lang-current {
    width:95.5px !important;
    min-width:95.5px !important;
    max-width:95.5px !important;
    height:39px !important;
    padding:0 7px !important;
    font-size:10.1px !important;
  }
  body:not([data-page-key="home"]) .lang-options {
    width:95.5px !important;
    min-width:95.5px !important;
    max-width:95.5px !important;
  }
  body:not([data-page-key="home"]) .topbar { --tablet-menu-row-h:clamp(36px,4.75dvh,42px); }
  body:not([data-page-key="home"]) .menu-columns a,
  body:not([data-page-key="home"]) .menu-columns .menu-item-disabled,
  body:not([data-page-key="home"]) .menu-columns .phone-portrait-menu-only,
  body:not([data-page-key="home"]) .menu-columns a.phone-portrait-menu-only {
    font-size:14.43px !important;
    letter-spacing:.05em !important;
  }
  body:not([data-page-key="home"]) .menu-columns a[aria-current="page"] {
    transform:scale(1.12) !important;
  }
}

/* Tablet portrait INDEX really uses the phone composition: large identity,
   unclipped waveform, foreground portrait, three étoiles and dense Schaeffer field. */
@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  body[data-page-key="home"] .hero,
  body[data-page-key="home"] .collage-home {
    overflow:visible !important;
  }
  body[data-page-key="home"] .collage-wave-canvas {
    display:block !important;
    left:0 !important;
    right:0 !important;
    top:var(--mobile-wave-top,44px) !important;
    bottom:auto !important;
    width:100% !important;
    height:var(--mobile-wave-height,240px) !important;
    z-index:4 !important;
    overflow:visible !important;
    pointer-events:none !important;
  }
  body[data-page-key="home"] .collage-schaeffer-field {
    display:block !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    z-index:5 !important;
    overflow:hidden !important;
  }
  body[data-page-key="home"] .collage-medin-wrap {
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    left:50% !important;
    right:auto !important;
    top:var(--mobile-portrait-top,190px) !important;
    bottom:auto !important;
    width:var(--mobile-portrait-width,114%) !important;
    height:var(--mobile-portrait-height,520px) !important;
    aspect-ratio:auto !important;
    transform:translateX(-50%) !important;
    z-index:6 !important;
    overflow:visible !important;
  }
  body[data-page-key="home"] .collage-medin-drift,
  body[data-page-key="home"] .collage-medin-glitch {
    display:block !important;
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    transform:none !important;
  }
  body[data-page-key="home"] .collage-medin,
  body[data-page-key="home"] .collage-medin-noise {
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center center !important;
    -webkit-mask-position:center center !important;
    mask-position:center center !important;
    transform:scaleX(.96) !important;
    transform-origin:center center !important;
  }
  body[data-page-key="home"] .mobile-home-role {
    font-family:"LackRegular","Lack",Arial,sans-serif !important;
    font-size:var(--mobile-role-font-size,68px) !important;
    font-weight:400 !important;
    letter-spacing:.012em !important;
    text-transform:lowercase !important;
  }
}


/* ─────────────────────────────────────────────────────────────
   v97 — tablet menu anchoring + HOME optical spacing
───────────────────────────────────────────────────────────── */

@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  /* MENU panel is visually attached to the MENU selector: its right edge
     coincides with the selector's right edge and it expands to the left. */
  body:not([data-page-key="home"]) .menu-columns {
    left:auto !important;
    right:99.5px !important; /* 95.5px language selector + 4px gap */
  }
  body[data-page-key="home"] .menu-columns {
    left:auto !important;
    right:87px !important; /* 83px language selector + 4px gap */
  }

  /* Optical breathing room requested beneath the portrait. */
  body[data-page-key="home"] .mobile-home-role {
    transform:translateY(19px) !important;
  }
}


/* ─────────────────────────────────────────────────────────────
   v98 — desktop editorial rail, framed scrollbar + download fallback
───────────────────────────────────────────────────────────── */

/* Reusable scrollbar visual: same 8px/accent treatment as before. */
.desktop-frame-scroll {
  scrollbar-width:thin;
  scrollbar-color:var(--accent) transparent;
}
.desktop-frame-scroll::-webkit-scrollbar { width:8px; }
.desktop-frame-scroll::-webkit-scrollbar-track { background:transparent; }
.desktop-frame-scroll::-webkit-scrollbar-thumb { background:var(--accent); }

@media (min-width:1046px) {
  .bio-layout,
  .texts-layout,
  .contact-layout {
    --desktop-frame-side:max(14px,calc((100vw - 1580px) / 2));
    --desktop-scrollbar-gap:7px;
  }

  /* BIO: the scrollport ends just before the frame; the editorial rail uses
     1fr / 1.6fr side tracks, shifting the editorial rail slightly left while preserving generous right-hand air. */
  .bio-text-scroll {
    left:var(--desktop-frame-side) !important;
    right:calc(var(--desktop-frame-side) + var(--desktop-scrollbar-gap)) !important;
    display:grid;
    grid-template-columns:minmax(35px,1fr) minmax(0,var(--desktop-content-max)) minmax(42px,1.6fr);
    align-content:start;
  }
  .bio-content {
    grid-column:2;
    width:100% !important;
    min-width:0;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  /* TEXTOS: fixed introduction and scrolling catalogue share exactly the same rail. */
  .texts-fixed {
    display:grid;
    grid-template-columns:minmax(35px,1fr) minmax(0,var(--desktop-content-max)) minmax(42px,1.6fr);
    padding-left:var(--desktop-frame-side) !important;
    padding-right:calc(var(--desktop-frame-side) + var(--desktop-scrollbar-gap)) !important;
  }
  .texts-intro,
  .texts-table-head-wrap {
    grid-column:2;
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .texts-publications-scroll {
    margin-left:var(--desktop-frame-side) !important;
    margin-right:calc(var(--desktop-frame-side) + var(--desktop-scrollbar-gap)) !important;
    display:grid;
    grid-template-columns:minmax(35px,1fr) minmax(0,var(--desktop-content-max)) minmax(42px,1.6fr);
    align-content:start;
  }
  .texts-publications-inner {
    grid-column:2;
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  /* CONTACTO: Schaeffer and the form are one composition inside the same
     editorial rail, rather than two independently positioned systems. */
  .contact-intro-fixed {
    display:grid;
    grid-template-columns:minmax(35px,1fr) minmax(0,var(--desktop-content-max)) minmax(42px,1.6fr);
    padding-left:var(--desktop-frame-side) !important;
    padding-right:calc(var(--desktop-frame-side) + var(--desktop-scrollbar-gap)) !important;
  }
  .contact-intro {
    grid-column:2;
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .contact-workspace {
    margin-left:var(--desktop-frame-side) !important;
    margin-right:calc(var(--desktop-frame-side) + var(--desktop-scrollbar-gap)) !important;
  }
  .contact-form-scroll {
    display:grid;
    grid-template-columns:minmax(35px,1fr) minmax(0,var(--desktop-content-max)) minmax(42px,1.6fr);
    align-content:start;
  }
  .contact-scroll-grid {
    grid-column:2;
    width:100%;
    min-width:0;
    display:grid;
    grid-template-columns:minmax(0,1fr) clamp(150px,13vw,190px);
    gap:clamp(30px,3vw,48px);
    align-items:center;
  }
  .contact-content {
    grid-column:1;
    width:100% !important;
    min-width:0;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .contact-visual { display:none !important; }
  .contact-visual-inline {
    grid-column:2;
    display:flex !important;
    width:100%;
    margin:0;
    padding:0;
    border:0;
    align-items:center;
    justify-content:center;
    align-self:center;
  }
  .contact-visual-inline img {
    display:block;
    width:100%;
    height:auto;
    max-width:190px;
    max-height:58vh;
    object-fit:contain;
    filter:grayscale(1) contrast(1.02);
    opacity:.96;
  }

}

/* Download fallback: an in-site viewer, never the browser's naked PNG tab. */


/* ─────────────────────────────────────────────────────────────
   v99 — geometry-safe colour reveal + larger portrait-tablet controls
───────────────────────────────────────────────────────────── */
@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  /* Inner pages only: +15% over v98. HOME keeps its established compact header. */
  body:not([data-page-key="home"]) {
    --tablet-selector-w:110px;
    --tablet-selector-h:45px;
    --tablet-selector-font:11.62px;
    --tablet-menu-font:16.6px;
    --tablet-menu-row-h:clamp(41.4px,5.46dvh,48.3px);
  }
  body:not([data-page-key="home"]) .topbar {
    grid-template-rows:53px !important;
    min-height:53px !important;
    height:53px !important;
  }
  body:not([data-page-key="home"]) .brand-banner {
    height:53px !important;
  }
  body:not([data-page-key="home"]) .mobile-brand-name {
    height:100% !important;
    max-height:49.5px !important;
  }
  body:not([data-page-key="home"]) .menu-current,
  body:not([data-page-key="home"]) .lang-current {
    width:var(--tablet-selector-w) !important;
    min-width:var(--tablet-selector-w) !important;
    max-width:var(--tablet-selector-w) !important;
    height:var(--tablet-selector-h) !important;
    padding:0 8px !important;
    font-size:var(--tablet-selector-font) !important;
  }

  /* MENU remains attached to its selector. The language selector is 110px wide,
     so the MENU panel's right edge is exactly the MENU button's right edge. */
  body:not([data-page-key="home"]) .menu-columns {
    left:auto !important;
    right:calc(var(--tablet-selector-w) + 4px) !important;
    max-height:calc(100dvh - 64px) !important;
    grid-auto-rows:var(--tablet-menu-row-h) !important;
  }
  body:not([data-page-key="home"]) .menu-columns a,
  body:not([data-page-key="home"]) .menu-columns .menu-item-disabled,
  body:not([data-page-key="home"]) .menu-columns .phone-portrait-menu-only,
  body:not([data-page-key="home"]) .menu-columns a.phone-portrait-menu-only {
    height:var(--tablet-menu-row-h) !important;
    min-height:var(--tablet-menu-row-h) !important;
    font-size:var(--tablet-menu-font) !important;
    line-height:1 !important;
  }

  /* Language dropdown uses the exact same typography and row height as MENU.
     It is right-anchored to the language selector, hence all extra width grows
     towards the left and never outside the intermediate frame. */
  body:not([data-page-key="home"]) .lang-options {
    left:auto !important;
    right:0 !important;
    width:var(--tablet-selector-w) !important;
    min-width:var(--tablet-selector-w) !important;
    max-width:var(--tablet-selector-w) !important;
    max-height:calc(100dvh - 64px) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
  body:not([data-page-key="home"]) .lang-options button {
    height:var(--tablet-menu-row-h) !important;
    min-height:var(--tablet-menu-row-h) !important;
    padding:0 8px !important;
    box-sizing:border-box !important;
    font-size:var(--tablet-menu-font) !important;
    line-height:1 !important;
    letter-spacing:.05em !important;
  }
}


/* ─────────────────────────────────────────────────────────────
   v100 — authoritative text justification + INDEX tablet parity
───────────────────────────────────────────────────────────── */

/* Running-copy colour follows the warm paper palette without recolouring
   headings, navigation, controls, icons or form UI. */
.bio-page .bio-content p,
.contact-page .contact-intro,
.texts-page .texts-layout p {
  color:var(--body-copy);
}

/* Running text is justified everywhere. UI labels, controls, footer metadata
   and the download-viewer instruction keep their intentional alignment. */
.bio-page .bio-content p,
.contact-page .contact-intro,
.texts-page .texts-layout p {
  text-align:justify !important;
  text-align-last:auto !important;
  text-justify:inter-word !important;
  hyphens:auto !important;
}

@media (min-width:521px) and (max-width:1045px) and (orientation:portrait) {
  /* INDEX now uses exactly the same selector scale as the tablet inner pages. */
  body[data-page-key="home"] {
    --tablet-selector-w:110px;
    --tablet-selector-h:45px;
    --tablet-selector-font:11.62px;
    --tablet-menu-font:16.6px;
    --tablet-menu-row-h:clamp(41.4px,5.46dvh,48.3px);
  }
  body[data-page-key="home"] .topbar {
    grid-template-rows:53px !important;
    min-height:53px !important;
    height:53px !important;
  }
  body[data-page-key="home"] .brand-banner { height:53px !important; }
  body[data-page-key="home"] .menu-current,
  body[data-page-key="home"] .lang-current {
    width:var(--tablet-selector-w) !important;
    min-width:var(--tablet-selector-w) !important;
    max-width:var(--tablet-selector-w) !important;
    height:var(--tablet-selector-h) !important;
    padding:0 8px !important;
    font-size:var(--tablet-selector-font) !important;
  }
  body[data-page-key="home"] .menu-columns {
    left:auto !important;
    right:calc(var(--tablet-selector-w) + 4px) !important;
    max-height:calc(100dvh - 64px) !important;
    grid-auto-rows:var(--tablet-menu-row-h) !important;
  }
  body[data-page-key="home"] .menu-columns a,
  body[data-page-key="home"] .menu-columns .menu-item-disabled,
  body[data-page-key="home"] .menu-columns .phone-portrait-menu-only,
  body[data-page-key="home"] .menu-columns a.phone-portrait-menu-only {
    height:var(--tablet-menu-row-h) !important;
    min-height:var(--tablet-menu-row-h) !important;
    font-size:var(--tablet-menu-font) !important;
    line-height:1 !important;
  }
  body[data-page-key="home"] .lang-options {
    left:auto !important;
    right:0 !important;
    width:var(--tablet-selector-w) !important;
    min-width:var(--tablet-selector-w) !important;
    max-width:var(--tablet-selector-w) !important;
    max-height:calc(100dvh - 64px) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
  body[data-page-key="home"] .lang-options button {
    height:var(--tablet-menu-row-h) !important;
    min-height:var(--tablet-menu-row-h) !important;
    padding:0 8px !important;
    box-sizing:border-box !important;
    font-size:var(--tablet-menu-font) !important;
    line-height:1 !important;
    letter-spacing:.05em !important;
  }
  body[data-page-key="home"] .mobile-home-brand-large {
    width:94% !important;
  }
}


/* v106 — desktop navigation is content-driven in landscape. JS exposes this
   state only when the full or abbreviated rail actually fits. Portrait tablet
   and phone navigation retain their established compact behaviour. */
@media (min-width:521px) and (orientation:landscape) {
  html.nav-fit-desktop .topline { grid-template-columns:minmax(0,1fr) auto !important; gap:14px !important; }
  html.nav-fit-desktop .menu-horizontal { display:block !important; grid-column:1 !important; min-width:0 !important; }
  html.nav-fit-desktop .menu-compact-control { display:none !important; }
  html.nav-fit-desktop .top-contact-compact { display:none !important; }
  html.nav-fit-desktop .lang-compact { grid-column:2 !important; justify-self:end !important; }
}


/* v108 — VER is intentionally unavailable in portrait tablet and phone layouts.
   Download controls remain unchanged. */

/* v127 — HOME portrait first-paint guard. Geometry is written synchronously by
   index.js; until then only the portrait layer stays hidden (no fade/transition). */
html.js body[data-page-key="home"] .collage-home:not(.home-portrait-ready) .collage-medin-wrap {
  visibility:hidden !important;
}