/* WE GO · butična agencija za marketing in turizem · v7
   Smer: ime kot spomenik. "we" in "go" iz logotipa sta v nasprotnih kotih, med njima stojita
   dve enakovredni področji (Marketing in PR, Doživetja in turizem), ki se ob drsenju razpreta čez zaslon.
   Ena družina (Outfit), ena ploskev, eno črnilo, en poudarek (bordo) na glavnem dejanju in kuponu.
   En CSS za WordPress, brez page builderja. Brez JS je vse vidno in berljivo. */

:root{
  --bg:#ebe6de;          /* topel kamen, nizka kroma */
  --surface:#f5f2ec;     /* en ton svetleje */
  --ink:#121420;
  --muted:#4b4c57;       /* samo za sekundarne opombe */
  --accent:#5a1a2b;      /* bordo: glavni gumb, kupon */
  --accent-2:#6d2a3c;    /* svetlejši ton kupona za polja */
  --brass:#c9a46a;
  --inverse-bg:#121420;
  --inverse-ink:#f1f1ee;
  --scrim:rgba(18,20,32,.55);

  --f:"Outfit", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  /* pet stopenj */
  --t-display:clamp(36px, 5vw, 80px);
  --t-head:clamp(28px, 2.6vw, 40px);
  --t-lead:clamp(19px, 1.5vw, 23px);
  --t-body:17px;
  --t-small:14px;

  --m:clamp(20px, 2vw, 28px);          /* zunanji robovi */
  --gap:clamp(120px, 14vw, 200px);     /* razmik med sekcijami */
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f);font-size:var(--t-body);line-height:1.55;overflow-x:clip;font-kerning:normal}
img,video{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:500;letter-spacing:-.025em;line-height:1.05;text-wrap:balance}
p{margin:0}
.wrap{padding-left:max(var(--m), env(safe-area-inset-left,0px));padding-right:max(var(--m), env(safe-area-inset-right,0px))}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--ink);color:var(--inverse-ink);padding:10px 14px;text-decoration:none}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--inverse-ink)}
section{position:relative}

/* logotip kot material: polovici "we" in "go" iz iste slike */
.we,.go,.mark{display:block;background:url(../img/we-go-logo.png) no-repeat;background-size:auto 100%}
.we{aspect-ratio:935/543;background-position:left center}
.go{aspect-ratio:762/543;background-position:right center}
.mark{aspect-ratio:1827/543}
.inverse .we,.inverse .go,.inverse .mark{filter:brightness(0) invert(.95)}

/* gumbi: ena oblika, ravni robovi */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 26px;background:var(--accent);color:var(--inverse-ink);font:500 var(--t-body)/1 var(--f);text-decoration:none;border:0;cursor:pointer;transition:transform 220ms var(--ease-out),background-color 250ms ease,color 300ms ease}
.btn:active{transform:scale(.97)}
.btn .arr{transition:transform 300ms var(--ease-out)}
.btn.ink{background:var(--ink)}
.tl{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;transition:color 200ms ease}
@media (hover:hover) and (pointer:fine){
  .btn:hover{background:var(--ink);transform:translateY(-2px)}
  .btn:hover .arr{transform:translateX(4px)}
  .btn:active{transform:translateY(0) scale(.97)}
  .btn.ink:hover{background:var(--accent)}
  a.tl:hover{color:var(--accent)}
}

/* ---------- zavesa med stranmi (JS; brez JS je nevidna) ---------- */
.curtain{position:fixed;inset:0;z-index:300;background:var(--accent);transform:scaleY(0);transform-origin:bottom;pointer-events:none;visibility:hidden}
.js.curtain-in .curtain{transform:scaleY(1);transform-origin:top;visibility:visible}
@media (prefers-reduced-motion:reduce){.curtain{display:none}}

/* ---------- pas z navigacijo: pride po heroju, se umakne ob drsenju navzdol ---------- */
.bar{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--bg);transform:translateY(-100%);transition:transform 600ms var(--ease-out),background-color 300ms ease}
.bar.show{transform:none}
.bar.show.away{transform:translateY(-100%)}
.bar-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:68px}
.bar .mark{height:26px}
.bar nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.bar nav a{text-decoration:none;font-size:var(--t-small);font-weight:500}
@media (hover:hover) and (pointer:fine){.bar nav a:hover{color:var(--accent)}}
.bar .btn{min-height:44px;padding:0 18px;font-size:var(--t-small)}
.menu-btn{display:none;background:none;border:0;padding:10px;cursor:pointer;color:var(--ink);font:500 var(--t-small) var(--f)}
@media (max-width:980px){
  .bar nav{display:none}
  .menu-btn{display:block}
  .bar .btn{display:inline-flex;min-height:40px;padding:0 14px;margin-left:auto}
  .bar-in{gap:12px}
}
.drawer{position:fixed;inset:0;z-index:60;background:var(--accent);color:var(--inverse-ink);padding:96px var(--m) 40px;display:flex;flex-direction:column;gap:14px;visibility:hidden;transform:translateY(-100%);transition:transform 600ms var(--ease-in-out),visibility 0s 600ms}
.drawer.open{visibility:visible;transform:none;transition:transform 600ms var(--ease-in-out)}
.drawer a{font-size:var(--t-head);text-decoration:none;font-weight:500;letter-spacing:-.025em}
.drawer .close{position:absolute;top:22px;right:var(--m);background:none;border:0;color:inherit;font:500 var(--t-small) var(--f);cursor:pointer;padding:10px}

