/* Kodranka · "Išvykimai" design system (concept F) */
:root{--concrete:#DCDCD6;--paper:#F6F4EC;--board:#121212;--flap:#202020;--flapt:#F2EFE6;--yellow:#FFC300;--ink:#121212;--green:#7BD88F;--muted:#5b5b55;--line:rgba(18,18,18,.16);--pad:clamp(16px,2.6vw,40px)}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--concrete)}
body{color:var(--ink);font-family:'Schibsted Grotesk',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{display:block;max-width:100%}
::selection{background:var(--yellow);color:var(--ink)}

/* ---------- flap ---------- */
.f{display:inline-flex;gap:calc(var(--cw,30px)*.1)}
.f b{flex:none;width:var(--cw,30px);height:calc(var(--cw,30px)*1.45);background:var(--flap);color:var(--flapt);font-family:'Big Shoulders Display';font-weight:800;font-size:var(--cw,30px);line-height:1;display:grid;place-items:center;border-radius:calc(var(--cw,30px)*.1);position:relative;overflow:hidden;box-shadow:0 1px 0 #000}
.f b:after{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:#0a0a0a}
.f b.flip{animation:flip .07s linear}
@keyframes flip{50%{transform:scaleY(.15);filter:brightness(.55)}}
.f b.y{color:var(--yellow)}.f b.g{color:var(--green)}

/* ---------- header ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px var(--pad);transition:transform .45s cubic-bezier(.7,0,.2,1)}
.hdr.hide{transform:translateY(-110%)}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:21px;letter-spacing:-.02em;background:var(--concrete);padding:8px 12px 8px 8px;border:2px solid var(--ink)}
.logo i{width:20px;height:20px;background:var(--yellow);border:2.5px solid var(--ink)}
.nav{display:flex;background:var(--concrete);border:2px solid var(--ink)}
.nav a{padding:10px 15px;font-weight:700;font-size:15px;border-left:2px solid var(--ink);position:relative}
.nav a:first-child{border-left:0}
.nav a:hover{background:var(--ink);color:var(--yellow)}
.nav a.on{background:var(--yellow)}
.hbtns{display:flex;gap:8px}
.pill{background:var(--concrete);border:2px solid var(--ink);padding:10px 15px;font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.pill.dark{background:var(--ink);color:var(--yellow)}
.pill.dark:hover{background:var(--yellow);color:var(--ink)}
.bars{display:inline-flex;gap:3px;align-items:flex-end;height:14px}.bars i{width:3px;background:currentColor;height:5px}
.sound-on .bars i{animation:eq .5s ease-in-out infinite alternate}.bars i:nth-child(2){animation-delay:.15s}.bars i:nth-child(3){animation-delay:.3s}
@keyframes eq{to{height:14px}}
.mb{display:none}

/* ---------- page head (inner pages) ---------- */
.phead{padding:120px var(--pad) 40px}
.phead .crumb{display:flex;justify-content:space-between;font-weight:600;font-size:14px;color:var(--muted);border-bottom:3px solid var(--ink);padding-bottom:12px;margin-bottom:34px}
.phead h1{font-weight:900;font-size:clamp(56px,10vw,170px);line-height:.88;letter-spacing:-.05em}
.phead h1 mark{background:transparent;color:inherit}
.phead .lede{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px;align-items:end}
.phead .lede p{font-size:clamp(19px,1.6vw,24px);line-height:1.5}
.phead .board{background:var(--board);border-radius:8px;padding:18px;--cw:clamp(18px,2.2vw,36px);display:flex;flex-direction:column;gap:8px;justify-self:end}

/* ---------- common blocks ---------- */
section{position:relative;z-index:3}
.sec{padding:110px var(--pad) 40px}
.sec-h{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:34px}
.sec-h h2{font-weight:900;font-size:clamp(40px,6vw,100px);line-height:.92;letter-spacing:-.045em}
.sec-h>span{font-family:'Big Shoulders Display';font-weight:800;font-size:24px}
.cta{display:inline-flex;align-items:center;gap:12px;background:var(--yellow);color:var(--ink);font-weight:800;font-size:18px;padding:18px 26px;border:2.5px solid var(--ink);transition:background .2s,color .2s}
.cta:hover{background:var(--ink);color:var(--yellow)}
.cta .arw{font-family:'Big Shoulders Display';font-size:22px}
.cta.ghost{background:transparent}
.muted{color:var(--muted)}

/* ---------- strip CTA ---------- */
.strip{margin:80px var(--pad) 0;background:var(--yellow);border:3px solid var(--ink);padding:clamp(24px,4vw,56px);display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.strip h3{font-weight:900;font-size:clamp(32px,4.4vw,72px);line-height:.95;letter-spacing:-.04em}
.strip .cta{background:var(--ink);color:var(--yellow)}.strip .cta:hover{background:var(--paper);color:var(--ink)}

/* ---------- footer ---------- */
.ftr{background:var(--board);color:var(--flapt);padding:100px var(--pad) 30px;margin-top:110px}
.ftr .top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
.ftr h4{font-weight:700;font-size:13px;color:#8f8f88;margin-bottom:14px}
.ftr .top a{display:block;font-weight:700;font-size:18px;padding:4px 0}
.ftr .top a:hover{color:var(--yellow)}
.ftr .big{margin:70px 0 40px;--cw:clamp(18px,6.4vw,118px)}
.ftr .bot{display:flex;justify-content:space-between;color:#8f8f88;font-weight:600;font-size:14px;gap:20px;flex-wrap:wrap}

/* ---------- mobile menu ---------- */
.menu{position:fixed;inset:0;z-index:55;background:var(--board);color:var(--flapt);padding:100px var(--pad) 30px;display:flex;flex-direction:column;justify-content:space-between;clip-path:inset(0 0 100% 0);transition:clip-path .7s cubic-bezier(.7,0,.2,1)}
.menu-open .menu{clip-path:inset(0 0 0 0)}
.menu a{display:flex;align-items:center;gap:16px;padding:9px 0;border-bottom:1px solid #2a2a2a;--cw:clamp(18px,5.6vw,48px)}
.menu a small{font-family:'Big Shoulders Display';font-weight:800;font-size:20px;color:#8f8f88;width:40px}
.menu .mfoot{display:flex;justify-content:space-between;color:#8f8f88;font-weight:600}

/* ---------- page transition ---------- */
.pt{position:fixed;inset:0;z-index:200;background:var(--board);display:grid;place-items:center;clip-path:inset(0 0 0 0);transition:clip-path .65s cubic-bezier(.7,0,.2,1);--cw:clamp(22px,4.6vw,66px)}
.pt.up{clip-path:inset(0 0 100% 0)}
.pt.down{clip-path:inset(0 0 0 0)}
.pt .sub{position:absolute;bottom:30px;left:0;right:0;text-align:center;color:#8f8f88;font-weight:600;font-size:14px}

/* ---------- peek (cursor image) ---------- */
.peek{position:fixed;left:0;top:0;width:380px;aspect-ratio:16/10;pointer-events:none;z-index:40;border:3px solid var(--ink);overflow:hidden;opacity:0;transform:scale(.85);transition:opacity .25s,transform .35s cubic-bezier(.2,1.3,.4,1);background:#000}
.peek.on{opacity:1;transform:scale(1)}
.peek img{width:100%;height:100%;object-fit:cover;object-position:top;position:absolute;inset:0;opacity:0;transition:opacity .2s}
.peek img.on{opacity:1}

@media (max-width:980px){.nav{display:none}.mb{display:flex}}
@media (max-width:760px){
 .hdr{padding:12px}.logo{font-size:18px}.pill{padding:8px 11px;font-size:14px}.snd span:last-child{display:none}.hbtns .dark{display:none}
 .phead{padding:96px 14px 30px}.phead .lede{grid-template-columns:1fr;gap:24px}.phead .board{justify-self:start;--cw:clamp(14px,4.6vw,22px)}
 .sec{padding:80px 14px 30px}.strip{margin:60px 14px 0}
 .ftr{padding:70px 14px 24px}.ftr .top{grid-template-columns:1fr 1fr}.ftr .big{--cw:clamp(14px,9vw,40px)}.peek{display:none}
}