:root {--ink:#263d3c; --gold:#ae833f; --cream:#fffaf1; --pale:#f4eee3; --line:#d5bb8e}
* {box-sizing:border-box}
html {scroll-behavior:smooth}
body {margin:0; background:radial-gradient(ellipse at 10% 0%,#fffbf2 0,#f4f1e9 70%,#ece9e3 100%); color:var(--ink);font:18px/1.7 Georgia,'Times New Roman',serif}
a{color:inherit}
header.site-head {position:relative;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;padding:15px clamp(18px,5vw,72px);border-bottom:1px solid #d9c49d;background:#fffaf2eb}
.identity{font-size:1.2rem;text-decoration:none;font-variant:small-caps;letter-spacing:.06em;color:#4a3640}
.identity span{display:block;font:12px/1.3 Georgia,serif;letter-spacing:.13em;text-transform:uppercase;color:#92723e}
nav{display:flex;gap:clamp(10px,2vw,26px);flex-wrap:wrap;font-size:15px}
nav a{text-decoration:none;border-bottom:1px solid transparent}nav a:hover, nav a:focus-visible{border-bottom-color:var(--gold)}
main{max-width:1180px;padding:36px 28px 90px;margin:0 auto}
.welcome{max-width:830px;margin:12px auto 18px;text-align:center}
.eyebrow{text-transform:uppercase;letter-spacing:.20em;font-size:14px;color:#85693d;margin:0 0 4px}
h1,h2,h3{font-weight:normal;line-height:1.16}
h1{font-size:clamp(2.4rem,5vw,4.8rem);color:#4a3540;margin:10px 0 14px}
.lead{font-size:clamp(1rem,2.3vw,1.35rem);max-width:650px;margin:20px auto 12px}
.flourish{display:flex;align-items:center;gap:20px;color:var(--gold);justify-content:center;font-size:28px;margin:12px auto}
.flourish:before,.flourish:after{content:'';display:block;height:1px;width:min(27%,170px);background:linear-gradient(to right,transparent,var(--gold))}
.flourish:after{transform:scaleX(-1)}
.series-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:20px}
.collection{display:block;border:1px solid #d8ba7c;border-radius:38% 38% 20px 20px / 5% 5% 20px 20px;overflow:hidden;text-decoration:none;background:#fffbf5;box-shadow:0 12px 28px #372e2217;transition:transform .15s}
.collection:hover{transform:translateY(-3px)}
.collection img{display:block;width:100%;height:230px;object-fit:cover;object-position:center}
.collection h2{font-size:clamp(25px,3vw,37px);text-align:center;margin:19px 12px 2px}
.collection p{font-size:15px;text-align:center;margin:0 12px 15px}
.collection .enter{display:block;background:#b48c52;color:#fff;text-align:center;padding:10px;margin:13px 18px 23px;border-radius:28px;font-size:16px}
.collection.fire h2{color:#81332f}.collection.ocean h2{color:#17526a}.collection.rain h2{color:#603d72}
.series-hero{border-radius:50% 50% 18px 18px / 10% 10% 18px 18px;overflow:hidden;border:2px solid #cba967;box-shadow:0 14px 30px #4a373326;margin:12px auto 45px;max-width:1100px}
.series-hero img{width:100%;height:auto;display:block}
.back{display:inline-block;margin:0 0 18px;text-decoration:none;border-bottom:1px solid #b38d51}
.intro{text-align:center;margin:0 auto 38px;max-width:680px}
.intro p{margin:9px 0}
.preview{font-size:14px;background:#faf0df;border:1px solid #e2d1b4;text-align:center;padding:13px 18px;border-radius:12px;max-width:850px;margin:0 auto 38px}
.recordings{display:grid;gap:36px;max-width:930px;margin:0 auto}
.recording{display:grid;grid-template-columns:minmax(190px,270px) 1fr;gap:clamp(20px,4vw,44px);align-items:center;padding:20px;min-height:340px;background:linear-gradient(135deg,#fffefa 0%,#f7f0e4 100%);border:1px solid #ddc9a8;border-radius:58px 16px 58px 16px;box-shadow:0 10px 20px #3b32200e;overflow:hidden}
.recording .art{display:block;max-width:270px;width:100%;margin:auto;cursor:zoom-in}
.recording img{display:block;width:100%;height:auto;border-radius:13px;box-shadow:0 6px 22px #35282032}
.recording h2{margin:8px 0 22px;font-size:clamp(24px,2.6vw,34px);line-height:1.24}
.recording .number{font-size:13px;text-transform:uppercase;letter-spacing:.16em;color:#887049}
.controls{display:flex;gap:10px;flex-wrap:wrap}
.controls button{border:1px solid #b4945a;border-radius:50px;padding:11px 19px;background:#e5d0a7;color:#5d533f;font:16px Georgia,serif;opacity:.70;cursor:not-allowed}
.controls button:last-child{background:transparent}
.fire-page .recording{border-color:#d5b5a0}.ocean-page .recording{border-color:#b5cbd1}.rain-page .recording{border-color:#c6bbd6}
footer{text-align:center;padding:32px 16px;border-top:1px solid #dccbae;font-size:14px;color:#6c625a}
footer small{display:block;font-size:12px;margin-top:5px}
@media(max-width:800px){.series-grid{grid-template-columns:1fr;max-width:550px;margin-left:auto;margin-right:auto}.collection img{height:250px}}
@media(max-width:660px){main{padding:24px 15px 65px}header.site-head{justify-content:center;text-align:center}.recording{display:flex;flex-direction:column;text-align:center;border-radius:30px;padding:20px 16px 27px;gap:18px}.recording .art{width:min(75vw,330px);max-width:330px}.recording h2{margin-bottom:15px}.controls{justify-content:center}}

/* A Little Personal Request — Welcome Page */
.personal-request{max-width:800px;margin:16px auto 0;padding:40px clamp(23px,5vw,65px) 48px;background:linear-gradient(150deg,rgba(255,253,247,.96),rgba(247,239,226,.92));border:1px solid #d5ba84;border-radius:90px 18px 90px 18px;box-shadow:0 12px 30px #463c2514}
.personal-request .request-flourish{text-align:center;color:#a28251;letter-spacing:16px;font-size:19px;margin-bottom:10px}
.personal-request h2{text-align:center;font-size:clamp(26px,3.7vw,39px);color:#503d43;margin:5px auto 24px}
.personal-request .request-body{max-width:660px;margin:auto;font-size:17px;line-height:1.85}
.personal-request .request-body p{margin:0 0 17px}
@media(max-width:660px){.personal-request{margin-top:18px;padding:28px 20px 36px;border-radius:42px 12px 42px 12px}.personal-request .request-body{font-size:16px}}