/* ---------- hero: ime v kotih, dve enakovredni okenci, ki se razpreta ---------- */
.hero{position:relative;height:200svh}
.stage{position:sticky;top:0;height:100svh;overflow:hidden}
.stage .we{position:absolute;left:var(--m);top:var(--m);height:clamp(64px,8.4vw,132px);z-index:3}
.stage .go{position:absolute;right:var(--m);bottom:var(--m);height:clamp(64px,8.4vw,132px);z-index:3}
.hero-top{position:absolute;top:calc(var(--m) + 6px);right:var(--m);z-index:3}
.hero-h{position:absolute;left:50%;top:18%;transform:translateX(-50%);width:100%;display:flex;justify-content:center;z-index:2;pointer-events:none}
.hero-h h1{font-size:clamp(40px,5.2vw,76px);letter-spacing:-.04em;line-height:1;max-width:12em;text-align:center}
.hero-pair{position:absolute;inset:0;z-index:1}
/* okenci: ob nalaganju majhni, enako veliki, ob drsenju ju JS razpre vsako v svojo polovico zaslona */
.pane{position:absolute;left:26%;top:40%;width:22%;height:40%;display:block;text-decoration:none;color:var(--inverse-ink);overflow:hidden}
.pane-m{border-right:3px solid var(--bg)}
.pane-d{left:52%;border-left:3px solid var(--bg)}
.pane figure{margin:0;position:absolute;inset:0}
.pane img{width:100%;height:100%;object-fit:cover;transform:scale(1.25)}
.pane-m img{object-position:62% 50%}
.pane-d img{object-position:50% 62%}
.pane-t{position:absolute;left:16px;bottom:16px;display:flex;flex-direction:column;gap:2px;padding:14px 18px 16px;background:var(--scrim);font-size:22px;line-height:1.1;letter-spacing:-.025em;font-weight:500;white-space:nowrap}
.pane-t span{font-size:var(--t-small);font-weight:400;letter-spacing:0;line-height:1.4;color:rgba(241,241,238,.85)}
.hero-foot{position:absolute;left:var(--m);bottom:var(--m);width:calc(100% - 2 * var(--m) - clamp(64px,8.4vw,132px) * 1.6);z-index:2;display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px 40px}
.hero-foot p{font-size:var(--t-lead);line-height:1.35;max-width:30ch}
@media (hover:hover) and (pointer:fine){
  .pane img{transition:transform 1.2s var(--ease-out)}
  .pane-t{transition:background-color 250ms ease}
  .pane:hover .pane-t{background:var(--accent)}
}
.pane:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}

