body{margin:0; }
a{color:#285d3a}a:hover{color:#1d4229}
.z{--acc:#fca712;font-family:'Rubik',system-ui,-apple-system,'Segoe UI',sans-serif;color:#18241b;background:#FFFCEB;overflow-x:hidden}
.z *{box-sizing:border-box}
.serif{font-family:'Inter Tight','Rubik',system-ui,sans-serif;font-weight:500!important;letter-spacing:-.025em}
.z .serif,.z em,.serif em,em.serif{font-style:normal!important}
em{font-style:normal}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
.eyebrow{font-size:12.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
.h2{margin:0;font-size:clamp(34px,4vw,56px);line-height:1.04;letter-spacing:-.02em;font-weight:400}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 26px;border-radius:999px;font-weight:500;font-size:15px;letter-spacing:.01em;text-decoration:none;position:relative;overflow:hidden;isolation:isolate;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;border:0;cursor:pointer;font-family:inherit}
.btn::before{content:"";position:absolute;inset:0;border-radius:inherit;transform:translateY(101%);transition:transform .45s cubic-bezier(.7,0,.2,1);z-index:-1}
.btn:hover{transform:translateY(-2px)}.btn:hover::before{transform:translateY(0)}
.btn-acc{background:var(--acc);color:#18241b}.btn-acc::before{background:#ffd27a}.btn-acc:hover{color:#18241b;box-shadow:0 14px 30px -12px rgba(252,167,18,.7)}
.btn-dark{background:#18241b;color:#FFFCEB}.btn-dark::before{background:#285d3a}.btn-dark:hover{color:#FFFCEB}
.btn-line{border:1.5px solid #18241b;color:#18241b;background:transparent}.btn-line::before{background:#18241b}.btn-line:hover{color:#FFFCEB}
.nl{color:#18241b;text-decoration:none;font-family:'Inter Tight','Rubik',system-ui,sans-serif;font-size:15px;font-weight:500;position:relative;padding:6px 0}
.nl::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--acc);transform:scaleX(0);transform-origin:right;transition:transform .35s}
.nl:hover{color:#18241b}.nl:hover::after{transform:scaleX(1);transform-origin:left}
.navlinks{display:flex;gap:28px}
.size{min-height:64px;min-width:120px;padding:0 22px;border-radius:18px;border:1.5px solid rgba(24,36,27,.18);background:#fff;font:700 15px 'Rubik',system-ui,-apple-system,'Segoe UI',sans-serif;color:#18241b;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;transition:all .3s}
.size small{font-weight:500;font-size:12px;color:#4f5a50}
.size:hover{border-color:#18241b}
.size.on{border-color:#285d3a;background:#285d3a;color:#FFFCEB}.size.on small{color:rgba(255,252,235,.75)}
.tab{min-height:48px;padding:0 4px;border:0;background:transparent;font:700 15px 'Rubik',system-ui,-apple-system,'Segoe UI',sans-serif;color:#4f5a50;cursor:pointer;position:relative}
.tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:#285d3a;transform:scaleX(0);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.tab:hover{color:#18241b}.tab.on{color:#18241b}.tab.on::after{transform:scaleX(1)}
.thumb{width:84px;height:84px;border-radius:16px;border:1.5px solid transparent;background:#fff;overflow:hidden;cursor:pointer;padding:0;display:grid;place-items:center;transition:border-color .3s}
.thumb.on{border-color:#285d3a}
.ph{background-color:#efe5c4;background-image:repeating-linear-gradient(135deg,rgba(40,93,58,.08) 0 2px,transparent 2px 14px);display:grid;place-items:center;color:#4f5a50;font-size:13px;font-weight:600;text-align:center;padding:16px}
.stage img{transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .5s}
.pop{animation:pop .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes pop{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.bar{height:14px;border-radius:7px;background:#285d3a;transform-origin:left;animation:barIn 1.2s cubic-bezier(.2,.8,.2,1) both}
@keyframes barIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.halo{animation:breathe 8s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
.card{background:#fff;border-radius:24px;overflow:hidden;text-decoration:none;color:#18241b;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-8px);box-shadow:0 30px 60px -30px rgba(29,66,41,.45);color:#18241b}
.card img{transition:transform .7s cubic-bezier(.2,.8,.2,1)}.card:hover img{transform:scale(1.07) rotate(-2.5deg)}
.row{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid rgba(24,36,27,.1);font-size:15px}
.field{min-height:56px;border-radius:999px;border:1.5px solid rgba(24,36,27,.2);background:#fff;padding:0 20px;font:600 15px 'Rubik',system-ui,-apple-system,'Segoe UI',sans-serif;color:#18241b}
.info{background:#fff;border-radius:28px;padding:32px;display:flex;flex-direction:column;gap:14px;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.info:hover{transform:translateY(-6px)}
.info .ic{width:52px;height:52px;border-radius:50%;background:#F4ECD2;color:#285d3a;display:grid;place-items:center}
.fact{border-top:1px solid rgba(24,36,27,.14);padding:16px 0 4px}
.fact dt{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#4f5a50}
.fact dd{margin:8px 0 0;font-size:17px;font-weight:700}
.fshell{background:#fff;border-radius:32px;padding:16px;box-shadow:0 40px 80px -50px rgba(24,36,27,.45)}
.fbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:4px 4px 16px}
.finder{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:16px;align-items:start}
.slist{display:flex;flex-direction:column;gap:8px;height:616px;overflow-y:auto;padding:2px 6px 2px 2px;scrollbar-width:thin}
.store{position:relative;display:flex;gap:14px;align-items:center;padding:12px;border-radius:20px;border:1.5px solid #f0ead6;background:#FFFCEB;color:#18241b;transition:border-color .3s,background .3s,transform .3s}
.store:hover{border-color:rgba(24,36,27,.25);transform:translateX(3px)}
.store.on{border-color:#285d3a;background:#fff;box-shadow:0 16px 36px -24px rgba(29,66,41,.6)}
.hit{position:absolute;inset:0;z-index:1;border:0;background:transparent;border-radius:20px;cursor:pointer;padding:0}
.dir{position:relative;z-index:2;flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#285d3a;color:#FFFCEB;text-decoration:none;transition:background .3s,transform .3s}
.dir:hover{background:#fca712;color:#18241b;transform:rotate(-12deg)}
.slogo{width:64px;height:48px;flex:none;border-radius:12px;background:#fff;border:1px solid #efe7cf;display:grid;place-items:center;overflow:hidden}
.mapcol{display:flex;flex-direction:column;gap:12px;min-width:0}
.map{position:relative;aspect-ratio:5 / 3;border-radius:24px;overflow:hidden;background:#f1ead2}
.mapimg{position:absolute;inset:0;width:100%;height:100%;display:block;animation:mapIn .6s ease both}
@keyframes mapIn{from{opacity:.2;transform:scale(1.03)}to{opacity:1;transform:none}}
.vt{position:absolute;top:14px;left:14px;z-index:5;display:flex;gap:4px;padding:4px;background:#fff;border-radius:999px;box-shadow:0 10px 24px -12px rgba(24,36,27,.5)}
.vt button{min-height:40px;padding:0 16px;border:0;border-radius:999px;background:transparent;font:500 14px 'Rubik',system-ui,sans-serif;color:#18241b;cursor:pointer;transition:background .3s,color .3s}
.vt button:hover{background:#F4ECD2}
.vt button.on{background:#285d3a;color:#FFFCEB}
.map svg.bg{position:absolute;inset:0;width:100%;height:100%;display:block}
.mlabel{position:absolute;transform:translate(-50%,-50%);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#285d3a;white-space:nowrap;pointer-events:none}
.pin{position:absolute;width:40px;height:44px;margin:-42px 0 0 -20px;border:0;background:transparent;cursor:pointer;padding:0;z-index:2;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .3s;animation:dropIn .8s cubic-bezier(.2,.8,.2,1) backwards}
.pin span{display:block;width:26px;height:26px;margin:6px auto 0;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#285d3a;border:3px solid #fff;box-shadow:0 8px 14px -6px rgba(0,0,0,.45);transition:background .3s}
.pin:hover{transform:translateY(-4px)}
.pin.on{z-index:4;transform:scale(1.3)}
.pin.on span{background:#fca712}
.pin.dim{opacity:.3}
@keyframes dropIn{from{opacity:0;transform:translateY(-60px)}to{opacity:1;transform:none}}
.ring{position:absolute;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;border:2px solid #fca712;z-index:1;animation:ring 1.8s ease-out infinite;pointer-events:none}
@keyframes ring{from{transform:scale(.3);opacity:1}to{transform:scale(1.4);opacity:0}}
.you{position:absolute;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;background:#2b6fd6;border:3px solid #fff;z-index:3;animation:you 2s ease-out infinite}
@keyframes you{0%{box-shadow:0 0 0 0 rgba(43,111,214,.5)}100%{box-shadow:0 0 0 26px rgba(43,111,214,0)}}
.mtag{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.9);border-radius:999px;padding:6px 12px;font-size:11px;font-weight:700;color:#4f5a50}
.selbar{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;background:#F4ECD2;border-radius:20px;padding:14px 14px 14px 16px}
.pg{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:72px;align-items:start}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 40px;margin:0}
.spec{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:56px}
@supports (animation-timeline: view()){.rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 22%}}
@keyframes rv{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.z *,.z *::before,.z *::after{animation:none!important;transition:none!important}}
@media (max-width:1080px){.navlinks{display:none}.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.finder{grid-template-columns:minmax(0,1fr)}.slist{height:auto;max-height:420px}.mapcol{order:-1}.facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.pg,.spec{grid-template-columns:minmax(0,1fr);gap:40px}.g3{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){.wrap{padding:0 20px}.g4{gap:12px}.stage{min-height:420px!important}.fshell{padding:10px;border-radius:24px}.facts{grid-template-columns:minmax(0,1fr)}}