/* Keep the email action legible and comfortably tappable. */
.contact-mail.contact-button{display:inline-flex;align-items:center;justify-content:flex-start;gap:1rem;max-width:100%;padding:1.05rem 1.5rem;border:1px solid #233b56;border-radius:1rem;background:#152133;color:#f2f7ff;font-size:1rem;letter-spacing:0;line-height:1.4;text-decoration:none;box-shadow:0 8px 24px #15213318;transition:background .2s,box-shadow .2s}
.contact-mail.contact-button:hover{background:#233b56;box-shadow:0 10px 28px #15213330}
.contact-button .mail-icon{width:3rem;height:3rem;flex:0 0 3rem;border:1px solid #91afd052;border-radius:50%;display:grid;place-items:center;background:#d5e6ff0d}
.contact-button svg{width:1.5rem;height:1.5rem;display:block}
.contact-mail.contact-button>span{font-size:1rem;transform:none;transition:none}
.contact-button .mail-label{display:flex;flex-direction:column;gap:.2rem;min-width:0;overflow-wrap:anywhere;text-align:left}
.contact-button strong{font-size:1.125rem;font-weight:600}.contact-button small{font-size:.875rem;color:#c3d6f1}
.contact-mail.contact-button:focus-visible{outline:3px solid #152133;outline-offset:5px}
@media(max-width:760px) and (orientation:portrait){
 /* Text and progress occupy separate grid rows instead of overlapping absolute boxes. */
 .brain-active .brain-pin{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(min-content,1fr) auto;height:100svh;min-height:42rem}
 .brain-active .brain-copy,.brain-active .brain-final{grid-area:1/1;position:relative;inset:auto;align-self:end;width:88%;max-width:none;margin:7rem auto 1.75rem;padding:0}
 .brain-active .brain-bottom{grid-area:2/1;position:relative;inset:auto;width:88%;margin:0 auto;padding:0 0 max(1.25rem,env(safe-area-inset-bottom));min-width:0}
 .brain-status,.brain-bottom-links{flex-wrap:wrap;gap:.75rem 1rem}.brain-status>*{min-width:0}.brain-scroll-hint{text-align:left;max-width:none}.brain-track{margin:1rem 0;flex-shrink:0}
 .brain-bottom-links>a,.brain-bottom-links>button{min-height:44px;display:inline-flex;align-items:center}
 .brain-still .brain-pin{height:auto;min-height:42rem}.brain-still .brain-final{display:none}
 .motion-ready:not(.motion-still) .journey-pin{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(min-content,1fr) auto;min-height:42rem}
 .motion-ready:not(.motion-still) .journey-top{grid-area:1/1;position:relative;inset:auto}
 .motion-ready:not(.motion-still) .journey-copy{grid-area:2/1;position:relative;inset:auto;display:grid;margin:2rem 6%;align-self:center;min-width:0}
 .motion-ready:not(.motion-still) .journey-chapter{grid-area:1/1;position:relative;inset:auto;min-width:0;padding:0}
 .motion-ready:not(.motion-still) .journey-bottom{grid-area:3/1;position:relative;inset:auto;padding:0 6% max(1.25rem,env(safe-area-inset-bottom))}
 .journey-steps{gap:.5rem;justify-content:space-between;flex-wrap:wrap}.journey-actions{flex-wrap:wrap;gap:.5rem 1rem}.journey-meter{margin-top:.75rem}
 .contact-mail.contact-button{width:100%;padding:1rem 1.1rem}.contact h2{overflow-wrap:anywhere}.rule{flex-shrink:0}
}
@media(prefers-reduced-motion:reduce){.contact-mail.contact-button{transition:none}.brain-active .brain-pin{height:auto!important}.motion-ready .journey-pin{height:auto!important}}

/* Studio controls must not move across the footer separator. */
.hero .visual{transform:none!important}
@media(min-width:761px){.hero .visual{bottom:calc(var(--studio-footer-height,100px) + 40px)}}
@media(max-width:760px){.hero{padding-bottom:0}.hero-footer{position:relative;inset:auto;margin:28px 6% 0;flex-wrap:wrap;gap:16px;padding:24px 0}.hero-footer>span:first-child{max-width:none}.hero .visual{bottom:auto}.visual-tools{padding-top:12px}}