/* prihod ob nalaganju (samo CSS; naslov H1 je takoj viden zaradi LCP) */
@keyframes inLeft{from{transform:translateX(-24%);opacity:0}to{transform:none;opacity:1}}
@keyframes inRight{from{transform:translateX(24%);opacity:0}to{transform:none;opacity:1}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes wipeUp{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes settle{from{transform:scale(1.18)}to{transform:none}}
@keyframes settleBig{from{transform:scale(1.45)}to{transform:scale(1.25)}}
@media (prefers-reduced-motion:no-preference) and (min-width:861px){
  .stage .we{animation:inLeft 1.1s var(--ease-out) backwards .1s}
  .stage .go{animation:inRight 1.1s var(--ease-out) backwards .2s}
  .pane{animation:wipeUp 1.2s var(--ease-in-out) backwards .15s}
  .pane-d{animation-delay:.3s}
  .pane img{animation:settleBig 1.8s var(--ease-out) backwards .15s}
  .hero-foot>*{animation:fadeUp .9s var(--ease-out) backwards .7s}
  .hero-foot>*:nth-child(2){animation-delay:.8s}
  /* napisa in e-naslov samo zbledijo (brez premika), ker njihov premik vodi JS */
  .pane-t,.hero-top{animation:fadeIn .9s ease backwards .8s}
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

@media (max-width:860px){
  .hero{height:auto}
  .stage{position:relative;height:auto;overflow:visible;display:flex;flex-direction:column;gap:24px;padding:var(--m) var(--m) calc(var(--m) + 4px)}
  .stage .we,.stage .go{position:static;height:15vw;min-height:54px;width:auto;align-self:flex-start}
  .stage .go{align-self:flex-end}
  .hero-top{display:none}
  .hero-h{position:static;transform:none;display:block;pointer-events:auto;margin-top:6px}
  .hero-h h1{text-align:left;max-width:12em}
  .hero-pair{position:static;display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 calc(-1 * var(--m))}
  .pane,.pane-d{position:relative;left:auto;top:auto;width:auto;height:auto;aspect-ratio:3/4;border:0}
  .pane img{transform:none}
  .pane-t{left:12px;bottom:12px;right:12px;padding:10px 12px 12px;font-size:17px;white-space:normal}
}
@media (max-width:480px){
  .pane-t span{display:none}
  .pane-t span{font-size:13px}
  .hero-foot{position:static;width:auto;flex-direction:column;align-items:flex-start;gap:20px}
}
@media (prefers-reduced-motion:no-preference) and (max-width:860px){
  .stage .we{animation:inLeft 1s var(--ease-out) backwards .05s}
  .stage .go{animation:inRight 1s var(--ease-out) backwards .5s}
  .pane{animation:wipeUp 1.1s var(--ease-in-out) backwards .2s}
  .pane-d{animation-delay:.35s}
  .pane img{animation:settle 1.6s var(--ease-out) backwards .2s}
  .hero-foot>*{animation:fadeUp .8s var(--ease-out) backwards .5s}
  .hero-foot>*:nth-child(2){animation-delay:.6s}
}

/* ---------- dve področji: dva temna razdelka, zrcalna in enakovredna ---------- */
.duo{margin-top:0}
.signature{background:var(--inverse-bg);color:var(--inverse-ink);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);min-height:92svh}
.sig-photo{position:relative;overflow:hidden;min-height:60svh}
.sig-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform}
.sig-inset{position:absolute;right:28px;bottom:28px;width:34%;aspect-ratio:4/5;overflow:hidden;border:6px solid var(--inverse-bg)}
.sig-inset img{position:static;width:100%;height:100%;object-fit:cover;will-change:auto}
.sig-text{padding:clamp(40px,5vw,80px) var(--m) clamp(40px,5vw,80px) clamp(28px,4vw,64px);display:flex;flex-direction:column;justify-content:center;gap:24px}
.sig-text h2{font-size:var(--t-display);letter-spacing:-.04em;line-height:.98}
.sig-text .promise{font-size:var(--t-lead);color:var(--brass)}
.sig-text p{max-width:44ch}
.sig-text ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.sig-text li{display:flex;gap:14px;align-items:baseline}
.sig-text li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--brass);transform:translateY(-2px)}
.sig-text li a{display:inline-flex;gap:10px;align-items:baseline;font-size:var(--t-lead);font-weight:500;letter-spacing:-.01em;text-decoration:none;padding:3px 0}
.sig-text li a .arr{color:var(--brass);transition:transform 300ms var(--ease-out)}
.sig-text .btn{align-self:flex-start;background:var(--brass);color:var(--ink)}
.signature.rev{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.signature.rev .sig-photo{order:2}
.signature.rev .sig-text{padding:clamp(40px,5vw,80px) clamp(28px,4vw,64px) clamp(40px,5vw,80px) max(var(--m), env(safe-area-inset-left,0px))}
.signature.rev .sig-inset{right:auto;left:28px}
.signature.wine{background:var(--accent)}
.signature.wine .sig-inset{border-color:var(--accent)}
@media (hover:hover) and (pointer:fine){
  .sig-text .btn:hover{background:var(--inverse-ink)}
  .sig-text li a{transition:transform 300ms var(--ease-out),color 200ms ease}
  .sig-text li a:hover{color:var(--brass);transform:translateX(6px)}
  .sig-text li a:hover .arr{transform:translateX(5px)}
  .sig-inset img{transition:transform 1.2s var(--ease-out)}
  .sig-inset:hover img{transform:scale(1.05)}
}
@media (max-width:980px){
  .signature,.signature.rev{grid-template-columns:1fr}
  .signature.rev .sig-photo{order:0}
  .sig-text,.signature.rev .sig-text{padding:40px var(--m)}
  .sig-inset{width:38%;right:16px;bottom:16px}
  .signature.rev .sig-inset{left:16px}
  .sig-text li a{min-height:40px;align-items:center}
}

/* ---------- ponudbe: raziskovalec ---------- */
.offers{padding-top:var(--gap)}
.offers-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:end;margin-bottom:64px}
.offers-head h2{font-size:var(--t-display);letter-spacing:-.04em;max-width:13ch}
.offers-head p{font-size:var(--t-lead);max-width:36ch;justify-self:end}
.ofx{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:clamp(24px,4vw,64px);align-items:start}
.ofx-nav{display:flex;flex-direction:column;gap:28px;position:sticky;top:110px}
.ofx-group h3{font-size:var(--t-small);font-weight:600;letter-spacing:0;margin-bottom:6px;color:var(--muted)}
.ofx-group ul{list-style:none;margin:0;padding:0}
.ofx-group button{all:unset;cursor:pointer;display:flex;align-items:baseline;gap:14px;padding:3px 0;font-size:clamp(20px,1.7vw,26px);font-weight:500;letter-spacing:-.025em;line-height:1.3;color:#8b8579;transition:color 200ms ease}
.ofx-group button .arr{font-size:.6em;opacity:0;transform:translateX(-8px);transition:opacity 250ms ease,transform 300ms var(--ease-out)}
.ofx-group button[aria-selected="true"]{color:var(--ink)}
.ofx-group button[aria-selected="true"] .arr{opacity:1;transform:none}
@media (hover:hover) and (pointer:fine){.ofx-group button:hover{color:var(--ink)}}
.ofx-group button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.ofx-panels{display:grid;position:sticky;top:100px}
.offer{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:32px;row-gap:12px;align-items:center;min-width:0}
.js .ofx-panels .offer{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity 400ms ease,visibility 0s 400ms}
.js .ofx-panels .offer.on{opacity:1;visibility:visible;transition:opacity 400ms ease}
.offer figure{margin:0;grid-column:1;grid-row:1 / span 4;aspect-ratio:4/5;max-height:min(62vh,520px);width:100%;overflow:hidden;background:var(--surface)}
.offer figure img{width:100%;height:100%;object-fit:cover}
.offer h3{grid-column:2;align-self:end;font-size:var(--t-head)}
.offer .promise{grid-column:2;font-size:19px;margin-top:-4px}
.offer .hl{grid-column:2;list-style:none;margin:0;padding:0;display:flex;flex-direction:row;flex-wrap:wrap;gap:6px 0;font-size:15px;color:var(--muted)}
.offer .hl li{display:flex;align-items:center}
.offer .hl li:not(:last-child)::after{content:"";width:4px;height:4px;border-radius:50%;background:var(--brass);margin:0 10px}
.offer-actions{grid-column:2;margin-top:10px;align-self:start;display:flex;flex-wrap:wrap;align-items:center;gap:20px 28px}
@media (hover:hover) and (pointer:fine){
  .offer figure img{transition:transform 1.2s var(--ease-out)}
  .offer:hover figure img{transform:scale(1.04)}
}
@media (max-width:980px){
  .offers-head{grid-template-columns:1fr}
  .offers-head p{justify-self:start;max-width:none}
  .ofx{grid-template-columns:1fr}
  /* pripeti gumbi ponudb */
  .ofx-nav{display:flex;flex-direction:row;flex-wrap:nowrap;position:sticky;top:68px;z-index:6;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 0 16px;padding:10px 0;background:var(--bg)}
  .ofx-nav::-webkit-scrollbar{display:none}
  .ofx-group{display:contents}
  .ofx-group h3{display:none}
  .ofx-group ul{display:contents}
  .ofx-group button{flex:none;white-space:nowrap;font-size:15px;font-weight:500;letter-spacing:0;min-height:42px;padding:0 16px;background:var(--surface);color:var(--ink);display:inline-flex;align-items:center;transition:background-color 200ms ease,color 200ms ease,transform 160ms var(--ease-out)}
  .ofx-group button .arr{display:none}
  .ofx-group button[aria-selected="true"]{background:var(--ink);color:var(--inverse-ink)}
  .ofx-group button:active{transform:scale(.96)}
  /* karusel kart */
  .ofx-panels{display:flex;flex-direction:row;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0;padding:0 0 6px;align-items:start;position:static}
  .ofx-panels::-webkit-scrollbar{display:none}
  .js .ofx-panels .offer{opacity:1;visibility:visible}
  .offer{display:flex;flex-direction:column;flex:0 0 88%;scroll-snap-align:start;background:var(--surface);gap:14px;padding-bottom:22px;transition:transform 200ms var(--ease-out)}
  .offer:active{transform:scale(.99)}
  .offer>*:not(figure){margin-inline:18px}
  .offer figure{aspect-ratio:4/3;max-height:none}
  .offer h3{font-size:28px}
  .offer .promise{font-size:18px;margin-top:-6px}
  .offer .hl{font-size:14px}
  .offer-actions{flex-direction:column;align-items:flex-start;gap:14px;margin-top:4px}
  .offer-actions .btn{width:100%}
}

/* ---------- kje: pas neenakih slik ---------- */
.showcase{padding-top:var(--gap)}
.showcase h2{grid-column:3 / span 7;font-size:var(--t-head);margin-bottom:56px}
.band{display:flex;height:68svh;min-height:420px}
.band figure{margin:0;position:relative;overflow:hidden;flex-basis:0;transition:flex-grow 500ms var(--ease-out)}
.band figure:nth-child(1){flex-grow:5}.band figure:nth-child(2){flex-grow:2}.band figure:nth-child(3){flex-grow:3}.band figure:nth-child(4){flex-grow:2}
@media (hover:hover) and (pointer:fine){.band figure:hover{flex-grow:6}}
.band img{width:100%;height:100%;object-fit:cover}
.band .ttl{position:absolute;left:0;top:0;padding:24px 28px 28px 24px;background:var(--scrim);color:var(--inverse-ink);font-size:var(--t-head);font-weight:500;letter-spacing:-.025em;line-height:1.05;max-width:12ch}
.band-cap{padding-top:18px;max-width:72ch}
@media (max-width:860px){
  .showcase h2{grid-column:1 / -1}
  .band{display:grid;grid-template-columns:64fr 36fr;grid-template-rows:1fr 1fr;height:84svh}
  .band figure:nth-child(3){order:4}
  .band figure:nth-child(4){order:3}
}

/* ---------- kako poteka: stopnice ---------- */
.stairs{padding-top:var(--gap)}
.stairs ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:80px}
.stairs li{display:flex;flex-direction:column;gap:12px}
.stairs li:nth-child(2){margin-left:16.66%}
.stairs li:nth-child(3){margin-left:33.33%}
.stairs li:nth-child(4){margin-left:50%}
.stairs .line{display:inline-block;font-size:var(--t-display);font-weight:500;letter-spacing:-.04em;line-height:1;will-change:clip-path}
.stairs li:last-child .line{color:var(--accent)}
.stairs li p{max-width:38ch}
@media (max-width:860px){
  .stairs ol{gap:40px}
  .stairs li:nth-child(2){margin-left:6vw}.stairs li:nth-child(3){margin-left:12vw}.stairs li:nth-child(4){margin-left:18vw}
}

