/* Tierinii – sunny editorial direction, 2026-10-29
   References the approved warm photographic hero mock-up; keeps actual HTML accessible. */
:root{
  --paper:#fff9f1;
  --white:#fffefb;
  --ink:#29272a;
  --muted:#68625f;
  --rule:#e8d8cd;
  --dark:#29262a;
  --red:#cc4a47;
  --wide:1420px;
  --pad:clamp(23px,5.4vw,94px);
}
body{background:var(--paper);color:var(--ink)}
.site-header{background:#fffcf7;border-bottom:0;height:94px}
.site-header__inner{max-width:1500px}
.wordmark--small{font-size:38px;letter-spacing:-.088em}
.desktop-nav{gap:clamp(27px,3.3vw,57px)}
.desktop-nav a{font-size:15px}
.desktop-nav a[aria-current="page"]::after{bottom:-15px}
/* Airy hero: one photographic piece, actual text and accessible links. */
.home-hero{
  min-height:clamp(660px,54vw,850px);
  background:#fffcf5;
  color:var(--ink);
  display:grid;
  grid-template-columns:minmax(0,59%) minmax(0,41%);
  overflow:hidden;
  isolation:isolate;
}
.home-hero__visual{
  min-height:0;
  height:auto;
  background:#fffaf2;
  align-self:stretch;
  display:block;
  overflow:hidden;
  position:relative;
}
.home-hero__visual img{
  width:100%;height:100%;max-height:none;
  object-fit:cover;object-position:center center;
}
.home-hero__visual:after{
  content:"";position:absolute;inset:0 -2px 0 auto;
  width:15%;pointer-events:none;
  background:linear-gradient(90deg,#fffcf500,#fffcf5 98%);
}
.photo-credit{display:none}
.home-hero__copy{
  align-items:flex-start;justify-content:center;
  padding:clamp(72px,7vw,130px) clamp(30px,4.5vw,78px) clamp(79px,6vw,116px) clamp(4px,1.25vw,22px);
  position:relative;
}
.home-hero__topline{
  display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;
  color:#6c6764;font-size:10px;line-height:1.8;letter-spacing:.19em;
  text-transform:uppercase;margin:0;
}
.hero-red-rule{width:36px;background:var(--red);height:2px;flex:none}
.wordmark--hero{
  color:#27262b;letter-spacing:-.112em;
  font-size:clamp(74px,8vw,134px);
  margin:clamp(44px,5.1vw,82px) 0 18px;
  transform:translateX(-.048em);
  line-height:.89;max-width:100%;
}
.wordmark__period{color:var(--red)}
.home-hero__role{
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(24px,2.15vw,38px);
  letter-spacing:-.035em;line-height:1.18;
  color:#333136;margin:0 0 26px;
}
.home-hero__intro{
  font-size:clamp(16px,1.22vw,20px);line-height:1.65;
  max-width:465px;color:#67615f;letter-spacing:-.012em;margin:0;
}
.home-hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:37px}
.hero-button{
  display:inline-flex;align-items:center;justify-content:center;
  gap:20px;min-height:56px;
  border-radius:999px;padding:15px 24px;
  font-size:11px;font-weight:750;letter-spacing:.14em;line-height:1.25;
  text-align:center;text-transform:uppercase;
  transition:transform .22s,background .22s,color .22s,border-color .22s;
}
.hero-button:hover{transform:translateY(-2px)}
.hero-button--primary{background:#cf4c49;color:#fff;border:2px solid #cf4c49}
.hero-button--primary:hover{background:#ad3838;border-color:#ad3838;color:#fff}
.hero-button--outline{border:1.5px solid #343337;color:#343337;background:#fffcf5}
.hero-button--outline:hover{background:#343337;color:#fff}
/* Make scrolling through the site feel like the same summer editorial identity. */
.honors-rail{background:#f7e9df;color:#282629;border:0;border-top:1px solid #f0ded4}
.honors-rail__inner{padding-block:37px}
.honors-rail__label{color:#725f59}
.honors-rail__facts>div{border-left-color:#dbc5b9}
.honors-rail__facts span{color:#625b57}
.honors-rail__more{color:#8e3735}
.honors-rail__more:hover{color:#c44c46}
.performance{background:#fffdf9}
.video-poster img{filter:brightness(.98) saturate(1.08)}
.video-poster:hover img{filter:brightness(1.04) saturate(1.08)}
.video-poster::after{background:linear-gradient(180deg,transparent 50%,#17120b7a)}
.recordings{background:#fff9f1}
.home-invites,.story-interlude,.lessons-focus{background:#f9e9dd}
.story-body,.story-close,.lessons-formats,.lessons-note,.contact-people,.press-section{background:#fffdf8}
.site-footer{background:#f7ecdf}
.site-header,.mobile-menu{color:var(--ink)}
.site-header a:focus-visible,.hero-button:focus-visible{outline-offset:5px}
@media(max-width:1310px) and (min-width:801px){
  .home-hero{grid-template-columns:minmax(0,55%) minmax(0,45%);min-height:710px}
  .home-hero__copy{padding:70px 30px 70px 4px}
  .wordmark--hero{font-size:clamp(70px,8.7vw,110px);margin:51px 0 19px}
  .home-hero__role{font-size:clamp(23px,2.4vw,33px)}
  .home-hero__intro{font-size:16px}
  .hero-button{padding-inline:18px;letter-spacing:.10em;font-size:10px}
}
@media(max-width:950px) and (min-width:801px){
  .home-hero{grid-template-columns:52% 48%;min-height:640px}
  .home-hero__copy{padding:50px 28px 53px 0}
  .home-hero__actions{gap:9px;margin-top:26px}
  .hero-button{min-height:48px;padding-inline:14px}
  .home-hero__role{font-size:25px}
  .home-hero__topline{font-size:9px;gap:7px}
  .hero-red-rule{width:24px}
}
@media(max-width:800px){
  .site-header{height:72px;position:sticky;top:0;background:#fffcf7;z-index:60}
  .wordmark--small{font-size:34px}
  .mobile-menu{inset:72px 0 0;top:72px;background:#fffcf7}
  .home-hero{min-height:0;grid-template-columns:1fr;background:#fffcf5}
  .home-hero__visual{aspect-ratio:1.48/1;min-height:0}
  .home-hero__visual img{width:100%;height:100%;object-fit:cover;object-position:50% 44%}
  .home-hero__visual:after{display:none}
  .home-hero__copy{padding:clamp(48px,7vw,70px) var(--pad) clamp(70px,9vw,96px)}
  .home-hero__topline{font-size:10px;letter-spacing:.14em}
  .wordmark--hero{font-size:clamp(85px,16vw,125px);margin:35px 0 18px}
  .home-hero__role{font-size:clamp(28px,4vw,36px);margin-bottom:18px}
  .home-hero__intro{font-size:17px;max-width:580px;line-height:1.63}
  .home-hero__actions{margin-top:30px;gap:12px}
  .hero-button{min-height:54px}
  .honors-rail__inner{padding-block:31px}
  .honors-rail__facts>div{border-left-color:#dfc7bb}
}
@media(max-width:560px){
  :root{--pad:22px}
  .site-header{height:70px}
  .mobile-menu{inset:70px 0 0;top:70px}
  .home-hero__visual{aspect-ratio:1.23/1}
  .home-hero__visual img{object-position:51% 44%}
  .home-hero__copy{padding:42px var(--pad) 68px}
  .home-hero__topline{gap:7px 12px;font-size:9px;letter-spacing:.12em}
  .hero-red-rule{width:21px}
  .wordmark--hero{font-size:clamp(75px,18vw,99px);margin:30px 0 17px}
  .home-hero__role{font-size:clamp(27px,7.1vw,34px);line-height:1.24;margin-bottom:17px}
  .home-hero__intro{font-size:16px;line-height:1.65}
  .home-hero__actions{margin-top:28px;gap:12px;width:100%}
  .hero-button{min-height:51px;padding:14px 17px;font-size:10px;letter-spacing:.10em}
  .hero-button--primary{flex:1 1 100%}
  .hero-button--outline{flex:1 1 100%}
  .honors-rail__facts>div{border-top-color:#dfc7bb}
  .home-invites{background:#f9e9dd}
}
@media(max-width:360px){
  :root{--pad:18px}
  .wordmark--hero{font-size:clamp(65px,17.5vw,75px)}
  .home-hero__topline{font-size:9px;gap:7px}
  .home-hero__role{font-size:25px}
}
@media(hover:none){
  .hero-button:hover{transform:none}
  .video-poster:hover img{filter:brightness(.98) saturate(1.08)}
}
@media(prefers-reduced-motion:reduce){.hero-button{transition:none}}

/* Forms should feel like part of the sunny site, not a return to dark-template UI. */
.inquiry-section{background:#f9e9df;color:var(--ink)}
.inquiry-grid .section-number{color:#776862}
.inquiry-grid>div:first-child>p:not(.section-number){color:#625a56}
.inquiry-grid .quiet-link--light{color:var(--ink)}
.inquiry-grid .quiet-link--light:hover{color:var(--red)}
.site-form{border-top:1px solid #d5bfb3}
.field-grid label,.field-grid .field-label{color:#3d3735}
.field-grid .required-mark{color:#b73f39}
.field-grid input,.field-grid textarea,.field-grid select{
  color:#29272a;background:#fffdfa;border:1px solid #cbb9b0;border-radius:4px;
}
.field-grid input:focus,.field-grid textarea:focus,.field-grid select:focus{border-color:var(--red)}
.field-grid input::placeholder,.field-grid textarea::placeholder{color:#77716e;opacity:1}
.field-grid select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='m4 7 5 5 5-5' fill='none' stroke='%23544e4a' stroke-width='1.5'/%3E%3C/svg%3E")}
.form-submit{background:#cf4c49;color:#fff;border-radius:999px;min-height:52px;padding-inline:25px}
.form-submit:hover{background:#af3b39;color:#fff}
.form-fineprint{color:#6e605b}
@media(max-width:560px){.inquiry-section{padding-block:67px 78px}.form-submit{justify-content:center}}
/* Portrait-first editorial crop for the lessons page supporting photograph. */
.lessons-note img{height:auto;aspect-ratio:1.25/1;object-fit:cover;object-position:center}

/* Final visual, editorial and usability audit — 2026-10-29 */
/* The new crop retains the entire raised hand from the approved summer hero. */
.home-hero__visual img{object-position:50% 0%}
@media(max-width:800px){.home-hero__visual img{object-position:50% 0%}}
/* Never use intrinsic HTML height attributes as display heights: this was
   causing 1,527px-tall crops on Story and 1,024px-tall crops on Contact. */
.story-interlude .image-open img{
  display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;
}
.contact-head figure{overflow:hidden}
.contact-head figure img{
  display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;
}
/* More consistent button and reading rhythm across the four pages. */
.lessons-head .solid-link{
  background:var(--red);color:#fff;border-radius:999px;
  min-height:53px;padding:15px 24px;gap:30px;
}
.lessons-head .solid-link:hover{background:#ab3a36}
.story-prose p:last-child,.lessons-focus p:last-child,.lessons-note p:last-child{margin-bottom:0}
.recording{min-height:122px}
.recording small{white-space:pre-line}
.footer-bottom:has(>span:only-child){justify-content:flex-start}
/* A little extra room above the contact picture without introducing dead space. */
@media(max-width:800px){
  .contact-head__layout{gap:32px}
  .contact-head figure img{max-height:none}
  .story-interlude figure{align-self:start}
  .story-interlude .image-open{display:block}
}
@media(max-width:560px){
  .contact-head figure img{width:100%;height:auto}
  .story-interlude .image-open img{width:100%;height:auto}
  .lessons-head .solid-link{min-height:52px}
  .recording{min-height:0}
  .footer-bottom{padding-bottom:calc(22px + env(safe-area-inset-bottom,0px))}
}
/* Explicit repeat/position: an earlier background shorthand inadvertently reset no-repeat,
   making the select arrow tile across the entire field. */
.field-grid select{
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:18px 18px;
  padding-right:42px;
}