:root{--primary:#1F3D2E;--primary-dark:#15291F;--primary-light:#2C5440;--accent:#C9A961;--accent-light:#DFC489;--ink:#1A1A1A;--ink-soft:#3A3A3A;--bg:#F7F2E8;--bg-warm:#EFE7D4;--white:#FFFFFF;--font-display:"Fraunces",Georgia,serif;--font-body:"Inter",-apple-system,sans-serif;--ease:cubic-bezier(.22,1,.36,1);--shadow-sm:0 4px 20px rgba(31,61,46,.08);--shadow-md:0 12px 40px rgba(31,61,46,.12);--shadow-lg:0 24px 60px rgba(31,61,46,.18)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);color:var(--ink);background:var(--bg);line-height:1.6;font-size:16px;overflow-x:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}.container{max-width:1280px;margin:0 auto;padding:0 32px}.container-wide{max-width:1440px;margin:0 auto;padding:0 32px}.header{position:fixed;top:0;left:0;right:0;z-index:100;padding:20px 0;transition:all .4s var(--ease);background:#f7f2e8f5;backdrop-filter:blur(14px);box-shadow:var(--shadow-sm)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:32px}.logo{font-family:var(--font-display);font-weight:500;font-size:22px;letter-spacing:.02em;color:var(--primary);line-height:1.1}.logo span{display:block;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);font-family:var(--font-body);font-weight:500;margin-top:4px}.nav{display:flex;gap:34px;align-items:center}.nav a{font-size:13px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);position:relative;transition:color .3s}.nav a:after{content:"";position:absolute;bottom:-6px;left:0;width:0;height:1px;background:var(--accent);transition:width .3s var(--ease)}.nav a:hover{color:var(--primary)}.nav a:hover:after{width:100%}.nav-cta{background:var(--accent);color:var(--primary-dark)!important;padding:11px 22px;border-radius:2px;letter-spacing:.08em}.nav-cta:after{display:none!important}.nav-cta:hover{background:var(--accent-light);transform:translateY(-1px)}.menu-toggle{display:none;background:none;border:none;color:var(--ink);cursor:pointer;padding:8px;font-size:22px}.page-hero{position:relative;padding:200px 0 110px;background:linear-gradient(180deg,var(--primary-dark) 0%,var(--primary) 60%,var(--primary-light) 100%);color:var(--white);overflow:hidden}.page-hero:before{content:"";position:absolute;inset:0;background:url(https://hss-studio.pages.dev/img/hotel-putnik-kopaonik/cat/spa/0?w=1920&q=70&f=auto) center/cover;opacity:.18;mix-blend-mode:luminosity}.page-hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:90px;background:linear-gradient(180deg,transparent,var(--bg))}.page-hero-inner{position:relative;z-index:2;max-width:880px}.eyebrow{display:inline-flex;align-items:center;gap:14px;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--accent);margin-bottom:28px;font-weight:500}.eyebrow:before{content:"";width:48px;height:1px;background:var(--accent)}.page-hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(44px,7vw,88px);line-height:1.02;letter-spacing:-.02em;margin-bottom:28px}.page-hero h1 em{font-style:italic;color:var(--accent-light);font-weight:300}.page-hero p.lead{font-size:19px;line-height:1.65;color:#ffffffd1;max-width:640px;font-weight:300}.crumbs{position:relative;z-index:2;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#ffffff8c;margin-bottom:36px;display:flex;gap:14px;align-items:center}.crumbs a:hover,.crumbs span{color:var(--accent)}.intro{padding:90px 0 40px;background:var(--bg)}.intro-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start}.intro-label{font-family:var(--font-display);font-style:italic;font-weight:300;font-size:28px;color:var(--primary);line-height:1.3}.intro-text{font-size:17px;line-height:1.75;color:var(--ink-soft)}.intro-text p+p{margin-top:18px}.filters{padding:48px 0 32px;background:var(--bg)}.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;border-top:1px solid rgba(31,61,46,.12);border-bottom:1px solid rgba(31,61,46,.12);padding:28px 0}.chip{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);padding:10px 20px;border:1px solid rgba(31,61,46,.18);border-radius:100px;cursor:pointer;transition:all .3s var(--ease);background:transparent}.chip:hover,.chip.active{background:var(--primary);color:var(--white);border-color:var(--primary)}.section-head{padding:70px 0 40px;text-align:center}.section-head .eyebrow{justify-content:center;color:var(--accent);margin-bottom:20px}.section-head .eyebrow:before{display:none}.section-head h2{font-family:var(--font-display);font-weight:400;font-size:clamp(36px,5vw,58px);line-height:1.05;letter-spacing:-.015em;color:var(--primary);margin-bottom:16px}.section-head h2 em{font-style:italic;color:var(--accent);font-weight:300}.section-head p{font-size:16px;color:var(--ink-soft);max-width:600px;margin:0 auto}.rates{padding:20px 0 80px;background:var(--bg)}.rate-list{display:flex;flex-direction:column;gap:28px}.rate{display:grid;grid-template-columns:80px 1fr auto;gap:40px;align-items:center;background:var(--white);padding:36px 44px;border-radius:4px;box-shadow:var(--shadow-sm);transition:all .5s var(--ease);position:relative;overflow:hidden;opacity:0;animation:fadeUp .8s var(--ease) forwards}.rate:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform .5s var(--ease)}.rate:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.rate:hover:before{transform:scaleY(1)}.rate-num{font-family:var(--font-display);font-weight:300;font-size:42px;color:var(--accent);line-height:1;font-style:italic}.rate-main{min-width:0}.rate-tag{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--primary);background:var(--bg-warm);padding:5px 12px;border-radius:2px;margin-bottom:12px}.rate-tag.promo{background:var(--accent);color:var(--primary-dark)}.rate-tag.early{background:var(--primary);color:var(--white)}.rate-tag.family{background:#a8c5b0;color:var(--primary-dark)}.rate-tag.season{background:var(--primary-light);color:var(--white)}.rate-tag.lastmin{background:#c97961;color:var(--white)}.rate h3{font-family:var(--font-display);font-weight:500;font-size:24px;color:var(--primary);line-height:1.2;margin-bottom:10px;letter-spacing:-.01em}.rate p{font-size:14px;color:var(--ink-soft);line-height:1.55;max-width:620px}.rate-incl{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px}.rate-incl span{font-size:12px;color:var(--ink-soft);display:inline-flex;align-items:center;gap:6px;letter-spacing:.02em}.rate-incl span:before{content:"";width:5px;height:5px;background:var(--accent);border-radius:50%}.rate-cta{display:inline-flex;align-items:center;gap:10px;background:var(--primary);color:var(--white);padding:14px 26px;border-radius:2px;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;transition:all .35s var(--ease);white-space:nowrap}.rate-cta:hover{background:var(--accent);color:var(--primary-dark);transform:translate(4px)}.rate-cta svg{width:14px;height:14px;transition:transform .35s var(--ease)}.rate-cta:hover svg{transform:translate(3px)}.featured{padding:40px 0 80px;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-warm) 100%)}.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.feat{background:var(--white);border-radius:4px;overflow:hidden;box-shadow:var(--shadow-sm);transition:all .5s var(--ease);display:flex;flex-direction:column;opacity:0;animation:fadeUp .8s var(--ease) forwards}.feat:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}.feat-img{position:relative;aspect-ratio:4/3;overflow:hidden}.feat-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}.feat:hover .feat-img img{transform:scale(1.06)}.feat-img-tag{position:absolute;top:18px;left:18px;background:var(--accent);color:var(--primary-dark);padding:6px 14px;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;border-radius:2px}.feat-body{padding:30px 28px 32px;display:flex;flex-direction:column;flex:1}.feat h3{font-family:var(--font-display);font-weight:500;font-size:22px;color:var(--primary);line-height:1.25;margin-bottom:12px}.feat p{font-size:14px;color:var(--ink-soft);line-height:1.6;margin-bottom:20px;flex:1}.feat-incl{display:flex;flex-direction:column;gap:7px;margin-bottom:24px;padding-top:18px;border-top:1px solid rgba(31,61,46,.08)}.feat-incl span{font-size:12.5px;color:var(--ink-soft);display:flex;align-items:flex-start;gap:9px}.feat-incl span:before{content:"✓";color:var(--accent);font-weight:700;flex-shrink:0}.feat-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:var(--primary);border:1px solid var(--primary);padding:13px 22px;border-radius:2px;font-size:11.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;transition:all .35s var(--ease);margin-top:auto}.feat-cta:hover{background:var(--primary);color:var(--white)}.cta-block{padding:110px 0;background:var(--primary-dark);color:var(--white);position:relative;overflow:hidden}.cta-block:before{content:"";position:absolute;inset:0;background:url(https://hss-studio.pages.dev/img/hotel-putnik-kopaonik/cat/spa/0?w=1920&q=70&f=auto) center/cover;opacity:.12}.cta-inner{position:relative;z-index:2;text-align:center;max-width:720px;margin:0 auto}.cta-inner h2{font-family:var(--font-display);font-weight:400;font-size:clamp(36px,5vw,56px);line-height:1.1;margin-bottom:22px;letter-spacing:-.01em}.cta-inner h2 em{font-style:italic;color:var(--accent-light);font-weight:300}.cta-inner p{font-size:17px;color:#ffffffc7;margin-bottom:38px;line-height:1.65;font-weight:300}.cta-btn{display:inline-flex;align-items:center;gap:12px;background:var(--accent);color:var(--primary-dark);padding:18px 38px;border-radius:2px;font-size:13px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;transition:all .35s var(--ease)}.cta-btn:hover{background:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-md)}.footer{background:var(--primary-dark);color:#ffffffb3;padding:80px 0 32px;border-top:1px solid rgba(255,255,255,.08)}.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:50px;margin-bottom:56px}.foot-brand{font-family:var(--font-display);color:var(--white);font-size:24px;font-weight:500;margin-bottom:14px}.foot-brand span{display:block;font-family:var(--font-body);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);margin-top:6px;font-weight:500}.foot-col p{font-size:14px;line-height:1.7;margin-top:14px}.foot-col h4{font-family:var(--font-body);color:var(--white);font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;margin-bottom:20px}.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:10px}.foot-col a{font-size:14px;transition:color .3s}.foot-col a:hover{color:var(--accent)}.foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:28px;display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:.06em;color:#ffffff73}@keyframes fadeUp{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}.rate:nth-child(1){animation-delay:.05s}.rate:nth-child(2){animation-delay:.1s}.rate:nth-child(3){animation-delay:.15s}.rate:nth-child(4){animation-delay:.2s}.rate:nth-child(5){animation-delay:.25s}.rate:nth-child(6){animation-delay:.3s}.rate:nth-child(7){animation-delay:.35s}.rate:nth-child(8){animation-delay:.4s}.rate:nth-child(9){animation-delay:.45s}.rate:nth-child(10){animation-delay:.5s}.feat:nth-child(1){animation-delay:.1s}.feat:nth-child(2){animation-delay:.2s}.feat:nth-child(3){animation-delay:.3s}@media(max-width:960px){.nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--white);flex-direction:column;padding:24px;gap:18px;box-shadow:var(--shadow-md)}.nav.open{display:flex}.menu-toggle{display:block}.intro-grid{grid-template-columns:1fr;gap:36px}.feat-grid{grid-template-columns:1fr;gap:24px}.rate{grid-template-columns:1fr;gap:18px;padding:28px}.rate-num{font-size:32px}.rate-cta{justify-self:start}.page-hero{padding:150px 0 80px}.foot-grid{grid-template-columns:1fr 1fr;gap:32px}.foot-bottom{flex-direction:column;gap:12px;text-align:center}}@media(max-width:560px){.container,.container-wide{padding:0 20px}.foot-grid{grid-template-columns:1fr}.chips{gap:8px;padding:20px 0}.chip{padding:8px 14px;font-size:11px}}