/* ---------- počitek s fotografijo ---------- */
.rest{position:relative;margin-top:var(--gap);height:88svh;min-height:520px;overflow:hidden;color:var(--inverse-ink);display:flex;align-items:flex-end}
.rest img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rest blockquote{position:relative;margin:0 0 var(--m) var(--m);max-width:min(30ch,90%);padding:28px 32px;background:var(--scrim);font-size:clamp(22px,2.3vw,34px);font-weight:500;letter-spacing:-.02em;line-height:1.2}
.rest cite{display:block;margin-top:12px;font-style:normal;font-size:var(--t-small);font-weight:400;color:rgba(241,241,238,.8)}
.rest h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- o nas ---------- */
.about{padding-top:var(--gap)}
.about-row{display:grid;grid-template-columns:minmax(0,34fr) minmax(0,56fr) minmax(0,10fr);column-gap:24px}
.facts{display:flex;flex-direction:column;gap:20px;max-width:220px;margin:0}
.facts dt{color:var(--muted);font-size:var(--t-small)}
.facts dd{margin:0;font-weight:500}
.about-main h2{font-size:var(--t-head);margin-bottom:28px}
.about-main>p{font-size:var(--t-lead);line-height:1.4}
.about-row.second{margin-top:120px}
.about-row.second .word{font-size:var(--t-head);font-weight:500;max-width:12ch}
.reasons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:64px;row-gap:22px;list-style:none;margin:0;padding:0}
.reasons b{display:block;font-weight:600}
.reasons span{color:var(--muted)}
@media (max-width:860px){
  .about-row{grid-template-columns:1fr;row-gap:32px}
  .about-main{order:-1}
  .facts{display:grid;grid-template-columns:1fr 1fr;max-width:none}
  .reasons{grid-template-columns:1fr}
  .about-row.second{margin-top:72px}
}

