/* Robotrata · Uvodna stran, 3. in 4. korak, obrisi na zemljevidu */
/* ===== uvodna stran (hero): tekst levo, slika desno, mehak prehod ===== */
body:not(.v-home) #domov{display:none}
body.v-home #konfigurator,body.v-home #katalog{display:none}
.home{padding-bottom:64px}
.hero{position:relative;overflow:hidden;align-items:center}
.hero-media{top:0;right:0;bottom:0;margin:0;background:var(--md-surface)}
.hero-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:60% 50%;}
/* mehak val v naslednjo sekcijo */
.hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-1px;height:70px;z-index:2;background:var(--md-surface);border-radius:50% 50% 0 0/100% 100% 0 0}
.hero-in{position:relative;z-index:3;width:100%;padding-block:56px 96px}
.hero-txt{display:grid;justify-items:start;gap:18px;max-width:600px}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 16px;border-radius:999px;background:color-mix(in srgb,#b8e986 38%,var(--md-sc-lowest));color:var(--md-on-surface);font:700 12.5px/1 var(--font);letter-spacing:.06em;text-transform:uppercase}
.hero h1{margin:0;font:800 clamp(34px,4.1vw,58px)/1.08 var(--font);letter-spacing:-.035em;color:var(--md-on-surface)}
.hero h1{text-wrap:balance}
.hero h1 em{font-style:normal;color:var(--md-primary)}
.hero-lead{max-width:27em;margin:0;font-size:clamp(16px,1.35vw,19px);line-height:1.55;color:var(--md-on-surface-variant)}
.hero-cta{flex-wrap:wrap;align-items:center;}
.hero-cta .btn-filled{padding:0 24px 0 28px;border-radius:14px;font-size:16.5px;box-shadow:0 12px 30px color-mix(in srgb,var(--md-primary) 30%,transparent)}
.hero-cta .btn-filled .ms{font-size:21px;}
.hero-cta .btn-filled:hover{transform:translateY(-1px)}
.hero-cta .btn-filled:hover .ms{transform:translateX(3px)}
.hero-cta .btn-text{font-size:15.5px}
.hero-trust{display:flex;flex-wrap:wrap;gap:14px 28px;padding:0;list-style:none;font:500 14px/19px var(--font);color:var(--md-on-surface)}
.hero-trust li{display:flex;align-items:center;gap:10px}
.hero-trust .ms{font-size:26px;color:var(--md-primary)}
/* oznake na sliki – kaj uporabnik dobi */
.hm-chips{position:absolute;inset:0;z-index:1;pointer-events:none}
.hm-chip{position:absolute;display:flex;align-items:center;gap:10px;padding:9px 14px 9px 10px;border-radius:14px;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(10,30,14,.2);color:#121a14}
.hm-chip>.ms{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#e5f3e3;color:#176b45;font-size:19px}
.hm-chip>span:last-child{display:grid;line-height:1.2}
.hm-chip small{font-size:11.5px;color:#5a665c}
.hm-chip b{font-size:14.5px;font-weight:700;letter-spacing:-.01em}
/* koraki pod uvodom */
.hero-steps{position:relative;z-index:3;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:-8px 0 0;padding:0;list-style:none}
.hero-steps li{display:flex;gap:14px;align-items:flex-start;padding:18px 20px;background:var(--md-sc-lowest);border:1px solid var(--rt-line);}
.hs-n{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--md-primary);color:var(--md-on-primary);font:700 15px/1 var(--font)}
.hero-steps div{display:grid;gap:2px}
.hero-steps b{font:600 16px/22px var(--font);letter-spacing:-.01em}
.hero-steps div span{font-size:14px;line-height:20px;color:var(--md-on-surface-variant)}
/* tablica: slika širša, tekst ostane berljiv */
@media (max-width:1180px) and (min-width:901px){}
/* telefon in ožja tablica: najprej tekst, nato slika */
@media (max-width:900px){
  .hero{min-height:0}
  .hero-media{position:relative;width:100%;aspect-ratio:16/10}
  .hero-media img{-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 22%);mask-image:linear-gradient(180deg,transparent 0%,#000 22%)}
  .hero-in{padding-block:28px 4px}
  .hero::after{height:36px}
  .hero-steps{grid-template-columns:1fr;gap:10px;}
  .hm-chip{padding:7px 11px 7px 7px;gap:8px;border-radius:12px}.hm-chip>.ms{width:28px;height:28px;font-size:17px}.hm-chip b{font-size:13px}.hm-chip small{font-size:11px}
}
@media (max-width:600px){
  .hero-txt{gap:14px}
  .hero-eyebrow{font-size:11px;height:30px;padding:0 12px}
  .hero-cta{width:100%}
  .hero-cta .btn-filled{font-size:16px}
  .hero-cta .btn-text{width:100%}
  .hero-trust{gap:12px 18px;font-size:13px;line-height:17px}
  .hero-trust .ms{font-size:22px}
  .hero-media{aspect-ratio:4/3}
  .hero-media img{object-position:66% 50%}
}

/* uravnoteženje uvodne strani: ožja in mirnejša slika, močnejši levi stolpec, ena oznaka */

.hero-media img{filter:saturate(.88) brightness(1.02)}
.hero-media::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;}
@media (max-width:900px){.hero-media::before{background:linear-gradient(180deg,var(--md-surface) 0%,transparent 26%)}.hm-a{left:auto;right:12px;top:auto;bottom:46px}}
.hero-trust{border-top:1px solid var(--rt-line)}

/* =====================================================================
   POENOTENJE S PRVO STRANJO – isti zeleni ton, naglasi, naslovi, gumbi in oznake na vseh straneh
   ===================================================================== */
:root{--md-primary:#176b45;--rt-hover:#115a39;--md-primary-container:#e4f2e6;--md-on-primary-container:#0f3d27;
  --rt-accent:#2f9e5f;--rt-accent-soft:#eef7e6;--rt-lime:#b8e986;--md-on-surface:#1c2420}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--md-primary:#6fd08a;--rt-hover:#86dc9d;--rt-accent-soft:#14291b;--md-on-surface:#e6ece6}}
:root[data-theme="dark"]{--md-primary:#6fd08a;--rt-hover:#86dc9d;--rt-accent-soft:#14291b;--md-on-surface:#e6ece6}

/* oznaka nad naslovom: enaka limetina »tabletka« kot na prvi strani */
.wz-k{justify-self:start;display:inline-flex;align-items:center;height:30px;padding:0 14px;border-radius:999px;background:color-mix(in srgb,var(--rt-lime) 38%,var(--md-sc-lowest));color:var(--md-on-surface);font:700 12px/1 var(--font);letter-spacing:.06em}
:root[data-theme="dark"] .wz-k,:root[data-theme="dark"] .hero-eyebrow{background:color-mix(in srgb,var(--rt-lime) 16%,var(--md-sc-lowest))}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .wz-k,:root:not([data-theme="light"]) .hero-eyebrow{background:color-mix(in srgb,var(--rt-lime) 16%,var(--md-sc-lowest))}}
.wz-head{gap:10px}

/* naslovi: enaka teža in razmik črk kot naslov prve strani */
.wz-head h2{font:800 clamp(28px,2.8vw,40px)/1.1 var(--font);letter-spacing:-.035em}
.cat-head h1{font:800 clamp(30px,3vw,42px)/1.1 var(--font)!important;letter-spacing:-.035em}
#cat-count{margin-top:6px;font-size:15px;color:var(--md-on-surface-variant)}
.lead-head h2{font:800 28px/1.15 var(--font)!important;letter-spacing:-.03em}
.pdlg h2,.nd-body h2{font-weight:800!important;letter-spacing:-.03em}
.rd b,.sumbar::before,.wl-t b{font-weight:800!important;letter-spacing:-.02em}
.ap-area b{font-weight:800!important}
.wz-d{font-size:17px;line-height:26px}
@media (max-width:600px){.wz-head h2{font-size:26px}.wz-d{font-size:15px;line-height:22px}}

/* glavni gumbi: enaki kot »Začni z mojim vrtom« (višina, zaobljenost, mehka zelena senca, puščica) */
.btn-filled{border-radius:14px}
.btn-filled:hover{transform:translateY(-1px)}

.btn-filled:hover .ms:last-child{transform:translateX(2px)}
.wz-next{height:54px;padding:0 22px 0 26px;border-radius:14px;font-size:16px;box-shadow:0 10px 26px color-mix(in srgb,var(--md-primary) 28%,transparent)}
.wz-next:disabled{transform:none}
.btn-lg{height:56px;border-radius:14px;font-size:16px}
.lead-acts .btn-filled{box-shadow:0 10px 26px color-mix(in srgb,var(--md-primary) 26%,transparent)}
.btn-outlined,.btn-tonal{border-radius:14px}
@media (max-width:600px){.wz-next{height:52px}}

/* številke korakov: enak krog kot na prvi strani */
@media (min-width:761px){
  .steps .sn{width:34px;height:34px;font:700 14px/1 var(--font)}
  .steps li.on .sn{background:var(--md-primary);color:var(--md-on-primary)}
}

/* izbrane možnosti in poudarki v limetino-zelenem tonu prve strani */
.tool[aria-pressed="true"],.set-card .opt-slope .seg .tool[aria-pressed="true"],.set-card .opts-main .seg .tool[aria-pressed="true"]{background:var(--rt-accent-soft)}
.wz-why::before,.hint::before{color:var(--md-primary)}

/* kartice: enaka zaobljenost in senca kot kartice korakov na prvi strani */
.card,.lead-card,.pcard,.cat-filters,.sumbar,#konfigurator #recs .rec.nc,.hero-steps li{border-radius:20px}
.hero-steps li{box-shadow:var(--elev-1)}
.pdlg,.navdlg{border-radius:24px}

/* katalog: glava v slogu prve strani */
.cat-head{padding-block:28px 20px}

/* ===== 3. korak: pregledna vprašanja kot ločene kartice, levo povzetek z odgovori ===== */

#konfigurator .set-card{background:transparent;border:0;box-shadow:none;padding:0!important}
#konfigurator .set-card .opt-slope,#konfigurator .set-card .opts-main .opt{position:relative;border-radius:18px;background:var(--md-sc-lowest);gap:12px;}
#konfigurator .set-card .opt-slope.done,#konfigurator .set-card .opts-main .opt.done{border-color:color-mix(in srgb,var(--md-primary) 38%,var(--rt-line))!important}
#konfigurator .set-card .opts-main{display:block}
.set-card .opt-l{gap:12px}
.set-card .opt-slope .opt-l>.ms,.set-card .opts-main .opt-l>.ms{place-items:center;width:38px;height:38px;flex:none;border-radius:12px;background:var(--rt-accent-soft);font-size:21px!important;margin:0}
.set-card .opt-l .opt-t{font:700 17px/22px var(--font);letter-spacing:-.01em}
.set-card .opt-l .opt-t small{font:400 13.5px/19px var(--font);margin-top:3px;color:var(--md-on-surface-variant)!important}
.set-card .opt-l .opt-t small .info-q{width:20px;height:20px;vertical-align:-4px}
/* enakomerne izbire: vse v eni vrsti enake višine */
@media (min-width:901px){
  
  .set-card .opt[data-opt="sig4g"] .seg{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .set-card .opt[data-opt="sky"] .seg{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media (max-width:900px){.set-card .opt-slope .seg,.set-card .opts-main .seg{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.set-card .opt-slope .seg .tool,.set-card .opts-main .seg .tool{align-items:center}
.set-card .tool .tl small{white-space:normal}
.set-card .tool .tl{min-width:0}
/* meritev naklona: kratka zelena vrstica v kartici, natančen vnos kot majhna povezava */
.set-card .opt-slope .lidar-res{margin:0!important;padding:0;background:transparent!important;border:0!important;font-size:13px;line-height:18px;color:var(--md-on-surface-variant);gap:8px}
.set-card .opt-slope .lidar-res::before{font-size:18px}
.set-card .opt-slope .lidar-res.bad::before{content:"info";color:var(--md-warning)}
.set-card .opt-slope .exact{margin:-6px 0 0!important}
.set-card .opt-slope .exact>summary{min-height:28px;font-size:13px}
/* dodatne možnosti in opomba – mirno na koncu */
#konfigurator .set-card .more-set{margin:4px 0 0;padding:0 20px;border:1px dashed var(--md-outline)!important;border-radius:18px;background:transparent}
#konfigurator .set-card .more-set[open]{border-style:solid;background:var(--md-sc-lowest)}
#konfigurator .set-card .sig-note{margin:12px 4px 0}
/* levo: povzetek vrta z odgovori (sproti se dopolnjuje) */

@media (min-width:901px){
  
  #konfigurator .set-card>#wz-lawn{padding:16px;border:1px solid var(--rt-line);border-radius:18px;background:var(--md-sc-lowest);box-shadow:var(--elev-1)}
  #konfigurator .set-card>#wz-lawn .wl{padding:0;margin:0;border:0;background:transparent;gap:10px}
  #konfigurator .set-card>#wz-lawn .wl svg{max-height:120px;background:var(--md-sc)}
}
@media (max-width:900px){#konfigurator .set-card>#wz-lawn{margin-bottom:12px}}

/* ===== 3. korak: slika trate kot glavni akter, eno vprašanje naenkrat ===== */
/* prikaži samo trenutno vprašanje */
#nastavitve .opt-slope,#nastavitve .opts-main .opt,#nastavitve .q3-done,#nastavitve .more-set,#nastavitve .sig-note{display:none!important}
#nastavitve[data-q="0"] .opt-slope,#nastavitve[data-q="1"] .opt[data-opt="sky"],#nastavitve[data-q="2"] .opt[data-opt="sig4g"]{display:grid!important;}
#nastavitve[data-q="2"] .sig-note,#nastavitve[data-q="3"] .sig-note{display:flex!important}
#nastavitve[data-q="9"] .q3-done{display:flex!important;animation:q3in .35s ease both}
#nastavitve[data-q="9"] .more-set{display:block!important}
@keyframes q3in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){#nastavitve .opt,#nastavitve .q3-done{animation:none!important}}
#nastavitve .opt-slope::before,#nastavitve .opt[data-opt="sky"]::before,#nastavitve .opt[data-opt="sig4g"]::before{font:700 12px/16px var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--md-primary)}
/* na desni so vprašanja v enem stolpcu (manj stolpcev, večji gumbi) */
@media (min-width:901px){
  .set-card .opt-slope .seg,.set-card .opt[data-opt="sig4g"] .seg,.set-card .opt[data-opt="sky"] .seg{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}



.q3-done{align-items:flex-start;gap:12px;padding:18px 20px;margin:0 0 14px;border-radius:18px;background:var(--rt-accent-soft);border:1px solid color-mix(in srgb,var(--md-primary) 22%,transparent)}
.q3-done>.ms{font-size:28px;color:var(--md-primary)}
.q3-done>div{display:grid;gap:2px}
.q3-done b{font:800 17px/22px var(--font);letter-spacing:-.01em}
.q3-done span:not(.ms){font-size:14px;color:var(--md-on-surface-variant)}

/* slika trate */
.lawn-stage{position:relative;margin:0;overflow:hidden;box-shadow:var(--elev-2);isolation:isolate}
.ls-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .55s ease}
.ls-img img.on{opacity:1}
.lawn-stage.noimg .ls-img{display:none}
.ls-sat{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0;}
.ls-sat.on{opacity:1}
.ls-sat line{stroke-width:.45;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-width:2.2}
.ls-sat.q-good line{stroke:#9ff0b4;stroke-dasharray:none;filter:drop-shadow(0 0 3px rgba(160,255,190,.9))}
.ls-sat.q-mid line{stroke:#ffd36b;stroke-dasharray:10 7}
.ls-sat.q-bad line{stroke:#ff8f80;stroke-dasharray:3 9}
.ls-sat.on line{animation:lsdash 1.6s linear infinite}
@keyframes lsdash{to{stroke-dashoffset:-34}}
@media (prefers-reduced-motion:reduce){.ls-sat.on line{animation:none}}
.ls-fx{position:absolute;inset:0;z-index:2;pointer-events:none;padding:14px}
.ls-tag{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px 0 10px;border-radius:11px;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 6px 18px rgba(10,30,14,.2);color:#17211a;font:600 13px/1 var(--font);white-space:nowrap}
.ls-tag .ms{font-size:18px;color:#176b45}
.ls-cx{position:absolute;left:14px;top:14px}
.ls-sl{position:absolute;left:14px;bottom:14px}
.ls-sl.pulse{box-shadow:0 0 0 3px rgba(184,233,134,.9),0 6px 18px rgba(10,30,14,.2)}
.ls-right{position:absolute;right:14px;top:14px;display:grid;justify-items:end;gap:8px}
.ls-gps.q-good .ms{color:#1f9d55}.ls-gps.q-mid .ms{color:#b98200}.ls-gps.q-bad .ms{color:#c8341f}
.ls-bars{display:inline-flex;align-items:flex-end;gap:2px;height:16px}
.ls-bars i{width:4px;border-radius:1px;background:#c9d1cb}
.ls-bars i:nth-child(1){height:5px}.ls-bars i:nth-child(2){height:8px}.ls-bars i:nth-child(3){height:12px}.ls-bars i:nth-child(4){height:16px}
.ls-bars i.on{background:#176b45}
.ls-bars.unk i{background:repeating-linear-gradient(180deg,#c9d1cb 0 2px,transparent 2px 3px)}
.ls-cap{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;bottom:12px;z-index:2;margin:0;padding:3px 8px;border-radius:6px;background:rgba(0,0,0,.35);color:#fff;font-size:11px;letter-spacing:.02em}
.lawn-stage .ls-img img{transform:scale(1.02);transition:opacity .55s ease,transform 1.2s ease}
.lawn-stage .ls-img img.on{transform:scale(1)}

/* postavitev: računalnik – slika levo (povzetek pod njo), vprašanje desno; telefon – slika zgoraj */
@media (min-width:901px){
  #konfigurator #nastavitve{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important;grid-template-rows:min-content min-content min-content 1fr auto;column-gap:28px!important;align-items:start}
  #konfigurator #nastavitve>#lawn-stage{grid-column:1;grid-row:1 / 5}
  #konfigurator #nastavitve>#wz-lawn{grid-column:1!important;grid-row:5!important;position:static!important;margin-top:14px;padding:14px 16px}
  #konfigurator #nastavitve>*:not(#lawn-stage):not(#wz-lawn){grid-column:2}
  #konfigurator #nastavitve .opts-main{display:contents}
  #konfigurator #nastavitve .opts-main>.opt{grid-column:2}
  #konfigurator #nastavitve>#wz-lawn .wl svg{max-height:64px;width:auto;flex:none}
  #konfigurator #nastavitve>#wz-lawn .wl{flex-direction:row!important;align-items:center}
  #konfigurator #nastavitve>#wz-lawn .wl .btn-text{margin-left:auto}
}
.wl-b{display:grid;grid-template-columns:22px minmax(0,1fr);column-gap:6px;align-items:start;width:100%;height:100%;padding:10px 10px 10px 8px;border:1px solid var(--rt-line);border-radius:12px;background:var(--md-sc-lowest);color:inherit;font:inherit;text-align:left;cursor:pointer;transition:border-color .15s,background-color .15s}
.wl-b:hover{border-color:color-mix(in srgb,var(--md-primary) 45%,var(--rt-line))}
.wl-b .ms{grid-row:span 2;font-size:19px;color:var(--md-on-surface-variant)}
.wl-b b{font:600 13px/17px var(--font);color:var(--md-on-surface)}
@media (max-width:900px){
  
  
  
  .ls-tag{height:30px;font-size:12px;padding:0 10px 0 8px}.ls-tag .ms{font-size:16px}
  .wl-b{padding:8px 6px;grid-template-columns:18px minmax(0,1fr)}.wl-b .ms{font-size:16px}.wl-b b{font-size:12px;line-height:15px}
}

/* ===== računalnik: zemljevid in slika trate zapolnita prostor pod naslovom; vse ostalo lebdi v njiju ===== */
@media (min-width:901px){
  
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"]) .wz-why{display:none}
  
  /* spodnja vrstica (Nazaj / Naprej) lebdi na dnu zemljevida oz. slike */
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"])>.wz-nav{position:relative;bottom:auto;max-width:none;margin:-92px 16px 0}
  /* zemljevid */
  
  #konfigurator .map-card>#map-side{max-height:calc(100% - 192px)}
  
  
  
  #konfigurator .map-wrap:not(.fs) .grid-note{bottom:160px!important}
  /* lastnosti vrta: slika enake velikosti kot zemljevid */
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve{display:block!important;padding:0!important}
  #konfigurator #nastavitve>#lawn-stage{aspect-ratio:auto;}
  /* vprašanje desno na sliki */
  #konfigurator #nastavitve>.q3-panel{position:absolute;z-index:5;display:flex;flex-direction:column;gap:12px;scrollbar-width:thin;}
  #konfigurator #nastavitve .q3-panel .opt-slope,#konfigurator #nastavitve .q3-panel .opts-main .opt,#konfigurator #nastavitve .q3-panel .q3-done,#konfigurator #nastavitve .q3-panel .more-set{-webkit-backdrop-filter:blur(10px)}
  
  
  #konfigurator #nastavitve .q3-panel .sig-note{border-radius:12px;}
  /* povzetek odgovorov levo spodaj na sliki */
  #konfigurator #nastavitve>#wz-lawn{position:absolute!important;top:auto!important;left:16px;bottom:108px;z-index:4;width:min(560px,calc(100% - 440px));margin:0!important;padding:12px 14px!important;background:color-mix(in srgb,var(--md-sc-lowest) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:var(--elev-3)!important}
  #konfigurator #nastavitve>#wz-lawn .wl svg{max-height:48px!important}
  /* oznake na sliki v stolpcu levo zgoraj (desno je vprašanje) */
  #nastavitve .ls-fx .ls-sl{top:56px;bottom:auto}
  #nastavitve .ls-fx .ls-right{left:14px;right:auto;top:98px;justify-items:start}
  
}

/* =====================================================================
   ZEMLJEVID IN SLIKA TRATE BREZ OKVIRJA: čez celo širino, mehki prehodi, naslov v njiju,
   kartice kot matirano steklo (≈60 % prosojnost + zamegljenost)
   ===================================================================== */
:root{--glass:color-mix(in srgb,#ffffff 60%,transparent);--glass-strong:color-mix(in srgb,#ffffff 72%,transparent);--glass-line:rgba(255,255,255,.55);--glass-blur:blur(18px) saturate(1.5)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--glass:color-mix(in srgb,#121915 58%,transparent);--glass-strong:color-mix(in srgb,#121915 72%,transparent);--glass-line:rgba(255,255,255,.12)}}
:root[data-theme="dark"]{--glass:color-mix(in srgb,#121915 58%,transparent);--glass-strong:color-mix(in srgb,#121915 72%,transparent);--glass-line:rgba(255,255,255,.12)}
body{overflow-x:clip}
@media (max-width:900px){
  /* telefon: elementi levega stolpca se zvrstijo v običajnem vrstnem redu */
  .stage-left{display:contents}
  #konfigurator .map-card{display:flex;flex-direction:column;background:transparent;box-shadow:none}
  #konfigurator .map-card>*,#konfigurator .stage-left>*{order:5}
  #konfigurator .stage-left>.wz-head{order:0;}
  #konfigurator .stage-left>#search-home,#konfigurator .stage-left>#search-box{order:1}
  #konfigurator .map-card>.map-wrap{order:2}
  #konfigurator .map-card>#status,#konfigurator .map-card>#hint{order:3}
  #konfigurator .stage-left>#map-side{order:4}
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve{display:flex!important;flex-direction:column}
  #konfigurator #nastavitve>*,#konfigurator #stage-left-set>*{order:5}
  #konfigurator #stage-left-set>.wz-head{order:0;}
  #konfigurator #nastavitve>#lawn-stage{order:1}
  #konfigurator #stage-left-set>#wz-lawn{order:2}
  #konfigurator #nastavitve>.q3-panel{order:3}
}
@media (min-width:901px){
  #konfigurator{--gut:max(16px,calc((100vw - 1200px) / 2));--stage-h:max(500px,calc(100vh - 168px))}
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"]) .wz-steps{margin-bottom:6px}
  /* čez celo širino zaslona, brez okvirja */
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"]) .map-card,
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;overflow:visible!important}
  #konfigurator .map-wrap:not(.fs) #map{height:var(--stage-h)!important;border-radius:0}
  /* mehak prehod zgoraj in spodaj */
  #konfigurator .map-wrap:not(.fs) #map,#konfigurator:is([data-step="3"],[data-step="4"]) #lawn-stage .ls-img{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 64px,#000 calc(100% - 80px),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 64px,#000 calc(100% - 80px),transparent 100%)}
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve>#lawn-stage{border:0;border-radius:0;box-shadow:none;}
  /* levo: mehko zlitje z ozadjem, da je naslov berljiv (zemljevid ostane uporaben) */
  #konfigurator .map-wrap:not(.fs)::after,#konfigurator:is([data-step="3"],[data-step="4"]) #lawn-stage::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:500;
    background:linear-gradient(90deg,color-mix(in srgb,var(--md-surface) 86%,transparent) 0,color-mix(in srgb,var(--md-surface) 62%,transparent) calc(var(--gut) + 300px),transparent calc(var(--gut) + 600px))}
  #konfigurator:is([data-step="3"],[data-step="4"]) #lawn-stage::after{z-index:1}
  /* levi stolpec */
  #konfigurator .stage-left{position:absolute;left:var(--gut);top:30px;bottom:110px;width:400px;z-index:1040;display:flex;flex-direction:column;gap:12px;pointer-events:none}
  #konfigurator .stage-left>*{pointer-events:auto;flex:0 0 auto}
  #konfigurator .stage-left>.wz-head{margin:0 0 4px;gap:8px}
  #konfigurator .stage-left .wz-head h2{font-size:clamp(30px,2.6vw,38px)}
  #konfigurator .stage-left>#search-box{position:relative!important;top:auto!important;left:auto!important;width:auto!important;margin:0;z-index:5}
  #konfigurator .stage-left>#map-side{position:static!important;width:auto!important;max-height:none!important;flex:0 1 auto;min-height:0;overflow:auto;margin:0!important}
  #konfigurator #stage-left-set>#wz-lawn{position:static!important;width:auto!important;margin:auto 0 0!important}
  /* elementi na zemljevidu – desno od levega stolpca */
  #konfigurator .map-wrap:not(.fs)>.tools{left:calc(var(--gut) + 420px);right:var(--gut);top:30px}
  #konfigurator .map-wrap:not(.fs) .map-fs-btn{left:calc(var(--gut) + 420px);bottom:110px}
  #konfigurator .map-card>#hint{left:calc(var(--gut) + 474px);bottom:110px;max-width:min(460px,calc(100vw - var(--gut) * 2 - 520px))}
  #konfigurator .map-card>#status{left:calc(var(--gut) + 420px);top:84px}
  #konfigurator .map-wrap:not(.fs) .leaflet-right{right:max(8px,calc(var(--gut) - 10px))}
  #konfigurator .map-wrap:not(.fs) .leaflet-bottom{bottom:96px}
  /* 3. korak: vprašanje desno, oznake desno od levega stolpca */
  #konfigurator #nastavitve>.q3-panel{right:var(--gut);top:30px;max-height:calc(var(--stage-h) - 140px)}
  #nastavitve .ls-fx .ls-cx{left:calc(var(--gut) + 420px);top:30px}
  #nastavitve .ls-fx .ls-sl{left:calc(var(--gut) + 420px);top:72px}
  #nastavitve .ls-fx .ls-right{left:calc(var(--gut) + 420px);top:114px}
  /* spodnja vrstica v zemljevidu / sliki */
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"])>.wz-nav{margin-top:-96px;z-index:1020}
}
/* ----- matirano steklo za vse kartice na zemljevidu in sliki ----- */
@media (min-width:901px){
  #konfigurator .stage-left .searchbar,
  #konfigurator .stage-left>#map-side,
  #konfigurator .map-card>#hint,
  #konfigurator .map-wrap:not(.fs)>.tools .segd,#konfigurator .map-wrap:not(.fs)>.tools .act-btn,#konfigurator .map-wrap:not(.fs) .passw,#konfigurator .map-wrap:not(.fs) .edit-undo,#konfigurator .map-wrap:not(.fs) .map-fs-btn,
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"])>.wz-nav,
  #konfigurator #nastavitve .q3-panel .opt-slope,#konfigurator #nastavitve .q3-panel .opts-main .opt,#konfigurator #nastavitve .q3-panel .more-set,#konfigurator #nastavitve .q3-panel .sig-note,
  #konfigurator #stage-left-set>#wz-lawn,
  #nastavitve .ls-tag{
    background:var(--glass)!important;backdrop-filter:var(--glass-blur)!important;-webkit-backdrop-filter:var(--glass-blur)!important;
    border:1px solid var(--glass-line)!important;box-shadow:0 8px 32px rgba(10,30,14,.16)!important}
  #konfigurator #nastavitve .q3-panel .q3-done span:not(.ms){color:var(--md-on-surface)!important}
  #konfigurator #nastavitve .q3-panel .q3-done{background:color-mix(in srgb,var(--rt-accent-soft) 80%,transparent)!important;-webkit-backdrop-filter:var(--glass-blur)!important;}
  /* notranji elementi kartic: rahlo prosojni, da steklo ostane enotno */
  #konfigurator .stage-left>#map-side .wz-help,#konfigurator .stage-left>#map-side .ap-acts .btn-tonal{background:color-mix(in srgb,var(--md-sc-lowest) 45%,transparent)!important;border-color:var(--glass-line)!important}
  #konfigurator .stage-left>#map-side .ap-area{background:linear-gradient(160deg,color-mix(in srgb,var(--rt-accent-soft) 70%,transparent),color-mix(in srgb,var(--md-primary-container) 70%,transparent))!important;border-color:var(--glass-line)!important}
  
  #konfigurator #nastavitve .q3-panel .seg .tool[aria-pressed="true"],#konfigurator #stage-left-set .wl-list li.cur .wl-b{background:color-mix(in srgb,var(--rt-accent-soft) 80%,transparent)}
  #konfigurator .stage-left .searchbar input{background:transparent}
  #nastavitve .ls-tag{color:var(--md-on-surface)}
  #nastavitve .ls-tag .ms{color:var(--md-primary)}
}

.ls-img{position:absolute;inset:0}
@media (min-width:901px){
  
  #konfigurator #stage-left-set>#wz-lawn .wl{flex-direction:row!important;align-items:center;gap:10px;padding:0;margin:0;border:0;background:transparent}
  #konfigurator #stage-left-set>#wz-lawn .wl svg{width:auto!important;max-height:46px!important;flex:none;background:color-mix(in srgb,var(--md-sc-lowest) 60%,transparent)}
  #konfigurator #stage-left-set>#wz-lawn .wl .btn-text{margin-left:auto}
}

/* 1.–3. korak: kartice na zemljevidu in sliki skoraj do roba zaslona */
@media (min-width:901px){
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"]){--gut:24px}
  #konfigurator:is([data-step="1"],[data-step="2"],[data-step="3"],[data-step="4"])>.wz-nav{margin-left:calc(50% - 50vw + 24px)!important;margin-right:calc(50% - 50vw + 24px)!important}
}

/* ===== uvodna stran kot konfigurator: slika čez cel zaslon, mehki prehodi, gumb na sredini, steklene kartice ===== */
@media (min-width:901px){
  #domov{--gut:24px;padding-bottom:0}
  #domov .hero{display:block;position:relative;height:max(620px,calc(100vh - 68px));min-height:0;overflow:hidden}
  #domov .hero::after{display:none}
  #domov .hero-media{position:absolute;inset:0;width:100%;margin:0}
  #domov .hero-media img{object-position:62% 55%;-webkit-mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 90px),transparent 100%);mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 90px),transparent 100%)}
  /* levo mehko zlitje z ozadjem – berljiv naslov */
  #domov .hero-media::before{background:linear-gradient(90deg,color-mix(in srgb,var(--md-surface) 90%,transparent) 0,color-mix(in srgb,var(--md-surface) 66%,transparent) 420px,transparent 760px)}
  #domov .hero-media::after{display:none}
  #domov .hero-in{position:absolute;left:var(--gut);top:40px;z-index:3;width:min(600px,44vw);padding:0;display:grid;gap:22px}
  #domov .hero-txt{max-width:none;gap:16px}
  #domov .hero h1{font-size:clamp(38px,3.8vw,58px)}
  #domov .hero-lead{max-width:26em}
  #domov .hero-trust{margin:0;padding:12px 16px;border:1px solid var(--glass-line);border-radius:16px;width:fit-content;background:var(--glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);box-shadow:0 8px 32px rgba(10,30,14,.12)}
  /* gumb »Začni« na sredini zaslona */
  #domov .hero-cta{position:absolute;left:50%;top:61%;transform:translate(-50%,-50%);z-index:4;display:grid;justify-items:center;gap:10px;margin:0}
  #domov .hero-cta .btn-filled{height:66px;padding:0 30px 0 36px;border-radius:999px;font-size:18px;box-shadow:0 0 0 8px color-mix(in srgb,#ffffff 35%,transparent),0 18px 40px color-mix(in srgb,var(--md-primary) 45%,transparent)}
  #domov .hero-cta .btn-filled .ms{font-size:23px}
  #domov .hero-cta-note{padding:6px 12px;border-radius:999px;background:var(--glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line);font:600 13px/1 var(--font);color:var(--md-on-surface)}
  /* oznaka na sliki */
  #domov .hm-a{left:auto;right:var(--gut);top:40px}
  #domov .hm-chip{background:var(--glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line);color:var(--md-on-surface)}
  /* koraki kot steklene kartice na dnu slike */
  #domov .hero-steps{position:absolute;left:var(--gut);right:var(--gut);bottom:24px;z-index:3;margin:0}
  #domov .hero-steps li{background:var(--glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line);box-shadow:0 8px 32px rgba(10,30,14,.14)}
}
.hero-cta-note{font-size:13px;color:var(--md-on-surface-variant)}
@media (max-width:900px){
  /* telefon: tekst, gumb, slika, koraki */
  #domov .hero{display:flex;flex-direction:column}
  #domov .hero-in{order:1;padding:24px 16px 0;display:grid;gap:16px}
  #domov .hero-cta{order:2;display:grid;justify-items:stretch;gap:8px;padding:18px 16px 4px;margin:0}
  #domov .hero-cta .btn-filled{width:100%;height:56px}
  #domov .hero-cta-note{text-align:center}
  #domov .hero-media{order:3;margin-top:18px}
  #domov .hero-steps{order:4;padding:0 16px;margin-top:12px}
  #domov .hero-trust{margin:0;padding-top:14px}
  #domov .hero::after{display:none}
}

/* ===== obrisi na zemljevidu: neon zelena meja, notranjost kot pokošena trata, moderne točke ===== */
:root{--neon:#3be27f;--neon-glow:rgba(59,226,127,.85);--hole:#ff4d5e;--hole-glow:rgba(255,77,94,.8)}
/* trata */
.shape-lawn{stroke:none!important;fill:url(#rt-mow)!important;fill-opacity:.7!important}   /* vzorec trate skupaj prekrije ~25 % posnetka */
/* ko je izmerjen naklon, barvo da naklon pod trato, pasovi košnje so nevtralni (svetli/temni) */
.has-slope .shape-lawn,.has-sky .shape-lawn{fill:none!important}
.slope-img{image-rendering:auto}
/* skupna obroba trate in prehodov */
.lawn-edge{fill:none!important;stroke:var(--neon)!important;stroke-width:2px!important;stroke-linejoin:round;stroke-linecap:round}
/* sij: kopije obrisov (neprosojne), ki jih SVG filter spremeni v sij – pri trati le navzven, pri prepovedani coni le navznoter */
.glow-src{fill:#000!important;fill-opacity:1!important;stroke:none!important}
/* izločena površina */
.shape-hole{stroke:none!important;fill:url(#rt-hole)!important;fill-opacity:1!important;}
.shape-hole.hole-out{opacity:.35}
/* rob izločenega območja */
.nogo-edge{fill:none!important;stroke:var(--hole)!important;stroke-width:1.5px!important;stroke-linecap:round;stroke-linejoin:round}
.nogo-edge-out{stroke:rgba(255,255,255,.8)!important;stroke-width:1px!important;stroke-dasharray:4 5;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
/* oznaka izločenega območja: znak prepovedi + odšteta površina */
.maplabel.nogo{border-color:rgba(255,77,94,.7)!important;box-shadow:0 0 10px rgba(255,77,94,.4),0 2px 6px rgba(0,0,0,.3)!important;display:inline-flex;align-items:center;gap:5px}
.maplabel.nogo::before{content:"";width:11px;height:11px;flex:none;border-radius:50%;border:2px solid var(--hole);box-sizing:border-box;
  background:linear-gradient(45deg,transparent 42%,var(--hole) 42% 58%,transparent 58%)}
.maplabel.nogo-out{background:rgba(40,40,40,.72)!important;border-color:rgba(255,255,255,.35)!important;box-shadow:0 2px 6px rgba(0,0,0,.3)!important;color:#e9e9e9}
.maplabel.nogo-out::before{border-color:#bbb;background:linear-gradient(45deg,transparent 42%,#bbb 42% 58%,transparent 58%)}
/* točke med risanjem izločenega območja */
.vx.vx-m-hole{border-color:var(--hole);box-shadow:0 0 0 3px rgba(255,77,94,.25),0 0 10px var(--hole-glow),0 1px 3px rgba(0,0,0,.35)}
.vx.vx-m-hole.first{background:var(--hole);border-color:#fff;animation-name:vxpulseR}
@keyframes vxpulseR{0%{box-shadow:0 0 0 0 rgba(255,77,94,.7),0 0 14px var(--hole-glow)}70%{box-shadow:0 0 0 12px rgba(255,77,94,0),0 0 14px var(--hole-glow)}100%{box-shadow:0 0 0 0 rgba(255,77,94,0),0 0 14px var(--hole-glow)}}
/* obris med risanjem */
.draft-line{stroke-width:2px!important;stroke-dasharray:8 6;stroke-linecap:round;animation:rtdraft 1s linear infinite}
.draft-lawn{stroke:var(--neon)!important;filter:drop-shadow(0 0 2px rgba(59,226,127,.45))}
.draft-hole{stroke:var(--hole)!important;filter:drop-shadow(0 0 2px rgba(255,77,94,.4))}
.draft-pass{stroke:var(--neon)!important;filter:drop-shadow(0 0 2px rgba(59,226,127,.45))}
@keyframes rtdraft{to{stroke-dashoffset:-28}}
/* prehod */
/* prehod: temnejši zeleni pas v izbrani širini + neonska sredinska črta */
.pass-band{fill:url(#rt-pass)!important;fill-opacity:1!important;stroke:none!important}
.pass-band.pass-prev{stroke:rgba(59,226,127,.6)!important;stroke-width:1px!important;stroke-dasharray:4 4}
.pass-band.pass-prev{opacity:.6}
.segd .t-pass .ms,.passw .pw-l{color:var(--md-primary)!important}
.pass-line{fill:none!important;stroke:var(--neon)!important;stroke-width:1px!important;stroke-linecap:round;opacity:.9}
@media (prefers-reduced-motion:reduce){.draft-line{animation:none}}

/* točke: belo središče, zelen obroč in sij; prva (zaključna) točka polna in utripa */
.vx{border-radius:50%;box-sizing:border-box;}
.vx.first{width:22px;height:22px;margin:-11px 0 0 -11px;background:var(--neon);border:3px solid #fff;cursor:pointer;
  box-shadow:0 0 0 0 rgba(59,226,127,.7),0 0 14px var(--neon-glow),0 1px 4px rgba(0,0,0,.4);animation:vxpulse 1.6s ease-out infinite}
.vx.first::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff}
.vx.first{position:relative}
@keyframes vxpulse{0%{box-shadow:0 0 0 0 rgba(59,226,127,.7),0 0 14px var(--neon-glow),0 1px 4px rgba(0,0,0,.4)}70%{box-shadow:0 0 0 12px rgba(59,226,127,0),0 0 14px var(--neon-glow),0 1px 4px rgba(0,0,0,.4)}100%{box-shadow:0 0 0 0 rgba(59,226,127,0),0 0 14px var(--neon-glow),0 1px 4px rgba(0,0,0,.4)}}
@media (prefers-reduced-motion:reduce){.vx.first{animation:none}}
/* urejanje točk */
.vx.vx-ed{width:18px;height:18px;margin:-9px 0 0 -9px;background:#fff;border:3px solid var(--neon);box-shadow:0 0 0 3px rgba(59,226,127,.16),0 0 6px rgba(59,226,127,.45),0 2px 6px rgba(0,0,0,.35);cursor:grab}
.vx.vx-ed:active{cursor:grabbing;transform:scale(1.15)}
.vx.vx-ed.vx-hole{border-color:var(--hole);box-shadow:0 0 0 4px rgba(255,77,94,.22),0 0 12px var(--hole-glow),0 2px 6px rgba(0,0,0,.35)}
.vx.vx-ed.vx-del{background:#e5484d;border:3px solid #fff;box-shadow:0 0 0 4px rgba(229,72,77,.25),0 2px 6px rgba(0,0,0,.4)}
.vx.vx-ed.vx-del::after{content:"×";display:grid;place-items:center;height:100%;color:#fff;font:700 12px/1 var(--font)}
.vx.vx-ed.vx-add{width:18px;height:18px;margin:-9px 0 0 -9px;background:rgba(255,255,255,.85);border:2px dashed var(--neon);box-shadow:0 0 8px var(--neon-glow);cursor:copy}
.vx.vx-ed.vx-add::after{content:"+";display:grid;place-items:center;height:100%;color:#167a3c;font:800 13px/1 var(--font)}
.vx.vx-ed.vx-add.vx-hole{border-color:var(--hole)}.vx.vx-ed.vx-add.vx-hole::after{color:#c81e32}
.vx.vx-ed.vx-dim{width:10px;height:10px;margin:-5px 0 0 -5px;border-width:2px;opacity:.75;box-shadow:0 0 6px var(--neon-glow)}
@media (max-width:600px){.vx.vx-ed,.vx.vx-ed.vx-add{width:24px;height:24px;margin:-12px 0 0 -12px}.vx.first{width:26px;height:26px;margin:-13px 0 0 -13px}}
/* oznaka površine na obrisu */
.maplabel{background:rgba(10,30,18,.78)!important;border:1px solid rgba(59,226,127,.45);box-shadow:0 0 5px rgba(59,226,127,.2),0 2px 6px rgba(0,0,0,.3)!important;backdrop-filter:blur(6px)}
/* levi stolpec: kartica pod iskalnikom – zaobljena steklena kartica z notranjim robom; vsebina brez lastnega ozadja */
@media (min-width:901px){
  #konfigurator .stage-left>#map-side{border-radius:18px!important;padding:6px!important;gap:6px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--md-on-surface) 25%,transparent) transparent;overscroll-behavior:contain}
  #konfigurator .stage-left>#map-side>.wz-help{background:transparent!important;border:0!important;border-radius:12px;padding:10px 12px 12px;margin:0}
  #konfigurator .stage-left>#map-side>.wz-help>summary{padding:0 0 2px}
  #konfigurator .stage-left>#map-side>.wz-help ol{margin-bottom:0}
  #konfigurator .stage-left>#map-side>.wz-help>p:last-child{margin-bottom:0}
  #konfigurator .stage-left>#map-side>.area-panel{border-radius:12px}
  #map-side .only-mob{display:none}
  /* površina: številka in are v isti vrstici – kartica je nižja */
  #konfigurator .stage-left>#map-side .ap-area{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:10px;row-gap:0;padding:14px 16px}
  #konfigurator .stage-left>#map-side .ap-k{flex-basis:100%}
  #konfigurator .stage-left>#map-side .area-panel>div:first-child{display:grid;gap:10px}
  #konfigurator .stage-left>#map-side .ap-tip{padding:0 6px}
}
@media (min-width:901px) and (max-height:820px){
  #konfigurator .stage-left>#map-side>.wz-help{padding:8px 12px 6px}
  #konfigurator .stage-left>#map-side>.wz-help li{font-size:13px;line-height:18px}
  #konfigurator .stage-left>#map-side>.wz-help>p{font-size:12px;line-height:16px}
  #konfigurator .stage-left{gap:8px}
  #konfigurator .stage-left>#map-side .ap-area{padding:10px 14px}
  #konfigurator .stage-left>#map-side .ap-area b{font-size:32px;line-height:38px}
  #konfigurator .stage-left>#map-side .ap-tip{font-size:12.5px;line-height:17px}
  #konfigurator .stage-left>#map-side .ap-acts .btn{height:36px;min-height:36px}
  #konfigurator .stage-left>#map-side>details.wz-help:not([open])>summary{min-height:32px;padding:0}
  #konfigurator .stage-left>#map-side>details.wz-help:not([open]){padding-top:4px;padding-bottom:4px}
}
/* viri zemljevida: le ikona ⓘ, napis se pokaže ob tapu */
#map:not(.attr-open) .leaflet-control-attribution{display:none!important}
.attr-btn{padding:0;border:1px solid color-mix(in srgb,var(--md-on-surface) 12%,transparent)!important;background:color-mix(in srgb,var(--md-sc-lowest) 70%,transparent)!important;color:var(--md-on-surface-variant);display:grid;place-items:center;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.2);margin:0 8px 6px 0!important;justify-self:end;align-self:end;float:right;clear:both}
.attr-btn .ms{font-size:17px}
#map.attr-open .attr-btn{background:var(--md-primary)!important;color:#fff;border-color:var(--md-primary)!important}
#map.attr-open .leaflet-control-attribution{clear:both;border-radius:8px!important;margin:0 8px 6px 0!important;max-width:min(520px,calc(100vw - 32px));white-space:normal!important;opacity:1!important}
/* orodja za urejanje trate (meni) – enako na računalniku in telefonu; Izbriši vse in Uredi točke sta v meniju */
:root{--m-card:color-mix(in srgb,var(--md-sc-lowest) 96%,transparent);--m-line:color-mix(in srgb,var(--md-on-surface) 10%,transparent)}
.m-tw{position:relative;}
.m-menu{position:absolute;right:0;top:50px;min-width:236px;padding:6px;border-radius:16px;background:var(--m-card);border:1px solid var(--m-line);box-shadow:0 10px 30px rgba(0,0,0,.25);display:grid;gap:2px;z-index:2}
.m-menu[hidden]{display:none}
.m-menu button{display:flex;align-items:center;gap:12px;min-height:46px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--md-on-surface);font:500 15px/20px var(--font);text-align:left;cursor:pointer}
.m-menu button .ms{font-size:20px;color:var(--md-primary)}
.m-menu button:active{background:color-mix(in srgb,var(--md-on-surface) 8%,transparent)}
.m-menu button:disabled{opacity:.4;cursor:default}
.m-menu button.danger,.m-menu button.danger .ms{color:var(--md-error,#c62828)}
.m-menu .m-chk{margin-left:auto;width:20px;height:20px;border-radius:6px;border:2px solid color-mix(in srgb,var(--md-on-surface) 35%,transparent);box-sizing:border-box}
.m-menu [aria-checked="true"] .m-chk{background:var(--md-primary);border-color:var(--md-primary);box-shadow:inset 0 0 0 3px var(--m-card)}
.m-tw{display:none!important}   /* meni »več nastavitev« odstranjen: Izbriši vse in Popravi točke imata svoja gumba, mreža in naklon sta v izbiri satelitskih plasti */
.acts .m-tw .m-tb .ms{font-size:22px}
.m-tw .m-tb[aria-expanded="true"],#konfigurator .map-wrap .m-tw .m-tb[aria-expanded="true"],body.m-stage .m-top .m-tw .m-tb[aria-expanded="true"]{background:var(--md-primary)!important;color:#fff!important;border-color:var(--md-primary)!important}
/* ===== 3. korak – enak potek in videz na računalniku in telefonu =====
   pet kartic (naklon, krošnje, signal, dodatne lastnosti vrta, opis vrta) s črticami zgoraj in gumbom Naprej spodaj;
   enake oznake na sliki (naklon, GPS, signal), enaki gumbi za odgovore; postavitev se razlikuje le po velikosti zaslona */
body.q3c .q3-dots{display:flex;gap:4px;margin:0 0 8px}
body.q3c .q3-dots button{width:30px;height:16px;padding:0;border:0;background:none;cursor:pointer;display:grid;align-items:center;-webkit-tap-highlight-color:transparent}
body.q3c .q3-dots button::before{content:"";height:5px;border-radius:3px;background:color-mix(in srgb,var(--md-on-surface) 15%,transparent)}
body.q3c .q3-dots button.done::before{background:color-mix(in srgb,var(--md-primary) 55%,transparent)}
body.q3c .q3-dots button.cur::before{background:var(--md-primary)}
body.q3c .q3-dots button:disabled{cursor:default}
body.q3c #nastavitve .opt-slope::before,body.q3c #nastavitve .opt[data-opt]::before{display:none!important}
body.q3c #nastavitve .opt-l{font-size:17px!important;line-height:22px!important;font-weight:700;margin:0 0 10px!important;min-height:0!important}
body.q3c #nastavitve .opt-l>.ms,body.q3c #nastavitve .opt-l small{display:none!important}
body.q3c #nastavitve .seg{gap:6px!important}
body.q3c #nastavitve .seg .tool{min-height:42px!important;height:auto!important;padding:6px 12px!important;border-radius:12px!important}
body.q3c #nastavitve .seg .tool .tl{font-size:14px!important;line-height:18px!important}
body.q3c #nastavitve .seg .tool .tl small{display:none!important}
body.q3c #nastavitve .lidar-res,body.q3c #nastavitve .slope-leg,body.q3c #lidar-btn{display:none!important}

body.q3c #nastavitve .opt-slope>.opt-l{order:0}
body.q3c #nastavitve .opt-slope>.m-lidar{order:1;display:flex!important;align-items:center;gap:6px;margin:0 0 10px!important;font-size:14px;line-height:19px;font-weight:500;color:var(--md-on-surface)}
body.q3c #nastavitve .opt-slope>.m-lidar[hidden]{display:none!important}
body.q3c #nastavitve .m-lidar>.ms{font-size:18px;color:var(--md-primary)}
body.q3c #nastavitve .m-lidar .ml-t{flex:1;min-width:0}
body.q3c #nastavitve .m-lidar b{font-weight:800}
body.q3c #nastavitve .m-relidar{flex:none;display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 10px;border-radius:999px;border:1px solid var(--glass-line);background:color-mix(in srgb,var(--md-sc-lowest) 40%,transparent);color:var(--md-on-surface);font:600 12.5px/16px var(--font);cursor:pointer;white-space:nowrap}
body.q3c #nastavitve .m-relidar .ms{font-size:16px!important;color:var(--md-primary)}
body.q3c #nastavitve .m-relidar.busy .ms{animation:rtspin 1s linear infinite}
@keyframes rtspin{to{transform:rotate(360deg)}}
body.q3c #nastavitve .opt-slope>.q3-ok{order:2}
body.q3c #nastavitve .opt-slope>.seg{order:3}
body.q3c #nastavitve .opt-slope>*:not(.opt-l):not(.m-lidar):not(.q3-ok):not(.seg){order:4}
body.q3c #nastavitve .opt-slope>.q3-ok,body.q3c #nastavitve .opt .q3-next,body.q3c #nastavitve[data-q="9"] .q3-extra-next .q3-next{display:inline-flex;justify-content:center;align-items:center;gap:8px;justify-self:stretch;width:100%;height:44px!important;border-radius:12px!important;border:0!important;
  background:var(--md-primary)!important;color:var(--md-on-primary,#fff)!important;font:700 15px/20px var(--font)!important;box-shadow:none!important;cursor:pointer}
body.q3c #nastavitve .opt-slope:not(.done)>.q3-ok{display:none!important}
body.q3c #nastavitve .opt-slope>.q3-ok{margin:0 0 10px!important}
body.q3c #nastavitve .opt .q3-next,body.q3c #nastavitve[data-q="9"] .q3-extra-next .q3-next{margin-top:12px}
body.q3c #nastavitve .q3-next .ms,body.q3c #nastavitve .opt-slope>.q3-ok .ms{font-size:19px!important}
body.q3c #nastavitve .q3-next:disabled{opacity:.45}
body.q3c #nastavitve .exact>summary{font-size:13px!important}
body.q3c #nastavitve[data-q="3"] .q3-done,body.q3c #nastavitve:is([data-q="4"],[data-q="5"]) .q3-done{display:none!important}
body.q3c #nastavitve[data-q="9"] .more-set{display:block!important;border:0!important;background:none!important;padding:0!important;margin:0!important;box-shadow:none!important}
body.q3c #nastavitve[data-q="9"] .more-set>summary{pointer-events:none;list-style:none;padding:0 0 10px!important;border:0!important;background:none!important}
body.q3c #nastavitve[data-q="9"] .more-set>summary::-webkit-details-marker{display:none}
body.q3c #nastavitve[data-q="9"] .more-set>summary>.ms,body.q3c #nastavitve[data-q="9"] .more-set>summary small,body.q3c #nastavitve[data-q="9"] .more-set>summary::after{display:none!important}
body.q3c #nastavitve[data-q="9"] .more-set>summary .ms-l{font-size:17px;line-height:22px;font-weight:700;color:var(--md-on-surface)}
body.q3c #nastavitve[data-q="5"] .q3-sum{display:block;animation:q3in .35s ease both}
body.q3c .q3-sum h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font:700 17px/22px var(--font);color:var(--md-on-surface)}
body.q3c .q3-sum h3 .ms{font-size:22px;color:var(--md-primary)}
body.q3c .q3-sum-lead{margin:0 0 6px;font-size:14px;line-height:20px;color:var(--md-on-surface)}
body.q3c .q3-sum ul{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:5px}
body.q3c .q3-sum li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;line-height:19px;color:var(--md-on-surface)}
body.q3c .q3-sum li .ms{font-size:19px;color:var(--md-primary);margin-top:1px}
body.q3c .q3-sum-note{margin:0;font-size:12.5px;line-height:17px;color:var(--md-on-surface-variant)}
body.q3c #nastavitve .ls-fx .ls-cx{display:none!important}
@media (min-width:901px){
  
  /* ena steklena kartica z vprašanjem (kot na telefonu); notranji deli brez lastnega ozadja */
  body.q3c #konfigurator #nastavitve>.q3-panel{background:var(--glass)!important;backdrop-filter:var(--glass-blur)!important;-webkit-backdrop-filter:var(--glass-blur)!important;border:1px solid var(--glass-line)!important;
    box-shadow:0 8px 32px rgba(10,30,14,.16)!important;border-radius:22px!important;padding:14px 16px!important;width:380px;overflow:auto;overscroll-behavior:contain}
  body.q3c #konfigurator #nastavitve .q3-panel :is(.opt-slope,.opts-main,.opts-main .opt,.more-set,.sig-note,.q3-done){background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important}
  body.q3c #konfigurator #nastavitve .q3-panel .sig-note{font-size:12.5px;line-height:17px}
  body.q3c #konfigurator #nastavitve .q3-panel .seg .tool{background:color-mix(in srgb,var(--md-sc-lowest) 45%,transparent)!important;border-color:color-mix(in srgb,var(--md-on-surface) 14%,transparent)!important}
  body.q3c #konfigurator #nastavitve .q3-panel .seg .tool[aria-pressed="true"]{background:color-mix(in srgb,var(--rt-accent-soft) 80%,transparent)!important;border-color:var(--md-primary)!important}
}
/* ===== 4. korak: Vaše želje – v isti stekleni kartici kot vprašanja 3. koraka, eno vprašanje naenkrat ===== */
.w4{display:none}
#konfigurator[data-step="4"] #q3-panel>.w4{display:block}
#konfigurator[data-step="4"] #q3-panel>*:not(.w4):not(.q3-back){display:none!important}
.w4-q[hidden]{display:none!important}
.w4-q{animation:q3in .3s ease both}
.w4-k{margin:0 0 2px;font:700 11px/16px var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--md-primary)}
.w4-t{margin:0 0 10px;font:700 17px/22px var(--font);color:var(--md-on-surface)}
.w4-opts{display:grid;gap:6px}
.w4-opts.w4-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.w4-o{display:flex;align-items:center;min-height:44px;border-radius:12px;border:1px solid color-mix(in srgb,var(--md-on-surface) 14%,transparent);
  background:color-mix(in srgb,var(--md-sc-lowest) 45%,transparent);color:var(--md-on-surface);font:600 13.5px/17px var(--font);cursor:pointer;-webkit-tap-highlight-color:transparent;}
.w4-opts.w4-3 .w4-o{flex-direction:column;justify-content:center;text-align:center;gap:3px;padding:8px 6px}
.w4-o .ms{font-size:20px;color:var(--md-primary);flex:none}
.w4-o:hover{border-color:color-mix(in srgb,var(--md-primary) 50%,transparent)}
.w4-o.on{background:color-mix(in srgb,var(--rt-accent-soft,#e3f6d5) 75%,transparent);border-color:var(--md-primary);box-shadow:inset 0 0 0 1px var(--md-primary)}
.w4-o.w4-none{border-style:dashed}
.w4-o.w4-none .ms{color:var(--md-on-surface-variant)}
.w4-next{display:inline-flex;justify-content:center;align-items:center;gap:8px;width:100%;height:44px;margin-top:12px;border-radius:12px;border:0;background:var(--md-primary);color:var(--md-on-primary,#fff);font:700 15px/20px var(--font);cursor:pointer}
.w4-next .ms{font-size:19px}
.w4-next:disabled{opacity:.45;cursor:default}
.w4-sum .w4-t{display:flex;align-items:center;gap:8px}
.w4-sum .w4-t .ms{font-size:22px;color:var(--md-primary)}
.w4-sr{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;min-height:30px;padding:3px 6px;border:0;border-radius:8px;background:none;color:var(--md-on-surface);text-align:left;font:500 13px/17px var(--font);cursor:pointer}
.w4-sr:hover{background:color-mix(in srgb,var(--md-on-surface) 7%,transparent)}
.w4-sr .ms{font-size:18px;color:var(--md-primary)}
.w4-sr b{font-weight:700;text-align:right}
.w4-sr b.w4-nn{font-weight:500;color:var(--md-on-surface-variant);background:none;padding:0}
.w4-sn{margin:0;font-size:12px;line-height:16px;color:var(--md-on-surface-variant)}
/* telefon: kartica z željami naj se vidi v celoti (brez drsenja) */
@media (max-width:900px){
  
  body.m-s3 .w4-k{display:none}
  body.m-s3 .w4-t{font-size:16px;line-height:21px;margin-bottom:8px}
  body.m-s3 .w4-o{min-height:40px;font-size:13.5px}
  body.m-s3 .w4-opts.w4-3 .w4-o{padding:6px 4px}
  body.m-s3 .w4-next{margin-top:10px}
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .w4-o.on{background:color-mix(in srgb,var(--md-primary) 28%,transparent)}}
:root[data-theme="dark"] .w4-o.on{background:color-mix(in srgb,var(--md-primary) 28%,transparent)}
/* 3. korak, dodatne lastnosti vrta: ostaneta le Wi-Fi in otroci/živali; cena, višina trave, čas košnje in rez ob robu
   so skriti (cena in čas sta v 4. koraku); polja ostanejo v kodi prazna, zato ne vplivajo na priporočila */
#more-set .opt[data-opt="q-price"],#more-set .opt[data-opt="q-grass"],#more-set .opt[data-opt="q-time"],#more-set .opt[data-opt="q-edge"],
#more-set label.tf:has(#q-price),#more-set label.tf:has(#q-grass),#more-set label.tf:has(#q-time),#more-set label.tf:has(#q-edge){display:none!important}
/* telefon: nižja zgornja vrstica (50 px namesto 68 px) – več prostora za zemljevid in sliko */
@media (max-width:900px){
  .topbar .in{height:50px!important;gap:8px}
  .topbar .rt-logo{--rt-ico:32px}
  .vtabs a{height:50px!important;padding:0 10px!important;font-size:13.5px!important;gap:5px}
  .vtabs a .ms{font-size:18px!important}
  .vtabs a[aria-current="page"]::after{left:10px!important;right:10px!important}
  .topbar .icon-btn{width:36px;height:36px}
  .topbar .icon-btn .ms{font-size:20px}
}
/* telefon, koraki 1–4: še nižja vrstica (44 px), v zavihkih le ikoni – besedilo ostane za bralnike zaslona */
@media (max-width:900px){
  body:is(.m-stage,.m-s3) .topbar .in{height:44px!important}
  body:is(.m-stage,.m-s3) .topbar .rt-logo{--rt-ico:28px}
  body:is(.m-stage,.m-s3) .vtabs a{height:44px!important;width:44px;padding:0!important;justify-content:center}
  body:is(.m-stage,.m-s3) .vtabs a .ms{font-size:22px!important}
  body:is(.m-stage,.m-s3) .vtabs a>span:not(.ms){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  body:is(.m-stage,.m-s3) .vtabs a[aria-current="page"]::after{left:8px!important;right:8px!important}
  body:is(.m-stage,.m-s3) .topbar .icon-btn{width:34px;height:34px}
}