/* Alcedo Canoeing. Barve iz vodomca in kanuja, pisavi Jost in Newsreader. */
@font-face{font-family:"Jost";src:url(assets/fonts/jost-latin-ext-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+1E00-1E9F}
@font-face{font-family:"Jost";src:url(assets/fonts/jost-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:"Newsreader";src:url(assets/fonts/newsreader-latin-ext-wght-normal.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0100-02BA,U+1E00-1E9F}
@font-face{font-family:"Newsreader";src:url(assets/fonts/newsreader-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:"Newsreader";font-style:italic;src:url(assets/fonts/newsreader-latin-ext-wght-italic.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0100-02BA,U+1E00-1E9F}
@font-face{font-family:"Newsreader";font-style:italic;src:url(assets/fonts/newsreader-latin-wght-italic.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC}

:root{
  --sc-canvas:#0d1f1a; --sc-surface:#16302a;
  --sc-ink:#f1ecdf; --sc-ink-soft:#b9c4b4;
  --sc-accent:#f39437; --sc-accent-ink:#14170f;
  --sc-font-display:"Jost",system-ui,sans-serif;
  --sc-font-text:"Newsreader",Georgia,serif;
  --sc-track-tight:-.02em; --sc-track-snug:-.012em;
  --hull:#6e1612; --teal:#0d3a44; --paper:#eee8da;
  --rail-w:64px; --bar-h:56px;
}
html{background:var(--sc-canvas)}
body{font-size:clamp(1.0625rem,1rem + .25vw,1.25rem)}
.sc-display{font-weight:400}
.sc-body{color:var(--sc-ink-soft)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

#flyer{position:fixed;left:0;top:0;width:100px;height:auto;max-width:none;z-index:50;pointer-events:none;overflow:visible;transform-origin:0 0;opacity:0;will-change:transform,opacity}
#flyer .b-wing{transform-origin:250px 262px;transform-box:view-box}

/* ---------- rečna črta ---------- */
.rail{position:fixed;z-index:40;left:0;top:50%;width:var(--rail-w);height:60svh;margin-top:-30svh;color:var(--sc-ink);opacity:0;pointer-events:none;transition:opacity var(--sc-d-base) var(--sc-ease-out),color var(--sc-d-base) var(--sc-ease-out)}
.rail.is-on,.rail:focus-within{opacity:1;pointer-events:auto}
.rail[data-tone="light"]{color:#17312a}
.rail__river{position:absolute;inset:0;width:100%;height:100%;max-width:none;overflow:visible}
.rail__river path{fill:none;stroke:currentColor;stroke-width:1.25;opacity:.5}
.rail ol{list-style:none;margin:0;padding:0}
.rail li a{position:absolute;display:block;width:44px;height:44px;margin:-22px 0 0 -22px;text-decoration:none;color:inherit;font-family:var(--sc-font-display)}
.rail li a::before{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px;border-radius:50%;background:currentColor;transition:transform var(--sc-d-fast) var(--sc-ease-out)}
.rail li a[aria-current="true"]::before{background:var(--sc-accent);transform:scale(1.35)}
.rail[data-tone="light"] li a[aria-current="true"]::before{background:#a84a09}
.rail span{position:absolute;left:40px;top:50%;translate:0 -50%;white-space:nowrap;font-size:var(--sc-t-sm);padding:.15em .6em;border-radius:var(--sc-r-sm);background:var(--sc-canvas);color:var(--sc-ink);opacity:0;transition:opacity var(--sc-d-fast) var(--sc-ease-out);pointer-events:none}
.rail a:focus-visible span{opacity:1}
@media (hover:hover) and (pointer:fine){.rail a:hover span{opacity:1}.rail a:hover::before{transform:scale(1.6)}}

/* ---------- odseki: trdi prehodi med podlagami ---------- */
.ch{position:relative;padding-block:var(--sc-section)}
#aljosa{padding-top:clamp(3rem,6vw,6rem)}
.ch--forest{background:var(--sc-canvas);color:var(--sc-ink)}
.ch--hull{background:var(--hull);--sc-ink-soft:#ecd5c7;color:var(--sc-ink)}
.ch--teal{background:var(--teal);--sc-ink-soft:#bcd3d3;color:var(--sc-ink)}
.ch--paper{background:var(--paper);--sc-ink:#17312a;--sc-ink-soft:#44564c;--sc-accent:#a84a09;color:var(--sc-ink)}
@media (min-width:861px){.sc-wrap{padding-left:max(var(--sc-gutter),calc(var(--rail-w) + 2rem))}}

.aljosa{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.aljosa__foto{margin:0}
.aljosa__foto img{width:100%;height:auto;border-radius:var(--sc-r-sm)}
.aljosa__txt>*+*{margin-top:var(--sc-5)}
.aljosa__txt .sc-display{font-size:clamp(2.4rem,1.6rem + 3.2vw,4.4rem)}

.kanuji{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(2rem,5vw,5rem);align-items:end}
.kanuji__word{margin:0 0 0 -.05em;font-family:var(--sc-font-display);font-weight:300;font-size:clamp(4rem,13vw,12.5rem);line-height:.9;letter-spacing:-.03em}
.kanuji__facts{list-style:none;margin:var(--sc-6) 0 0;padding:0;font-size:var(--sc-t-lg);line-height:1.35}
.kanuji__facts li{padding-block:var(--sc-3);border-top:1px solid color-mix(in oklab,var(--sc-ink) 28%,transparent)}
.kanuji__foto{margin:0}
.kanuji__clip{overflow:hidden;border-radius:var(--sc-r-sm);aspect-ratio:4/5}
.kanuji__clip img{width:100%;height:118%;object-fit:cover;object-position:46% 50%;max-width:none}
.kanuji__foto figcaption{margin-top:var(--sc-3);font-size:var(--sc-t-sm);color:var(--sc-ink-soft)}

.poti{background:var(--teal);display:flex;align-items:center}
.poti__rail{gap:clamp(1.25rem,3vw,3rem);padding-inline:calc(var(--rail-w) + 2rem) var(--sc-gutter);align-items:flex-start;width:max-content}
.poti__lead{flex:0 0 min(30rem,70vw);align-self:center;padding-right:var(--sc-6)}
.poti__lead>*+*{margin-top:var(--sc-4)}
.trip{flex:0 0 clamp(18rem,38vw,40rem)}
.trip h3{margin:var(--sc-4) 0 0;font-family:var(--sc-font-display);font-weight:400;font-size:var(--sc-t-xl);line-height:1.15}
.trip h3 span{font-variant-numeric:tabular-nums;color:var(--sc-accent);margin-right:.35em}
.trip p{margin:var(--sc-2) 0 0;color:var(--sc-ink-soft)}
.yt{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;border-radius:var(--sc-r-sm);overflow:hidden;background:#07161a;cursor:pointer;box-shadow:var(--sc-e2)}
.yt img{width:100%;height:100%;object-fit:cover}
button.yt::after{content:"";position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px;border-radius:50%;background:var(--sc-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2314170f' d='M9 6.5v11l9-5.5z'/%3E%3C/svg%3E") center/26px no-repeat;transition:transform var(--sc-d-fast) var(--sc-ease-out)}
button.yt:active::after{transform:scale(.95)}
@media (hover:hover) and (pointer:fine){button.yt:hover::after{transform:scale(1.08)}}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.zapiski>*+*{margin-top:var(--sc-7)}
.zapiski__list{list-style:none;margin-bottom:0;padding:0;max-width:58rem}
.zapiski__list li{border-top:1px solid color-mix(in oklab,var(--sc-ink) 30%,transparent)}
.zapiski__list li:last-child{border-bottom:1px solid color-mix(in oklab,var(--sc-ink) 30%,transparent)}
.zapiski__list a{display:block;padding-block:var(--sc-6);text-decoration:none}
.zapiski__list strong{display:block;font-family:var(--sc-font-display);font-weight:400;font-size:var(--sc-t-2xl);line-height:1.1;letter-spacing:-.012em}
.zapiski__list span{display:block;margin-top:var(--sc-3);color:var(--sc-ink-soft);font-style:italic}
@media (hover:hover) and (pointer:fine){.zapiski__list a:hover strong{color:var(--sc-accent)}}

/* ---------- pristan ---------- */
.pismo{position:absolute;z-index:5;right:clamp(1.25rem,6vw,6rem);top:50%;translate:0 -50%;width:min(30rem,40vw)}
.pismo form{display:grid;grid-template-columns:1fr 1fr;gap:var(--sc-4);margin-top:var(--sc-6)}
.f{grid-column:1/-1;display:flex;flex-direction:column;gap:var(--sc-1)}
.f--half{grid-column:auto}
.f label{font-family:var(--sc-font-display);font-size:var(--sc-t-sm);color:var(--sc-ink-soft)}
.f input,.f textarea{width:100%;min-height:44px;padding:.55rem .1rem;background:transparent;border:0;border-bottom:1px solid color-mix(in oklab,var(--sc-ink) 55%,transparent);border-radius:0;color:var(--sc-ink);resize:vertical;font-family:var(--sc-font-text)}
.f input:focus-visible,.f textarea:focus-visible{outline-offset:2px}
.f [aria-invalid="true"]{border-bottom-color:var(--sc-accent)}
.cta{grid-column:1/-1;justify-self:start;min-height:48px;padding:.6rem 1.6rem;border:0;border-radius:var(--sc-r-sm);background:var(--sc-accent);color:var(--sc-accent-ink);font-family:var(--sc-font-display);font-size:var(--sc-t-base);font-weight:500;white-space:nowrap;cursor:pointer;box-shadow:var(--sc-e1);transition:transform var(--sc-d-fast) var(--sc-ease-out),background var(--sc-d-fast) var(--sc-ease-out)}
.cta:active{transform:translateY(1px) scale(.98)}
@media (hover:hover) and (pointer:fine){.cta:hover{background:#ffa94f}}
.pismo__status{grid-column:1/-1;margin:0;font-size:var(--sc-t-sm);line-height:1.4;color:var(--sc-ink-soft)}
.noga{position:absolute;z-index:5;left:calc(var(--rail-w) + 1rem);bottom:var(--sc-4);font-family:var(--sc-font-display);font-size:var(--sc-t-xs);color:var(--sc-ink);opacity:.8}

@media (max-width:860px){
  .rail{left:0;right:0;top:auto;bottom:0;margin:0;width:100%;height:calc(var(--bar-h) + env(safe-area-inset-bottom));background:var(--sc-canvas);box-shadow:0 -1px 0 color-mix(in oklab,var(--sc-ink) 14%,transparent)}
  .rail[data-tone="light"]{background:var(--paper);box-shadow:0 -1px 0 rgb(23 49 42/.18)}
  .rail span{display:none}
  .aljosa,.kanuji{grid-template-columns:1fr}
  .kanuji__word{font-size:21vw}
  .ch{padding-block:clamp(3.5rem,12vw,5rem) calc(clamp(3.5rem,12vw,5rem) + var(--bar-h))}
  .kanuji__foto{max-width:24rem}
  .poti{padding-bottom:var(--bar-h)}
  .poti__rail{padding-inline:var(--sc-gutter)}
  .poti__lead{flex-basis:78vw}
  .trip{flex-basis:80vw}
}