:root{--bg:#efeade;--ink:#1c1c1c;--accent:#446084;--max:1200px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Lato,"Helvetica Neue",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
header{background:var(--bg);text-align:center;padding:10px 16px;position:sticky;top:0;z-index:10}
header img{max-height:80px;width:auto;margin:0 auto}
nav{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;font-weight:700;text-transform:uppercase;font-size:.85rem;margin-top:4px}
nav a{text-decoration:none}
nav a:hover{color:var(--accent)}
.hero{position:relative;min-height:78vh;background:var(--bg) url(/img/hero.jpg) 50% 10%/cover no-repeat;display:flex;align-items:flex-end;justify-content:flex-start;color:#fff;padding:5%}
.hero div{position:relative;z-index:1;max-width:440px;background:rgba(28,28,28,.55);padding:20px 28px;border-radius:6px;text-align:left}
.hero h1{text-transform:uppercase;font-size:2rem;letter-spacing:.05em}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:40px 8%;align-items:center}
.contact img{width:62%}
.contact h3{margin-bottom:8px}
footer{background:#222;color:#ddd;text-align:center;padding:16px;font-size:.85rem}
.page{max-width:var(--max);margin:0 auto;padding:32px 16px}
.page h1{text-align:center;text-transform:uppercase;margin-bottom:24px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.gallery figure figcaption{text-align:center;font-weight:700;text-transform:uppercase;margin:6px 0}
.back{text-align:center;margin-top:32px}
@media(max-width:849px){
 .grid,.contact{grid-template-columns:1fr}
 .tile{min-height:70vh}
 .contact img{width:50%}
 .hero h1{font-size:1.5rem}
 .hero{background-position:82% 10%}
}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card{display:flex;flex-direction:column;background:var(--bg)}
.card:nth-child(even){background:#fff}
.card img{width:100%;aspect-ratio:2/3;object-fit:cover}
.card .box{padding:24px}
.card h2{text-transform:uppercase;font-size:1.4rem;margin-bottom:8px}
.card p{font-size:.9rem;line-height:1.5;margin-bottom:16px}
.spec{max-width:760px;margin:0 auto 24px;padding-left:20px;font-size:.95rem}
.spec li{margin:4px 0}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:32px}
.chips a{text-decoration:none;border:1px solid var(--accent);color:var(--accent);padding:4px 14px;border-radius:99px;font-size:.85rem;font-weight:700}
.chips a:hover{background:var(--accent);color:#fff}
.variant{margin-bottom:40px;scroll-margin-top:150px}
.variant h2{text-align:center;margin-bottom:12px}
.gallery{grid-template-columns:repeat(auto-fit,minmax(240px,320px));justify-content:center}
.gallery img{width:100%;border-radius:4px}
address{font-style:normal}
