/* Moonwake Pictures: additions on top of the shared Moonwake Publishing site.css (hand-written) */
.wrap.narrow{max-width:720px;text-align:center}
.hero img.logo{width:min(560px,84vw)}
.tagline-wrap .tagline{font-size:clamp(23px,2.5vw,32px)}
.cover.art{box-shadow:0 30px 70px rgba(0,0,0,.7),0 0 0 1px var(--line),0 0 60px rgba(75,47,158,.25)}
.feature h2{font-size:clamp(32px,4.4vw,50px)}
.btn-row .btn{padding:13px 20px}
.spotify{display:block;border:0;border-radius:12px;margin-top:30px;background:var(--bg-2)}
section.listen{padding-top:0;border-top:0!important}
section.listen .spotify{margin-top:0}
/* newsletter */
.newsletter{position:relative;overflow:hidden;background:radial-gradient(ellipse 60% 70% at 50% 100%,rgba(0,112,127,.16),transparent 70%),radial-gradient(ellipse 50% 60% at 80% 100%,rgba(75,47,158,.18),transparent 70%)}
.newsletter h2{font-size:clamp(34px,4vw,46px);letter-spacing:.06em;text-transform:uppercase}
.inline-form{display:grid;grid-template-columns:1fr 1.3fr auto;gap:14px;align-items:end;max-width:none;margin:30px 0 0;text-align:left}
.inline-form .btn{height:52px}
.inline-form .form-status{grid-column:1/-1;margin:0;text-align:center}
@media (max-width:640px){.inline-form{grid-template-columns:1fr}.inline-form .btn{width:100%}}
.fine{font-size:13px;color:var(--muted);margin-top:8px}
/* footer socials */
.socials{display:flex;gap:12px;margin-top:20px}
.socials a{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.socials svg{width:20px;height:20px}
.socials a:hover{border-color:var(--accent);color:var(--ink)}
.nav ul{gap:30px}
@media (max-width:760px){.feature .cover.art{max-width:320px}}
.inline-form input{height:52px;background:#141418;border-color:#34343b}
.inline-form>div{margin:0}
.inline-form label{margin-bottom:8px}
.tagline-wrap{max-width:100%}
.tagline{text-wrap:balance}
.newsletter .muted,.fine{text-wrap:balance}
.fine{font-size:14px}
@media (max-width:560px){.btn-row .btn{flex:1 1 100%;text-align:center}}
/* "On the page" block: the Publishing tagline fog (teal-to-purple, left to right) reveals it when scrolled into view */
.smoke-reveal{position:relative}
.smoke-reveal .fog{top:-40px;bottom:-40px;left:-60px;right:-60px}
.smoke-reveal .puffs{transform:scaleY(2.6)}
.smoke-reveal .reveal-body{position:relative;z-index:2}
@media (prefers-reduced-motion:no-preference){
  .smoke-reveal .puffs i,.smoke-reveal .puffs i::before{animation:none}
  .js .smoke-reveal .reveal-body{-webkit-mask-image:linear-gradient(90deg,#000 40%,transparent 60%);mask-image:linear-gradient(90deg,#000 40%,transparent 60%);-webkit-mask-size:250% 100%;mask-size:250% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:100% 0;mask-position:100% 0}
  .js .smoke-reveal.in .puffs i{animation:roll 4.6s cubic-bezier(.3,.15,.35,1) var(--d) both}
  .js .smoke-reveal.in .puffs i::before{animation:spread 4.6s ease-out var(--d) both}
  .js .smoke-reveal.in .reveal-body{animation:reveal 3.4s cubic-bezier(.4,.1,.3,1) 1s both,settle 3.4s ease-out 1s both}
}