@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=DM+Sans:wght@400;500;600;700&display=swap');

:root{--cream:#f8f3e9;--cream-2:#eee5d5;--green:#315849;--green-dark:#28483d;--brown:#3b2b24;--ink:#27231f;--muted:#716a60;--line:rgba(39,35,31,.12);--accent:#a9765d}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;line-height:1.65;overflow-x:hidden}
a{text-decoration:none;color:inherit}
.top-note{background:var(--brown);color:#f5eee3;text-align:center;padding:8px 16px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.site-header{background:rgba(248,243,233,.98);border-bottom:1px solid var(--line);position:relative;z-index:10}
.nav{min-height:96px;max-width:1280px;margin:0 auto;padding:18px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.brand-mark{width:54px;height:54px;border-radius:50%;background:var(--green);color:#f8f3e9;display:grid;place-items:center;font:500 27px/1 'Cormorant Garamond',serif;flex:0 0 auto}
.brand-name{display:block;font:500 30px/1.05 'Cormorant Garamond',serif;white-space:nowrap}
.brand-sub{display:block;color:#8a8277;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-top:4px;white-space:nowrap}
.main-nav{display:flex;gap:28px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.main-nav a:hover{color:var(--accent)}
.menu-toggle{display:none;width:62px;height:62px;border:1px solid var(--line);background:#fffdf8;border-radius:5px;padding:16px;cursor:pointer}
.menu-toggle span{display:block;height:2px;background:var(--brown);margin:6px 0}

/* HERO */
.hero{background:var(--cream);display:grid;grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);min-height:650px;overflow:hidden}
.hero-copy{padding:86px clamp(28px,6vw,82px) 76px;display:flex;flex-direction:column;justify-content:center;max-width:780px;position:relative;z-index:2}
.eyebrow,.section-heading>span{display:block;color:var(--green);font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;margin-bottom:24px}
.hero h1{font:500 clamp(56px,5.8vw,86px)/.92 'Cormorant Garamond',serif;letter-spacing:-.035em;margin:0;max-width:720px}
.hero h1 em{color:var(--green);font-style:italic;font-weight:500}
.hero-copy>p{font:400 clamp(18px,1.75vw,21px)/1.55 'Cormorant Garamond',serif;color:var(--muted);max-width:620px;margin:28px 0 32px}
.buttons{display:flex;gap:18px;flex-wrap:wrap}
.btn{min-height:58px;padding:17px 28px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;border-radius:2px;transition:.2s ease}
.btn-primary{background:var(--green);color:#fff}.btn-primary:hover{background:var(--green-dark)}
.btn-secondary{border:1px solid #768077;color:var(--green);background:transparent}.btn-secondary:hover{background:#fff}
.hero-portrait{position:relative;min-height:650px;margin:0 0 0 0;overflow:hidden;background:#e7ddca}
.hero-portrait:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--cream) 0%,rgba(248,243,233,.2) 18%,transparent 42%);z-index:1;pointer-events:none}
.hero-portrait:after{content:'';position:absolute;left:8%;right:8%;bottom:0;height:34px;background:linear-gradient(180deg,transparent,rgba(59,43,36,.08));filter:blur(10px);pointer-events:none}
.hero-portrait img{width:100%;height:100%;min-height:650px;display:block;object-fit:cover;object-position:center top}

.section{padding:110px max(28px,7vw)}
.section-heading h2{font:500 clamp(42px,5vw,70px)/.98 'Cormorant Garamond',serif;margin:0;letter-spacing:-.02em}
.section-heading p{font:400 20px/1.7 'Cormorant Garamond',serif;color:var(--muted);max-width:760px;margin:24px 0 0}
.poetry{background:#fbf8f1}.poem-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:55px}
.poem-card{min-height:390px;padding:42px 42px 34px;background:#eee4d1;display:flex;flex-direction:column;justify-content:space-between}.poem-card:nth-child(2){background:#dce4db}.poem-card:nth-child(3){background:#e9d5c8}.poem-number{font-size:12px;letter-spacing:.16em;color:#81796f}.poem-card h3{font:500 42px/1 'Cormorant Garamond',serif;margin:44px 0 12px}.poem-card p{font:italic 19px/1.5 'Cormorant Garamond',serif;color:#70685e}.read{font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--green)}
.music{background:var(--green);color:#f7f0e5}.music .section-heading>span{color:#d6b79f}.music .section-heading p{color:#ddd8cf}.music-list{border:1px solid rgba(255,255,255,.14);margin-top:55px}.track{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:38px;border-bottom:1px solid rgba(255,255,255,.14)}.track:last-child{border-bottom:0}.track small{display:block;text-transform:uppercase;letter-spacing:.17em;font-size:11px;color:#d4c8bb;margin-bottom:10px}.track h3{font:500 36px/1 'Cormorant Garamond',serif;margin:0}.play{width:62px;height:62px;border:1px solid rgba(255,255,255,.4);border-radius:50%;display:grid;place-items:center;flex:0 0 auto}
.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px;align-items:center}.about-box{min-height:420px;background:#d6c6aa;display:grid;place-items:center;position:relative;font:500 28px 'Cormorant Garamond',serif;letter-spacing:.15em}.about-box strong{font-size:42px;font-weight:400}.about-copy p{font:400 21px/1.7 'Cormorant Garamond',serif;color:var(--muted);max-width:720px}.quote{border-left:3px solid #a9765d;padding:4px 0 4px 28px;margin-top:34px;font:italic 27px/1.4 'Cormorant Garamond',serif;max-width:700px}
.newsletter{background:#e3d8c5;text-align:center}.newsletter-inner{max-width:1000px;margin:0 auto}.newsletter .section-heading>span{color:#a9765d}.newsletter .section-heading p{margin-left:auto;margin-right:auto}.newsletter-form{max-width:780px;margin:42px auto 0;display:grid;grid-template-columns:1fr 220px;gap:10px}.newsletter-form input{border:1px solid #ddd4c6;background:#fff;padding:18px 20px;font:400 17px 'Cormorant Garamond',serif;min-width:0}.newsletter-form button{border:0;background:var(--green);color:#fff;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:18px;cursor:pointer}
footer{background:var(--brown);color:#f7f0e5;text-align:center;padding:72px 28px 30px}.footer-inner{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;align-items:center}.footer-brand strong{font:500 38px/1 'Cormorant Garamond',serif}.footer-brand p{color:#d9cec2;font:400 19px 'Cormorant Garamond',serif;margin:14px 0 0}.footer-social-title{margin-top:38px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#c5b8aa}.socials{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 24px;margin:18px auto 32px}.socials a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border:1px solid rgba(255,255,255,.22);color:#f2e8dc;text-decoration:none;font-size:13px;transition:background .2s ease,border-color .2s ease,color .2s ease}.socials a:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.4);color:#fff}.footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;padding-top:28px;border-top:1px solid rgba(255,255,255,.15);width:100%;font-size:12px;letter-spacing:.1em;text-transform:uppercase}.footer-links a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 18px;border:1px solid rgba(255,255,255,.18);color:#f2e8dc;text-decoration:none;transition:background .2s ease,border-color .2s ease}.footer-links a:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.38)}.copyright{max-width:1000px;margin:32px auto 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.15);font-size:12px;color:#bcaea1}

@media(max-width:1100px){
 .hero{grid-template-columns:1fr;min-height:0}
 .hero-copy{padding:76px 42px 48px;max-width:900px}
 .hero h1{font-size:clamp(58px,8vw,82px)}
 .hero-copy>p{max-width:760px}
 .hero-portrait{min-height:500px;margin:0 42px 42px;border-radius:2px}.hero-portrait img{min-height:500px}
}

@media(max-width:900px){
 .main-nav{display:none}.menu-toggle{display:block}.hero{grid-template-columns:1fr;min-height:0}.hero-copy{padding:68px 28px 46px;text-align:left;max-width:none}.hero h1{font-size:clamp(50px,11vw,72px)}.hero-copy>p{font-size:19px}.buttons{gap:12px}.btn{flex:1 1 210px}.hero-portrait{min-height:430px;margin:0 28px 30px;border-radius:2px}.hero-portrait img{min-height:430px}.section{padding:88px 28px}.poem-grid{grid-template-columns:1fr}.poem-card{min-height:330px}.music-list{margin-top:42px}.track{padding:30px 24px}.track h3{font-size:30px}.about{grid-template-columns:1fr;gap:48px}.about-box{min-height:330px}.newsletter-form{grid-template-columns:1fr}.newsletter-form button{min-height:56px}
}
@media(max-width:560px){
 .top-note{font-size:10px;letter-spacing:.1em}.nav{min-height:82px;padding:14px 18px}.brand-mark{width:48px;height:48px;font-size:24px}.brand-name{font-size:25px}.brand-sub{font-size:9px;letter-spacing:.12em}.menu-toggle{width:54px;height:54px;padding:13px}.hero-copy{padding:54px 22px 40px}.eyebrow{font-size:10px;letter-spacing:.18em;margin-bottom:18px}.hero h1{font-size:49px;line-height:.96}.hero-copy>p{font-size:18px;line-height:1.55;margin:24px 0 28px}.buttons{display:grid;grid-template-columns:1fr;gap:10px}.btn{width:100%;min-height:54px}.hero-portrait{min-height:360px;margin:0 18px 18px;border-radius:2px}.hero-portrait img{min-height:360px;object-position:center top}.section{padding:72px 22px}.section-heading h2{font-size:45px}.section-heading p{font-size:19px}.poem-card{padding:32px 28px;min-height:300px}.poem-card h3{font-size:36px;margin-top:34px}.track{padding:26px 18px}.track h3{font-size:27px}.play{width:52px;height:52px}.about-box{min-height:270px}.about-copy p{font-size:19px}.quote{font-size:24px;padding-left:20px}.newsletter{padding-left:22px;padding-right:22px}.footer-brand strong{font-size:34px}.socials{gap:10px}.socials a{min-height:40px;padding:0 14px}.footer-links{gap:8px}.footer-links a{min-height:38px;padding:0 14px}
}
