/* Sofia Miyake Photography — /es only (es.html, body.es-body), the one page in Spanish.
   Loaded right after style.css. Every rule is scoped to .es-body so nothing here can reach
   another page. The header carries no nav: the session pages it would point to are in English,
   so the page links to them from its tiles and says so, and the header offers "English" instead. */

.es-body .lang-switch{display:inline-flex;align-items:center;min-height:44px;font-size:0.82rem;letter-spacing:0.12em;text-transform:uppercase;border-bottom:1px solid transparent;}
.es-body .lang-switch:hover{color:var(--gold);border-bottom-color:var(--gold);}

.es-body .about-photo img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:62% 50%;}
.es-body .about-copy p{margin:0 0 16px;}
.es-body .about-copy .about-lead{font-family:var(--serif);font-style:italic;font-weight:500;font-size:1.3rem;line-height:1.4;margin-top:20px;}

/* Session tiles, after the homepage's: the heading's link is stretched over the tile, so each
   link's name is the session ("Familias"), not the alt text plus the description. */
.es-body .es-intro{max-width:46ch;margin:14px auto 0;text-align:center;color:var(--ink-soft);text-wrap:balance;}
.es-body .es-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 28px;margin-top:44px;}
.es-body .es-tile{position:relative;}
.es-body .es-tile-photo{aspect-ratio:4/3;overflow:hidden;border-radius:2px;background:#e4d9c7;}
.es-body .es-tile-photo img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease;}
/* Births: the frame is mostly blanket at tile size, so it is drawn at 140% to centre the feet (as on the homepage). */
.es-body .es-tile-photo--feet img{width:140%;height:140%;max-width:none;margin:-22.8% 0 0 -29.8%;}
.es-body .es-tile h3{font-size:1.65rem;line-height:1.2;margin:14px 0 4px;}
.es-body .es-tile h3 a{display:inline-flex;align-items:baseline;gap:8px;}
.es-body .es-tile h3 a::after{content:"";position:absolute;inset:0;z-index:1;}
.es-body .es-tile .arrow{display:inline-block;color:var(--gold);transition:transform 0.3s ease;}
.es-body .es-tile p{margin:0;font-size:0.95rem;line-height:1.5;color:var(--ink-soft);}
@supports selector(:has(a)){
  .es-body .es-tile h3 a:focus-visible{outline:none;}
  .es-body .es-tile:has(h3 a:focus-visible){outline:2px solid var(--gold-text);outline-offset:6px;border-radius:2px;}
}
@media (hover:hover) and (pointer:fine){
  .es-body .es-tile:hover h3 a{color:var(--ink);}
  .es-body .es-tile:hover .es-tile-photo img{transform:scale(1.04);}
  .es-body .es-tile:hover .arrow{transform:translateX(6px);}
}
.es-body .es-minis{max-width:46ch;margin:44px auto 0;text-align:center;font-family:var(--serif);font-style:italic;font-size:1.2rem;line-height:1.4;text-wrap:balance;}

.es-body .faq-answer a,.es-body .es-contact a{text-decoration:underline;text-underline-offset:3px;}

.es-body .es-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin:28px 0 22px;}
.es-body .es-actions .btn{margin-top:0;}
.es-body .es-contact{font-size:0.95rem;text-wrap:balance;}

@media (max-width:1023px){
  .es-body .es-tiles{gap:40px 24px;}
  .es-body .es-tile h3{font-size:1.5rem;}
}
@media (max-width:700px){
  .es-body .es-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px;}
  .es-body .es-tile h3{font-size:1.2rem;margin-top:12px;}
  .es-body .es-tile p{font-size:0.875rem;}
}
