@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans:wght@400;600;700&family=Press+Start+2P&display=swap');
:root{font-family:'Pixelify Sans',monospace;color:#f5fbff;background:#073776;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 68% 5%,#65b8e8 0,#3491c9 22%,#16649f 53%,#082f69 100%);min-height:100vh}a{color:inherit}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}.shell{width:min(1160px,calc(100% - 48px));margin:auto}.topbar{background:#063469;border-bottom:2px solid #a9dcff;position:sticky;top:0;z-index:30;box-shadow:0 4px 20px #02274c55}.topbar .shell{display:flex;align-items:center;justify-content:space-between;min-height:64px;gap:18px}.brand,.nav a{font-family:'Pixelify Sans',monospace;text-decoration:none;font-weight:700}.brand{font-style:italic;letter-spacing:-1px;font-size:1.2rem;text-shadow:2px 2px #388be2}.nav{display:flex;align-items:center;gap:22px}.nav a{font-size:.72rem;text-transform:uppercase}.nav a:hover,.nav a:focus-visible,.footer a:hover{color:#a9e5ff}.menu-button{display:none;background:#b6e9ff;color:#07346b;border:2px solid white;padding:7px 12px;font-weight:700;cursor:pointer}.hero{position:relative;min-height:660px;padding:75px 0 95px;overflow:hidden}.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:50px}.eyebrow,.tag{font-family:'Pixelify Sans',monospace;text-transform:uppercase;font-size:.78rem;letter-spacing:.08em}.eyebrow{display:inline-block;background:#e5f8ff;color:#075199;border-radius:50px;padding:7px 14px;font-weight:700}.display{font-family:'Pixelify Sans',monospace;text-transform:uppercase;line-height:.97;letter-spacing:-.08em;font-size:clamp(3.5rem,8vw,8rem);margin:20px 0;text-shadow:4px 4px #175fa4,-2px -2px #aedfff}.hero p{max-width:52ch;font-size:1.12rem;line-height:1.6}.hero-image{width:100%;max-height:540px;object-fit:cover;border:9px solid #b9e7ff;border-radius:20px;box-shadow:18px 18px 0 #063668,0 24px 45px #001b4e66;transform:rotate(2deg)}.sticker{position:absolute;pointer-events:none;opacity:.6;z-index:1}.sticker.star{width:180px;left:3%;top:7%;transform:rotate(-15deg)}.sticker.player{width:180px;right:0;bottom:0;transform:rotate(16deg)}.sticker.orb{width:170px;left:43%;bottom:2%}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:11px 20px;text-decoration:none;background:#e7f8ff;border:2px solid #fff;color:#074886;font-family:'Pixelify Sans',monospace;font-weight:700;box-shadow:5px 5px 0 #082d66;cursor:pointer}.button:hover,.button:focus-visible{transform:translate(2px,2px);box-shadow:3px 3px 0 #082d66}.button.dark{background:#062f71;color:white}.button.pink{background:#ff95d9;color:#082c67}.buttons{display:flex;gap:15px;flex-wrap:wrap;margin-top:28px}.section{padding:72px 0}.section h2,.page-title{font-family:'Pixelify Sans',monospace;text-transform:uppercase;letter-spacing:-.055em;line-height:1.04;text-shadow:3px 3px #185b9e}.section h2{font-size:clamp(2rem,5vw,3.7rem)}.page-title{font-size:clamp(3rem,8vw,6rem);margin:10px 0 25px}.panel{background:#eaf9ff;color:#07386e;border:3px solid #bde5ff;box-shadow:9px 9px 0 #07346c;padding:32px;border-radius:16px}.panel p,.panel li{line-height:1.65}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}.portrait{width:100%;max-height:600px;object-fit:cover;border:8px solid #def6ff;border-radius:14px;box-shadow:12px 12px #07346c}.cover{width:100%;max-width:420px;aspect-ratio:1;object-fit:cover;border:8px solid #bbebff;box-shadow:12px 12px #062b67}.track-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin:40px 0}.track{background:#d9f1ff;color:#072f68;border:2px solid white;padding:22px;border-radius:14px;box-shadow:6px 6px #082e6a}.track h3{margin:0 0 8px;font-size:1.25rem}.track .credit{font-size:.9rem;line-height:1.5;margin:14px 0 0;padding:12px;background:#f6fcff;border-left:4px solid #468ad3}.track audio{display:block;width:100%;margin-top:12px}.video{aspect-ratio:16/9;width:100%;border:6px solid #d8f4ff;box-shadow:8px 8px #052f67}.fine{font-size:.86rem;opacity:.9}.form{display:grid;gap:15px}.form label{display:grid;gap:6px;font-family:'Pixelify Sans',monospace;font-size:.85rem;font-weight:700}.form input,.form select,.form textarea{width:100%;min-height:46px;border:2px solid #5e9ad1;background:white;border-radius:5px;padding:10px;color:#082d67}.form textarea{min-height:130px;resize:vertical}.notice{font-family:'Pixelify Sans',monospace;font-size:.83rem;font-weight:700;text-transform:uppercase}.notice a{color:#ad2d92;text-decoration-thickness:3px}.quote-list{padding-left:24px}.quote-list li{margin-bottom:10px}.footer{background:#062955;padding:45px 0;margin-top:55px;border-top:2px solid #a8d9ff}.footer .shell{display:flex;justify-content:space-between;align-items:start;gap:30px;flex-wrap:wrap}.footer-links{display:flex;gap:12px 22px;flex-wrap:wrap}.footer a{text-decoration:none;font-family:'Pixelify Sans',monospace;font-size:.82rem}.footer small{display:block;opacity:.7;margin-top:14px}.intro{max-width:750px;font-size:1.12rem;line-height:1.7}.page-top{padding-top:64px}.badge{display:inline-block;padding:6px 12px;background:#d7f4ff;color:#08518b;border-radius:40px;font-family:'Pixelify Sans',monospace;font-size:.78rem}.divider{border:0;border-top:2px dashed #a7ddff;margin:52px 0}.hide{display:none}
@media(max-width:900px){.nav{gap:12px}.nav a{font-size:.64rem}.hero{min-height:auto}.hero-grid{gap:24px}.sticker{opacity:.36}.two-col{gap:28px}}
@media(max-width:700px){.shell{width:min(100% - 30px,540px)}.topbar .shell{min-height:60px;flex-wrap:wrap}.menu-button{display:block}.nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:0 0 14px}.nav.open{display:flex}.nav a{font-size:.9rem;padding:10px 8px;border-top:1px solid #4283b0}.hero{padding:52px 0 65px}.hero-grid,.two-col{grid-template-columns:1fr}.hero-image{max-height:430px;width:min(100%,470px);justify-self:center}.hero .display{font-size:clamp(3.5rem,17vw,6rem)}.sticker.star{width:95px;top:22%}.sticker.orb{width:100px;left:auto;right:0}.section{padding:52px 0}.panel{padding:22px;box-shadow:5px 5px #07346c}.track-list{grid-template-columns:1fr}.page-top{padding-top:45px}.footer{margin-top:40px}.footer .shell{display:block}.footer-links{margin-top:22px}.portrait{max-height:500px}}

/* Pixel type system and collage ornaments */
h1,h2,h3,.brand,.page-title,.display,.section h2,.track h3{font-family:'Press Start 2P',monospace;letter-spacing:0;line-height:1.5}h2{overflow-wrap:anywhere}.brand{font-size:clamp(.66rem,1.25vw,.9rem);white-space:nowrap}.display{font-size:clamp(1.1rem,4vw,3.65rem);white-space:nowrap;letter-spacing:-.09em;line-height:1.35}.section h2{font-size:clamp(1.25rem,3vw,2.2rem)}.page-title{font-size:clamp(1.45rem,4.2vw,3.3rem)}.panel h2{font-size:clamp(1.05rem,2.5vw,1.6rem)}.track h3{font-size:clamp(.84rem,1.5vw,1.12rem)}.hero .display{font-size:clamp(1.15rem,4.35vw,3.75rem)}.collage-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}.collage-piece{position:absolute;width:clamp(65px,11vw,170px);opacity:.26;filter:drop-shadow(3px 7px 3px #001a4b55)}main>section,main.shell{position:relative;isolation:isolate}main>section>.shell,main.shell>*:not(.collage-layer){position:relative;z-index:1}.hero .sticker{display:none}.hero-grid{z-index:2}.freelance-cta{background:#ff89d3;color:#08275c;font-weight:700;border:3px solid white;box-shadow:7px 7px #08275c;animation:cta-glow 2.6s ease-in-out infinite}.freelance-cta:hover{background:#ffb3e5}.music-embed{width:100%;height:175px;border:0;border-radius:8px;margin:12px 0}.track a{color:#114fac;font-weight:700}.footer-links a,.notice{font-size:.82rem}@keyframes cta-glow{50%{box-shadow:7px 7px #08275c,0 0 22px #ffb1e2}}
@media(max-width:700px){.hero .display{font-size:clamp(1.08rem,5.25vw,2.2rem)}.brand{font-size:.7rem}.collage-piece{width:75px;opacity:.19}.buttons{align-items:stretch}.buttons .button{width:100%}.page-title{font-size:clamp(1.35rem,6vw,2rem)}}
@media(prefers-reduced-motion:reduce){.freelance-cta{animation:none}}
.contact-page{min-height:calc(100vh - 180px)}.contact-page>.two-col{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:6vw;align-items:stretch}.contact-page .intro{font-size:clamp(1.35rem,2.2vw,2rem);line-height:1.55;max-width:28ch}.contact-page .freelance-cta{display:flex;width:100%;max-width:550px;min-height:100px;margin:35px 0;padding:22px;font-size:clamp(1.1rem,2vw,1.65rem);text-align:center;line-height:1.45}.contact-page .panel{padding:clamp(25px,3vw,48px)}.contact-page .form label{font-size:1.05rem}.contact-page .form input,.contact-page .form textarea{font-size:1.15rem}.contact-page .form button{font-size:1.2rem;min-height:60px}.newsletter-section .panel{min-height:170px}.newsletter-section h2{margin-top:5px}@media(max-width:700px){.contact-page>.two-col{grid-template-columns:1fr;gap:30px}.contact-page .intro{font-size:1.25rem}.contact-page .freelance-cta{font-size:1.15rem;min-height:80px}.collage-piece{opacity:.26}}
.kit-signup .newsletter-field{flex:1 1 240px;min-width:0}.kit-signup .newsletter-email{box-sizing:border-box;width:100%!important;min-height:54px!important;border:2px solid #478bc3!important;border-radius:4px!important;background:#fff!important;color:#07346b!important;padding:10px 14px!important;font-family:'Pixelify Sans',monospace!important;font-size:1.15rem!important}.kit-signup .formkit-fields{display:flex!important;gap:12px!important;align-items:stretch!important;flex-wrap:wrap!important}.kit-signup .formkit-submit{min-height:54px!important;flex:0 0 auto!important;font-family:'Pixelify Sans',monospace!important;font-size:1.1rem!important;padding:10px 20px!important;background:#ff95d9!important;color:#082c67!important}.kit-signup .formkit-alert-success{font-family:'Pixelify Sans',monospace!important}@media(max-width:700px){.kit-signup .newsletter-field,.kit-signup .formkit-submit{width:100%!important;flex-basis:100%!important}}

/* EPK media and downloadable gallery */
.epk-block{margin-top:65px}.epk-block h2{font-family:'Press Start 2P',monospace;font-size:clamp(1.1rem,2.4vw,2rem);line-height:1.5}.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:25px}.gallery figure{margin:0;padding:14px;background:#eaf9ff;color:#07386e;border:3px solid #bde5ff;border-radius:14px;box-shadow:6px 6px #07346c}.gallery img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px}.gallery figcaption{padding:15px 4px 4px;line-height:1.6}.gallery .button{margin-top:12px;font-size:.82rem}.collage-piece{will-change:transform}@media(max-width:700px){.gallery{grid-template-columns:1fr}.epk-block{margin-top:50px}}@media(prefers-reduced-motion:reduce){.collage-piece{will-change:auto}}
.press-page .epk-tagline{font-size:clamp(1.1rem,2vw,1.5rem);margin:0 0 25px}.press-page .epk-bios{align-items:stretch}.press-page .epk-bios .panel{display:flex;flex-direction:column;align-items:flex-start}.press-page .epk-bios .button{margin-top:auto}.press-page .epk-bios h3{font-size:clamp(.78rem,1.3vw,1.02rem);line-height:1.5}.press-page .epk-socials{display:flex;flex-wrap:wrap;gap:12px 20px;margin:24px 0}.press-page .epk-socials a{color:#eaf9ff;text-decoration-thickness:2px}.press-page #epk-contact .panel{width:100%}@media(max-width:700px){.press-page .epk-bios .button{margin-top:14px}.press-page .gallery .button{width:100%}}

/* Lead with the artist hero; newsletter follows on the next scroll. */
.hero{min-height:calc(100svh - 64px);display:flex;align-items:center}.hero .hero-grid{width:100%}@media(max-width:700px){.hero{min-height:calc(100svh - 60px)}}

/* Simple masthead, then signup, then the rest of the home page. */
.hero-title{display:flex;align-items:center;min-height:clamp(280px,49svh,540px);padding:70px 0;overflow:hidden}.hero-title .shell{position:relative;z-index:2}.hero-title .display{font-size:clamp(1.7rem,5.4vw,5.7rem);line-height:1.35;white-space:nowrap;margin:22px 0 0}.hero-title .eyebrow{font-size:clamp(.68rem,1.1vw,.95rem)}.hero{min-height:auto;display:block}.hero .hero-grid{width:auto}@media(max-width:700px){.hero-title{min-height:clamp(230px,36svh,400px);padding:45px 0}.hero-title .display{font-size:clamp(1.1rem,5.3vw,2.5rem);white-space:nowrap}.hero-title .eyebrow{font-size:.66rem}}

/* Client review: compact paired masthead, readable media, uninterrupted collage. */
.hero-title{min-height:auto;padding:clamp(32px,5vw,72px) 0 44px;overflow:visible}
.hero-title .title-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:clamp(24px,5vw,65px);align-items:center}
.hero-title .display{font-size:clamp(1.35rem,3.9vw,3.7rem);overflow-wrap:anywhere;white-space:normal}
.hero-title .hero-image{display:block;max-height:400px;aspect-ratio:4/3;object-fit:cover}
.hero .hero-grid{grid-template-columns:1fr}
.hero .hero-grid p{max-width:70ch}
.press-page>.eyebrow{font-size:clamp(.95rem,1.5vw,1.25rem);padding:10px 18px}
.collage-layer{z-index:-1;overflow:visible}
.collage-piece{opacity:.2}
.gallery figure,.panel,.track{position:relative;isolation:isolate}
.gallery .button{margin-top:0}
@media(max-width:700px){.hero-title .title-grid{grid-template-columns:1fr;gap:30px}.hero-title .display{font-size:clamp(1.2rem,5.4vw,2.2rem)}.hero-title .hero-image{max-height:350px;width:min(100%,470px)}.hero-title{padding:38px 0 30px}.collage-piece{opacity:.16}}

/* Preserve the entire portrait on the home masthead. */
.hero-title .hero-image{width:min(100%,340px);height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;justify-self:center}
@media(max-width:700px){.hero-title .hero-image{width:min(100%,320px);max-height:none}}

/* Center the introductory copy and its actions under the signup. */
.hero .hero-grid{text-align:center;justify-items:center}
.hero .hero-grid>div{width:100%}
.hero .hero-grid p{margin-inline:auto;text-align:center}
.hero .hero-grid .buttons{justify-content:center}

/* Give the home contact introduction and freelance instruction more presence. */
#get-in-touch .two-col>div:first-child>p:not(.notice){font-size:clamp(1.3rem,2vw,1.8rem);line-height:1.5;max-width:34ch}
#get-in-touch .notice{font-size:clamp(1.1rem,1.6vw,1.45rem);line-height:1.6;max-width:36ch}
@media(max-width:700px){#get-in-touch .two-col>div:first-child>p:not(.notice){font-size:1.2rem}#get-in-touch .notice{font-size:1.05rem}}
