/* Local typography study: geometric rhythm, with a quieter literary accent.
   Uses installed fonts only. No font files, external requests or dependencies. */
:root{
 --type-reading:"Avenir Next",Avenir,"Segoe UI",Arial,sans-serif;
 --type-display:"Avenir Next",Avenir,"Century Gothic","Trebuchet MS",sans-serif;
 --type-literary:Baskerville,"Palatino Linotype",Palatino,Georgia,serif;
 --type-brand:Futura,"Avenir Next","Trebuchet MS",sans-serif;
 --type-accent:#b74b20;
}
body{font-family:var(--type-reading);font-weight:400;line-height:1.7}
button,input,output{font-family:inherit}
h1,h2,h3,p,blockquote{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}
/* A typeset signature for this study, not a reproduction of the old Figma logo. */
.wordmark,.site-footer .wordmark,.song-footer .wordmark{
 font-family:var(--type-brand);font-weight:500;letter-spacing:-.065em;
 font-size:clamp(30px,3.5vw,48px);line-height:1.3;
}
.wordmark .brand-stop{display:inline-block;width:.13em;height:.13em;border-radius:50%;background:var(--type-accent);margin-left:.09em;vertical-align:.04em;font-size:inherit}
.home-page .site-header .brand-stop{background:#161a19}
.site-nav{font-size:14px;font-weight:500;letter-spacing:.005em}
.eyebrow,.mini-label,.edition,.section-head,.section-label,.edition-line{font-family:var(--type-reading);font-weight:500}
.eyebrow,.mini-label{font-size:11px;letter-spacing:.11em;line-height:1.85}
.site-header{padding-top:26px;padding-bottom:26px}
.home-page .hero h2:where(#hero-title){font-family:var(--type-display);font-size:clamp(68px,6.7vw,108px);font-weight:500;letter-spacing:-.065em;line-height:1.02}
.hero h2:where(#hero-title) .human-word{font-family:var(--type-literary);font-weight:400;font-style:italic;letter-spacing:-.045em}
.hero-subline{font-weight:500;font-size:17px;letter-spacing:-.015em}
.hero .button,.line-link,.explore-link,.text-link,.back-link{font-weight:500;letter-spacing:.005em}
.home-page .section-copy h2,.home-page .experiment-heading h2,.home-page .hero-copy h2,.home-page .closing-word{
 font-family:var(--type-display);font-weight:400;letter-spacing:-.065em;line-height:1.07;
}
.home-page .section-copy h2,.home-page .experiment-heading h2{font-size:clamp(68px,8.4vw,126px)}
.home-page .section-copy h2>span,.home-page .experiment-heading h2>span{color:var(--type-accent)}
.home-page .writing-section h2{font-family:var(--type-literary);font-style:italic;font-weight:400;letter-spacing:-.05em}
.home-page .companion{font-family:var(--type-literary);font-style:italic;font-weight:400}
.home-page .sound-study-heading h2{font-family:var(--type-display);font-weight:400;letter-spacing:-.06em;line-height:1.12}
.home-page .section-description{font-size:21px;letter-spacing:-.025em;line-height:1.7}
.home-page .about-content h2{font-family:var(--type-display);font-weight:400;letter-spacing:-.055em}
.home-page .about-content h2 em{font-family:var(--type-literary);font-weight:400;letter-spacing:-.04em}
.home-page .paper-art blockquote,.home-page .release-note>p{font-family:var(--type-literary);font-weight:400;letter-spacing:-.015em;line-height:1.55}
.home-page .card-bottom h3{font-family:var(--type-display);font-weight:500;letter-spacing:-.045em}
.home-page .podcast-art>span{font-family:var(--type-display);font-weight:400;letter-spacing:-.055em}
.home-page .podcast-art>span em{font-family:var(--type-literary);letter-spacing:-.035em}
.home-page .closing-word{font-size:clamp(90px,18vw,270px)}
.site-footer .wordmark,.song-footer .wordmark{font-size:30px}
/* Song titles feel like cover lettering; verses keep their own softer voice. */
.song-page .song-copy h1{font-family:var(--type-display);font-size:clamp(76px,9.2vw,142px);font-weight:400;line-height:1.02;letter-spacing:-.075em;margin:22px 0 28px}
.song-page .song-copy h1 em{font-style:normal;font-weight:500;letter-spacing:-.07em;color:#586548;position:relative;display:inline-block}
.song-page .sun-stop{position:relative;display:inline-block;width:.105em;height:.105em;margin-left:.025em;border-radius:50%;background:#b65322;vertical-align:.035em;box-shadow:0 0 0 .035em #b6532218}
.song-page .devanagari{font-size:21px;letter-spacing:.02em;color:#526047}
.song-page .song-deck{font-size:20px;line-height:1.7;letter-spacing:-.025em;max-width:24em}
.song-page h2,.song-page .listening-room h2,.song-page .making-grid h3,.song-page .player-name{font-family:var(--type-display);font-weight:400;letter-spacing:-.05em;line-height:1.18}
.song-page h2 em{font-family:var(--type-literary);font-weight:400;letter-spacing:-.035em}
.song-page .listening-room h2{font-size:clamp(35px,3.7vw,52px)}
.song-page .verse blockquote{font-family:var(--type-literary);font-size:clamp(27px,3.1vw,43px);font-weight:400;line-height:1.55;letter-spacing:-.02em}
.song-page .verse .translation{font-family:var(--type-reading);font-size:15px;line-height:1.9}
.song-page .next-title{font-family:var(--type-display);font-weight:400;letter-spacing:-.065em}
.song-page .next-title em{font-family:var(--type-literary);font-weight:400}
.song-page .art-stamp{font-family:var(--type-brand);font-style:normal;font-weight:500}
.song-page .moods span{font-size:12px;font-weight:500;letter-spacing:.02em}
@media(max-width:760px){
 .song-page .song-copy h1{font-size:clamp(70px,19.8vw,122px);letter-spacing:-.075em;line-height:1.06}
 .song-page .song-deck{font-size:18px}.song-page .verse blockquote{font-size:clamp(24px,5.8vw,33px)}
 .song-page .song-header{gap:14px}.song-page .song-header .wordmark{font-size:30px}
 .song-page .song-header .back-link{font-size:12px}
}
@media(max-width:680px){
 .site-header .wordmark{font-size:32px}.site-nav{font-size:16px}
 .home-page .hero h2:where(#hero-title){font-size:clamp(57px,14.4vw,88px);letter-spacing:-.065em;line-height:1.08}
 .home-page .hero-eyebrow{font-size:10px;letter-spacing:.075em;max-width:26em}
 .home-page .hero-content{padding-top:160px}.home-page .hero-subline{font-size:16px}
 .home-page .section-copy h2,.home-page .experiment-heading h2{font-size:clamp(60px,18vw,94px)}
 .home-page .hero-copy h2{font-size:clamp(52px,15.5vw,92px)}
 .home-page .sound-study-heading h2{font-size:clamp(37px,10vw,52px)}
 .home-page .section-description{font-size:20px}
 .home-page .closing-word{font-size:23vw}
 .home-page .about-content h2{font-size:clamp(39px,11vw,61px)}
}

/* Custom vector lettering inspired by the founder's original rounded sketches.
   The logo has its own drawn shapes; it no longer depends on a text font. */
.wordmark:has(.brand-lettering){display:inline-flex;align-items:center;line-height:1;letter-spacing:0;flex-shrink:0}
.wordmark .brand-lettering{display:block;width:clamp(190px,20vw,272px);height:auto;max-width:100%;object-fit:contain}
.site-footer .wordmark .brand-lettering,.song-footer .wordmark .brand-lettering{width:190px}
@media(max-width:680px){
 .wordmark .brand-lettering{width:190px}
 .site-header{gap:18px}
 .song-header .wordmark .brand-lettering{width:174px}
 .song-header .back-link{font-size:11px}
}
@media(max-width:360px){.song-header .wordmark .brand-lettering{width:155px}.song-header{gap:10px}}