/* ---------- kraji: pas imen ---------- */
.places{margin-top:var(--gap)}
.places-band{background:var(--accent);color:var(--inverse-ink);height:34vh;min-height:200px;display:flex;align-items:center;overflow:hidden}
.places-track{display:flex;width:max-content;animation:run 46s linear infinite}
.places-track span{font-size:8vw;font-weight:500;letter-spacing:-.04em;line-height:1;white-space:nowrap;display:flex;align-items:center;gap:.35em;padding-right:.35em}
.places-track i{display:block;width:.22em;height:.22em;border-radius:50%;background:var(--brass)}
@keyframes run{to{transform:translateX(-50%)}}
.places h2{font-size:var(--t-lead);font-weight:500;letter-spacing:-.01em;padding-top:20px;max-width:56ch}
@media (max-width:860px){.places-band{height:22vh}.places-track span{font-size:15vw}}

/* ---------- vprašanja ---------- */
.faq{padding-top:var(--gap)}
.faq h2{font-size:var(--t-display);letter-spacing:-.04em;max-width:16ch}
.qs{margin-top:80px;margin-left:33.33%}
.qs details{padding:0 24px;margin:0 -24px 12px;transition:background-color 250ms ease}
.qs details[open]{background:var(--surface)}
.qs summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:20px 0;font-size:var(--t-lead);letter-spacing:-.01em}
.qs summary::-webkit-details-marker{display:none}
.qs summary .chev{flex:none;width:14px;height:14px;position:relative;transition:transform 300ms var(--ease-out)}
.qs summary .chev::before,.qs summary .chev::after{content:"";position:absolute;top:5px;width:9px;height:2px;background:currentColor}
.qs summary .chev::before{left:0;transform:rotate(45deg)}
.qs summary .chev::after{right:0;transform:rotate(-45deg)}
.qs details[open] .chev{transform:rotate(180deg)}
.qs .ans{padding-bottom:24px;max-width:48ch;overflow:hidden}
@media (max-width:860px){.qs{margin-left:0}.qs details{margin:0 calc(-1 * var(--m)) 8px;padding:0 var(--m)}}

