/* ============================================================================
   OasisLabs — Liquid Glass (svetlá téma)
   Načítava sa ZA inline <style> každej stránky: prepíše tokeny (farby) a povrchy.
   Stránky majú rovnaké názvy tokenov (--abyss, --frost, --cyan…), takže stačí jeden súbor.
   Tokeny sú bezpečné pre TEXT na svetlom pozadí; výplne tlačidiel sú nižšie zvlášť.
   ============================================================================ */
:root{
  --void:#eaf3f8; --abyss:#f2f7fa; --deep:#e3f1f8; --deep2:#d6ebf5; --panel:rgba(255,255,255,.55);
  --cyan:#087aa3;        /* akcent pre text a ikony (kontrast 4.8:1 na bielej) */
  --cyan2:#1f9fd0;       /* stredná modrozelená — čiary, ikony */
  --cyan-soft:#0b6f93;   /* tlmený akcent pre text */
  --ice:#5cc8ea;
  --frost:#0c2a3c;       /* nadpisy */
  --text:#3a5566;        /* základný text */
  --dim:#46606f; --faint:#647d8c;
  --sun:#a8701a;         /* teplý akcent (piesok oázy) — tmavší, aby bol čitateľný */
  --line:rgba(12,42,60,.10);
  --glass:rgba(255,255,255,.5);
  --shadow-soft:0 18px 44px -24px rgba(12,42,60,.28);
  --shadow-glow:0 10px 28px -12px rgba(31,159,208,.55);

  /* sklo */
  --g-fill:linear-gradient(140deg,rgba(255,255,255,.80) 0%,rgba(255,255,255,.50) 52%,rgba(255,255,255,.36) 100%);
  --g-edge:rgba(255,255,255,.88);
  --g-blur:blur(22px) saturate(175%);
  --g-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.4),0 1px 2px rgba(12,42,60,.06),0 16px 36px -18px rgba(12,42,60,.24);
  --g-shadow-hover:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(255,255,255,.5),0 2px 4px rgba(12,42,60,.06),0 26px 52px -20px rgba(12,42,60,.32);
  /* „kvapka vody“ — výplň hlavných tlačidiel */
  --aqua-fill:linear-gradient(180deg,#9aeefd 0%,#46d2f6 46%,#1fa9df 100%);
  --aqua-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -3px 8px rgba(6,90,130,.22),0 10px 24px -10px rgba(20,150,200,.6);
  color-scheme:light;
}

