/* ============================================================
HOUSE OF DEVI — Homepage dizaina prototips · WebAdapt 2026
Krāsas un fonti: apstiprinātā zīmola grāmata (2026-07-02)
============================================================ */
:root{
color-scheme:light;
--cream:#FCF3E4; --cream-2:#F7EBD5; --cream-3:#FBF1DE;
--ink:#12205B; /* Sandras 26.07: melns nav zimola krasa - navy no logo sparniem */ --ink-soft:#3B3733; --soft:#4A4641; --taupe:#66615E;
--orange:#F15D32; --orange-deep:#D94E27; --gold:#FFD600;
--line:rgba(18,32,91,.13); --line-soft:rgba(18,32,91,.09);
--serif:'Crimson Pro', Georgia, serif;
--sans:'Outfit', -apple-system, sans-serif;
--ease:cubic-bezier(.32,.72,0,1);
--shadow-soft:0 30px 70px -30px rgba(18,32,91,.24);
--shadow-float:0 18px 50px -18px rgba(18,32,91,.30);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{
background:var(--cream); color:var(--ink);
font-family:var(--sans); font-weight:400; font-size:16px; line-height:1.65;
-webkit-font-smoothing:antialiased; overflow-x:clip;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
a,button,input{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:6px}
h1,h2{text-wrap:balance}
.skip{position:absolute;left:-9999px;top:14px;z-index:200;background:var(--ink);color:var(--cream);
padding:10px 18px;border-radius:100px;font-size:13px}
.skip:focus{left:14px}
/* film grain — fixed, pointer-events none */
.grain{position:fixed;inset:0;z-index:80;pointer-events:none;opacity:.05;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
/* ambient orbs */
.orb{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:0}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;position:relative;z-index:1}
section{position:relative}
/* ---------- reveal targets (initial states set by GSAP; visible without JS) ---------- */
.b-photo img.bg{will-change:transform}
.split-mask .line{will-change:transform}
/* ---------- typography ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:9px;
font-size:10.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;
color:var(--orange);border:1px solid rgba(241,93,50,.35);border-radius:100px;
padding:7px 16px;background:rgba(241,93,50,.05)}
.eyebrow::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange)}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.06;letter-spacing:.1px}
h1{font-size:clamp(46px,6vw,80px)}
h2{font-size:clamp(34px,4.2vw,54px)}
.h-it{font-style:italic;color:var(--orange);font-weight:400}
.lede{font-size:clamp(16px,1.5vw,19px);color:var(--taupe);line-height:1.75;font-weight:300}
/* ---------- buttons: pill + nested chip ---------- */
.btn{display:inline-flex;align-items:center;gap:14px;
font-family:var(--sans);font-size:15px;font-weight:500;cursor:pointer;
border-radius:100px;padding:9px 9px 9px 26px;border:1px solid transparent;
transition:transform .5s var(--ease),background .5s var(--ease),border-color .5s var(--ease),box-shadow .5s var(--ease)}
.btn:active{transform:scale(.98)}
.btn .chip{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
font-size:15px;transition:transform .55s var(--ease),background .55s var(--ease),color .55s var(--ease)}
.btn-ink{background:var(--ink);color:var(--cream)}
.btn-ink .chip{background:rgba(255,255,255,.14);color:var(--cream)}
.btn-ghost{border-color:var(--line);color:var(--ink);background:transparent}
.btn-ghost .chip{background:rgba(18,32,91,.07)}
.btn-orange{background:var(--orange);color:#fff}
.btn-orange .chip{background:rgba(255,255,255,.2);color:#fff}
.btn-cream{background:var(--cream);color:var(--ink)}
.btn-cream .chip{background:rgba(18,32,91,.09);color:var(--ink)}
/* ---------- double-bezel shells ---------- */
.shell{background:rgba(18,32,91,.05);border:1px solid var(--line-soft);
border-radius:32px;padding:10px;box-shadow:var(--shadow-soft)}
.core{border-radius:23px;overflow:hidden;position:relative;
box-shadow:inset 0 1px 1px rgba(255,255,255,.45)}
/* ============ NAV — floating glass pill ============ */
nav{position:fixed;top:22px;left:50%;transform:translateX(-50%);z-index:100;
display:flex;align-items:center;gap:6px;
background:rgba(252,243,228,.78);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
border:1px solid var(--line);border-radius:100px;padding:8px 10px 8px 20px;
transition:box-shadow .6s var(--ease),background .6s var(--ease);white-space:nowrap}
nav.scrolled{box-shadow:0 18px 44px -18px rgba(18,32,91,.30);background:rgba(252,243,228,.92)}
nav .brand{display:flex;align-items:center;gap:10px;margin-right:26px}
nav .brand img{width:30px;height:30px;object-fit:contain}
nav .brand span{font-size:12.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
nav .links{display:flex;align-items:center;gap:2px}
nav .links a{font-size:13.5px;font-weight:500;color:var(--ink-soft);padding:8px 13px;border-radius:100px;
transition:background .45s var(--ease),color .45s var(--ease);position:relative}
nav .links a .new{position:absolute;top:4px;right:5px;width:5px;height:5px;border-radius:50%;background:var(--orange)}
nav .lang{font-size:11.5px;font-weight:600;letter-spacing:.08em;color:var(--taupe);padding:0 12px}
nav .lang b{color:var(--ink)}
nav .btn{padding:7px 7px 7px 18px;font-size:13.5px}
nav .btn .chip{width:32px;height:32px;font-size:13px}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:transparent;
cursor:pointer;position:relative;flex:0 0 auto}
.burger i{position:absolute;left:13px;right:13px;height:1.6px;background:var(--ink);border-radius:2px;
transition:transform .55s var(--ease),opacity .4s var(--ease)}
.burger i:nth-child(1){top:17px}.burger i:nth-child(2){top:25px}
.burger.open i:nth-child(1){transform:translateY(4px) rotate(45deg)}
.burger.open i:nth-child(2){transform:translateY(-4px) rotate(-45deg)}
/* mobile overlay menu */
.menu{position:fixed;inset:0;z-index:95;background:rgba(252,243,228,.9);overscroll-behavior:contain;
backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);
display:flex;flex-direction:column;justify-content:center;padding:0 36px;
opacity:0;pointer-events:none;transition:opacity .55s var(--ease)}
.menu.open{opacity:1;pointer-events:auto}
.menu a{font-family:var(--serif);font-size:34px;padding:13px 0;border-bottom:1px solid var(--line-soft);
opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.menu.open a{opacity:1;transform:translateY(0)}
.menu.open a:nth-child(1){transition-delay:.08s}.menu.open a:nth-child(2){transition-delay:.14s}
.menu.open a:nth-child(3){transition-delay:.2s}.menu.open a:nth-child(4){transition-delay:.26s}
.menu.open a:nth-child(5){transition-delay:.32s}.menu.open a:nth-child(6){transition-delay:.38s}
.menu .m-cta{margin-top:28px;border:none;opacity:0;transition-delay:.46s}
.menu.open .m-cta{opacity:1}
/* ============ HERO ============ */
.hero{padding:clamp(150px,17vh,190px) 0 clamp(70px,8vw,110px)}
.hero .grid{display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(40px,5vw,76px);align-items:center}
.hero h1{margin:26px 0 24px}
.hero .cta-row{display:flex;gap:16px;flex-wrap:wrap;margin-top:38px;align-items:center}
.hero .trust{display:flex;gap:26px;margin-top:44px;padding-top:26px;border-top:1px solid var(--line-soft);flex-wrap:wrap}
.hero .trust .t b{display:block;font-family:var(--serif);font-size:21px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.hero .trust .t span{font-size:12px;color:var(--taupe);letter-spacing:.04em}
.hero-visual{position:relative}
.hero-visual .main img{aspect-ratio:4/5.1;object-fit:cover;width:100%}
.hero-visual .badge{position:absolute;top:-26px;right:-18px;width:92px;height:92px;border-radius:50%;
background:var(--cream);border:1px solid var(--line);box-shadow:var(--shadow-float);
display:flex;align-items:center;justify-content:center;z-index:3}
.hero-visual .badge img{width:56px;height:56px;object-fit:contain}
.hero-visual .float{position:absolute;bottom:-34px;left:-44px;width:200px;z-index:3;transform:rotate(-3deg)}
.hero-visual .float .core img{aspect-ratio:1/1.18;object-fit:cover}
.hero-visual .float .cap{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--taupe);
padding:9px 6px 4px;text-align:center}
/* ============ THREE LEVELS ============ */
.levels{padding:clamp(60px,7vw,96px) 0}
.levels .row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.level .core{background:var(--cream-3);padding:30px 28px;display:flex;flex-direction:column;gap:12px}
.level img{width:52px;height:52px;object-fit:contain}
.level h3{font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.level p{font-size:14px;color:var(--taupe);line-height:1.6;font-weight:300}
.level .n{position:absolute;top:22px;right:26px;font-family:var(--serif);font-style:italic;font-size:19px;color:rgba(241,93,50,.5)}
/* ============ ABOUT ============ */
.about{padding:clamp(80px,10vw,150px) 0}
.about .grid{display:grid;grid-template-columns:.94fr 1.06fr;gap:clamp(44px,6vw,90px);align-items:center}
.about .photo{position:relative;transform:rotate(1.6deg)}
.about .photo .core img{aspect-ratio:4/5;object-fit:cover}
.about .photo .q{position:absolute;bottom:-24px;right:-20px;transform:rotate(-2.5deg);
background:var(--ink);color:var(--cream);border-radius:18px;padding:16px 22px;box-shadow:var(--shadow-float);
font-family:var(--serif);font-style:italic;font-size:19px}
.about h2{margin:24px 0 22px}
.about .chips{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 30px}
.about .chips span{font-size:12.5px;font-weight:500;border:1px solid var(--line);border-radius:100px;
padding:8px 16px;color:var(--ink-soft);background:rgba(255,255,255,.35)}
.tlink{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px;color:var(--ink);position:relative}
.tlink::after{content:"";position:absolute;left:0;bottom:-4px;height:1.5px;width:100%;background:var(--orange);
transform:scaleX(.28);transform-origin:left;transition:transform .6s var(--ease)}
.tlink .chip{width:30px;height:30px;border-radius:50%;background:rgba(241,93,50,.12);color:var(--orange);
display:flex;align-items:center;justify-content:center;font-size:13px;transition:transform .55s var(--ease)}
/* ============ BENTO OFFERINGS ============ */
.offer{padding:clamp(80px,10vw,150px) 0}
.offer .head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:46px;flex-wrap:wrap}
.offer .head h2{margin-top:22px;max-width:560px}
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.b-card{position:relative;border-radius:32px}
.b-card .core{height:100%}
.b-a{grid-column:1/8;grid-row:1/3;min-height:640px}
.b-b{grid-column:8/13;grid-row:1/2;min-height:304px}
.b-c{grid-column:8/13;grid-row:2/3;min-height:304px}
.b-photo .core{min-height:100%;display:flex;align-items:flex-end}
.b-photo .core::before{content:"";position:absolute;inset:0;
background:linear-gradient(180deg,rgba(30,30,30,.1) 18%,rgba(30,30,30,.48) 58%,rgba(30,30,30,.85) 100%);z-index:1}
.b-photo img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
transition:transform 1.4s var(--ease)}
.b-photo .txt{position:relative;z-index:2;padding:30px 32px;color:var(--cream);width:100%}
.b-a .txt{padding:38px 40px}
.b-eyebrow{font-size:10px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;opacity:.85}
.b-card h3{font-size:clamp(24px,2.3vw,33px);margin:9px 0 10px}
.b-card p{font-size:14px;line-height:1.6;font-weight:300;opacity:.88;max-width:420px}
.b-card .go{position:absolute;top:22px;right:22px;z-index:3;width:44px;height:44px;border-radius:50%;
background:rgba(252,243,228,.16);backdrop-filter:blur(8px);border:1px solid rgba(252,243,228,.32);
color:var(--cream);display:flex;align-items:center;justify-content:center;font-size:16px;
transition:background .5s var(--ease),transform .5s var(--ease),color .5s var(--ease)}
.b-strip{grid-column:1/13;margin-top:0}
.b-strip .core{background:var(--cream-3);display:flex;align-items:center;gap:26px;padding:24px 32px;flex-wrap:wrap}
.b-strip img.ic{width:46px;height:46px;object-fit:contain}
.b-strip .t{flex:1;min-width:230px}
.b-strip h3{font-size:23px;margin-bottom:3px}
.b-strip p{font-size:13.5px;color:var(--taupe);font-weight:300}
.b-strip .actions{display:flex;gap:12px;flex-wrap:wrap}
/* ============ PROGRAMS ============ */
.programs{padding:clamp(36px,5vw,72px) 0 clamp(80px,10vw,150px)}
.programs .intro{max-width:620px;margin-bottom:52px}
.programs .intro h2{margin:22px 0 18px}
.prow{display:grid;grid-template-columns:86px 1fr auto;gap:26px;align-items:center;
padding:30px 22px;border-top:1px solid var(--line);cursor:pointer;position:relative;
transition:background .6s var(--ease)}
.prow:last-of-type{border-bottom:1px solid var(--line)}
.prow .num{font-family:var(--serif);font-style:italic;font-size:30px;color:var(--orange);opacity:.75}
.prow h3{font-size:clamp(21px,2vw,27px);margin-bottom:6px;transition:transform .6s var(--ease)}
.prow p{font-size:14px;color:var(--taupe);font-weight:300;max-width:560px}
.prow .tag{display:inline-block;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
color:var(--orange);margin-top:9px}
.prow .go{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);
display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--ink);
transition:background .5s var(--ease),color .5s var(--ease),transform .5s var(--ease),border-color .5s var(--ease)}
/* ============ CORPORATE (dark band) ============ */
.corp{padding:clamp(40px,5vw,70px) 0 clamp(80px,10vw,150px)}
.corp .band{background:var(--ink);border-radius:44px;padding:clamp(46px,6vw,84px);
position:relative;overflow:hidden;color:var(--cream)}
.corp .band .orb1{width:480px;height:480px;background:rgba(241,93,50,.28);top:-190px;right:-130px}
.corp .band .orb2{width:380px;height:380px;background:rgba(255,214,0,.14);bottom:-190px;left:-110px}
.corp .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(40px,5vw,80px);position:relative;z-index:1;align-items:center}
.corp .eyebrow{color:var(--gold);border-color:rgba(255,214,0,.4);background:rgba(255,214,0,.07)}
.corp .eyebrow::before{background:var(--gold)}
.corp h2{color:#fff;margin:24px 0 20px}
.corp .lede{color:rgba(252,243,228,.72)}
.corp .stats{display:flex;gap:34px;margin:34px 0 38px;flex-wrap:wrap}
.corp .stats b{display:block;font-family:var(--serif);font-size:34px;font-weight:600;color:var(--gold);font-variant-numeric:tabular-nums}
.corp .stats span{font-size:12px;color:rgba(252,243,228,.62);letter-spacing:.03em}
.corp .note{font-family:var(--serif);font-style:italic;font-size:15.5px;color:rgba(252,243,228,.65);margin-left:20px}
.s-card{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);border-radius:26px;
padding:14px;backdrop-filter:none}
.s-card .in{border-radius:16px;padding:6px 4px}
.s-item{display:flex;align-items:center;gap:16px;padding:15px 14px;border-radius:14px;
transition:background .5s var(--ease)}
.s-item+.s-item{border-top:1px solid rgba(255,255,255,.07)}
.s-item img{width:38px;height:38px;object-fit:contain;filter:brightness(0) invert(1);opacity:.85}
.s-item b{display:block;font-size:14.5px;font-weight:600;color:#fff}
.s-item span{font-size:12px;color:rgba(252,243,228,.55)}
/* ============ CEREMONIES + TESTIMONIAL ============ */
.cere{padding:0 0 clamp(80px,10vw,150px)}
.cere .grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(44px,6vw,90px);align-items:start}
.cere h2{margin:22px 0 18px}
.cere .side p{max-width:420px}
.cere .side .btn{margin-top:30px}
.c-list{display:flex;flex-direction:column;gap:14px}
.c-row{border-radius:26px}
.c-row .core{background:var(--cream-3);display:flex;align-items:center;gap:20px;padding:20px 24px}
.c-row img{width:44px;height:44px;object-fit:contain}
.c-row .t{flex:1}
.c-row h3{font-size:21px;margin-bottom:2px}
.c-row span{font-size:12.5px;color:var(--taupe);font-weight:300}
.c-row .go{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;
justify-content:center;font-size:14px;
transition:background .5s var(--ease),color .5s var(--ease),border-color .5s var(--ease),transform .5s var(--ease)}
.quote{padding:0 0 clamp(80px,10vw,150px);text-align:center}
.quote .mark{font-family:var(--serif);font-size:88px;line-height:.4;color:var(--orange);opacity:.5;display:block;margin-bottom:26px}
.quote blockquote{font-family:var(--serif);font-style:italic;font-weight:400;
font-size:clamp(24px,3vw,36px);line-height:1.35;max-width:820px;margin:0 auto;color:var(--ink-soft)}
.quote .who{margin-top:26px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe)}
.quote .who b{color:var(--orange)}
/* ============ BOOKING CTA ============ */
.book{padding:0 0 clamp(90px,11vw,160px)}
/* .book relies on the PREVIOUS section's bottom padding for its top gap.
When it directly follows a surface with its own background (tinted band, dark
corp band, full-bleed band), that surface ends at a hard edge and the booking
box would press right against it — so restore an explicit top gap. */
section[style*="background"] + .book, section[style*="background"] + .cere,
section[style*="background"] + .quote,
section.tstrip + .book, section.tstrip + .cere,
section.band + .book, section.band + .cere,
section.band + .quote,
section.corp + .book, section.corp + .cere,
section.corp-full + .book, section.corp-full + .cere,
section.corp-full + .quote,
.marquee + .book, .marquee + .cere{padding-top:clamp(60px,7vw,104px)}
/* The tint is one continuous lens, not a block: it fades IN over the top of
the reviews strip, holds through the cards, then fades back OUT down the
booking section into the page cream before the footer. No hard edge at
either end. (Index only — .book is shared by 10 pages.) */
section.tstrip + .book{background:linear-gradient(180deg,
var(--cream-2) 0,
var(--cream-2) 26%,
var(--cream) 92%)}
.book .core{background:var(--cream-2);text-align:center;padding:clamp(54px,7vw,92px) 30px}
.book img.orn{width:min(340px,70%);margin:0 auto 30px}
.book h2{max-width:640px;margin:0 auto 16px}
.book .lede{max-width:520px;margin:0 auto 38px}
.book .row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;align-items:center}
.book .mini{margin-top:34px;display:flex;gap:28px;justify-content:center;flex-wrap:wrap;
font-size:13.5px;color:var(--taupe)}
.book .mini b{color:var(--ink);font-weight:600}
/* ============ FOOTER ============ */
footer{background:var(--ink);color:rgba(252,243,228,.78);border-radius:44px 44px 0 0;
padding:clamp(60px,7vw,90px) 0 34px;position:relative;overflow:hidden}
footer .orbf{width:420px;height:420px;background:rgba(241,93,50,.16);top:-220px;right:8%}
footer .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:clamp(30px,4vw,60px);position:relative;z-index:1}
footer .brand img{width:64px;margin-bottom:18px}
footer .brand p{font-size:13.5px;font-weight:300;line-height:1.7;color:rgba(252,243,228,.6);max-width:300px}
footer h4{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
color:var(--gold);margin-bottom:20px}
footer .ln{display:flex;flex-direction:column;gap:11px;font-size:14px}
footer .ln a{color:rgba(252,243,228,.75);transition:color .4s var(--ease),transform .4s var(--ease)}
footer .socials{display:flex;gap:10px;margin-top:22px}
footer .socials a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.18);
display:flex;align-items:center;justify-content:center;font-size:14px;
transition:background .5s var(--ease),border-color .5s var(--ease),transform .5s var(--ease)}
.newsl{display:flex;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
border-radius:100px;padding:5px;margin-top:6px}
.newsl input{flex:1;background:none;border:none;outline:none;color:#fff;font-family:var(--sans);
font-size:13.5px;padding:0 16px;min-width:0;border-radius:100px}
.newsl input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.newsl input::placeholder{color:rgba(252,243,228,.45)}
.newsl button{border:none;cursor:pointer;background:var(--orange);color:#fff;border-radius:100px;
font-family:var(--sans);font-weight:600;font-size:13px;padding:10px 20px;
transition:background .45s var(--ease)}
footer .base{margin-top:clamp(44px,5vw,64px);padding-top:26px;border-top:1px solid rgba(255,255,255,.1);
display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
font-size:12px;color:rgba(252,243,228,.45);position:relative;z-index:1}
/* ============ RESPONSIVE ============ */
@media(max-width:1020px){
nav .links a{padding:8px 9px;font-size:13px}
.hero .grid,.about .grid,.cere .grid{grid-template-columns:1fr;gap:52px}
.hero-visual{max-width:520px}
.corp .grid{grid-template-columns:1fr;gap:44px}
.b-a{grid-column:1/13;grid-row:auto;min-height:420px}
.b-b,.b-c{grid-column:1/13;grid-row:auto;min-height:340px}
}
@media(max-width:768px){
.wrap{padding:0 20px}
nav{top:14px;left:20px;right:20px;transform:none;justify-content:space-between;padding:7px 8px 7px 16px}
nav .links,nav .lang,nav .btn{display:none}
.burger{display:block}
.hero{padding-top:120px}
.hero .trust{gap:18px}
.hero-visual .float{left:-6px;bottom:-26px;width:150px}
.hero-visual .float .cap{display:none}
.hero-visual .badge{width:72px;height:72px;top:-16px;right:-6px}
.hero-visual .badge img{width:44px;height:44px}
.levels .row{grid-template-columns:1fr;gap:14px}
.about .photo{transform:none}
.about .photo .q{right:6px;bottom:-18px;font-size:16px}
.offer .head{margin-bottom:30px}
.b-a,.b-b,.b-c{min-height:320px}
.b-a .txt{padding:26px 24px}
.prow{grid-template-columns:1fr;gap:10px;padding:24px 6px}
.prow .num{font-size:22px}
.prow .go{display:none}
.corp .band{border-radius:32px}
.corp .note{margin-left:0;display:block;margin-top:14px}
.b-strip .core{padding:22px 20px}
footer .cols{grid-template-columns:1fr;gap:36px}
footer{border-radius:28px 28px 0 0}
}
/* ============ INNER PAGES — component library ============ */
.page-hero{padding:clamp(140px,16vh,178px) 0 clamp(44px,6vw,70px);position:relative}
.page-hero .crumb{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--taupe)}
.page-hero .crumb a{color:var(--orange)}
.page-hero h1{font-size:clamp(40px,5vw,64px);max-width:840px;margin:20px 0 18px}
.page-hero .lede{max-width:660px}
.page-hero .meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.page-hero .meta span{font-size:12.5px;font-weight:500;border:1px solid var(--line);border-radius:100px;
padding:8px 16px;color:var(--ink-soft);background:rgba(255,255,255,.35)}
.page-hero .rule{height:1px;background:var(--line);margin-top:clamp(40px,5vw,64px)}
.section{padding:clamp(56px,7vw,104px) 0}
.section.tight{padding:clamp(36px,4vw,64px) 0}
.section-head{margin-bottom:clamp(30px,4vw,50px);max-width:720px}
.section-head h2{margin-top:20px}
.section-head .lede{margin-top:14px}
.prose{max-width:760px;font-size:15.5px;line-height:1.8;color:var(--soft);font-weight:300}
.prose h2{font-size:clamp(28px,3vw,38px);margin:1.6em 0 .6em;color:var(--ink)}
.prose h3{font-family:var(--serif);font-weight:500;font-size:22px;margin:1.4em 0 .5em;color:var(--ink)}
.prose p{margin:.9em 0}
.prose ul{margin:.9em 0;padding-left:0;list-style:none}
.prose li{padding-left:26px;position:relative;margin:.55em 0}
.prose li::before{content:"";position:absolute;left:4px;top:.62em;width:7px;height:7px;border-radius:50%;
background:var(--orange);opacity:.75}
.prose b,.prose strong{color:var(--ink);font-weight:600}
.media-split{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(40px,5vw,80px);align-items:center}
.media-split.flip{grid-template-columns:1.05fr .95fr}
.media-split .m-img .core img{aspect-ratio:4/4.6;object-fit:cover;width:100%}
.media-split h2{margin:20px 0 16px}
.media-split + .media-split{margin-top:clamp(56px,7vw,96px)}
.cards-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.icard .core{background:var(--cream-3);padding:28px 26px;height:100%;display:flex;flex-direction:column;gap:11px}
.icard img{width:48px;height:48px;object-fit:contain}
/* photo-led icard: full-width banner, consistent ratio (never a squashed letterbox) */
.icard img.ci-photo{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:14px;margin-bottom:2px}
.icard h3{font-size:21px}
.icard p{font-size:13.5px;line-height:1.65;color:var(--taupe);font-weight:300}
.icard .from{margin-top:auto;padding-top:12px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);font-weight:600}
.pcard .core{background:var(--cream-3);height:100%;display:flex;flex-direction:column}
.pcard .core>img{aspect-ratio:4/2.9;object-fit:cover;width:100%}
.pcard .pc-body{padding:22px 24px 24px;display:flex;flex-direction:column;gap:9px;flex:1}
.pcard h3{font-size:22px}
.pcard p{font-size:13.5px;line-height:1.62;color:var(--taupe);font-weight:300}
.pcard .pc-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:10px}
.pcard .pc-meta span{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
color:var(--orange);background:rgba(241,93,50,.08);border-radius:100px;padding:5px 12px}
.price-card .core{background:var(--cream-3);padding:30px 28px;height:100%;display:flex;flex-direction:column;gap:8px}
.price-card .p-label{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--taupe)}
.price-card .p-amount{font-family:var(--serif);font-size:44px;font-weight:600;color:var(--ink);line-height:1.1}
.price-card .p-amount small{font-size:17px;color:var(--taupe);font-weight:400}
.price-card ul{list-style:none;margin:12px 0 18px}
.price-card li{font-size:13.5px;color:var(--soft);font-weight:300;padding:7px 0 7px 24px;position:relative;border-top:1px solid var(--line-soft)}
.price-card li::before{content:"✓";position:absolute;left:2px;color:var(--orange)}
.price-card .btn{margin-top:auto;align-self:flex-start}
.faq details{border-top:1px solid var(--line);padding:4px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;
gap:20px;padding:19px 4px;font-family:var(--serif);font-size:20px;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--sans);font-size:22px;color:var(--orange);
transition:transform .45s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .faq-a{padding:0 4px 20px;font-size:14.5px;line-height:1.75;color:var(--soft);font-weight:300;max-width:700px}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gallery .core img{aspect-ratio:1/1.05;object-fit:cover;width:100%}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(36px,5vw,70px);align-items:start}
.c-info{display:flex;flex-direction:column;gap:6px}
.c-info .ci-row{display:flex;gap:16px;padding:18px 4px;border-top:1px solid var(--line-soft);align-items:baseline}
.c-info .ci-row:last-child{border-bottom:1px solid var(--line-soft)}
.c-info .k{flex:0 0 110px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--taupe)}
.c-info .v{font-size:15.5px;color:var(--ink)}
.c-info .v a{color:var(--orange)}
.form{display:flex;flex-direction:column;gap:14px}
.form label{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--taupe)}
.form input,.form textarea,.form select{font-family:var(--sans);font-size:15px;color:var(--ink);
background:rgba(255,255,255,.55);border:1px solid var(--line);border-radius:14px;padding:14px 18px;width:100%}
.form textarea{min-height:130px;resize:vertical}
.form input:focus,.form textarea:focus{outline:2px solid var(--orange);outline-offset:2px}
.map-embed .core{aspect-ratio:16/10;background:var(--cream-2)}
.map-embed iframe{width:100%;height:100%;border:0;display:block}
@media(max-width:1020px){
.media-split,.media-split.flip{grid-template-columns:1fr;gap:40px}
.cards-3{grid-template-columns:repeat(2,1fr)}
.contact-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
.cards-2,.cards-3{grid-template-columns:1fr}
.gallery{grid-template-columns:repeat(2,1fr)}
.page-hero{padding-top:120px}
}
/* ============ V2 — IMAGE-FIRST SYSTEM ============ */
/* full-bleed photo page hero */
.img-hero{position:relative;min-height:clamp(480px,68vh,730px);display:flex;align-items:flex-end;overflow:hidden}
.img-hero .bgw{position:absolute;inset:0;overflow:hidden}
.img-hero .bgw img{width:100%;height:100%;object-fit:cover;transform:scale(1.12)}
.img-hero::after{content:"";position:absolute;inset:0;
background:linear-gradient(180deg,rgba(30,30,30,.30) 0%,rgba(30,30,30,.08) 42%,rgba(30,30,30,.68) 100%)}
.img-hero .wrap{position:relative;z-index:2;padding-bottom:clamp(38px,5vw,66px);color:var(--cream);width:100%}
.img-hero .crumb{color:rgba(252,243,228,.85)}
.img-hero .crumb a{color:var(--gold)}
.img-hero h1{color:#fff;font-size:clamp(42px,5.4vw,74px);max-width:920px;margin:16px 0 14px;text-shadow:0 2px 30px rgba(0,0,0,.3)}
.img-hero .lede{color:rgba(252,243,228,.93);max-width:660px;text-shadow:0 1px 16px rgba(0,0,0,.25)}
.img-hero .meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.img-hero .meta span{font-size:12.5px;font-weight:500;border:1px solid rgba(252,243,228,.4);border-radius:100px;
padding:8px 16px;color:var(--cream);background:rgba(30,30,30,.35)}
/* full-bleed breather band */
section.band{position:relative;height:clamp(320px,56vh,560px);overflow:hidden;display:flex;align-items:center;justify-content:center}
section.band img.bg{position:absolute;left:0;right:0;top:-6%;width:100%;height:112%;object-fit:cover;will-change:transform}
section.band::after{content:"";position:absolute;inset:0;background:rgba(30,30,30,.34)}
section.band .line{position:relative;z-index:2;font-family:var(--serif);font-style:italic;
font-size:clamp(25px,3.6vw,46px);color:#fff;text-align:center;padding:0 26px;max-width:900px;
text-shadow:0 2px 26px rgba(0,0,0,.4)}
section.band .line em{font-style:normal;color:var(--gold)}
/* breakout split — image escapes container to viewport edge */
.breakout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,4.5vw,72px);align-items:center}
.breakout .bo-img{position:relative;height:clamp(430px,60vh,650px);overflow:hidden}
.breakout .bo-img img{width:100%;height:100%;object-fit:cover}
.breakout.right .bo-img{border-radius:28px 0 0 28px;margin-right:calc(50% - 50vw)}
.breakout.left .bo-img{border-radius:0 28px 28px 0;margin-left:calc(50% - 50vw);order:-1}
.breakout h2{margin:20px 0 16px}
/* marquee divider */
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0}
.marquee .mq{display:flex;width:max-content;animation:mq 30s linear infinite}
.marquee .mq>span{font-family:var(--serif);font-style:italic;font-size:clamp(20px,2.4vw,30px);
color:var(--ink);white-space:nowrap;display:flex;align-items:center;gap:52px;padding-right:52px}
.marquee .mq em{font-style:normal;color:var(--orange);font-size:.55em;transform:translateY(-2px)}
@keyframes mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee .mq{animation:none}}
/* horizontal photo strip (scrub-driven on desktop) */
.hstrip-sec{overflow:hidden;padding:clamp(48px,6vw,84px) 0}
.hstrip{display:flex;gap:16px;width:max-content;padding:0 max(32px,calc(50vw - 590px))}
.hstrip .shell{flex:0 0 auto;width:clamp(250px,27vw,390px);padding:8px}
.hstrip img{aspect-ratio:3/4;object-fit:cover;width:100%;border-radius:18px}
/* dark editorial quote */
.quote.dark .qcore{background:var(--ink);border-radius:44px;padding:clamp(52px,7vw,90px) 30px;position:relative;overflow:hidden}
.quote.dark blockquote{color:rgba(252,243,228,.94)}
.quote.dark .mark{color:var(--gold);opacity:.85}
.quote.dark .who{color:rgba(252,243,228,.55)}
.quote.dark .who b{color:var(--gold)}
/* orange booking finale */
.book.orange .core{background:var(--orange)}
.book.orange h2{color:#fff}
.book.orange .h-it{color:var(--gold)}
.book.orange .lede{color:rgba(255,255,255,.9)}
.book.orange .mini{color:rgba(255,255,255,.85)}
.book.orange .mini b{color:#fff}
/* photo thumbs in list rows */
.c-row .thumb{width:64px;height:64px;border-radius:14px;object-fit:cover;flex:0 0 auto}
/* ghost section numbers */
.ghostn{position:absolute;top:-24px;right:0;font-family:var(--serif);font-style:italic;line-height:1;
font-size:clamp(110px,15vw,210px);color:transparent;-webkit-text-stroke:1.2px rgba(241,93,50,.22);
pointer-events:none;z-index:0;user-select:none}
/* richer card hovers */
.b-photo .core::after{content:"";position:absolute;inset:0;background:rgba(241,93,50,0);
transition:background .7s var(--ease);z-index:1;pointer-events:none}
.pcard .core>img{transition:transform 1.2s var(--ease)}
/* larger gallery variant */
.gallery.xl{grid-template-columns:repeat(2,1fr);gap:16px}
.gallery.xl .core img{aspect-ratio:4/3}
@media(max-width:1020px){
.breakout{grid-template-columns:1fr;gap:36px}
.breakout.right .bo-img,.breakout.left .bo-img{margin:0 calc(50% - 50vw);border-radius:0;height:clamp(320px,46vh,460px);order:-1}
}
@media(max-width:768px){
.img-hero{min-height:440px}
section.band{height:320px}
.hstrip-sec{overflow-x:auto;-webkit-overflow-scrolling:touch}
.hstrip{padding:0 20px}
.quote.dark .qcore{border-radius:28px}
}
/* homepage hero: breakout photo to right viewport edge */
.hero-visual .main{margin-right:calc(50% - 50vw)}
.hero-visual .main .core{border-radius:28px 0 0 28px}
.hero-visual .main img{aspect-ratio:4/4.55}
.hero-visual .badge{right:18px}
@media(max-width:1020px){.hero-visual .main{margin-right:0}.hero-visual .main .core{border-radius:23px}}
/* odd-count xl gallery: last tile spans full row (no empty cell) */
.gallery.xl>*:last-child:nth-child(odd){grid-column:1/-1}
.gallery.xl>*:last-child:nth-child(odd) .core img{aspect-ratio:16/7}
/* ============ V3 — POLISH SYSTEM ============ */
/* bigger display type */
.hero h1{font-size:clamp(48px,6.4vw,88px)}
.img-hero h1{font-size:clamp(42px,5.8vw,80px)}
/* ghost watermark words (desktop only) */
.ghostw{position:absolute;right:-10px;top:-58px;font-family:var(--serif);font-style:italic;line-height:1;
font-size:clamp(120px,14vw,200px);color:transparent;-webkit-text-stroke:1.2px rgba(241,93,50,.13);
pointer-events:none;user-select:none;z-index:0;white-space:nowrap}
.section .wrap{position:relative}
@media(max-width:1020px){.ghostw{display:none}}
/* ambient canvas holders */
.amb{position:absolute;pointer-events:none;z-index:1}
.amb-hero-right{top:0;right:-4%;width:56%;height:100%}
.amb-fill{inset:0;width:100%;height:100%}
.img-hero .wrap{z-index:3}
@media(max-width:768px){.amb-hero-right{right:-20%;width:100%;opacity:.55}}
/* video hero */
.video-hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* mobile sticky action bar */
.sticky-bar{display:none}
@media(max-width:768px){
.sticky-bar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:90;
padding:10px 14px calc(10px + env(safe-area-inset-bottom));
background:rgba(252,243,228,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
border-top:1px solid var(--line);transform:translateY(0);transition:transform .5s var(--ease)}
.sticky-bar.hide{transform:translateY(110%)}
.sticky-bar .btn{flex:1;justify-content:center;padding:11px 12px}
.sticky-bar .btn .chip{display:none}
.sticky-bar .btn-ghost{flex:0 0 34%}
body{padding-bottom:76px}
}
/* sticky subnav anchor chips */
.subnav{position:sticky;top:84px;z-index:60;margin:-26px 0 8px}
.subnav .row{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
background:rgba(252,243,228,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
border:1px solid var(--line);border-radius:100px;padding:7px;width:max-content;max-width:100%}
.subnav .row::-webkit-scrollbar{display:none}
.subnav a{flex:0 0 auto;font-size:12.5px;font-weight:600;letter-spacing:.04em;color:var(--ink-soft);
padding:8px 16px;border-radius:100px;white-space:nowrap;transition:background .4s var(--ease),color .4s var(--ease)}.subnav a.on{background:var(--ink);color:var(--cream)}
@media(max-width:768px){.subnav{top:72px}}
/* schedule table */
.sched{border-top:1px solid var(--line)}
.sched .srow{display:grid;grid-template-columns:120px 150px 1fr auto auto;gap:18px;align-items:center;
padding:20px 10px;border-bottom:1px solid var(--line);transition:background .5s var(--ease)}
.sched .day{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--orange)}
.sched .time{font-family:var(--serif);font-size:24px;color:var(--ink);font-variant-numeric:tabular-nums}
.sched .what b{display:block;font-size:15.5px;font-weight:600;color:var(--ink)}
.sched .what span{font-size:12.5px;color:var(--taupe);font-weight:300}
.sched .who{font-size:12.5px;color:var(--taupe)}
@media(max-width:768px){
.sched .srow{grid-template-columns:1fr auto;grid-template-areas:"day day" "time cta" "what what";row-gap:6px}
.sched .day{grid-area:day}.sched .time{grid-area:time;font-size:28px}
.sched .what{grid-area:what}.sched .who{display:none}.sched .btn{grid-area:cta}
}
/* quick-booking strip (home) */
.qbook{background:var(--cream-2);border-block:1px solid var(--line);padding:26px 0}
.qbook .row{display:flex;gap:14px;align-items:stretch;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.qbook .row::-webkit-scrollbar{display:none}
.qbook .qlabel{flex:0 0 auto;display:flex;flex-direction:column;justify-content:center;padding-right:16px;border-right:1px solid var(--line)}
.qbook .qlabel b{font-family:var(--serif);font-size:20px;color:var(--ink)}
.qbook .qlabel span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);font-weight:700}
.qbook .qi{flex:0 0 auto;scroll-snap-align:start;display:flex;align-items:center;gap:16px;
background:var(--cream);border:1px solid var(--line);border-radius:18px;padding:12px 16px}
.qbook .qt{font-family:var(--serif);font-size:23px;color:var(--ink);font-variant-numeric:tabular-nums}
.qbook .qd b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.qbook .qd span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--taupe)}
.qbook .btn{padding:7px 7px 7px 16px;font-size:13px}
.qbook .btn .chip{width:30px;height:30px;font-size:12px}
/* dark bento tile (Uzņēmumiem) */
.b-dark .core{background:var(--ink);display:flex;align-items:center;gap:18px;padding:24px 28px;height:100%}
.b-dark h3{color:#fff;font-size:22px}
.b-dark p{color:rgba(252,243,228,.6);font-size:13px;font-weight:300}
.b-dark .go2{margin-left:auto;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,214,0,.5);
color:var(--gold);display:flex;align-items:center;justify-content:center;flex:0 0 auto;
transition:background .5s var(--ease),color .5s var(--ease),transform .5s var(--ease)}
/* program row thumbnails */
.prow .pthumb{width:86px;height:64px;border-radius:14px;object-fit:cover}
.prow.has-thumb{grid-template-columns:86px 86px 1fr auto}
@media(max-width:768px){.prow.has-thumb{grid-template-columns:1fr auto}.prow .pthumb{width:100%;height:120px;grid-column:1/-1}}
/* tilt + sheen */
.tilt{transform-style:preserve-3d;will-change:transform}
.btn-orange{position:relative;overflow:hidden}
.btn-orange::before{content:"";position:absolute;top:0;bottom:0;left:-70%;width:50%;
background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);
transform:skewX(-20deg);transition:left .8s var(--ease)}
/* footer serif line */
.f-line{font-family:var(--serif);font-style:italic;font-size:clamp(30px,4vw,52px);color:rgba(252,243,228,.92);
margin-bottom:clamp(34px,4vw,54px)}
.f-line em{font-style:italic;color:var(--gold)}
/* hero trust glass strip (home) */
.hero-trustglass{position:absolute;left:0;right:0;bottom:0;z-index:3;border-top:1px solid rgba(252,243,228,.22);
background:linear-gradient(180deg,rgba(30,30,30,0),rgba(30,30,30,.42))}
.hero-trustglass .wrap{display:flex;gap:clamp(20px,4vw,60px);padding-top:18px;padding-bottom:20px;overflow-x:auto;scrollbar-width:none}
.hero-trustglass .t{flex:0 0 auto}
.hero-trustglass b{display:block;font-family:var(--serif);font-size:22px;color:#fff;font-variant-numeric:tabular-nums}
.hero-trustglass span{font-size:11.5px;color:rgba(252,243,228,.75);letter-spacing:.04em}
/* img-hero: top clearance so long content never slides under the floating nav */
.img-hero .wrap{padding-top:clamp(118px,15vh,150px)}
/* informational numbered rows: no fake click affordance */
div.prow{cursor:default}
/* anchor jumps clear the floating nav */
section[id],div[id^="ytt"],#laimavoti,#pieteikties,#grafiks,#veidi,#padzilinatas,#buj{scroll-margin-top:118px}
/* ============ NAV DROPDOWN (Programmas) ============ */
.has-sub{position:relative;display:inline-flex}
.nav-sub{position:absolute;top:calc(100% + 12px);left:0;min-width:264px;z-index:110;
background:rgba(252,243,228,.97);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
border:1px solid var(--line);border-radius:22px;padding:8px;
box-shadow:0 26px 60px -22px rgba(18,32,91,.34);
opacity:0;transform:translateY(-6px);pointer-events:none;
transition:opacity .35s var(--ease) .16s,transform .35s var(--ease) .16s}
/* invisible bridge across the gap so the pointer never leaves the hover zone */
.nav-sub::before{content:"";position:absolute;top:-16px;left:-10px;right:-10px;height:18px}
.has-sub::after{content:"";position:absolute;top:100%;left:0;width:100%;height:14px}.has-sub:focus-within .nav-sub{opacity:1;transform:translateY(0);pointer-events:auto;transition-delay:0s}
.nav-sub .ns-note{font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
color:var(--taupe);padding:9px 14px 5px}
.nav-sub a{display:block;font-size:13.5px;font-weight:500;color:var(--ink-soft);
padding:10px 14px;border-radius:14px;white-space:nowrap;
transition:background .35s var(--ease),color .35s var(--ease)}
.nav-sub a em{font-style:normal;color:var(--orange);font-size:10px;font-weight:700;
letter-spacing:.08em;text-transform:uppercase;margin-left:6px}
.has-sub>a .caret{font-size:8.5px;opacity:.55;margin-left:2px}
/* mobile submenu inside overlay */
.menu .msub{display:flex;flex-direction:column;padding:4px 0 10px 22px;border-bottom:1px solid var(--line-soft)}
.menu .msub a{font-family:var(--sans);font-size:15.5px;padding:9px 0;border-bottom:0}
.menu.open .msub a{opacity:1;transform:none;transition-delay:.3s}
/* phone-framed vertical video feature */
.vsplit{display:grid;grid-template-columns:1fr minmax(300px,380px);gap:clamp(40px,5vw,80px);align-items:center}
.vphone{background:var(--ink);border-radius:36px;padding:12px;box-shadow:var(--shadow-soft)}
.vphone video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:26px;background:#000}
.vphone .vcap{text-align:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
color:rgba(252,243,228,.6);padding:10px 4px 4px}
@media(max-width:1020px){.vsplit{grid-template-columns:1fr}.vphone{max-width:340px;margin:0 auto}}
/* video strip — uniform portrait clips, click to play */
/* .vgrid — when a strip holds more tiles than fit on one desktop row, wrap it into a
grid so nothing is clipped. Below 1021px it reverts to the swipeable strip. */
@media(min-width:1021px){
.vstrip.vgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px 18px;
overflow:visible;scroll-snap-type:none;padding:4px 0 8px}
.vstrip.vgrid .vitem{flex:none!important;width:auto}
}
.vstrip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
padding:4px 2px 16px;scrollbar-width:none}
.vstrip::-webkit-scrollbar{display:none}
.vstrip .vitem{flex:0 0 clamp(190px,20vw,240px);scroll-snap-align:start;position:relative}
.vstrip .vitem video{width:100%;aspect-ratio:9/14;object-fit:cover;border-radius:20px;
background:var(--ink);display:block;cursor:pointer}
.vstrip .vcap2{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--taupe);
padding:9px 4px 0;text-align:center}
@media(max-width:768px){.vstrip .vitem{flex:0 0 66vw}}
/* fallback ![]()
inside a phone frame (reduced-motion / save-data / static) */
.vphone img{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:26px;background:#000}
/* ============ CONTRAST GUARDS (WCAG) ============ */
/* GOLD: verified — every --gold usage sits on a dark surface (img-hero scrim / .corp
ink band) where it scores 11.8:1. Keep it off light surfaces; no override needed.
ORANGE: brand #F15D32 is 3.0:1 on cream — fine for LARGE display text (>=24px),
but fails AA for small text and for white-on-orange buttons (3.31:1).
--orange-ax is the accessible sibling used ONLY for small text + solid buttons. */
:root{ --orange-ax:#C4441F; } /* 4.55:1 on cream · 5.01:1 vs white */
.eyebrow{ color:var(--orange-ax); border-color:rgba(196,68,31,.35) }
.eyebrow::before{ background:var(--orange-ax) }.prow .tag,.pcard .pc-meta span,.sess .s-meta span,.vstrip .vcap2,.sched .day,.qbook .qlabel span{ color:var(--orange-ax) }
.btn-orange{ background:var(--orange-ax) }
.book.orange .core{ background:var(--orange-ax) }
/* touch targets: >=44px on coarse pointers */
@media (pointer:coarse){
nav .links a{padding:12px 14px}
.nav-sub a{padding:12px 14px}
footer .ln a{padding:6px 0;display:inline-block}
}
/* footer column headings (were h4 → now h2 for hierarchy; visual unchanged) */
footer h2.f-h{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.22em;
text-transform:uppercase;color:var(--gold);margin-bottom:20px;line-height:1.2}
/* ══════════════════════════════════════════════════════════════════════════
POLISH PASS — 2026-07-18
Appended deliberately: every rule here is meant to win over the base system.
Grouped by proposal item number.
══════════════════════════════════════════════════════════════════════════ */
/* ── 2.1 easing vocabulary ──────────────────────────────────────────────
--ease (.32,.72,0,1) already existed and stays for panels/drawers.
These two add purpose: entrances/press vs on-screen movement. */
:root{
--ease-out:cubic-bezier(.23,1,.32,1);
--ease-io:cubic-bezier(.77,0,.175,1);
--breath:14s; /* 2.3 house tempo: 4s in · 4s hold · 6s out */
}
/* ── 1.1 band lines legible on bright photos ───────────────────────────
Localized radial scrim behind the centered line; photo stays visible. */
section.band::after{
background:
radial-gradient(58% 78% at 50% 50%,rgba(24,16,9,.66),rgba(24,16,9,.34) 54%,rgba(24,16,9,0) 78%),
rgba(30,30,30,.26)}
section.band .line{text-shadow:0 1px 3px rgba(0,0,0,.55),0 2px 30px rgba(0,0,0,.42)}
/* ── 1.2 mobile hero scrim (text block sits higher at 390px) ─────────── */
@media (max-width:768px){
.img-hero::after{background:linear-gradient(180deg,
rgba(30,30,30,.52) 0%,rgba(30,30,30,.34) 24%,
rgba(30,30,30,.50) 56%,rgba(30,30,30,.82) 100%)}
.img-hero h1,.img-hero .lede{text-shadow:0 2px 16px rgba(0,0,0,.45)}
}
/* ── 1.3 breadcrumb reads on photography ──────────────────────────────── */
.img-hero .crumb{display:inline-flex;align-items:center;gap:7px;
background:rgba(22,15,9,.44);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
border:1px solid rgba(252,243,228,.20);border-radius:99px;padding:5px 14px;
color:rgba(252,243,228,.94)}
.img-hero .crumb a{color:#fff}
/* ── 1.5 hero stats on small phones ───────────────────────────────────
The strip is absolutely pinned to the hero's bottom edge, so simply
wrapping it to two rows made it grow upward and collide with the CTAs.
On mobile it therefore leaves the absolute layer and flows below the
hero copy instead — no overlap possible at any content length. */
@media (max-width:560px){
/* every rule is scoped to :has() so a browser without it simply keeps the
original absolute layout instead of inheriting a half-applied one */
.img-hero:has(.hero-trustglass){flex-direction:column;justify-content:flex-end}
.img-hero:has(.hero-trustglass) .hero-trustglass{position:static;width:100%;
background:linear-gradient(180deg,rgba(30,30,30,.30),rgba(30,30,30,.62))}
.img-hero:has(.hero-trustglass) .hero-trustglass .wrap{display:grid;
grid-template-columns:1fr 1fr;gap:13px 16px;overflow:visible;
padding-top:16px;padding-bottom:18px}
.img-hero:has(.hero-trustglass) .hero-trustglass .t{flex:none}
.img-hero:has(.hero-trustglass) .hero-trustglass b{font-size:19px}
.img-hero:has(.hero-trustglass) .hero-trustglass span{font-size:11px;line-height:1.45}
}
/* ── 1.6 small bento tiles: deepen scrim (bright gong photo) ──────────── */
.b-b .core::before,.b-c .core::before{
background:linear-gradient(180deg,rgba(30,30,30,.30) 0%,rgba(30,30,30,.16) 30%,
rgba(30,30,30,.58) 64%,rgba(30,30,30,.88) 100%)}/* ── 1.7 carousel dots: 24px touch targets (WCAG 2.2) ─────────────────── */
/* ── 1.8 map tuned to the cream palette ───────────────────────────────── */
.map-embed iframe{filter:sepia(.22) saturate(.78) hue-rotate(-8deg) contrast(1.03) brightness(1.02)}
/* ── 2.2 press feedback — the UI confirms it heard you ────────────────── */
.btn{transition:transform .16s var(--ease-out),background .45s var(--ease),
border-color .45s var(--ease),box-shadow .45s var(--ease)}
.btn:active{transform:scale(.968)}
.shell:active,.qi .btn:active{transform:scale(.99)}
.sched .btn:active,.m-cta .btn:active,.sticky-bar .btn:active{transform:scale(.968)}
/* ── 2.3 the breathing motif, systematised ────────────────────────────
Applied only where GSAP does NOT own the transform (band images are
scrub-parallaxed, so they are deliberately left alone). */
@keyframes hod-breath-halo{
0% {box-shadow:0 0 0 0 rgba(252,243,228,0)}
28.5%{box-shadow:0 0 46px 4px rgba(252,243,228,.26)}
57.1%{box-shadow:0 0 46px 4px rgba(252,243,228,.26)}
100%{box-shadow:0 0 0 0 rgba(252,243,228,0)}
}
@keyframes hod-breath-dot{
0%{transform:scale(1);opacity:.75}
28.5%{transform:scale(1.5);opacity:1}
57.1%{transform:scale(1.5);opacity:1}
100%{transform:scale(1);opacity:.75}
}
@keyframes hod-breath-glow{
0%{opacity:.34}28.5%{opacity:.62}57.1%{opacity:.62}100%{opacity:.34}
}
.book.orange .core .btn-ink{animation:hod-breath-halo var(--breath) cubic-bezier(.45,0,.55,1) infinite}
.eyebrow::before{animation:hod-breath-dot var(--breath) cubic-bezier(.45,0,.55,1) infinite}
footer .orbf{animation:hod-breath-glow var(--breath) cubic-bezier(.45,0,.55,1) infinite}
/* ── 2.5 soft cross-document page transitions (progressive enhancement) ─ */
/* @view-transition noņemts 29.07 — Barba pārņem navigāciju un abi cīnītos */
@keyframes hod-vt-out{to{opacity:0}}
@keyframes hod-vt-in{from{opacity:0}}
/* view-transition-name vairs nav vajadzīgs: nav ir ārpus Barba konteinera un nemaz netiek nomainīts */
/* ── 2.6 video facade — editorial poster instead of browser chrome ────── */
.vfacade{position:relative;display:block;width:100%;cursor:pointer;border:0;padding:0;
background:none;overflow:hidden;border-radius:inherit;line-height:0}
.vfacade img{width:100%;height:100%;object-fit:cover;display:block}
.vfacade::after{content:"";position:absolute;inset:0;
background:linear-gradient(180deg,rgba(20,14,8,.05) 40%,rgba(20,14,8,.55) 100%);
transition:opacity .5s var(--ease-out)}
.vfacade .vplay{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:2;
width:62px;height:62px;border-radius:50%;display:grid;place-items:center;
background:rgba(252,243,228,.92);color:var(--ink);
box-shadow:0 10px 34px rgba(20,14,8,.34);
transition:transform .3s var(--ease-out),background .3s var(--ease-out)}
.vfacade .vplay svg{width:20px;height:20px;margin-left:3px}
.vfacade .vdur{position:absolute;right:12px;bottom:11px;z-index:2;
font-family:var(--serif);font-style:italic;font-size:13px;color:var(--cream);
text-shadow:0 1px 6px rgba(0,0,0,.6)}
.vfacade:active .vplay{transform:scale(.94)}
.vloop{cursor:pointer}
/* ── 3.2 typographic finesse ──────────────────────────────────────────── */
::selection{background:var(--orange-ax);color:#fff}
h1,h2,h3,section.band .line{text-wrap:balance}
p,.lede{text-wrap:pretty}
.sched .time,.p-amount,.hero-trustglass b,.qt,.stat b,.cstat b,.price-card li{
font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--orange-ax);outline-offset:3px;border-radius:10px}.img-hero :focus-visible,footer :focus-visible,.b-dark :focus-visible,.corp :focus-visible{outline-color:var(--gold)}
/* ── 3.3 today's class highlighted in the schedule ────────────────────── */
.sched .srow.is-today{background:linear-gradient(90deg,rgba(196,68,31,.07),rgba(196,68,31,0) 70%)}
.sched .srow.is-today .day{color:var(--orange-ax);font-weight:700}
.qi.is-next{position:relative}
.qi.is-next .qt{color:var(--orange-ax)}
.qnow{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700;
letter-spacing:.14em;text-transform:uppercase;color:var(--orange-ax);margin-bottom:2px}
.qnow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--orange-ax);
animation:hod-breath-dot var(--breath) cubic-bezier(.45,0,.55,1) infinite}
/* ── 3.5 footer as a brand moment ─────────────────────────────────────── */
footer .f-line{text-wrap:balance}
footer .socials a svg{width:17px;height:17px}
footer .f-hours{margin-top:16px;font-size:13px;color:rgba(252,243,228,.62);line-height:1.7}
footer .f-hours b{color:rgba(252,243,228,.9);font-weight:600}
/* ── 4.6 form states ──────────────────────────────────────────────────── */
.field input,.field textarea,footer .newsl input{
transition:border-color .3s var(--ease-out),box-shadow .3s var(--ease-out),background .3s var(--ease-out)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--orange-ax);
box-shadow:0 0 0 3px rgba(196,68,31,.14)}
footer .newsl input:focus{outline:none;border-color:var(--gold);
box-shadow:0 0 0 3px rgba(255,214,0,.16)}
.field.invalid input,.field.invalid textarea{border-color:#B3341A;
box-shadow:0 0 0 3px rgba(179,52,26,.12)}
.field .err{display:none;font-size:12.5px;color:#B3341A;margin-top:6px}
.field.invalid .err{display:block}
.form-ok{display:none;margin-top:14px;font-size:14px;color:var(--ink);
background:rgba(196,68,31,.08);border:1px solid rgba(196,68,31,.22);
border-radius:14px;padding:12px 16px}
.form-ok.on{display:block}
/* ── 4.5 content-visibility deliberately NOT used ──────────────────────
Measured: document height stayed stable (11381 vs 11364px), so it caused
no layout bug here. Removed anyway on risk grounds — content-visibility
defers layout of off-screen sections, and every page here is driven by
GSAP ScrollTrigger, which caches start/end positions from that layout.
The upside on an 11-page brochure site did not justify the interaction
risk. The real loading wins (fetchpriority, hero preload) are kept. */
/* ── 4.8 motion & transparency accessibility sweep ────────────────────── */
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
transition-duration:.001ms!important;scroll-behavior:auto!important}
.book.orange .core .btn-ink,.eyebrow::before,footer .orbf,.qnow::before{animation:none}
::view-transition-old(root),::view-transition-new(root){animation:none}
}
@media (prefers-reduced-transparency:reduce){
nav{background:var(--cream);backdrop-filter:none;-webkit-backdrop-filter:none}
.img-hero .crumb{background:rgba(22,15,9,.82);backdrop-filter:none;-webkit-backdrop-filter:none}
}
/* ── 2.2 hover gating — touch devices must not inherit sticky :hover ──
30 hover selectors moved here verbatim, relative order preserved.
Selectors that also carried :focus-within were SPLIT so keyboard access stays ungated. */
@media (hover:hover) and (pointer:fine){
.btn:hover .chip{transform:translate(3px,-2px) scale(1.06)}
.btn-ink:hover{box-shadow:var(--shadow-float)}
.btn-ink:hover .chip{background:var(--orange);color:#fff}
.btn-ghost:hover{border-color:rgba(18,32,91,.26);background:rgba(255,255,255,.4)}
.btn-orange:hover{background:var(--orange-deep);box-shadow:0 20px 46px -16px rgba(241,93,50,.55)}
.btn-cream:hover .chip{background:var(--orange);color:#fff}
nav .links a:hover{background:rgba(18,32,91,.07);color:var(--ink)}
.tlink:hover::after{transform:scaleX(1)}
.tlink:hover .chip{transform:translateX(4px)}
.b-card:hover img.bg{transform:scale(1.045)}
.b-card:hover .go{background:var(--orange);border-color:var(--orange);transform:translate(2px,-2px)}
.prow:hover{background:rgba(255,255,255,.45)}
.prow:hover h3{transform:translateX(6px)}
.prow:hover .go{background:var(--ink);color:var(--cream);border-color:var(--ink);transform:translate(3px,-3px)}
.s-item:hover{background:rgba(255,255,255,.06)}
.c-row:hover .go{background:var(--orange);color:#fff;border-color:var(--orange);transform:translate(2px,-2px)}
footer .ln a:hover{color:#fff}
footer .socials a:hover{background:var(--orange);border-color:var(--orange);transform:translateY(-3px)}
.newsl button:hover{background:var(--orange-deep)}
.b-card:hover .core::after{background:rgba(241,93,50,.14)}
.pcard:hover .core>img{transform:scale(1.05)}
.subnav a:hover{background:var(--ink);color:var(--cream)}
.sched .srow:hover{background:rgba(255,255,255,.5)}
.b-dark:hover .go2{background:var(--gold);color:var(--ink);transform:translate(2px,-2px)}
.btn-orange:hover::before{left:130%}
div.prow:hover{background:transparent}
div.prow:hover h3{transform:none}
.has-sub:hover .nav-sub{opacity:1;transform:translateY(0);pointer-events:auto;transition-delay:0s}
.nav-sub a:hover{background:rgba(18,32,91,.07);color:var(--ink)}
/* white text now 5.01:1 */
.btn-orange:hover{ background:#A83A19 }
}
@media (hover:hover) and (pointer:fine) and (min-width:1021px){
/* hiding the thumb must also drop its grid track, otherwise the copy is
squeezed into the leftover 86px column and the row height explodes */
a.prow[data-preview].has-thumb{grid-template-columns:86px 1fr auto}
a.prow[data-preview] .pthumb{display:none}
a.prow[data-preview] h3{transition:transform .45s var(--ease-out)}
a.prow[data-preview]:hover h3{transform:translateX(10px)}
}
/* ── 3.5 newsletter feedback ───────────────────────────────────────────── */
.newsl-note{font-size:12.5px;margin-top:9px;line-height:1.5;min-height:1px}
.newsl-note.ok{color:var(--gold)}
.newsl-note.bad{color:#FF9E80}
footer .newsl input[aria-invalid="true"]{border-color:#FF9E80;box-shadow:0 0 0 3px rgba(255,158,128,.14)}
/* ── Ceremoniju sadaļa — „augstie plakāti” (izvēlēts variants D, 2026-07-18) ──
Aizstāj iepriekšējo horizontālo kartīšu joslu: bilde dabū ~2,2x vairāk vietas.
Bez data-tilt — tas rakstītu rotationX/Y transformu tieši uz kartes un
cīnītos ar hover translateY. Hover tuvinājums sēž uz atseviška .ph ietvara,
nevis uz paša ![]()
, jo .imr (GSAP) animē tieši ![]()
— tā abas kustības
nekad necīnās par vienu un to pašu transformu. */
.eposters{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.epost{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:2/3;
display:flex;align-items:flex-end;box-shadow:var(--shadow-soft);
transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out)}
.epost .ph{position:absolute;inset:0;overflow:hidden;
transition:transform 1.1s var(--ease)}
.epost .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.epost::after{content:"";position:absolute;inset:0;pointer-events:none;
background:linear-gradient(180deg,rgba(20,14,8,0) 36%,rgba(20,14,8,.52) 64%,rgba(20,14,8,.93) 100%)}
.epost .ep-in{position:relative;z-index:2;padding:26px 22px;color:var(--cream);width:100%}
.epost .ep-rule{display:block;width:34px;height:2px;background:var(--gold);border-radius:2px;
margin-bottom:15px;transition:width .6s var(--ease-out)}
.epost h3{font-size:clamp(19px,1.6vw,23px);color:var(--cream);line-height:1.16;text-wrap:balance}
.epost .em{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px}
.epost .em span{font-size:10px;letter-spacing:.11em;text-transform:uppercase;font-weight:500;
padding:4px 10px;border-radius:99px;background:rgba(252,243,228,.17);
backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:var(--cream)}
@media (hover:hover) and (pointer:fine){
.epost:hover{transform:translateY(-7px);box-shadow:var(--shadow-float)}
.epost:hover .ph{transform:scale(1.06)}
.epost:hover .ep-rule{width:70px}
}
@media (max-width:900px){.eposters{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.eposters{grid-template-columns:1fr;gap:18px}.epost{aspect-ratio:4/5}}
@media (prefers-reduced-transparency:reduce){
.epost .em span{background:rgba(20,14,8,.72);backdrop-filter:none;-webkit-backdrop-filter:none}
}
/* ── Atsauksmju lente (izvēlēts variants D1, 2026-07-18) ──────────────────
Divas rindas, kas slīd pretējos virzienos. Citāti ir HTML, nevis JS —
meklētājiem tie ir īsts saturs. JS tikai nodublē tos cilpai (aria-hidden).
Cilpa iet līdz -50%, tāpēc katrā rindā jābūt tieši 2 identiskām kopijām. */
.tstrip{padding:clamp(64px,8vw,104px) 0;overflow:hidden;
/* fade in from the page cream instead of a hard edge at the top */
background:linear-gradient(180deg,var(--cream) 0,var(--cream-2) 120px)}
.tstrip .side{margin-bottom:40px}
.trib-track{position:relative;
/* The mask clips to the border box (mask-clip defaults to border-box), which
was slicing the cards' drop shadows straight through mid-fade and leaving a
hard horizontal line under the last row. The padding grows the masked box so
each shadow can fade out completely inside it; the matching negative margin
cancels the extra height so the layout is unchanged. */
padding-bottom:90px;margin-bottom:-90px;
-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.trib{display:flex;width:max-content;will-change:transform}
.trib-2{margin-top:18px}
/* Spacing lives on the card, NOT as flex `gap`: a row of n cards has n-1 gaps,
so a gap-based row can never be translated by a whole set width — it drifts
9px per cycle. With margin-right the set period is exactly n*(card+margin).
--tw is measured in JS so the loop is exact at any viewport and card count. */
@keyframes trib-l{from{transform:translateX(0)}
to{transform:translateX(calc(-1 * var(--tw,1672px)))}}
@keyframes trib-r{from{transform:translateX(calc(-1 * var(--tw,1672px)))}
to{transform:translateX(0)}}
.trib-1{animation:trib-l 46s linear infinite}
.trib-2{animation:trib-r 52s linear infinite}
/* (pause moved onto .trib itself — see the cohesion note below) */
.tq{flex:0 0 400px;background:var(--cream);border:1px solid var(--line-soft);
border-radius:18px;padding:22px 24px;box-shadow:var(--shadow-soft);margin:0 18px 0 0}
.tq blockquote{font-family:var(--serif);font-style:italic;font-size:15.5px;line-height:1.55;
color:var(--ink-soft);text-wrap:pretty}
.tq figcaption{margin-top:14px;font-size:11px;letter-spacing:.11em;text-transform:uppercase;
color:var(--taupe)}
.tq figcaption b{color:var(--orange-ax);font-weight:700}
@media (max-width:560px){.tq{flex:0 0 78vw}}
@media (prefers-reduced-motion:reduce){
/* no motion: becomes a plain wrapped wall, and the duplicate half is hidden */
.trib-track{mask-image:none;-webkit-mask-image:none}
.trib{animation:none!important;width:auto;flex-wrap:wrap;gap:18px}
.tq{flex:1 1 320px;margin:0}
.trib [aria-hidden="true"]{display:none}
}
/* ── Augstāka breather-josla sākumlapā ────────────────────────────────────
Noklusējuma josla (maks. 560px) šim kadram bija par šauru — paceltās rokas
tika nogrieztas. Tikai .band-tall; pārējo lapu joslas paliek nemainītas. */
section.band.band-tall{height:clamp(400px,72vh,700px)}
/* uz telefona 72vh aizņemtu gandrīz visu ekrānu — tur josla paliek ~ tāda kā bija */
@media (max-width:768px){section.band.band-tall{height:clamp(340px,50vh,440px)}}
/* ── Programmu kartes (apstiprināts variants) ─────────────────────────────
Tā pati valoda kā ceremoniju plakātiem — foto aizpilda karti, teksts virsū —
bet 2x2 un ainavas formātā, lai sadaļas sasaucas, nevis atkārtojas. */
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.pcard-x{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:3/2;
display:flex;align-items:flex-end;box-shadow:var(--shadow-soft);
transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out)}
.pcard-x .ph{position:absolute;inset:0;overflow:hidden;transition:transform 1.1s var(--ease)}
.pcard-x .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pcard-x::after{content:"";position:absolute;inset:0;pointer-events:none;
background:linear-gradient(180deg,rgba(20,14,8,.05) 22%,rgba(20,14,8,.52) 56%,rgba(20,14,8,.94) 100%)}
.pcard-x .pm-in{position:relative;z-index:2;padding:28px 26px;color:var(--cream);width:100%}
.pcard-x .pm-rule{display:block;width:34px;height:2px;background:var(--gold);border-radius:2px;
margin-bottom:14px;transition:width .6s var(--ease-out)}
.pcard-x .pm-num{font-family:var(--serif);font-style:italic;font-size:15px;
color:rgba(255,214,0,.85);display:block;margin-bottom:4px}
.pcard-x h3{font-size:clamp(20px,1.75vw,25px);color:var(--cream);line-height:1.16;text-wrap:balance}
.pcard-x p{font-size:13.5px;line-height:1.55;color:rgba(252,243,228,.82);margin-top:8px;
max-width:46ch;font-weight:300}
.pcard-x .pm-tag{display:inline-block;margin-top:12px;font-size:10px;letter-spacing:.11em;
text-transform:uppercase;font-weight:600;padding:4px 11px;border-radius:99px;
background:rgba(252,243,228,.17);backdrop-filter:blur(6px);color:var(--cream)}
@media (hover:hover) and (pointer:fine){
.pcard-x:hover{transform:translateY(-7px);box-shadow:var(--shadow-float)}
.pcard-x:hover .ph{transform:scale(1.05)}
.pcard-x:hover .pm-rule{width:70px}
}
@media (max-width:820px){.pgrid{grid-template-columns:1fr;gap:18px}.pcard-x{aspect-ratio:4/3}}
/* ── Uzņēmumiem: pilna platuma foto sadaļa (variants C, edge-to-edge) ─────
Sekcija iet no malas līdz malai; teksts paliek .wrap režģī, lai rinda
nekļūtu par platu lasīšanai. Slīpais scrim tur tekstu pa kreisi. */
.corp-full{position:relative;overflow:hidden;display:flex;align-items:center;
min-height:clamp(560px,78vh,860px)}
.corp-full .cf-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
object-position:center 42%}
.corp-full::after{content:"";position:absolute;inset:0;pointer-events:none;
background:linear-gradient(96deg,rgba(18,13,8,.93) 26%,rgba(18,13,8,.72) 52%,rgba(18,13,8,.34) 78%,rgba(18,13,8,.20) 100%)}
.corp-full .wrap{position:relative;z-index:2;width:100%} /* bez width:100% .wrap kā flex bērns saraujas līdz satura platumam un
`margin:0 auto` to nocentrē — teksts aizslīd uz lapas vidu. */
.corp-full .cf-in{max-width:620px;color:var(--cream)}
.corp-full .eyebrow{color:var(--gold);border-color:rgba(255,214,0,.42)}
.corp-full .eyebrow::before{background:var(--gold)}
.corp-full h2{font-size:clamp(30px,3.6vw,46px);color:var(--cream);margin-top:20px}
.corp-full h2 .h-it{font-style:italic;color:var(--gold)}
.corp-full .lede{margin-top:18px;font-size:16px;line-height:1.72;color:rgba(252,243,228,.82);max-width:50ch}
.corp-full .cf-stats{display:flex;gap:36px;flex-wrap:wrap;margin-top:32px}
.corp-full .cf-stats b{display:block;font-family:var(--serif);font-size:32px;color:var(--gold);
line-height:1;font-variant-numeric:tabular-nums}
.corp-full .cf-stats span{display:block;font-size:12px;color:rgba(252,243,228,.68);margin-top:8px;
line-height:1.5;max-width:19ch}
.corp-full .cf-fmts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px;max-width:560px}
.corp-full .cf-fmts div{background:rgba(252,243,228,.10);border:1px solid rgba(252,243,228,.14);
border-radius:14px;padding:12px 15px;
backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.corp-full .cf-fmts b{display:block;font-size:13.5px;font-weight:600;color:var(--cream)}
.corp-full .cf-fmts span{display:block;font-size:11.5px;color:rgba(252,243,228,.66);
margin-top:3px;font-weight:300;line-height:1.45}
@media (max-width:560px){.corp-full .cf-fmts{grid-template-columns:1fr}}
.corp-full .cf-cta{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:32px}
.corp-full .cf-note{font-family:var(--serif);font-style:italic;font-size:14.5px;color:rgba(252,243,228,.62)}
@media (max-width:768px){
.corp-full{min-height:auto;padding:clamp(56px,9vw,84px) 0}
.corp-full::after{background:linear-gradient(180deg,rgba(18,13,8,.80) 0%,rgba(18,13,8,.90) 100%)}
.corp-full .cf-stats{gap:22px}
.corp-full .cf-stats b{font-size:26px}
}
@media (prefers-reduced-transparency:reduce){
.corp-full .cf-fmts div{background:rgba(18,13,8,.78);backdrop-filter:none;-webkit-backdrop-filter:none}
}
/* ══ VIENOTĪBAS LABOJUMI (2026-07-19) ═══════════════════════════════════
Sākumlapas auditā atrastās nesakritības. Visas ir atņemšana, nevis
pievienošana — mazāk variantu, viena valoda. */
/* 1 · viens rādiuss visām foto kartēm (bija 32 / 24 / 22px) */
.b-card{border-radius:24px}
.b-card .core{border-radius:24px}
.epost{border-radius:24px}
/* 2 · foto kartes bez krēmīgā .shell ietvara — bilde IR karte.
.shell paliek uz ne-foto virsmām (līmeņu kartes, joslas, rezervācija). */
.b-card.b-photo{background:none;border:none;padding:0;box-shadow:var(--shadow-soft)}
.b-card.b-photo .core{box-shadow:none}
/* 3 · viena hover valoda: pacelšanās + ēna, tāpat kā programmu/pasākumu kartēm */
@media (hover:hover) and (pointer:fine){
.b-card{transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out)}
.b-card:hover{transform:translateY(-7px);box-shadow:var(--shadow-float)}
.shell.level{transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out)}
.shell.level:hover{transform:translateY(-7px);box-shadow:var(--shadow-float)}
}
/* 4 · sadaļu "eyebrow" punkti vairs nepulsē. Pulss tagad nozīmē vienu lietu —
ka informācija ir DZĪVA (tuvākās nodarbības zīmīte) — plus finiša CTA oreols. */
.eyebrow::before{animation:none}
.qnow::before{animation:hod-breath-dot var(--breath) cubic-bezier(.45,0,.55,1) infinite}
/* 5 · scrim dziļums izlīdzināts (bija .85 / .93 / .94) */
.b-photo .core::before{background:linear-gradient(180deg,
rgba(20,14,8,.10) 20%,rgba(20,14,8,.55) 58%,rgba(20,14,8,.90) 100%)}
.epost::after{background:linear-gradient(180deg,
rgba(20,14,8,0) 36%,rgba(20,14,8,.52) 64%,rgba(20,14,8,.90) 100%)}
.pcard-x::after{background:linear-gradient(180deg,
rgba(20,14,8,.05) 22%,rgba(20,14,8,.52) 56%,rgba(20,14,8,.90) 100%)}
/* ── Pilnekrāna hero (sākumlapa) ──────────────────────────────────────────
`svh` = mazais viewport: lapu atverot mobilajā pārlūka josla ir redzama,
tāpēc 100svh aizpilda tieši to, kas ir redzams, un saturs nekad nepazūd
aiz pārlūka joslas (kā tas notiktu ar 100vh). Uz darbvirsmas svh == vh.
min-height, nevis height — ja saturs ir garāks par ekrānu, sadaļa aug. */
.img-hero.full-vh{min-height:100vh;min-height:100svh}
.img-hero.full-vh > .wrap{padding-bottom:clamp(96px,13vh,140px)} /* `>` obligāts: bez tā noteikums ķer arī .hero-trustglass iekšējo .wrap
(augstāka specifika nekā tā paša noteikumam) un josla uzpūšas, uzkāpjot pogām. */
/* Uz zemiem ekrāniem (piem. 1280x720 klēpjdators) pilns saturs + statistikas
josla neietilpst vienā ekrānā — tur apakšējā atkāpe tiek samazināta, lai
josla paliek redzama bez ritināšanas. */
@media (max-height:780px){
.img-hero.full-vh > .wrap{padding-bottom:92px}
.img-hero.full-vh .hero-trustglass .wrap{padding-top:12px;padding-bottom:14px}
}
/* ── Atsauksmju lente: apstājas tikai virs pašām kartītēm ─────────────────
Bija `.trib-track:hover` — bet trekam ir 90px apakšējā atkāpe (ēnu dēļ) un
tas aptver abas rindas, tāpēc lente apstājās arī tad, kad pele bija tukšumā
tām blakus. Tagad apstājas tikai tā rinda, virs kuras pele tiešām atrodas. */
.trib:hover{animation-play-state:paused}
/* ══════════════════════════════════════════════════════════════════════════
OSMO — Lightbox · osmo.supply/resource/lightbox-setup
Osmo klases un data- atribūti saglabāti tieši tādi, kā viņu JS tos meklē.
Mainīts tikai izskats: zīmola burtveidols, atstarpes, fokusa gredzens.
Fons paliek melns — fotogrāfijas uz melna lasās vislabāk, un tas nozīmē,
ka Osmo JS (kas animē backgroundColor) nav jāaiztiek.
══════════════════════════════════════════════════════════════════════════ */
/* caurspīdīga poga ap attēlu — nedrīkst mainīt režģa izkārtojumu */
.lb-trigger{display:block;width:100%;padding:0;margin:0;border:0;background:none;
font:inherit;color:inherit;text-align:inherit;border-radius:inherit;
-webkit-appearance:none;appearance:none;cursor:zoom-in}
.lb-trigger:focus-visible{outline:2px solid var(--orange);outline-offset:5px;border-radius:26px}
/* Flip pārvieto īsto ![]()
; kamēr tas ir ceļā, tam nedrīkst būt pārejas */
.lb-trigger img{transition:none}
/* kamēr galerija ir atvērta, lapas navigācija un mobilā rezervēšanas josla
netraucē — tās ir zem lightbox, bet spīd cauri caurspīdīgajam fonam */
body.lb-open nav,
body.lb-open .sticky-bar,
body.lb-open .sticky-cta{opacity:0;pointer-events:none;
transition:opacity .35s var(--ease-out)}
.lightbox-wrap{z-index:1000;justify-content:center;align-items:center;
width:100%;height:100dvh;display:none;position:fixed;inset:0 0 auto;
font-family:var(--sans);font-size:15px}
.lightbox-wrap.is-active{display:flex}
/* Augšas/apakšas atkāpe tiek rezervēta ar padding, nevis ar mazāku augstumu:
wrapper ir vertikāli centrēts, tāpēc mazāks augstums atbrīvo vietu vienādi
augšā un apakšā, un paraksts uzkāpa attēlam virsū. */
.lightbox-img__wrap{width:92vw;height:100svh;padding:3.2em 0 9.6em;box-sizing:border-box}
.lightbox-img__list{justify-content:center;align-items:center;
width:100%;height:100%;display:flex;position:relative}
.lightbox-img__item{visibility:hidden;justify-content:center;align-items:center;
width:100%;height:100%;display:flex;position:absolute}
.lightbox-img__item.is-active{visibility:visible}
.lightbox-img{object-fit:contain;border-radius:14px;min-width:auto;max-height:100%}
/* attiecas arī uz Flip ievilkto oriģinālu, kas te ienāk ar savām lapas stila
īpašībām (object-fit:cover, fiksēts aspect-ratio) — te tās jāatceļ */
.lightbox-img__item img{object-fit:contain!important;min-width:auto;width:auto;
height:auto;max-width:100%;max-height:100%;aspect-ratio:auto;border-radius:14px;
box-shadow:0 40px 100px rgba(0,0,0,.55)}
.lightbox-cap{position:absolute;left:50%;transform:translateX(-50%);
bottom:5.6em;margin:0;max-width:min(760px,86vw);text-align:center;
color:rgba(255,255,255,.88);font-size:.92em;line-height:1.5;
text-wrap:balance;pointer-events:none}
.lightbox-nav{z-index:2;color:#fff;justify-content:space-between;align-items:center;
display:flex;position:absolute;bottom:2em;left:2em;right:2em}
.lightbox-nav__col{width:33.333%}
.lightbox-nav__col.start{justify-content:flex-start;align-items:center;display:flex}
.lightbox-nav__col.center{gap:2em;justify-content:center;align-items:center;display:flex}
.lightbox-nav__col.end{justify-content:flex-end;align-items:center;display:flex}
.lightbox-nav__text{margin-bottom:0;font-size:1em;letter-spacing:.02em;
font-variant-numeric:tabular-nums}
.lightbox-nav__button{gap:.5em;background:none;border:0;color:inherit;font:inherit;
justify-content:flex-start;align-items:center;margin:-1em;padding:1em;display:flex;
cursor:pointer;-webkit-appearance:none;appearance:none}
.lightbox-nav__button:focus-visible{outline:2px solid var(--orange);outline-offset:-.6em;border-radius:8px}
.lightbox-nav__dot{background-color:currentColor;border-radius:10em;
width:.375em;height:.375em;margin-bottom:-.1em;
transition:transform .45s cubic-bezier(.625,.05,0,1)}
@media (hover:hover) and (pointer:fine){
.lightbox-nav__button:hover .lightbox-nav__dot{transform:scale(2.4)}
}
.lightbox-nav__col.start .lightbox-nav__text{color:rgba(255,255,255,.62)}
@media (max-width:767px){
.lightbox-wrap{font-size:14px}
.lightbox-img__wrap{width:94vw;height:100svh;padding:2.6em 0 10.2em}
.lightbox-nav{left:1.1em;right:1.1em;bottom:1.2em}
.lightbox-nav__col.center{gap:1.2em}
.lightbox-cap{bottom:5em;font-size:.86em}
}
/* ══════════════════════════════════════════════════════════════════════════
OSMO — WhatsApp modālis · osmo.supply/resource/whatsapp-modal
Osmo klases un data- atribūti saglabāti. Pārkrāsots zīmola paletē (Osmo
demo bija brūns #612c08; WhatsApp zaļā šai lapai neder).
Viens labojums Osmo CSS: viņu selektors, kas uz peles ierīcēm paslēpj tiešo
saiti, ir [data-whatsapp-modal-btn], bet marķējumā atribūts ir
[data-whatsapp-modal-trigger] — selektors nekad netrāpa. Praksē tas nekaitē
(toggle DOM secībā ir virs saites un pārķer klikšķi), bet te lietots
pareizais nosaukums.
══════════════════════════════════════════════════════════════════════════ */
.whatsapp-modal{z-index:1100;pointer-events:none;flex-flow:column;
justify-content:center;align-items:center;display:flex;position:fixed;inset:0;
font-family:var(--sans);font-size:15px}
.whatsapp-modal__card{transition:all .6s cubic-bezier(.625,.05,0,1);
gap:1.25em;pointer-events:auto;background-color:var(--cream);
border:1px solid var(--line-soft);border-radius:1.5em;flex-flow:column;
align-items:center;width:20em;max-width:calc(100vw - 2.5em);
padding:4.5em 2em 3.26em;display:flex;position:relative;
box-shadow:0 40px 90px -30px rgba(18,32,91,.45);
transform:translateY(25%) rotate(.001deg);opacity:0;visibility:hidden}
[data-whatsapp-modal-status="active"] .whatsapp-modal__card{
transform:translateY(0) rotate(.001deg);opacity:1;visibility:visible}
.whatsapp-modal__qr-canvas{background-color:rgba(18,32,91,.08);
width:8.75em;height:8.75em;border-radius:10px}
[data-whatsapp-modal-qr-canvas]:has(svg){background-color:transparent}
[data-whatsapp-modal-qr-canvas] svg rect{fill:transparent}
[data-whatsapp-modal-qr-canvas] svg path{fill:var(--ink)}
.whatsapp-modal__card.is--no-qr .whatsapp-modal__qr-canvas{display:none}
.whatsapp-modal__text{gap:.75em;flex-flow:column;align-items:center;
padding-top:1em;display:flex}
.whatsapp-modal__h2{font-family:var(--serif);color:var(--ink);text-align:center;
margin:0;font-size:1.75em;font-weight:500;line-height:1.08}
.whatsapp-modal__p{color:var(--taupe);text-align:center;font-size:.95em;
line-height:1.5;margin:0;text-wrap:balance}
.whatsapp-modal__btn{gap:.5em;color:#fff;cursor:pointer;
background-color:var(--ink);border:0;border-radius:30em;padding:1em 1.5em;
text-decoration:none;display:flex;align-items:center;position:relative;
overflow:hidden;transition:transform .4s var(--ease-out),background-color .4s}
.whatsapp-modal__btn-span{color:var(--cream);font-size:.95em;font-weight:500;
line-height:1;white-space:nowrap}
@media (hover:hover) and (pointer:fine){
.whatsapp-modal__btn:hover{background-color:var(--orange-deep);transform:translateY(-2px)}
}
.whatsapp-modal__btn:focus-within{outline:2px solid var(--orange);outline-offset:3px}
.whatsapp-modal__overlay-link,
.whatsapp-modal__overlay-toggle{width:100%;height:100%;position:absolute;top:0;left:0}
.whatsapp-modal__close{cursor:pointer;justify-content:center;align-items:center;
width:2em;height:2em;display:flex;position:absolute;top:1.5em;right:1.5em;
border-radius:50%;transition:background-color .3s}
@media (hover:hover) and (pointer:fine){
.whatsapp-modal__close:hover{background-color:rgba(18,32,91,.07)}
}
.whatsapp-modal__close-bar{background-color:var(--ink);width:1.1em;height:.09375em;
position:absolute;transform:rotate(-45deg)}
.whatsapp-modal__close-bar.is--duplicate{transform:rotate(45deg)}
.whatsapp-modal__dark{transition:all .6s cubic-bezier(.625,.05,0,1);
pointer-events:auto;background-color:rgba(18,32,91,.34);
-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
width:100%;height:100%;position:absolute;top:0;left:0;opacity:0;visibility:hidden}
[data-whatsapp-modal-status="active"] .whatsapp-modal__dark{opacity:1;visibility:visible}
.whatsapp-modal__btn.is--large{font-size:1.05em}
.whatsapp-modal__icon-svg{width:1.25em;margin-top:-.125em;margin-left:-.25em;
display:block;position:relative;flex:0 0 auto}
/* uz peles ierīcēm rāda modāli, uz skāriena — atver WhatsApp uzreiz */
[data-whatsapp-modal-trigger] [data-whatsapp-modal-link]{display:none}
@media (hover:none) and (pointer:coarse){
[data-whatsapp-modal]{display:none}
[data-whatsapp-modal-trigger] [data-whatsapp-modal-toggle]{display:none}
[data-whatsapp-modal-trigger] [data-whatsapp-modal-link]{display:block}
}
@media (prefers-reduced-motion:reduce){
.whatsapp-modal__card,.whatsapp-modal__dark{transition-duration:.01ms}
}
/* ══════════════════════════════════════════════════════════════════════════
OSMO — Progressive Blur · osmo.supply/resource/progressive-blur
Slāņi un maskas ir Osmo oriģināls, nemainīti. Pievienots tikai:
· tikai telefonā — uz datora apakšā nav fiksētās joslas, ko mīkstināt;
· zemāks augstums (15em bija pusi ekrāna telefonā);
· atslēgts, ja lietotājs prasa mazāk caurspīdīguma.
══════════════════════════════════════════════════════════════════════════ */
.progressive-blur{display:none}
@media (max-width:900px){
.progressive-blur{
z-index:40;pointer-events:none;isolation:isolate;contain:paint;
width:100%;height:8em;transform-style:preserve-3d;
position:fixed;bottom:0;left:0;overflow:hidden;transform:translateZ(0);
display:block}
.progressive-blur__layer{width:100%;height:100%;position:absolute}
.progressive-blur__layer.is--1{-webkit-backdrop-filter:blur(.09375em);backdrop-filter:blur(.09375em);
-webkit-mask:linear-gradient(#0000 50%,#000 62.5% 75%,#0000 87.5%);
mask:linear-gradient(#0000 50%,#000 62.5% 75%,#0000 87.5%)}
.progressive-blur__layer.is--2{-webkit-backdrop-filter:blur(.1875em);backdrop-filter:blur(.1875em);
-webkit-mask:linear-gradient(#0000 62.5%,#000 75% 87.5%,#0000 100%);
mask:linear-gradient(#0000 62.5%,#000 75% 87.5%,#0000 100%)}
.progressive-blur__layer.is--3{-webkit-backdrop-filter:blur(.375em);backdrop-filter:blur(.375em);
-webkit-mask:linear-gradient(#0000 75%,#000 87.5% 100%);
mask:linear-gradient(#0000 75%,#000 87.5% 100%)}
.progressive-blur__layer.is--4{-webkit-backdrop-filter:blur(.75em);backdrop-filter:blur(.75em);
-webkit-mask:linear-gradient(#0000 82%,#000 92% 100%);
mask:linear-gradient(#0000 82%,#000 92% 100%)}
.progressive-blur__layer.is--5{-webkit-backdrop-filter:blur(1.5em);backdrop-filter:blur(1.5em);
-webkit-mask:linear-gradient(#0000 88%,#000 100%);
mask:linear-gradient(#0000 88%,#000 100%)}
}
@media (prefers-reduced-transparency:reduce){ .progressive-blur{display:none} }
/* ══════════════════════════════════════════════════════════════════════════
OSMO — Back To Top · osmo.supply/resource/back-to-top-button
Osmo struktūra un data- atribūti saglabāti. Mainīts izskats (rozā #fca5a0 →
zīmola navy) un novietojums telefonā: Osmo liek pogu pašā apakšā pa labi,
kur šai lapai ir „Rezervēt vietu" josla — poga uzkāptu tai virsū.
══════════════════════════════════════════════════════════════════════════ */
.back-top__wrap{z-index:95;pointer-events:none;flex-flow:column;
justify-content:flex-end;align-items:flex-end;width:100%;height:100vh;
height:100dvh;padding:2em;display:flex;position:fixed;inset:0}
.back-top__button{pointer-events:auto;background-color:var(--ink);
color:var(--cream);border:min(.4em,5px) solid var(--cream);
border-radius:1em;outline-style:none;
width:max(3.4vw,2.9rem);height:max(3.4vw,2.9rem);padding:.5em;
position:relative;cursor:pointer;
box-shadow:0 14px 34px -12px rgba(18,32,91,.45)}
.back-top__arrow{width:2.5em}
.back-top__arrow-wrap{flex-flow:column;justify-content:flex-start;align-items:center;
width:100%;height:100%;display:flex;position:relative;overflow:hidden}
.back-top__arrow-row{flex:none;justify-content:center;align-items:center;
width:100%;height:100%;display:flex}
[data-back-to-top="wrap"]{opacity:0}
.back-top__arrow-row{transition:transform .5s cubic-bezier(.65,0,0,1)}
.back-top__button{transition:border-width .5s cubic-bezier(.65,0,0,1),
background-color .5s cubic-bezier(.65,0,0,1)}
.back-top__button:focus-visible{border-width:.55em;outline:2px solid var(--orange);outline-offset:3px}
.back-top__button:focus-visible .back-top__arrow-row{transform:translate(0,-100%)}
@media (hover:hover){
.back-top__button:hover{border-width:.55em;background-color:var(--orange-deep)}
.back-top__button:hover .back-top__arrow-row{transform:translate(0,-100%)}
}
@media (max-width:900px){
/* fiksētā rezervēšanas josla aizņem apakšu — pogu paceļam virs tās */
.back-top__wrap{padding:1.25em 1.25em calc(78px + env(safe-area-inset-bottom))}
.back-top__button{border-radius:.7em;padding:.4em}
}
/* kamēr galerija ir atvērta, poga netraucē */
body.lb-open .back-top__wrap{opacity:0!important;pointer-events:none}
/* ══════════════════════════════════════════════════════════════════════════
OSMO — Check Section Theme on Scroll
Osmo piegādā tikai skriptu; stils ir mūsu. Virs tumšajām pilnekrāna
sekcijām (.img-hero, .band) navigācijas „tablete" pārslēdzas uz tumšu
stiklu ar krēmīgu tekstu, nevis peld kā gaišs plankums uz tumša foto.
══════════════════════════════════════════════════════════════════════════ */
nav{transition:background .55s var(--ease-out),border-color .55s var(--ease-out),
box-shadow .55s var(--ease-out)}
/* Fona bilde zem navigācijas var būt jebkura — gaišs logs, tumša telpa.
Ar 42% navy virs gaišas bildes krēmīgais teksts deva tikai 2,7:1, kas ir
zem WCAG AA (4,5:1 mazam tekstam). Tāpēc fonu ne tikai pārklājam, bet arī
pieklusinām ar brightness() — tā kontrasts ir garantēts neatkarīgi no tā,
kāda fotogrāfija ir zem tās. */
body[data-theme-nav="dark"] nav{
background:rgba(18,32,91,.58);
-webkit-backdrop-filter:blur(18px) brightness(.42) saturate(.85);
backdrop-filter:blur(18px) brightness(.42) saturate(.85);
border-color:rgba(252,243,228,.20);
box-shadow:0 18px 44px -20px rgba(0,0,0,.55)}
/* ja pārlūks neprot backdrop-filter, krītam atpakaļ uz blīvu navy */
@supports not (backdrop-filter:blur(1px)){
body[data-theme-nav="dark"] nav{background:rgba(18,32,91,.92)}
}
body[data-theme-nav="dark"] nav .links a,
body[data-theme-nav="dark"] nav .brand span,
body[data-theme-nav="dark"] nav .lang{color:var(--cream)}
body[data-theme-nav="dark"] nav .lang b{color:#fff}
body[data-theme-nav="dark"] nav .links a[aria-current="page"]{
background:rgba(252,243,228,.16)!important}
body[data-theme-nav="dark"] nav .btn-ink{
background:var(--cream);color:var(--ink)}
/* Poga tumšajā režīmā kļūst krēmīga, bet .chip aplītis palika ar savu
rgba(255,255,255,.14) fonu un krēmīgu bultiņu — gaišs uz gaiša, tātad
neredzams. Tumšajā režīmā tas jāizskatās kā .btn-cream .chip. */
body[data-theme-nav="dark"] nav .btn-ink .chip{
background:rgba(18,32,91,.09);color:var(--ink)}
@media (hover:hover) and (pointer:fine){
body[data-theme-nav="dark"] nav .btn-ink:hover .chip{
background:var(--orange);color:#fff}
}
body[data-theme-nav="dark"] .burger i{background:var(--cream)}
/* „Programmas un retrīti" nolaižamā izvēlne ir SAVS krēmīgs panelis un
neatrodas uz fotogrāfijas — tai tumšā režīma krāsas nav jāmanto.
Selektors augstāk (body[data-theme-nav="dark"] nav .links a) ir specifiskāks
par .nav-sub a, tāpēc saites kļuva krēmīgas uz krēmīga fona — praktiski
neredzamas. Šie noteikumi ir tikpat specifiski un stāv vēlāk, tāpēc uzvar. */
body[data-theme-nav="dark"] nav .nav-sub a{color:var(--ink-soft)}
body[data-theme-nav="dark"] nav .nav-sub .ns-note{color:var(--taupe)}
body[data-theme-nav="dark"] nav .nav-sub a em{color:var(--orange)}
@media (hover:hover) and (pointer:fine){
body[data-theme-nav="dark"] nav .links a:hover{background:rgba(252,243,228,.13)}
body[data-theme-nav="dark"] nav .nav-sub a:hover{
background:rgba(18,32,91,.07);color:var(--ink)}
}
/* nav.scrolled uzliek gaišu fonu — virs tumšas sekcijas tas uzvarētu */
body[data-theme-nav="dark"] nav.scrolled{background:rgba(18,32,91,.68)}
@media (prefers-reduced-motion:reduce){ nav{transition:none} }
/* ── nav CTA uz lapas, kurā jau atrodamies ──────────────────────────────
rezervacija.html nav pogai bija inline style="background:rgba(18,32,91,.07)",
kas apklusina pogu, jo tā norāda uz pašreizējo lapu. Bet inline stils maina
TIKAI fonu — teksts palika krēmīgs, tātad gaišs uz gaiša jau iepriekš.
Tumšajā režīmā tas kļuva navy uz navy, t.i. praktiski neredzams.
Tagad stāvoklis ir aprakstīts CSS un strādā abās tēmās: poga paliek
klusināta, bet salasāma. */
nav .btn-ink[aria-current="page"]{
background:rgba(18,32,91,.07);
color:var(--ink);
border-color:rgba(18,32,91,.18)}
nav .btn-ink[aria-current="page"] .chip{
background:rgba(18,32,91,.09);color:var(--ink)}
/* Tumšajā režīmā krēmīgs pildījums padara pogu GAIŠĀKU, un krēmīgs teksts uz
tā pazūd (3,46:1). Tāpēc te „pašreizējo lapu" apzīmē tikai kontūra —
fons paliek tumšs kā navigācijai, un teksts saglabā pilnu kontrastu. */
body[data-theme-nav="dark"] nav .btn-ink[aria-current="page"]{
background:transparent;
color:var(--cream);
border-color:rgba(252,243,228,.55)}
body[data-theme-nav="dark"] nav .btn-ink[aria-current="page"] .chip{
background:rgba(252,243,228,.16);color:var(--cream)}
/* ══════════════════════════════════════════════════════════════════════════
AUDITA LABOJUMI 2026-07-29
══════════════════════════════════════════════════════════════════════════ */
/* Saite teksta vidū. Iepriekš: color:var(--orange) inline — 3,0:1 pret krēmu
(WCAG AA prasa 4,5:1) un tikai 1,84:1 pret apkārtējo tekstu, tātad saite bija
atšķirama TIKAI pēc krāsas. --orange-ax dod 4,55:1, pasvītrojums noņem
atkarību no krāsas. */
.ilink{color:var(--orange-ax);text-decoration:underline;
text-decoration-thickness:1px;text-underline-offset:2px;
transition:color .3s var(--ease)}
@media (hover:hover) and (pointer:fine){
.ilink:hover{color:var(--ink);text-decoration-thickness:2px}
}
/* Pārlēkšanas saite „Pāriet uz saturu" ved uz , bet #main nebija
scroll-margin-top — satura augšmala aizlēca aiz fiksētās navigācijas.
Pārējiem mērķiem tas jau ir (sk. augstāk sarakstu ar section[id] u.c.). */
#main{scroll-margin-top:118px}
/* ══════════════════════════════════════════════════════════════════════════
OSMO — Curved Wipe Page Transition
osmo.supply/resource/curved-wipe-page-transition
Osmo klases, struktūra un ģeometrija saglabātas. Mainīts tikai panelis:
#201d1d → zīmola navy, un logo vietā ir emblēma (SVG vārdzīmes nav).
══════════════════════════════════════════════════════════════════════════ */
.transition{z-index:1200;pointer-events:none;position:fixed;inset:0;overflow:clip}
.transition__panel{color:var(--ink);background-color:currentColor;
justify-content:center;align-items:center;width:100%;height:100%;display:flex;
position:absolute;top:100%;left:0;visibility:hidden}
.transition__panel-top{transform-origin:bottom;flex-flow:column;align-items:center;
width:100%;height:0%;display:flex;position:absolute;bottom:calc(100% - 1px);left:0;
overflow:hidden}
.transition__panel-bottom{transform-origin:top;flex-flow:column;justify-content:flex-end;
align-items:center;width:100%;height:0%;display:flex;position:absolute;
top:calc(100% - 1px);left:0;overflow:hidden}
.transition__panel-circle{aspect-ratio:auto;background-color:currentColor;
border-radius:50%;width:125%;height:500%;position:absolute}
.transition__logo{color:var(--cream);opacity:0;width:8em;display:flex;
position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}
.transition__logo img{width:100%;height:auto;display:block}
/* pārlādes laikā lapa nedrīkst pazibēt — Barba to pārņem uzreiz */
@media (prefers-reduced-motion:reduce){
.transition{display:none}
}
/* ══════════════════════════════════════════════════════════════════════════
LAPU SPECIFISKAIS CSS (pārcelts no katras lapas