/* ---------- povpraševanje: kupon ---------- */
.inquiry{padding-block:var(--gap)}
.coupon{grid-column:2 / span 10;background:var(--accent);color:var(--inverse-ink);display:grid;grid-template-columns:46fr 54fr;position:relative;min-height:520px}
.coupon::before,.coupon::after{content:"";position:absolute;left:46%;width:28px;height:28px;margin-left:-14px;border-radius:50%;background:var(--bg)}
.coupon::before{top:-14px}.coupon::after{bottom:-14px}
.coupon-left{padding:48px;display:flex;flex-direction:column;justify-content:space-between;gap:40px;border-right:5px dotted var(--bg)}
.coupon-left h2{font-size:clamp(28px,3vw,44px);font-weight:600;max-width:12ch}
.coupon-left p{max-width:34ch}
.coupon-left .mail{font-size:var(--t-lead);font-weight:500}
.form{padding:48px;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:18px}
.progress{height:4px;background:var(--accent-2)}
.progress i{display:block;height:100%;background:var(--brass);transform-origin:left;transform:scaleX(.333);transition:transform 600ms var(--ease-out)}
.steps-viewport{display:grid}
.fstep{grid-area:1/1;border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:12px;transition:opacity 300ms ease,transform 450ms var(--ease-out)}
.fstep[aria-hidden="true"]{opacity:0;transform:translateX(32px);pointer-events:none;visibility:hidden}
.fstep.past[aria-hidden="true"]{transform:translateX(-32px)}
.fstep legend{padding:0;margin-bottom:8px;font-size:var(--t-lead);font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip-opt{position:relative}
.chip-opt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chip-opt span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:var(--accent-2);font-size:var(--t-small);font-weight:500;transition:background-color 200ms ease,color 200ms ease}
.chip-opt input:checked+span{background:var(--inverse-ink);color:var(--ink)}
.chip-opt input:focus-visible+span{outline:2px solid var(--brass);outline-offset:2px}
.field{display:flex;flex-direction:column;gap:4px;min-width:0}
.field label{font-size:var(--t-small)}
.field input,.field select,.field textarea{font:inherit;font-size:16px;min-height:52px;padding:12px 14px;border:0;background:var(--accent-2);color:var(--inverse-ink);width:100%}
.field select option{color:var(--ink)}
.field textarea{min-height:96px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:rgba(241,241,238,.6)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--brass);outline-offset:0}
.field .err{color:#ffd2d8;font-size:var(--t-small);min-height:1.2em}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:var(--t-small)}
.consent input{margin-top:3px;accent-color:var(--brass);width:18px;height:18px;flex:none}
.form-nav{display:flex;gap:10px;margin-top:auto}
.form-nav .btn{flex:1;min-height:56px}
.form-nav .back{flex:0 0 auto;background:var(--accent-2)}
.form-nav .btn[disabled]{display:none}
.done{position:absolute;inset:0;background:var(--ink);color:var(--inverse-ink);display:flex;flex-direction:column;justify-content:center;gap:14px;padding:48px;visibility:hidden;opacity:0;transition:opacity 400ms ease,visibility 0s 400ms}
.done.show{visibility:visible;opacity:1;transition:opacity 400ms ease}
.done h3{font-size:var(--t-head)}
@media (max-width:860px){
  .coupon{grid-column:1 / -1;grid-template-columns:1fr;margin:0 calc(-1 * var(--m) + 12px)}
  .coupon::before,.coupon::after{display:none}
  .coupon-left{border-right:0;border-bottom:5px dotted var(--bg);padding:32px 24px}
  .form{padding:28px 24px}
  .two{grid-template-columns:1fr}
}

/* ---------- noga: ime se v nogi spet sestavi ---------- */
.footer{background:var(--inverse-bg);color:var(--inverse-ink);padding-top:var(--m);padding-bottom:calc(var(--m) + env(safe-area-inset-bottom,0px));min-height:90svh;display:flex;flex-direction:column}
.foot-mark{display:flex;justify-content:space-between;align-items:flex-start;overflow:hidden}
.foot-mark .we,.foot-mark .go{height:calc((100vw - 2 * var(--m)) / 3.37);flex:none;will-change:transform}
.foot-row{margin-top:72px;align-items:start}
.reach{grid-column:1 / span 5;display:flex;flex-direction:column;gap:6px;list-style:none;margin:0;padding:0}
.reach li,.reach a{font-size:clamp(26px,2.4vw,36px);font-weight:500;letter-spacing:-.025em;text-decoration:none;color:var(--brass)}
.reach .ph{color:rgba(241,241,238,.5)}
.foot-cols{grid-column:7 / span 6;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.foot-cols h2{font-size:var(--t-small);font-weight:600;letter-spacing:0;margin-bottom:12px}
.foot-cols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:15px}
.foot-cols a{text-decoration:none;color:rgba(241,241,238,.8)}
@media (hover:hover) and (pointer:fine){.foot-cols a:hover,.reach a:hover{color:var(--inverse-ink)}}
.legal{margin-top:auto;padding-top:96px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:var(--t-small);color:rgba(241,241,238,.62)}
.legal a{color:inherit}
@media (max-width:860px){
  .reach,.foot-cols{grid-column:1 / -1}
  .foot-cols{grid-template-columns:1fr 1fr;margin-top:40px}
  .reach li,.reach a{font-size:26px}
}

/* ---------- podstran: hero ---------- */
.sub-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:stretch;padding-top:96px;min-height:100svh}
.sub-copy{display:flex;flex-direction:column;justify-content:center;gap:22px;padding-block:40px}
.crumbs{font-size:var(--t-small);color:var(--muted)}
.crumbs a{text-decoration:none}
@media (hover:hover) and (pointer:fine){.crumbs a:hover{color:var(--accent)}}
.sub-copy h1{font-size:clamp(38px,4.4vw,68px);letter-spacing:-.04em;line-height:1;max-width:14ch}
.sub-copy .lead{font-size:var(--t-lead);line-height:1.35;max-width:32ch}
.sub-copy .lead b{font-weight:600;color:var(--accent)}
.sub-copy p{max-width:46ch}
.sub-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:6px}
.sub-photo{margin:0;position:relative;overflow:hidden;min-height:60svh}
.sub-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:no-preference){
  .sub-photo{animation:wipeUp 1.3s var(--ease-in-out) backwards .1s}
  .sub-photo img{animation:settle 1.8s var(--ease-out) backwards .1s}
  .sub-copy>*:not(h1){animation:fadeUp .9s var(--ease-out) backwards}
  .sub-copy>*:nth-child(3){animation-delay:.1s}.sub-copy>*:nth-child(4){animation-delay:.2s}.sub-copy>*:nth-child(5){animation-delay:.3s}
}
@media (max-width:980px){
  .sub-hero{grid-template-columns:1fr;min-height:0;padding-top:84px}
  .sub-photo{min-height:56svh;margin:0 calc(-1 * var(--m))}
}