/* ---------- podklad: jemná aurora za sklom (fixná, aby sklo stále malo čo lámať) ---------- */
html{background:#f2f7fa}
body{background:transparent;color:var(--text)}
body::before{content:"";position:fixed;inset:-12vmax;z-index:-1;pointer-events:none;
  background:
    radial-gradient(36vmax 28vmax at 10% 8%,rgba(63,216,255,.36),transparent 70%),
    radial-gradient(34vmax 30vmax at 92% 12%,rgba(150,166,255,.26),transparent 70%),
    radial-gradient(38vmax 30vmax at 84% 90%,rgba(95,224,255,.30),transparent 70%),
    radial-gradient(32vmax 28vmax at 8% 94%,rgba(255,210,150,.36),transparent 70%),
    radial-gradient(44vmax 34vmax at 50% 50%,rgba(205,238,250,.6),transparent 76%);
  animation:olAurora 40s ease-in-out infinite alternate;will-change:transform}
@keyframes olAurora{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-2vmax,1.6vmax,0) scale(1.05)}100%{transform:translate3d(1.6vmax,-1.2vmax,0) scale(1.02)}}
::selection{background:#bdeefb;color:#0c2a3c}

/* sekcie priehľadné — aurora presvitá cez celú stránku */
.services,.process,.stats,.contact,.thesis,.faq,.salons,.refs,.tint,section.hero,header.hero:not(#home){background:transparent}
.services,.process,.stats,.contact,.thesis,.salons,.refs{border-top-color:rgba(255,255,255,.7)}

/* ---------- sklenené povrchy ---------- */
.ref-card,.faq-item,.price-card,.pkg,.svc__example,.svc__visual,.form,.card,.seg,.pcard,.acard,.step,details.faq,.callout,.box,.toc,
.salons-strip,.mod,.shot-tab,.cinfo .ic,.pillh,.pill{
  background:var(--g-fill);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);
  border:1px solid var(--g-edge);box-shadow:var(--g-shadow)}
.ref-card,.pkg,.price-card,.card,.acard,.form{border-radius:22px}
.faq-item,.pcard,.step,.seg,.callout,.box,.toc,details.faq{border-radius:18px}
/* zachovať farebný ľavý okraj tam, kde nesie význam */
.pgrid .pcard,.seg,.callout{border-left:3px solid var(--cyan2)}
.box.warn{background:linear-gradient(140deg,rgba(255,244,222,.85),rgba(255,236,200,.55));border-color:rgba(200,140,30,.35)}
a.ref-card:hover,.card:hover,.acard:hover,.pkg:hover,.price-card:hover,a.pcard:hover{border-color:#fff;box-shadow:var(--g-shadow-hover)}
.salons-strip{border-style:solid}

/* ---------- navigácia: plávajúca sklenená lišta ---------- */
.nav{top:12px;left:12px;right:12px;max-width:1180px;margin:0 auto;border-radius:22px;padding:11px 14px 11px 20px;
  background:rgba(255,255,255,.46);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);
  border:1px solid rgba(255,255,255,.85);box-shadow:var(--g-shadow)}
.nav.scrolled{background:rgba(255,255,255,.66);padding:9px 14px 9px 20px;box-shadow:var(--g-shadow-hover)}
.nav .brand{opacity:1;pointer-events:auto;color:var(--frost)}
/* „Oasis“ + <b>Labs</b> sú dve flex položky → medzera medzi nimi; medzeru nesie len logo */
.brand{gap:0}
.brand .mark,.brand img,.brand svg{margin-right:11px}
.nav-links a{color:var(--frost);text-shadow:none}
.nav-links a:hover{background:rgba(255,255,255,.75);color:var(--cyan)}
.nav-links a.lang{border:1px solid rgba(12,42,60,.14)}
.nav-burger{color:var(--frost)}
@media(max-width:880px){
  .nav-links.open{top:calc(100% + 8px);border-radius:20px;background:rgba(255,255,255,.86);
    -webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid #fff;box-shadow:var(--g-shadow-hover)}
  .nav-links.open a{color:var(--frost)}
}
/* jednoduchá lišta (blog, ochrana údajov) */
body>nav:not(.nav){top:12px;margin:12px 12px 0;border-radius:20px;background:rgba(255,255,255,.6);
  -webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid rgba(255,255,255,.88);box-shadow:var(--g-shadow)}
.nlinks a,nav a.back{color:var(--frost)}
.nlinks a:hover,nav a.back:hover{color:var(--cyan)}
@media(max-width:520px){body>nav:not(.nav){margin:10px 10px 0}body>nav:not(.nav) .row{padding:0 14px}.nlinks a{margin-left:12px;font-size:.84rem}}
@media(max-width:400px){body>nav:not(.nav) .brand{font-size:1rem}.nlinks a{margin-left:9px;font-size:.8rem}}
/* logo: svetlá azúrová na bielom zaniká → sýtejší odtieň */
svg.mark path,.hero__logo path{fill:#0b93c4}

/* ---------- tlačidlá ---------- */
.btn.primary,.hbtn.primary,.of-btn.primary,.submit,a.cta,.pkg.featured .cta,.shot-tab.active,.of-tag,.pkg .badge,.fbadge{
  color:#06303f;background:var(--aqua-fill);border:1px solid rgba(255,255,255,.75);box-shadow:var(--aqua-shadow)}
.btn.primary:hover,.hbtn.primary:hover,.of-btn.primary:hover,a.cta:hover,.pkg.featured .cta:hover{filter:brightness(1.04) saturate(1.05);transform:translateY(-2px)}
.submit:hover{box-shadow:var(--aqua-shadow),0 16px 34px -12px rgba(20,150,200,.6)}
.btn.ghost,.hbtn.ghost,.of-btn.ghost,.pkg .cta{color:var(--frost);background:rgba(255,255,255,.5);
  -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 1px 0 #fff,0 8px 20px -12px rgba(12,42,60,.3)}
.btn.ghost:hover,.hbtn.ghost:hover,.of-btn.ghost:hover,.pkg .cta:hover{background:rgba(255,255,255,.8)}
.ref-tags span{background:rgba(255,255,255,.55);border-color:rgba(8,122,163,.2)}

/* ---------- úvod (hero) hlavnej stránky ---------- */
#home.hero{background:radial-gradient(120% 120% at 74% 42%,#ffffff 0%,#e8f6fc 36%,#d2ebf7 70%,#c2e2f2 100%)}
#home.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:18%;pointer-events:none;
  background:linear-gradient(180deg,rgba(242,247,250,0),#f2f7fa)}
.hero__shade{background:linear-gradient(90deg,rgba(242,247,250,.9) 0%,rgba(242,247,250,.55) 34%,rgba(242,247,250,0) 62%)}
.hud-c{border-color:rgba(8,122,163,.28)}
.hero__ver{color:#6f93a6}
.hero__tag .ts{color:var(--dim)}
/* telemetria v úvode (EN) — sklenená karta */
.hero__tele{background:var(--g-fill);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);
  border:1px solid var(--g-edge);border-radius:14px;box-shadow:var(--g-shadow)}
.hero__tele .rows{color:var(--dim)}
.hero__tele .rows .gd,.olive{color:#0e9b6e}
.olive{background:#16b981;box-shadow:0 0 8px rgba(22,185,129,.6)}
.hero h1,.ctaband h2{color:var(--frost)}

/* ---------- úvod podstránok ---------- */
section.hero,header.hero:not(#home){border-bottom-color:rgba(255,255,255,.7)}
.hf-shade{background:linear-gradient(90deg,rgba(242,247,250,.95) 0%,rgba(242,247,250,.78) 32%,rgba(242,247,250,.2) 56%,rgba(242,247,250,0) 70%),
  linear-gradient(180deg,rgba(242,247,250,.55) 0%,rgba(242,247,250,0) 26%,rgba(242,247,250,.85) 100%)}
/* tmavé video OasisOne v úvode → svetlá verzia (invert + otočenie odtieňa zachová modré farby) */
.herofull>video{filter:invert(1) hue-rotate(180deg) saturate(1.2) contrast(1.05)}
.hero-video,.shot-frame,.of-visual{background:#fff;border:1px solid rgba(255,255,255,.9);border-radius:22px;
  box-shadow:inset 0 1px 0 #fff,0 30px 60px -30px rgba(12,42,60,.35),0 0 0 6px rgba(255,255,255,.35)}
.shot-bar{background:rgba(255,255,255,.75);border-bottom:1px solid var(--line)}
.shot-view{background:#eef5f9}
.ctaband{background:radial-gradient(90% 160% at 80% 0,rgba(63,216,255,.22) 0,transparent 55%),var(--g-fill);
  -webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid var(--g-edge);box-shadow:var(--g-shadow);border-radius:28px}
.card .ic{background:rgba(31,159,208,.12)}

/* ---------- služby, proces, štatistiky ---------- */
.svc.open,.svc__head:hover{background:rgba(255,255,255,.4)}
.svc.open .svc__num,.svc__head:hover .svc__num,.pstep.in .node,.form-success .ok{color:#06303f}
.svc__num,.pstep .node{background:rgba(255,255,255,.6);border-color:rgba(8,122,163,.22)}
.vw-chrome{border-bottom-color:var(--line)}
.vc-step .dot{background:#fff}
.stat .n{background:linear-gradient(135deg,#0c2a3c,#0a86b0);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .l{color:var(--cyan)}
.stat .l .sub{color:var(--faint)}
.oasis-feature{background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(214,241,251,.55));
  -webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid #fff;border-radius:28px;
  box-shadow:var(--g-shadow),0 0 70px -24px rgba(63,216,255,.55)}
.big-ring .r1{border-color:rgba(31,159,208,.35);box-shadow:0 0 80px rgba(63,216,255,.22),inset 0 0 80px rgba(63,216,255,.12)}
.big-ring .r2{border-color:rgba(31,159,208,.4)}
.big-ring .r3{border-color:rgba(31,159,208,.22)}
.contact::before{border-color:rgba(31,159,208,.22);box-shadow:inset 0 0 120px rgba(63,216,255,.14)}

/* ---------- index: zoznam služieb a štatistiky ako sklenené panely, nadpisy sekcií ---------- */
.svc-list{margin-top:10px;padding:4px 20px;border-radius:28px;background:var(--g-fill);
  -webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid var(--g-edge);box-shadow:var(--g-shadow)}
.svc:last-child{border-bottom:0}
.svc.open,.svc__head:hover{border-radius:18px}
.stat{padding:28px 18px 26px;border-radius:24px;background:var(--g-fill);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);
  border:1px solid var(--g-edge);box-shadow:var(--g-shadow)}
.faq>.wrap>h2,.refs>.wrap>h2{font-family:var(--font-display,'Sora',sans-serif);font-weight:700;color:var(--frost);
  font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.12;letter-spacing:-.02em;margin-top:12px}
@media(max-width:520px){.svc-list{padding:2px 10px;border-radius:22px}}

/* ---------- kontaktný formulár ---------- */
.cinfo .t{color:var(--faint)}
.cinfo .ic{border-radius:50%}
.field label{color:var(--frost)}
.field input,.field textarea,.field select{background:rgba(255,255,255,.72);border:1px solid rgba(12,42,60,.14);color:var(--frost)}
.field select{color-scheme:light}
.field input::placeholder,.field textarea::placeholder{color:#8aa0ad}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--cyan2);box-shadow:0 0 0 4px rgba(31,159,208,.16)}
.form-note{color:var(--faint)}

/* ---------- referencie: náhľad webu + text ---------- */
.ref-grid{grid-template-columns:repeat(4,1fr);gap:20px}
.ref-card{padding:12px 12px 20px;gap:9px;overflow:hidden}
.ref-card>:not(.ref-shot){margin-left:10px;margin-right:10px}
.ref-card .ref-city{color:var(--faint)}
.ref-shot{position:relative;display:block;aspect-ratio:16/10;border-radius:14px;overflow:hidden;margin-bottom:6px;
  background:#e9f2f7;box-shadow:inset 0 0 0 1px rgba(12,42,60,.08),0 10px 22px -16px rgba(12,42,60,.45)}
.ref-shot img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .6s var(--ease,ease)}
.ref-shot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 32%)}
a.ref-card:hover .ref-shot img{transform:scale(1.035)}
.ref-card.feat{grid-column:span 2}
.ref-card.feat .ref-shot{aspect-ratio:16/9}
@media(max-width:1020px){.ref-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.ref-grid{grid-template-columns:1fr}.ref-card.feat{grid-column:auto}.ref-card.feat .ref-shot{aspect-ratio:16/10}}

/* ---------- pätička, krúžok priebehu ---------- */
.footer{background:rgba(255,255,255,.45);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);
  border-top:1px solid rgba(255,255,255,.85);color:var(--faint)}
.footer .tag{color:var(--cyan)}
.progress-ring{border-radius:50%;background:rgba(255,255,255,.55);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);
  box-shadow:var(--g-shadow)}
.progress-ring .bg{stroke:rgba(12,42,60,.1)}

/* široká tabuľka (ochrana údajov) na úzkom mobile — posun v tabuľke, nie celej stránky */
@media(max-width:400px){main table{display:block;overflow-x:auto}}

/* ---------- výkon a prístupnosť ---------- */
@media(max-width:700px){
  :root{--g-blur:blur(14px) saturate(160%)}
  body::before{animation:none}
}
@media(prefers-reduced-motion:reduce){body::before{animation:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  :root{--g-fill:rgba(255,255,255,.9)}
}

/* ============================================================================
   Farby „Petrolej a piesok“ (28. 10. 2026)
   Svetlý kamenný podklad, sýty petrolej v úvode a v päte, piesok ako akcent.
   Prepisuje svetlé tyrkysové farby vyššie; štruktúra skla ostáva.
   Návrh a ostatné varianty: _drafts/palettes/.
   ============================================================================ */
:root{
  --p-scheme:light;
  --p-bg:#eef2f1;--p-bg-rgb:238 242 241;
  --void:#e6ecea;--abyss:#eef2f1;--deep:#e2eae8;--deep2:#d5e1de;--panel:rgba(255,255,255,.6);
  --cyan:#0c6b7a;--cyan2:#13889a;--cyan-soft:#0a5f6d;--ice:#7cc6cf;
  --frost:#0d3340;--text:#33505a;--dim:#3c5862;--faint:#587078;--sun:#9a6a26;
  --line:rgba(13,51,64,.11);--glass:rgba(255,255,255,.6);
  --shadow-glow:0 10px 28px -12px rgba(19,136,154,.45);
  --g-fill:linear-gradient(140deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,.7) 55%,rgba(255,255,255,.56) 100%);
  --g-edge:rgba(255,255,255,.95);
  --g-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(13,51,64,.06),0 18px 38px -20px rgba(13,51,64,.3);
  --g-shadow-hover:inset 0 1px 0 #fff,0 2px 4px rgba(13,51,64,.07),0 28px 54px -22px rgba(13,51,64,.38);
  --p-aurora:radial-gradient(36vmax 28vmax at 8% 10%,rgba(19,136,154,.12),transparent 70%),
    radial-gradient(34vmax 30vmax at 92% 30%,rgba(214,168,98,.16),transparent 70%),
    radial-gradient(38vmax 30vmax at 80% 92%,rgba(19,136,154,.10),transparent 70%);
  --p-select:#cfe7e9;--p-select-ink:#0d3340;
  --p-nav:rgba(255,255,255,.76);--p-nav-scrolled:rgba(255,255,255,.9);--p-menu:rgba(255,255,255,.97);
  --p-hover:rgba(12,107,122,.08);--p-hover-soft:rgba(255,255,255,.55);
  --p-logo:#0c6b7a;
  --p-btn:linear-gradient(180deg,#14707f 0%,#0d5664 100%);--p-btn-ink:#fff;--p-btn-edge:rgba(255,255,255,.2);
  --p-btn-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 24px -12px rgba(13,86,100,.6);
  --p-ghost:rgba(255,255,255,.72);--p-ghost-edge:rgba(13,51,64,.14);--p-ghost-hover:#fff;
  --p-hero:radial-gradient(120% 120% at 74% 42%,#1d6f7b 0%,#125461 38%,#0c3d48 72%,#092f38 100%);
  --p-hero-shade:linear-gradient(90deg,rgba(9,47,56,.85) 0%,rgba(9,47,56,.45) 34%,rgba(9,47,56,0) 62%);
  --p-hud:rgba(230,200,150,.42);--p-hero-ver:#8fb9bd;
  --p-canvas-filter:hue-rotate(-22deg) saturate(.9) brightness(1.3);--p-canvas-blend:screen;
  --p-video-filter:invert(1) hue-rotate(180deg) saturate(1.1) contrast(1.05);
  --p-surface-solid:#fff;
  --p-glow:rgba(19,136,154,.2);--p-glow-soft:rgba(19,136,154,.08);--p-ring:rgba(12,107,122,.28);--p-tint:rgba(12,107,122,.1);
  --p-orb:linear-gradient(180deg,#14707f,#0d5664);
  --p-orb-core:radial-gradient(circle at 40% 35%,rgba(255,250,240,.95),rgba(214,168,98,.55) 55%,rgba(13,86,100,0) 80%);
  --p-stat:linear-gradient(135deg,#0d3340,#13889a);
  --p-feature:linear-gradient(135deg,rgba(255,255,255,.9),rgba(214,168,98,.16));
  --p-field:rgba(255,255,255,.88);--p-field-edge:rgba(13,51,64,.16);
  --p-footer:#0c3d48;--p-footer-ink:#b9cfd1;--p-footer-accent:#e2c08d;
}
#home.hero{--frost:#f5f0e6;--text:#d3e3e3;--dim:#c9dbdb;--faint:#a9c4c5;--cyan:#e2c08d}
.footer{--frost:#f5f0e6;--faint:#b9cfd1;--cyan:#e2c08d;--line:rgba(255,255,255,.12)}
#home.hero::after{display:none}
#home.hero .hero__logo path{fill:#e2c08d}

:root{color-scheme:var(--p-scheme,light)}
html{background:var(--p-bg)}
body::before{background:var(--p-aurora)}
::selection{background:var(--p-select);color:var(--p-select-ink)}

/* navigácia */
.nav{background:var(--p-nav);border-color:var(--g-edge)}
.nav.scrolled{background:var(--p-nav-scrolled)}
.nav .brand,.nav-links a,.nav-burger{color:var(--frost)}
.nav-links a:hover{background:var(--p-hover);color:var(--cyan)}
.nav-links a.lang{border-color:var(--line)}
@media(max-width:880px){.nav-links.open{background:var(--p-menu);border-color:var(--g-edge)}.nav-links.open a{color:var(--frost)}}
body>nav:not(.nav){background:var(--p-nav);border-color:var(--g-edge)}
svg.mark path,.hero__logo path{fill:var(--p-logo)}

/* tlačidlá */
.btn.primary,.hbtn.primary,.of-btn.primary,.submit,a.cta,.pkg.featured .cta,.shot-tab.active,.of-tag,.pkg .badge,.fbadge{
  color:var(--p-btn-ink);background:var(--p-btn);border-color:var(--p-btn-edge);box-shadow:var(--p-btn-shadow)}
.submit:hover{box-shadow:var(--p-btn-shadow)}
.btn.ghost,.hbtn.ghost,.of-btn.ghost,.pkg .cta{color:var(--frost);background:var(--p-ghost);border-color:var(--p-ghost-edge);box-shadow:none}
.btn.ghost:hover,.hbtn.ghost:hover,.of-btn.ghost:hover,.pkg .cta:hover{background:var(--p-ghost-hover)}
.ref-tags span{background:var(--p-ghost);border-color:var(--line);color:var(--dim)}

/* úvod hlavnej stránky */
#home.hero{background:var(--p-hero)}
#home.hero::after{background:linear-gradient(180deg,rgb(var(--p-bg-rgb) / 0),rgb(var(--p-bg-rgb)))}
.hero__shade{background:var(--p-hero-shade)}
.hud-c{border-color:var(--p-hud)}
.hero__ver{color:var(--p-hero-ver)}
.hero__cv{filter:var(--p-canvas-filter,none);mix-blend-mode:var(--p-canvas-blend,normal)}

/* úvod podstránok */
.hf-shade{background:
  linear-gradient(90deg,rgb(var(--p-bg-rgb) / .95) 0%,rgb(var(--p-bg-rgb) / .78) 32%,rgb(var(--p-bg-rgb) / .2) 56%,rgb(var(--p-bg-rgb) / 0) 70%),
  linear-gradient(180deg,rgb(var(--p-bg-rgb) / .55) 0%,rgb(var(--p-bg-rgb) / 0) 26%,rgb(var(--p-bg-rgb) / .85) 100%)}
.herofull>video{filter:var(--p-video-filter)}
.hero-video,.shot-frame,.of-visual{background:var(--p-surface-solid);border-color:var(--g-edge)}
.shot-bar{background:var(--p-ghost);border-bottom-color:var(--line)}
.shot-view{background:rgb(var(--p-bg-rgb))}
.ctaband{background:radial-gradient(90% 160% at 80% 0,var(--p-glow) 0,transparent 55%),var(--g-fill)}
.card .ic{background:var(--p-tint)}

/* služby, proces, čísla */
.svc.open,.svc__head:hover{background:var(--p-hover-soft)}
.svc.open .svc__num,.svc__head:hover .svc__num,.pstep.in .node{background:var(--p-orb);color:var(--p-btn-ink);border-color:var(--cyan);box-shadow:0 8px 22px -10px var(--p-glow)}
.form-success .ok{color:var(--p-btn-ink)}
.svc__num,.pstep .node{background:var(--p-ghost);border-color:var(--line)}
.vc-step .dot{background:var(--p-surface-solid)}
.stat .n{background:var(--p-stat);-webkit-background-clip:text;background-clip:text;color:transparent}
.oasis-feature{background:var(--p-feature);border-color:var(--g-edge);box-shadow:var(--g-shadow),0 0 70px -24px var(--p-glow)}
.big-ring .r1{border-color:var(--p-ring);box-shadow:0 0 80px var(--p-glow),inset 0 0 80px var(--p-glow-soft)}
.big-ring .r2{border-color:var(--p-ring)}
.big-ring .r3{border-color:var(--p-glow)}
.big-ring .core{background:var(--p-orb-core)}
.contact::before{border-color:var(--p-ring);box-shadow:inset 0 0 120px var(--p-glow-soft)}

/* formulár */
.field label{color:var(--frost)}
.field input,.field textarea,.field select{background:var(--p-field);border-color:var(--p-field-edge);color:var(--frost)}
.field select{color-scheme:var(--p-scheme,light)}
.field input::placeholder,.field textarea::placeholder{color:var(--faint)}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--cyan2);box-shadow:0 0 0 4px var(--p-tint)}

/* referencie, pätička */
.ref-shot{background:var(--p-tint)}
.footer{background:var(--p-footer);border-top-color:var(--line);color:var(--p-footer-ink)}
.footer a{color:var(--p-footer-ink)}
.footer .tag{color:var(--p-footer-accent)}
.footer .brand{color:var(--p-footer-head,var(--frost))}
.progress-ring{background:var(--p-ghost)}
.progress-ring .bg{stroke:var(--line)}
.footer svg.mark path{fill:var(--p-footer-accent)}
.services,.process,.stats,.contact,.thesis,.salons,.refs{border-top-color:var(--line)}
section.hero,header.hero:not(#home){border-bottom-color:var(--line)}

/* OasisOne: úvod s videom v tmavom petroleji ako úvod hlavnej stránky */
.herofull{background:radial-gradient(120% 120% at 74% 42%,#1d6f7b 0%,#125461 38%,#0c3d48 72%,#092f38 100%);
  --frost:#f5f0e6;--text:#d3e3e3;--dim:#c9dbdb;--faint:#a9c4c5;--cyan:#e2c08d;border-bottom-color:transparent;color:var(--text)}
.herofull>video{filter:hue-rotate(-25deg) saturate(.85) brightness(1.1);mix-blend-mode:screen}
.herofull .hf-shade{background:
  linear-gradient(90deg,rgba(9,47,56,.92) 0%,rgba(9,47,56,.62) 30%,rgba(9,47,56,.14) 52%,rgba(9,47,56,0) 68%),
  linear-gradient(180deg,rgba(9,47,56,.5) 0%,rgba(9,47,56,0) 28%,rgba(9,47,56,.55) 100%)}
.herofull .sub b{color:#f5f0e6}
.herofull .pill{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#e2c08d;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.herofull .btn.primary{background:linear-gradient(180deg,#eed6aa 0%,#d9b06e 100%);color:#1d1606;border-color:rgba(255,255,255,.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 24px -12px rgba(0,0,0,.45)}
.herofull .btn.ghost{color:#f5f0e6;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28)}
.herofull .btn.ghost:hover{background:rgba(255,255,255,.16)}