/* Third refinement: a clear first note and a visitor-led route to conversation. */
.hero-shade {
  background: linear-gradient(90deg, #24120aef 0%, #302015b8 30%, #35201447 56%, #29190f0a 84%),
    linear-gradient(0deg, #2b180fe8, transparent 37%, transparent 76%, #26160d70);
}
.hero-frame { position:absolute; inset:0; pointer-events:none; }
.hero-content { top:45%; transform:translateY(-43%); width:75%; }
.hero .eyebrow { color:#ecdbb6; font-size:12px; letter-spacing:.14em; margin-bottom:24px; }
.hero h1 { font-size:clamp(56px,6.5vw,104px); line-height:1.48; letter-spacing:.075em; color:#fff9e9; }
.hero h1 em { color:#f8dbaa; text-shadow:0 2px 24px #261a1150; }
.hero .line-mask { padding-bottom:.08em; }
.hero .line-mask>span { animation-duration:.9s; animation-delay:.08s; }
.hero .line-mask:nth-child(2)>span { animation-delay:.19s; }
.hero-description { font-size:15px; line-height:2.05; color:#fff5df; letter-spacing:.055em; margin-top:24px; text-shadow:0 1px 8px #24120ad9; max-width:32em; }
.hero-enter { animation-duration:.6s; animation-delay:.08s; }
.hero-description.hero-enter { animation-delay:.19s; }
.hero-actions.hero-enter { animation-delay:.3s; }
.hero-actions { gap:26px; margin-top:29px; }
.hero-actions .button {
  min-height:62px; padding:18px 25px; gap:29px; font-size:14px; font-weight:500;
  color:#301c0e; border:1px solid #fff1ca; border-radius:3px 22px 3px 3px;
  background:linear-gradient(115deg,#fff0bd 0%,#d5ad50 42%,#f5db91 74%,#cda344 100%);
  box-shadow:0 5px 0 #795319,0 13px 28px #140c065e,inset 0 1px 0 #fff9;
}
.hero-actions .button:hover { box-shadow:0 8px 0 #795319,0 17px 30px #140c0666,inset 0 1px 0 #fff9; }
.hero-actions .text-link { font-size:13px; color:#fff1d5; min-height:48px; gap:15px; text-shadow:0 1px 7px #24120a; }
.hero .control-arriving { animation-duration:.5s; }
.hero-caption { color:#e5ddc6; font-size:11px; }
.hero-caption b { color:#e4c78e; font-size:10px; letter-spacing:.07em; }
.hero-bottom.hero-enter,.scene-selector.hero-enter { animation-delay:.32s; animation-duration:.6s; }
.scene-selector>button { font-size:10px; min-height:46px; background:linear-gradient(115deg,#2e2015d9,#302115c7); }
.scene-selector b { font-size:11px; }
.scene-selector>small { font-size:9px; color:#ede3ce; }
.hero-photo::after { animation-duration:1.7s; animation-delay:.1s; }
.desktop-nav { font-size:12px; }
.header-contact { font-size:12px; }
.image-caption { font-size:11px; letter-spacing:.09em; }
.about-copy .small-copy { color:#644f3f; font-size:15px; }
.about-copy>p:not(.lead) { line-height:2; }
.feel-content .fine-print { color:#c3b0a2; font-size:11px; line-height:1.9; }
#feel-description { font-size:14px; line-height:2; }
.feel-content { padding-top:75px; padding-bottom:68px; }
.feel-content h2 { line-height:1.7; }
.feel-tabs { margin-top:28px; }
.score-card { --note-ink:#846132; --note-glow:#d7bc7840; }
.score-card[data-note-theme=breath] { --note-ink:#856119; --note-glow:#b7977f40; }
.score-card[data-note-theme=expression] { --note-ink:#8a6d4d; --note-glow:#e0c7a44a; }
.score-card .score-note.active { background:var(--note-ink); border-color:var(--note-ink); box-shadow:0 0 0 8px var(--note-glow); }
.score-card .score-note.active i { background:var(--note-ink); }
.score-result p { font-size:13px; line-height:1.95; }
.score-result .eyebrow { font-size:10px; letter-spacing:.06em; }
.score-actions .button { font-size:12px; }
.copy-notes,.reset-checks { font-size:12px; min-height:44px; }
.sound-check .check-key::after { content:""; position:absolute; inset:-5px; border:1px solid currentColor; border-radius:50%; opacity:0; pointer-events:none; }
.sound-check .check-key { position:relative; color:#a58951; }
.sound-check[data-note-kind=breath] .check-key { color:#a27b26; }
.sound-check[data-note-kind=expression] .check-key { color:#b59569; }
.sound-check[aria-checked=true] .check-key { color:#301c0e; }
.sound-check.note-struck .check-key { animation:key-response .46s cubic-bezier(.18,.8,.3,1) both; }
.sound-check.note-struck .check-key::after { animation:key-ripple .65s ease-out both; }
.sound-check.note-struck[data-note-kind=breath] .check-key { animation:key-breath .85s ease-out both; }
.sound-check.note-struck[data-note-kind=breath] .check-key::after { animation-duration:1s; }
.sound-check.note-struck[data-note-kind=expression] .check-key { animation:key-expression .7s ease both; }
@keyframes key-response { 0%{scale:.82} 45%{scale:1.2} 100%{scale:1} }
@keyframes key-breath { 0%{scale:.92} 55%{scale:1.17} 100%{scale:1} }
@keyframes key-expression { 0%{rotate:-12deg;scale:.9} 45%{rotate:9deg;scale:1.13} 100%{rotate:0deg;scale:1} }
@keyframes key-ripple { 0%{opacity:.75;scale:.85} 100%{opacity:0;scale:1.6} }
.next-note-heading>small { font-size:11px; line-height:1.8; color:#d8c6b8; }
.next-note-message h3 { text-wrap:pretty; }
.next-note-route { border-top:3px solid #c9b080; }
.next-note-route[data-active-theme=breath] { border-top-color:#c0a998; }
.next-note-route[data-active-theme=expression] { border-top-color:#dbc4a0; }
.next-note-themes>button { min-height:44px; font-size:12px; }
.next-note-links b { font-size:13px; }
.next-note-links small { color:#d1beb0; font-size:10px; }
.guide-consult {
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:15px 17px; min-height:52px; margin-top:23px; font-size:12px; line-height:1.7;
  background:linear-gradient(115deg,#e7d8b1,#c2ad7a); border:1px solid #f0deb3;
  color:#301c0e; box-shadow:0 3px 0 #7e7049; border-radius:2px 16px 2px 2px;
}
.guide-consult i { font:normal 23px var(--sans); }
.next-note-footnote { font-size:10px; color:#cebfb3; }
.consult-priority { display:grid; grid-template-columns:1fr auto; align-items:center; gap:5px 16px; margin:23px 0 18px; padding:15px 16px; border-left:3px solid #e5c58e; background:linear-gradient(100deg,#99785f33,#c1a87713); }
.consult-priority>span { color:#cabaad; font-size:10px; }
.consult-priority>strong { color:#f4e7c6; font:500 17px/1.6 var(--serif); grid-column:1; }
.consult-priority>button { color:#dcd4b7; min-height:44px; min-width:48px; font-size:11px; grid-column:2; grid-row:1/3; }
.consult-priority i { font-style:normal; font-size:16px; margin-left:6px; }
.consult-heading>span { font-size:19px; }
.consult-options button { min-height:46px; }
.instrument-fields>p { line-height:1.9; }
.purchase-steps p { font-size:13px; color:#d1c3b8; }
.purchase-path-heading>p { font-size:13px; color:#d1c3b8; }
.purchase-steps a { border-radius:50%; background:radial-gradient(circle at 35% 20%,#c6ae7b66,#53403280 72%); box-shadow:0 3px 0 #1b0f06,inset 0 1px 0 #e4d4a742; }
.full-review blockquote { text-wrap:pretty; }
.review-caption { color:#705846; }
.contact-note { font-size:12px; color:#e1d8bc; }
.consult-footnote { font-size:11px; color:#d0c1b6; }
.sound-control { color:#f4e6c5; }
.copy-dialog[open] .dialog-close { animation:control-arrive .5s var(--ease) both; }
.hero :is(a,button):focus-visible,.contact-section :is(a,button,input):focus-visible { outline:2px solid #ffe0a3; outline-offset:5px; }
.experience :is(a,button):focus-visible,.all-voices :is(a,button):focus-visible { outline:2px solid #895f1b; outline-offset:5px; }
.next-note-route :is(a,button):focus-visible { outline-color:#ffe0a3; }
#your-note,#next-note-route,#check-questions,#voices-results,#consult-guide { scroll-margin-top:115px; }
.editing-field .mobile-cta { transform:translateY(115%); pointer-events:none; }
@media(min-width:1250px) and (min-height:850px) { .score-card{top:110px} }
@media(min-width:1250px) and (max-height:849px) { .score-card{position:relative;top:0} }
@media(max-width:1100px) {
  .hero-content{width:83%}
  .hero h1{font-size:clamp(57px,7.5vw,83px)}
  .hero-description{font-size:14px}
  .hero-actions .button{font-size:13px;gap:24px}
  .hero .eyebrow{font-size:11px}
  .next-note-heading>small{font-size:10px}
  .next-note-themes>button{font-size:11px}
  .guide-consult{font-size:11px}
  .feel-content{padding-top:60px;padding-bottom:55px}
}
@media(max-width:850px) {
  .hero-content{top:44%;width:88%}
  .hero h1{font-size:clamp(53px,8vw,72px)}
  .scene-selector>small{font-size:9px}
  .scene-selector b{font-size:10px}
  .hero-actions{gap:21px}
  .hero-actions .text-link{font-size:12px}
}
@media(max-width:640px) {
  .hero{height:auto;min-height:100svh;max-height:none;display:flex;flex-direction:column;justify-content:center;gap:24px;padding:108px 24px 30px}
  .hero-content{position:relative;top:auto;left:auto;transform:none;width:100%;margin:0;max-width:none}
  .hero .eyebrow{font-size:10px;line-height:1.7;letter-spacing:.09em;margin-bottom:19px}
  .hero h1{font-size:clamp(36px,10.3vw,57px);line-height:1.58;letter-spacing:.045em}
  .hero-description{font-size:14px;line-height:2;letter-spacing:.015em;margin-top:19px;max-width:none}
  .hero-shade{background:linear-gradient(90deg,#2a170de8,#35211578 70%,#301b1038),linear-gradient(0deg,#2b180ffa,transparent 60%,#2d1b1188)}
  .hero-actions{margin-top:25px;gap:11px;align-items:flex-start}
  .hero-actions .button{width:100%;max-width:370px;min-height:59px;padding:17px 20px;font-size:13px;gap:16px;letter-spacing:.015em}
  .hero-actions .button svg{width:27px;flex-shrink:0}
  .hero-actions .text-link{font-size:13px;min-height:44px;padding:9px 0}
  .scene-selector{position:relative;left:auto;right:auto;bottom:auto;top:auto;width:100%;grid-template-columns:1fr 1fr;gap:9px 10px;margin-top:0}
  .scene-selector>button{font-size:10px;min-height:46px;padding:11px;gap:9px}
  .scene-selector b{font-size:10px;margin-left:6px}
  .scene-selector>small{font-size:9px;color:#e1dbc7;opacity:1;line-height:1.7;letter-spacing:.01em}
  .hero-bottom{position:relative;left:auto;right:auto;bottom:auto;width:100%;margin:0;gap:15px}
  .hero-caption{font-size:10px;line-height:1.7;letter-spacing:.01em;gap:5px}
  .hero-caption b{font-size:10px;letter-spacing:.04em}
  .hero-number{font-size:49px}
  .hero-side{display:none}
  .hero-resonance{top:7%;height:75%;opacity:.26}
  .about-copy .small-copy{font-size:14px}
  .image-caption{font-size:10px;letter-spacing:.04em}
  .feel-content{padding:35px 24px 43px}
  .feel-content h2{font-size:30px;line-height:1.7}
  #feel-description{font-size:14px;line-height:2}
  .feel-content .fine-print{font-size:11px;line-height:1.9}
  .experience-grid{gap:27px}
  .experience-grid>.check-list{order:0}
  .experience-grid>.score-card{order:1}
  .check-live-staff{margin:0 0 10px;padding:11px 12px;gap:6px;top:67px;border-radius:3px;flex-wrap:nowrap}
  .check-live-staff .mini-staff{width:94px;gap:7px;flex-shrink:0}
  .check-live-staff>a{font-size:11px;line-height:1.6;min-height:44px;margin-left:5px;max-width:9em;text-align:right;justify-content:flex-end}
  .check-live-staff>#mobile-note-count{font-size:20px;white-space:nowrap}
  .sound-check{min-height:91px;padding:18px 5px;gap:13px}
  .check-text{font-size:15px;line-height:1.85}
  .check-text small{font-size:9px;line-height:1.5;margin-bottom:5px;letter-spacing:.09em;color:#745b48}
  .check-key{width:32px;height:32px;flex-shrink:0}
  .score-result p{font-size:14px;line-height:1.95}
  .score-result .eyebrow{font-size:10px}
  .score-card .score-art{height:108px}
  .score-top>span{font-size:11px;letter-spacing:.05em}
  .score-actions .button{font-size:13px;min-height:54px}
  .copy-notes,.reset-checks{font-size:12px}
  .next-note-route{margin-top:24px;padding:21px}
  .next-note-heading>small{font-size:11px}
  .next-note-themes>button{font-size:12px}
  .next-note-message h3{font-size:20px;line-height:1.8}
  .next-note-message p{font-size:13px;line-height:1.95}
  .next-note-links b{font-size:13px}
  .next-note-links>a{min-height:71px;padding:13px 0}
  .guide-consult{font-size:12px;padding:14px;min-height:52px;margin-top:20px}
  .next-note-footnote{font-size:11px;line-height:1.8}
  .consult-priority{padding:13px 14px;margin-top:20px;gap:4px 10px}
  .consult-priority>strong{font-size:17px}
  .consult-priority>span,.consult-priority>button{font-size:11px}
  .consult-heading>span{font-size:18px}
  .consult-footnote{font-size:11px;line-height:1.9}
  .purchase-steps p,.purchase-path-heading>p{font-size:13px;line-height:1.95}
  .mobile-cta>a{font-size:12px;min-height:55px;display:flex;justify-content:center;align-items:center;padding:13px 10px}
  .mobile-cta>a span{margin-left:10px}
  #your-note{scroll-margin-top:90px}
  #next-note-route{scroll-margin-top:158px}
  #check-questions{scroll-margin-top:160px}
  #voices-results{scroll-margin-top:85px}
  #consult-guide{scroll-margin-top:88px}
}
@media(max-width:360px) {
  .hero{padding:103px 20px 26px;gap:22px}
  .hero h1{font-size:35px}
  .hero .eyebrow{font-size:9px;letter-spacing:.03em}
  .hero-description{font-size:13px}
  .hero-actions .button{font-size:12px;padding:17px 17px;gap:12px}
  .hero-actions .text-link{font-size:12px}
  .scene-selector>button{padding:10px 9px;gap:8px}
  .scene-selector b{font-size:10px;margin-left:4px}
  .hero-caption,.hero-caption b{font-size:9px}
  .check-live-staff .mini-staff{width:85px;gap:5px}
  .check-live-staff>a{font-size:10px}
  .check-live-staff>#mobile-note-count{font-size:18px}
  .check-text{font-size:14px}
  .next-note-route{padding:20px 17px}
  .next-note-themes>button{font-size:11px;padding:9px}
  .mobile-cta>a{font-size:11px}
}
@media(prefers-reduced-motion:reduce) {
  .hero .line-mask>span,.hero .hero-enter,.hero-photo::after{animation:none}
  .sound-check.note-struck .check-key,.sound-check.note-struck .check-key::after{animation:none}
  .hero .control-arriving{animation:none}
  .copy-dialog[open] .dialog-close{animation:none}
  .hero-scenes .hero-scene{transition:none;scale:1}
}