/* Obras — one editorial measure for the text of every work.
   Baseline: Arqueología de un cuerpo. Keep intentional photographic layouts,
   quotations, technical captions and the specially approved Gigantismo title. */

:root {
  /* Single reference for the editorial copy in Obras, Statement, Bio and Proyectos. */
  --editorial-column-width: 24.5vw;
  --editorial-column-right: var(--artwork-right-safe, calc(var(--gutter) + 4.25vw));
  --editorial-copy-size: clamp(11px, .94vw, 16px);
  --editorial-title-size: clamp(12px, 1.04vw, 17px);
  --editorial-copy-leading: 1.3;
}

/* Mouse hover should never draw a frame around an artwork.
   Keyboard focus remains visible via the existing :focus-visible rules. */
.project .pdf-image:hover:not(:focus-visible) {
  outline: none;
  outline-offset: 0;
}

@media (min-width: 1025px) and (not ((max-width: 1366px) and (hover: none) and (pointer: coarse))) {
  .project {
    --obras-text-width: var(--editorial-column-width);
    --obras-text-right: var(--editorial-column-right);
    --obras-text-size: var(--editorial-copy-size);
    --obras-title-size: var(--editorial-title-size);
  }

  /* Two inherited page-specific measures were narrower than the others. */
  .nonce-editorial-project { --nonce-copy-width: var(--obras-text-width); }
  .ser-project .ser-intro > h1,
  .ser-project .ser-description {
    width: var(--obras-text-width);
    max-width: none;
  }

  /* Absolute editorial columns share the same right-hand grid line.
     Grid-based pages already use this line through their parent padding. */
  .project:not(.geopoiesis-project):not(.en-contacto-project) .project-copy {
    right: var(--obras-text-right);
    width: var(--obras-text-width);
  }
  .project.pdf-project .pdf-flow-title,
  .project.pdf-project .pdf-flow-body { width: 24.5%; }

  .project :is(
    .project-copy, .vacia-story-copy, .bosque-story-copy, .nonce-copy,
    .gigantismo-copy, .fiore-story, .pdf-flow-body, .ser-description
  ) {
    font-family: "Times Draft", "Times New Roman", serif;
    font-size: var(--obras-text-size);
    line-height: 1.3;
    font-weight: 400;
  }

  .project :is(
    .project-copy h1, .pdf-flow-title, .ser-intro h1,
    .vacia-editorial-heading h1, .bosque-editorial-heading h1,
    .nonce-copy h1, .fiore-story h1
  ) {
    font-size: var(--obras-title-size);
    line-height: 1.2;
  }

  /* The narrow desktop layout positions Appunti's column in the flow;
     do not reintroduce a relative right offset there. */
  @media (max-width: 1150px) {
    .project.appunti-project .project-copy { right: auto; }
  }
}

@media (max-width: 1024px), (max-width: 1366px) and (hover: none) and (pointer: coarse) {
  .project {
    --obras-compact-size: 15px;
    --obras-compact-title: 16px;
  }
  .project :is(
    .project-copy, .vacia-story-copy, .bosque-story-copy, .nonce-copy,
    .gigantismo-copy, .fiore-story, .ser-description
  ) {
    width: min(100%, 440px);
    max-width: 440px;
    margin-left: auto;
    margin-right: 0;
    font-family: "Times Draft", "Times New Roman", serif;
    font-size: var(--obras-compact-size);
    line-height: 1.35;
  }
  /* PDF-format pages use a full-width outer block with a shared inset. */
  .project.pdf-project > .pdf-mobile-copy {
    width: min(calc(100% - 44px), 440px);
    max-width: 440px;
    margin-left: auto;
    margin-right: 22px;
    padding-left: 0;
    padding-right: 0;
    font-size: var(--obras-compact-size);
    line-height: 1.35;
  }
  .project.pdf-project > .pdf-mobile-copy p {
    font-size: inherit;
    line-height: inherit;
  }
  .project :is(
    .project-copy h1, .pdf-mobile-copy h1, .ser-intro h1,
    .vacia-editorial-heading h1, .bosque-editorial-heading h1,
    .nonce-copy h1, .fiore-story h1
  ) {
    font-size: var(--obras-compact-title);
    line-height: 1.2;
  }
  /* Gigantismo's deliberately enlarged heading and its body/image
     alignment remain governed by gigantismo-heading.css. */
  .gigantismo-editorial-project .gigantismo-copy h1 { font-size: 17.6px; }
}

/* Main-body paragraphs inherit the same rhythm as their columns.
   Earlier page rules changed some paragraphs to 1.2 or 1.27 line-height. */
.project :is(
  .project-copy, .vacia-story-copy, .bosque-story-copy, .nonce-copy,
  .gigantismo-copy, .fiore-story, .pdf-flow-body, .pdf-mobile-copy,
  .ser-description
) > p {
  font-size: inherit;
  line-height: inherit;
}

/* Appunti di campo retains the right-aligned paragraph typography
   specified in style.css, unlike the other Obras pages. */