/* ---------- podstran: kaj vključuje ---------- */
.incl{padding-top:var(--gap);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px);align-items:start}
.incl h2{grid-column:1 / span 4;font-size:var(--t-display);letter-spacing:-.04em;max-width:8ch}
.incl-list{grid-column:5 / span 5;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
.incl-list li{display:flex;gap:16px;align-items:baseline;font-size:var(--t-lead);line-height:1.35}
.incl-list li::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:var(--accent);transform:translateY(-3px)}
.incl-photo{grid-column:10 / span 3;margin:0;aspect-ratio:3/4;overflow:hidden}
.incl-photo img{width:100%;height:100%;object-fit:cover}
@media (hover:hover) and (pointer:fine){.incl-photo img{transition:transform 1.2s var(--ease-out)}.incl-photo:hover img{transform:scale(1.05)}}
@media (max-width:980px){
  .incl{display:flex;flex-direction:column;gap:32px}
  .incl-photo{width:100%;aspect-ratio:4/3}
}

/* ---------- podstran: ekipa ---------- */
.team-field{margin-top:var(--gap);background:var(--accent);color:var(--inverse-ink);padding-block:clamp(90px,10vw,150px)}
.team-field h2{font-size:var(--t-head);margin-bottom:40px}
.roles{list-style:none;margin:0 0 44px;padding:0;display:flex;flex-wrap:wrap;gap:6px 0}
.roles li{font-size:var(--t-display);font-weight:500;letter-spacing:-.04em;line-height:1.05;display:flex;align-items:center}
.roles li:not(:last-child)::after{content:"";width:.2em;height:.2em;border-radius:50%;background:var(--brass);margin:0 .35em}
.team-field p{font-size:var(--t-lead);max-width:44ch}
@media (max-width:600px){.roles{flex-direction:column;gap:2px}.roles li:not(:last-child)::after{display:none}}

