/* 4: grafisch atelier, helder raster en stevige typografie. */
.version-4 { --paper: #f1f7ed; --ink: #263e33; --teal: #536b3c; --muted: #53614e; --line: #a9b79b; --sand: #e0eacd; --heading: var(--sans); --weight: 750; }
.version-4 .site-header { border-bottom: 3px solid var(--ink); }
.version-4 .hero { grid-template-columns: 1.15fr 1fr; margin-block: 1.5rem; padding: 2.7rem; background: var(--sand); }
.version-4 .hero h1 { font-size: clamp(3rem, 5.25vw, 5rem); letter-spacing: -.075em; }
.version-4 .hero h1 em { font-weight: 450; }
.version-4 .hero-photo { border-radius: 0; height: 37rem; }
.version-4 .hero-photo figcaption { width: 100%; background: var(--ink); }
.version-4 .intro-strip { border-top: 0; border-bottom: 3px solid var(--ink); }
.version-4 .stay-grid { gap: 1.5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.version-4 .stay { grid-column: auto; margin: 0; padding: 2rem; background: var(--sand); border: 2px solid var(--ink); }
.version-4 .stay-featured .stay-copy { display: block; }
.version-4 .stay-featured .stay-tips { margin-top: 2.5rem; }
.version-4 .stay-number { font: 600 .85rem var(--sans); }
.version-4 .stay h3 { font-size: clamp(1.8rem, 2.5vw, 2.4rem); }
.version-4 .management h2, .version-4 .contact h2 { font-weight: 500; }
.version-4 .coming-grid { grid-template-columns: 1fr 1fr 1fr; }
.version-4 .coming-grid li { border-top: 3px solid var(--ink); }

@media (max-width: 1050px) {
    .version-4 .hero { padding: 2rem; gap: 2rem; }
    .version-4 .hero-photo { height: 34rem; }
    .version-4 .stay { padding: 1.8rem; }
    .version-4 .coming-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .version-4 .hero { display: flex; flex-direction: column; align-items: stretch; gap: 1.5rem; }
    .version-4 .hero h1 { font-size: clamp(2.7rem, 10vw, 4rem); max-width: 18ch; }
    .version-4 .hero { padding: 1.5rem; }
    .version-4 .hero-photo { height: 23rem; }
    .version-4 .stay-grid { grid-template-columns: 1fr; }
    .version-4 .stay:last-child .stay-copy { display: block; }
    .version-4 .stay:last-child .stay-tips { margin-top: 2rem; }
    .version-4 .stay:last-child { grid-column: auto; }
    .version-4 .stay { padding: 1.5rem; }
    .version-4 .coming-grid { grid-template-columns: 1fr; gap: 1rem; }
}
