:root{--cream:#faf6ee;--cream-2:#f3ecdd;--spruce:#17352a;--amber:#c9862c;--amber-2:#a86c1d;--ink:#22271f;--muted:#6c705f;--line:#e0d7c2;--serif:'Fraunces',Georgia,serif;--sans:'Karla',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--ink);font:17px/1.7 var(--sans);margin:0}
img{display:block;max-width:100%}
a{color:var(--amber-2)}
h1,h2,h3{color:var(--spruce);font-family:var(--serif);line-height:1.1}
.wrap{margin:auto;width:min(1120px,calc(100% - 48px))}
.hero{align-items:end;background:linear-gradient(90deg,rgba(13,29,22,.86),rgba(13,29,22,.25)),url('../photos/010-71188537.jpg') center 42%/cover;color:#fff;display:flex;min-height:690px;padding:90px 0 72px}
.kicker{color:var(--amber-2);font-size:.76rem;font-weight:700;letter-spacing:.22em;margin:0 0 12px;text-transform:uppercase}
.hero .kicker{color:#f4d9a8}
.hero h1{color:#fff;font-size:clamp(3rem,7vw,6.1rem);letter-spacing:-.035em;margin:0;max-width:11ch}
.hero p{color:#f0ead9;font-size:1.13rem;max-width:58ch}
.article{padding:82px 0}
.article-grid{display:grid;gap:58px;grid-template-columns:minmax(0,1fr) 310px}
.article-body{max-width:740px}
.article-body>p:first-of-type{color:var(--spruce);font:400 clamp(1.45rem,3vw,2rem)/1.45 var(--serif)}
.article h2{font-size:clamp(2rem,4vw,3.25rem);letter-spacing:-.02em;margin:58px 0 18px}
.article h3{font-size:1.35rem;margin:28px 0 10px}
.quote{background:var(--cream-2);border-left:4px solid var(--amber);font:400 1.28rem/1.5 var(--serif);margin:36px 0;padding:24px 27px}
.side{position:sticky;top:94px}
.side-card{background:#fff;border:1px solid var(--line);border-radius:18px;margin-bottom:16px;overflow:hidden}
.side-card img{height:220px;object-fit:cover;width:100%}
.side-copy{padding:21px}
.side-card h3{font-size:1.18rem;margin:0 0 8px}
.side-card p{color:var(--muted);font-size:.84rem;margin:0 0 13px}
.side-card a{font-size:.8rem;font-weight:700}
.reasons{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr));margin:30px 0}
.reason{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px}
.reason b{color:var(--spruce);display:block;font-family:var(--serif);font-size:1.06rem;margin-bottom:6px}
.reason span{color:var(--muted);font-size:.83rem}
.day{border-top:1px solid var(--line);padding:19px 0}
.day strong{color:var(--spruce);display:block}
.cta{background:linear-gradient(90deg,rgba(12,29,22,.66),rgba(17,41,31,.42)),url('../photos/high-tatras-clover-panorama.webp') center 48%/cover;color:#fff;padding:86px 0;text-align:center}
.cta h2{color:#fff;font-size:clamp(2.2rem,5vw,4rem);margin:0 auto 16px;max-width:15ch;text-shadow:0 2px 18px rgba(10,22,16,.48)}
.cta p{color:#fff;margin:0 auto 24px;max-width:56ch;text-shadow:0 2px 14px rgba(10,22,16,.58)}
.buttons{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.btn{background:#fff;border-radius:999px;color:var(--spruce);display:inline-flex;font-weight:700;padding:12px 22px;text-decoration:none}
.btn.alt{background:var(--amber);color:#fff}
footer{background:#101f18;color:#b9c2b3;padding:38px 0;font-size:.84rem}
footer .wrap{display:flex;flex-wrap:wrap;gap:25px;justify-content:space-between}
footer a{color:#e8d8ae}
@media(max-width:860px){.article-grid{grid-template-columns:1fr}.side{display:grid;gap:16px;grid-template-columns:1fr 1fr;position:static}.side-card{margin:0}}
@media(max-width:660px){.wrap{width:min(100% - 30px,1120px)}.hero{min-height:560px;padding:62px 0}.article{padding:58px 0}.reasons,.side{grid-template-columns:1fr}.article h2{margin-top:43px}}