/* ---------- podstran: pas dveh fotografij ---------- */
.sub-band{margin-top:var(--gap);display:grid;grid-template-columns:62fr 38fr;gap:6px;height:70svh;min-height:420px}
.sub-band figure{margin:0;overflow:hidden}
.sub-band img{width:100%;height:100%;object-fit:cover;will-change:transform}
@media (max-width:860px){.sub-band{grid-template-columns:1fr;height:auto}.sub-band figure{aspect-ratio:4/3}}

/* ---------- podstran: kaj potrebujemo ---------- */
.needs{padding-top:var(--gap);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,96px);align-items:start}
.needs h2{font-size:var(--t-head);margin-bottom:22px}
.needs .lead{font-size:var(--t-lead);line-height:1.35;margin-bottom:16px;max-width:34ch}
.mini-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.mini-steps li{background:var(--surface);padding:20px 24px;display:flex;flex-direction:column;gap:4px}
.mini-steps b{font-size:var(--t-lead);font-weight:500;letter-spacing:-.01em}
@media (max-width:980px){.needs{grid-template-columns:1fr}}

/* ---------- podstran: druge ponudbe ---------- */
.related{padding-top:var(--gap)}
.related h2{font-size:var(--t-display);letter-spacing:-.04em;margin-bottom:40px}
.rel-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}
.rel-list a{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:20px;align-items:center;text-decoration:none;padding:12px;margin:-12px;transition:background-color 250ms ease}
.rel-img{display:block;aspect-ratio:4/3;overflow:hidden}
.rel-img img{width:100%;height:100%;object-fit:cover}
.rel-t{display:flex;flex-direction:column;gap:2px}
.rel-t b{font-size:var(--t-lead);font-weight:500;letter-spacing:-.01em}
.rel-t b .arr{display:inline-block;color:var(--brass);transition:transform 300ms var(--ease-out)}
.rel-t>span{color:var(--muted)}
@media (hover:hover) and (pointer:fine){
  .rel-list a:hover{background:var(--surface)}
  .rel-list a:hover .arr{transform:translateX(5px)}
  .rel-list a .rel-img img{transition:transform 1s var(--ease-out)}
  .rel-list a:hover .rel-img img{transform:scale(1.06)}
}
@media (max-width:860px){.rel-list{grid-template-columns:1fr}.rel-list a{grid-template-columns:minmax(0,1fr) 96px;gap:14px}}

/* ---------- gibanje: naslovi po besedah, razkrivanje med drsenjem ---------- */
.sw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.1em;margin-bottom:-.1em}
.sw>span{display:inline-block;will-change:transform}
.rv{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform 1.1s var(--ease-out)}
.rv.in{opacity:1;transform:none}

/* ---------- zmanjšano gibanje ---------- */
@media (prefers-reduced-motion:reduce){
  .places-track{animation:none}
  .fstep{transition:opacity 200ms ease}
  .fstep[aria-hidden="true"]{transform:none}
  .hero{height:auto}
  .stage{position:relative}
  .rv{opacity:1;transform:none;transition:none}
  .offer:hover figure img,.sig-inset:hover img,.incl-photo:hover img,.rel-list a:hover .rel-img img,.sig-text li a:hover,.btn:hover{transform:none}
}