/* Shared editorial text columns: Statement, Bio and Proyectos.
   Reuse the approved Obras measure without moving photographs or CV content. */
@media (min-width: 1025px) and (not ((max-width: 1366px) and (hover: none) and (pointer: coarse))) {
  .statement.statement-editorial {
    --statement-copy-width: var(--editorial-column-width);
    --statement-right: var(--editorial-column-right);
  }
  .bio-cv-sheet {
    grid-template-columns: minmax(0, 1fr) var(--editorial-column-width);
    padding-right: var(--editorial-column-right);
  }
  .proyectos-page .proyectos-entry,
  .proyectos-page .proyectos-entry:first-child {
    grid-template-columns: minmax(0, 1fr) var(--editorial-column-width);
  }

  .statement-editorial .statement-copy,
  .bio-cv-sheet .bio-copy,
  .proyectos-page .proyectos-entry .proyectos-copy {
    font: 400 var(--editorial-copy-size)/var(--editorial-copy-leading) "Times Draft", "Times New Roman", serif;
  }
  .statement-editorial .statement-heading h1,
  .proyectos-page .proyectos-entry .proyectos-title {
    font-size: var(--editorial-title-size);
    line-height: 1.2;
  }
}

@media (max-width: 1024px), (max-width: 1366px) and (hover: none) and (pointer: coarse) {
  /* Same 22px outer inset, 440px maximum measure and 15px/1.35 copy
     already approved for Obras. On tablets the text stays right-aligned
     in the canvas rather than drifting toward the center. */
  .statement.statement-editorial,
  .proyectos-page { padding-left: 22px; padding-right: 22px; }
  /* Let only the column move to the shared right edge; the photograph
     remains centered in the same overall horizontal position. */
  .statement-editorial .statement-spread {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
  .statement-editorial .statement-heading,
  .statement-editorial .statement-copy,
  .proyectos-page .proyectos-entry .proyectos-title,
  .proyectos-page .proyectos-entry .proyectos-copy {
    width: min(100%, 440px);
    max-width: 440px;
    margin-left: auto;
    margin-right: 0;
  }
  .statement-editorial .statement-copy,
  .bio-cv-sheet .bio-copy,
  .proyectos-page .proyectos-entry .proyectos-copy {
    font-size: 15px;
    line-height: 1.35;
  }
  .statement-editorial .statement-heading h1,
  .proyectos-page .proyectos-entry .proyectos-title {
    font-size: 16px;
    line-height: 1.2;
  }
  /* BIO shares Obras' right edge; the separate CV keeps its old centered width. */
  .bio-cv-sheet { width: calc(100% - 44px); }
  .bio-cv-sheet .bio-column {
    width: min(100%, 440px);
    justify-self: end;
  }
  .bio-cv-sheet .cv-sheet {
    width: min(100%, 580px);
    justify-self: center;
  }
}


/* Opening-image baseline for the artworks using the common editorial layout.
   Ser y desaparecer, Huellas and Appunti intentionally retain their own layouts. */
@media (min-width: 1025px) and (not ((max-width: 1366px) and (hover: none) and (pointer: coarse))) {
  /* Quoted Casa pages already align image and copy in the same grid row.
     Only La casa que migra retained an extra padding above the photo. */
  .migra-editorial-project .migra-intro-photo { padding-top: 0; }

  /* The title line and its bottom gap exactly determine the first body line. */
  .fiore-editorial-project .fiore-intro-image {
    margin-top: calc(var(--obras-title-size) * 1.2 + clamp(18px, 1.8vw, 28px)) !important;
  }
  .geopoiesis-project .geo-hero {
    margin-top: calc(var(--obras-title-size) * 1.2 + clamp(22px, 2.2vw, 34px)) !important;
  }
  /* The source photo includes pale paper at the top: compensate visually
     without cropping, resizing or changing the compact/mobile arrangement. */
  .gigantismo-editorial-project .gigantismo-covers {
    margin-top: calc(var(--gig-heading-gap) + clamp(15.84px, 1.3728vw, 22.44px) - clamp(14px, 1.4vw, 24px)) !important;
  }

  /* The PDF artwork positions differ from the actual rendered text baseline
     by a small viewport-relative amount. Move the complete hero, including
     its attached caption, without touching the carousel or gallery sizing. */
  .pdf-project[data-project="arqueologia"] .pdf-photo--hero { translate: 0 -0.54vw; }
  .pdf-project[data-project="gusci"] .pdf-photo--hero { translate: 0 -0.69vw; }
  .pdf-project[data-project="sei-passato-di-qui"] .pdf-photo--hero { translate: 0 -0.44vw; }


}


/* Match the Chiara non c'è opening artwork with its body-text baseline. */
@media (min-width: 1025px) and (not ((max-width: 1366px) and (hover: none) and (pointer: coarse))) {
  /* Chiara non c'è: derive the artwork top from the real title line-height
     and its 15px title-to-body gap, rather than a viewport approximation. */
  .nonce-editorial-project .nonce-hero {
    margin-top: calc(var(--obras-title-size) * 1.2 + 15px) !important;
  }


}