.hero{
 min-height:70vh;
 display:flex;
 align-items:center;
 padding:160px 48px 100px;
 background:var(--off-white);
}

.hero-content{
 max-width:900px;
 margin:0 auto;
 text-align:center;
}

.hero-label{
 font-size:11px;
 text-transform:uppercase;
 letter-spacing:0.15em;
 color:var(--text-muted);
 margin-bottom:24px;
}

.hero-title{
 font-family:var(--font-serif);
 font-size:clamp(42px, 6vw, 72px);
 font-weight:400;
 line-height:1.1;
 margin-bottom:32px;
}

.hero-title em{font-style:italic;}

.hero-subtitle{
 font-size:16px;
 color:var(--text-muted);
 max-width:600px;
 margin:0 auto;
}

@media (max-width:768px){
 .hero{padding:140px 24px 80px;}
}


.story{
 padding:100px 48px;
 background:var(--white);
}

.story-content{
 max-width:1100px;
 margin:0 auto;
 display:grid;
 grid-template-columns:1fr 1.5fr;
 gap:80px;
 align-items:start;
}

.story-image{
 position:sticky;
 top:120px;
}

.story-image img{
 width:100%;
 aspect-ratio:4/5;
 object-fit:cover;
 filter:grayscale(100%);
 transition:filter 0.6s var(--ease);
}

.story-image:hover img{
 filter:grayscale(0%);
}

.story-image-caption{
 font-size:11px;
 color:var(--text-muted);
 margin-top:12px;
 text-align:center;
}

.story-text{
 padding-top:20px;
}

.story-text h2{
 font-family:var(--font-serif);
 font-size:32px;
 font-weight:400;
 margin-bottom:32px;
 line-height:1.3;
}

.story-text p{
 font-size:14px;
 margin-bottom:24px;
 color:var(--text);
}

.story-text p.highlight{
 font-family:var(--font-serif);
 font-size:24px;
 line-height:1.5;
 color:var(--text);
 margin:48px 0;
 padding-left:24px;
 border-left:2px solid var(--accent);
}

@media (max-width:900px){
 .story{padding:80px 24px;}
 .story-content{
 grid-template-columns:1fr;
 gap:48px;
}
 .story-image{
 position:relative;
 top:0;
 max-width:400px;
 margin:0 auto;
}
}


.worlds{
 padding:100px 48px;
 background:var(--cream);
}

.worlds-content{
 max-width:1000px;
 margin:0 auto;
}

.worlds-header{
 text-align:center;
 margin-bottom:64px;
}

.worlds-header h2{
 font-family:var(--font-serif);
 font-size:36px;
 font-weight:400;
 margin-bottom:16px;
}

.worlds-header p{
 color:var(--text-muted);
 font-size:14px;
}

.worlds-grid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:32px;
}

.world-card{
 padding:48px;
 background:var(--off-white);
 border-radius:8px;
}

.world-card h3{
 font-family:var(--font-serif);
 font-size:24px;
 font-weight:400;
 margin-bottom:24px;
}

.world-card p{
 font-size:13px;
 color:var(--text-muted);
 margin-bottom:16px;
}

.world-card ul{
 list-style:none;
 margin-top:24px;
}

.world-card li{
 font-size:12px;
 padding:8px 0;
 border-bottom:1px solid rgba(0,0,0,0.05);
 color:var(--text);
}

.world-card li:last-child{
 border-bottom:none;
}

@media (max-width:768px){
 .worlds{padding:80px 24px;}
 .worlds-grid{grid-template-columns:1fr;}
}


.cta{
 padding:120px 48px;
 background:var(--dark);
 color:var(--white);
 text-align:center;
}

.cta-content{
 max-width:600px;
 margin:0 auto;
}

.cta h2{
 font-family:var(--font-serif);
 font-size:clamp(32px, 5vw, 48px);
 font-weight:400;
 margin-bottom:24px;
 line-height:1.2;
}

.cta p{
 font-size:14px;
 color:rgba(255,255,255,0.6);
 margin-bottom:40px;
}

.cta-buttons{
 display:flex;
 gap:16px;
 justify-content:center;
 flex-wrap:wrap;
}

@media (max-width:768px){
 .cta{padding:80px 24px;}
 .cta-buttons{
 flex-direction:column;
 align-items:center;
}
}