/* Shared reading roles; signature scenes retain their own geometry and scale. */
:root{--type-section:clamp(32px,4.5vw,72px);--type-heading:clamp(24px,2.3vw,36px);--type-body:18px;--type-control:16px;--type-meta:14px}
#proyectos h2,#equipo h2,#contacto h2,#enfoques .folios-intro h2{font-size:var(--type-section);line-height:1.06}
#equipo .person h3{font-size:var(--type-heading)}
#equipo .people-grid p,#enfoques .folio-description,#enfoques .folios-intro p,.contact-options>p{font-size:var(--type-body);line-height:1.6}
.text-link,.interest-options button,.contact-button,.contact-phone,#enfoques .folio-contact,#enfoques .folio-services li,.site-nav a{font-size:var(--type-control)}
.small-label,.eyebrow,#equipo .person span,#enfoques .panel-area{font-size:var(--type-meta)}
.work-rail{display:flex;gap:16px;align-items:stretch;margin-top:38px}
.work-slot{position:relative;flex:1 1 0;min-width:0;transition:flex-grow .45s ease}
.work-slot.is-active{flex-grow:2}
.work-category{font-size:var(--type-meta);margin:0 0 14px}
.work-link{display:block;color:var(--ink);text-decoration:none}
.work-media{position:relative;height:clamp(300px,31vw,480px);overflow:hidden;background:#e0e1d9}
.work-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .45s ease}
.work-photo{opacity:0;filter:saturate(.85)}
.is-active .work-photo,.is-current .work-photo{opacity:1}
.work-caption{display:flex;justify-content:space-between;gap:10px;margin-top:18px;align-items:baseline;min-height:48px}
.work-caption h3{margin:0;font-size:18px;line-height:1.3;font-weight:500;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.work-caption>span{font-size:var(--type-meta);white-space:nowrap}
.work-next{margin-top:16px;background:none;border:0;padding:10px 0;font:inherit;font-size:var(--type-meta);color:var(--ink);cursor:pointer;text-align:left}
.work-next:hover,.work-next:focus-visible{color:var(--orange)}
.work-closing{font-size:clamp(22px,2vw,28px);font-weight:600;line-height:1.4;max-width:800px;margin:48px 0 0}
.work-link:focus-visible,.work-next:focus-visible,#contact-form input:focus-visible,#contact-form textarea:focus-visible{outline:2px solid var(--orange);outline-offset:5px}
#contact-form{margin:28px 0 32px}#contact-form[hidden]{display:none}
#contact-form label{display:block;font-size:var(--type-control);margin-bottom:18px}
#contact-form label span{font-size:var(--type-meta)}
.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
#contact-form input,#contact-form textarea{display:block;width:100%;box-sizing:border-box;background:transparent;color:inherit;font:inherit;border:1px solid #73766c;border-radius:0;padding:12px;margin-top:8px}
#contact-form textarea{resize:vertical;min-height:130px}
#contact-form .contact-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.contact-status{font-size:var(--type-control);line-height:1.5}.contact-copy{display:block;background:none;border:0;padding:10px 0;font:inherit;font-size:var(--type-meta);color:inherit;cursor:pointer}
#contact-form [type=submit]:disabled{opacity:.6;cursor:wait}
@media(max-width:899px){.work-rail{overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;padding:5px 5px 20px;scroll-padding:5px}.work-slot,.work-slot.is-active{flex:0 0 78%;scroll-snap-align:center}.work-media{height:auto;aspect-ratio:4/3}}
@media(max-width:600px){:root{--type-body:16px}.contact-fields{grid-template-columns:1fr}.work-slot,.work-slot.is-active{flex-basis:88%}.small-label,.eyebrow{font-size:12px}}
@media(prefers-reduced-motion:reduce){.work-slot,.work-media img{transition:none}}
#equipo .person{position:relative}
.person-name{display:block;background:none;border:0;padding:0;font:inherit;text-align:left;color:inherit;cursor:default}
.person-name:focus-visible{outline:2px solid var(--orange);outline-offset:5px}
.person-photo-window{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows .25s ease,opacity .2s ease,margin .25s ease;pointer-events:none}
.person-photo-window>div{min-height:0;overflow:hidden}
.person-photo{display:block;width:100%;height:auto;max-height:400px;object-fit:cover}
.person-name:focus-visible+.person-photo-window{grid-template-rows:1fr;opacity:1;visibility:visible;margin:12px 0 16px}
@media(hover:hover){.person-name:hover+.person-photo-window{grid-template-rows:1fr;opacity:1;visibility:visible;margin:12px 0 16px}}
@media(prefers-reduced-motion:reduce){.person-photo-window{transition:none}}
