/* BIJU — shared styles for inner pages (index.html keeps its own inline styles) */
:root{--ink:#071e21;--ink2:#0e2f33;--gold:#ffc36c;--gold2:#b9862f;--bg:#f5f5f5;--gray:#c7c7c7;--mute:#5d6f71;--line:#e8eaea;--wrap:1240px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Ubuntu,Arial,sans-serif;color:var(--ink);font-size:16px;line-height:1.55;background:#fff}
h1,h2,h3,h4{font-family:Ubuntu,Arial,sans-serif;margin:0;line-height:1.1}
p{margin:0}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit;cursor:pointer}
ul{margin:0;padding:0;list-style:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
.cv{background-size:cover;background-position:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:500 15px Ubuntu;background:var(--gold);color:var(--ink);padding:14px 26px;border-radius:4px;border:1px solid var(--gold);white-space:nowrap;transition:transform .2s,background .2s,color .2s,border-color .2s}
.btn:hover{transform:translateY(-2px)}
.btn.o{background:transparent;border-color:currentColor;color:inherit}
.btn.o:hover{border-color:var(--gold);color:var(--gold2)}
.dark .btn.o:hover,.phero .btn.o:hover{color:var(--gold)}
.btn.dk{background:var(--ink);border-color:var(--ink);color:#fff}
.eyebrow{font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.dark .eyebrow,.phero .eyebrow{color:var(--gold)}
section{scroll-margin-top:80px}
.note{display:inline-block;background:#fff3dc;color:#7a5200;font:400 12px Ubuntu;letter-spacing:0;text-transform:none;padding:3px 8px;border-radius:4px;vertical-align:middle}

/* stock illustration marker (replace with real photos) */

.stk{position:absolute;top:12px;right:12px;z-index:3;background:rgba(255,243,220,.92);color:#7a5200;font:400 11px Ubuntu;font-style:normal;padding:3px 8px;border-radius:4px;pointer-events:none}

/* ---------- header ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:40;color:#fff;transition:background .3s,box-shadow .3s}
.hdr.solid{background:var(--ink);box-shadow:0 4px 20px rgba(0,0,0,.15)}
.hdr .wrap{display:flex;align-items:center;gap:30px;height:76px;max-width:none;padding:0 34px}
.logo{display:inline-flex;align-items:center;margin-right:auto;line-height:0}
.logo img{height:46px;width:auto;border-radius:2px;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.logo:hover img{transform:scale(1.04)}
.ft-logo img{height:36px}
.hdr .logo img{background:#f6f6f6;padding:3px;border-radius:4px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.menu{display:flex;gap:26px;font:500 13px Ubuntu;letter-spacing:.08em}
.menu a{opacity:.9;position:relative;padding:6px 0}
.menu a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transition:transform .3s}
.menu a:hover{color:var(--gold)}
.menu a.on{color:var(--gold)}.menu a.on::after{transform:scaleX(1)}
.hdr:not(.solid) .menu a{text-shadow:0 1px 6px rgba(0,0,0,.55)} /* legible over photos */
.hdr .btn{padding:10px 18px}
.burger{display:none;background:none;border:0;color:#fff;font-size:26px}

/* ---------- page hero ---------- */
.phero{position:relative;min-height:min(56vh,500px);display:flex;align-items:flex-end;color:#fff;background:var(--ink);overflow:hidden;isolation:isolate}
.phero.sm{min-height:min(46vh,400px)}
.phero .bgi{position:absolute;inset:0;z-index:-2;will-change:transform;transform:scale(1.08);animation:heroZoom 9s cubic-bezier(.2,.7,.2,1) forwards}
/* readable overlay: deep tint on the text side, soft vignette top/bottom, faint warm glow */
.phero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,22,24,.88) 0%,rgba(5,22,24,.7) 40%,rgba(5,22,24,.42) 100%),linear-gradient(180deg,rgba(5,22,24,.55) 0%,transparent 28%,transparent 58%,rgba(5,22,24,.92) 100%)}
.phero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(60% 80% at 0% 100%,rgba(255,195,108,.10),transparent 60%),radial-gradient(120% 90% at 50% 50%,transparent 55%,rgba(0,0,0,.35))}
.phero h1,.phero .lead,.phero .crumbs{text-shadow:0 2px 24px rgba(0,0,0,.35)}
@keyframes heroZoom{to{transform:scale(1)}}
.phero .wrap{width:100%;padding-top:130px;padding-bottom:56px}
#pd .phero .wrap{padding-bottom:100px}
.crumbs{font-size:13px;color:rgba(255,255,255,.85);margin-bottom:22px}
.crumbs a:hover{color:var(--gold)}
.crumbs span{margin:0 8px;opacity:.5}
.phero h1{font:500 clamp(36px,4.4vw,64px)/1.05 Ubuntu,Arial,sans-serif;letter-spacing:-.01em;margin:12px 0 14px;max-width:20ch}
@media (min-width:1001px){.phero h1{max-width:none;white-space:nowrap;font-size:clamp(34px,3.6vw,60px)}body[data-page="za-nas"] .phero h1{font-size:clamp(28px,2.8vw,48px)}}
.phero .lead{font-size:18px;color:#dfe9e9;max-width:560px}
body[data-page="kontakti"] .phero h1,body[data-page="kontakti"] .phero .lead{max-width:none}
.phero .acts{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}
.phero .facts{display:flex;gap:44px;margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,255,255,.18);flex-wrap:wrap}
.phero .facts b{display:block;font:500 26px Ubuntu;color:var(--gold)}
.phero .facts span{font-size:13px;color:#b9c8c9}
.phero>*{animation:fadeUp .9s cubic-bezier(.2,.8,.2,1) .1s backwards}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}}

/* ---------- generic sections ---------- */
.sec{padding:110px 0}
.sec.gray{background:var(--bg)}
.sec.dark{background:radial-gradient(ellipse 70% 60% at 50% 0,#0c2a2d,#03100f 70%);color:#fff}
.sec.tight{padding:80px 0}
.shead{text-align:center;max-width:680px;margin:0 auto 56px}
.shead .eyebrow{display:inline-flex;align-items:center;gap:12px}
.shead .eyebrow::before,.shead .eyebrow::after{content:"";width:28px;height:1px;background:var(--gold)}
.shead h2,.shead h1,.h2{font-size:clamp(30px,3.4vw,46px);font-weight:500;margin:14px 0 14px;letter-spacing:-.01em}
h1 em,h2 em,h3 em,h4 em{font:inherit;color:inherit;font-style:normal}
.shead p{color:var(--mute);font-size:17px}
.dark .shead p,.dark .mute{color:#9fb3b5}
.shead.left{text-align:left;margin-left:0}
.shead.left .eyebrow::before{display:none}
.mute{color:var(--mute)}

/* split: image + text */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(36px,6vw,90px);align-items:center}
.split.rev>:first-child{order:2}
.split .img{position:relative;aspect-ratio:4/5;border-radius:14px;overflow:hidden}
.split .img .cv{position:absolute;inset:0;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.split .img:hover .cv{transform:scale(1.05)}
.split .img .badge{position:absolute;left:22px;bottom:22px;background:rgba(7,30,33,.7);color:#fff;border-radius:10px;padding:14px 18px;font-size:13px}
.split .img .badge b{display:block;font:500 26px Ubuntu;color:var(--gold)}
.split p{color:var(--mute);font-size:17px;line-height:1.7}
.split p+p{margin-top:14px}
.split .btn{margin-top:30px}
.dark .split p{color:#9fb3b5}

/* tick list */
.ticks{display:grid;gap:12px;margin-top:24px}
.ticks li{display:flex;gap:12px;align-items:flex-start}
.ticks li::before{content:"";flex:0 0 22px;height:22px;border-radius:50%;background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12l4 4 8-8' fill='none' stroke='%23071e21' stroke-width='2.4'/%3E%3C/svg%3E") center/14px no-repeat;margin-top:1px}

/* image tiles (styles, rooms) */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tiles.c3{grid-template-columns:repeat(3,1fr)}
.tile{position:relative;aspect-ratio:3/4;border-radius:14px;overflow:hidden;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;isolation:isolate}
.tile .cv{position:absolute;inset:0;z-index:-2;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.tile::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 35%,rgba(7,30,33,.92));transition:background .5s}
.tile:hover .cv{transform:scale(1.08)}
.tile .n{position:absolute;top:20px;left:24px;font:500 13px Ubuntu;letter-spacing:.12em;color:var(--gold)}
.tile h3{font-size:22px;font-weight:500}
.tile p{font-size:14px;color:#cfdcdc;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s,opacity .5s,margin .5s}
.tile:hover p{max-height:120px;opacity:1;margin-top:8px}
@media (hover:none){.tile p{max-height:none;opacity:1;margin-top:8px}}

/* feature cards (icon + text) */
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.feats.c4{grid-template-columns:repeat(4,1fr)}
.feat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:30px 28px;position:relative;overflow:hidden;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s}
.feat::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s}
.feat:hover{transform:translateY(-6px);box-shadow:0 24px 50px -28px rgba(7,30,33,.35);border-color:transparent}
.feat:hover::after{transform:scaleX(1)}
.feat .ic{width:52px;height:52px;border-radius:50%;background:#fff6e8;display:grid;place-items:center;margin-bottom:18px;font:500 15px Ubuntu;color:var(--gold2)}
.feat .ic img{width:26px;height:26px;object-fit:contain}
.feat h3{font-size:20px;font-weight:500;margin-bottom:8px}
.feat p{font-size:15px;color:var(--mute);line-height:1.65}

/* materials table */
.mats{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.mat{position:relative;display:flex;flex-direction:column;border-radius:18px;background:#fff;border:1px solid var(--line);overflow:hidden;box-shadow:0 24px 50px -40px rgba(7,30,33,.45);color:inherit}
.mats .mat{transition:opacity .8s,transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.mats .mat.in:hover{transform:translateY(-8px);transition-delay:0s;border-color:rgba(185,134,47,.45);box-shadow:0 40px 70px -34px rgba(7,30,33,.55)}
.mat::before{content:"";position:absolute;left:0;top:0;z-index:3;height:3px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.mat:hover::before{transform:scaleX(1)}
.mat .ph{position:relative;aspect-ratio:5/4;background:var(--ink)}
.mat .ph .crop{position:absolute;inset:0;overflow:hidden}
.mat .ph .cv{position:absolute;inset:0;background-repeat:no-repeat;background-size:var(--z,220%);background-position:var(--p,50% 50%);transform-origin:var(--p,50% 50%);transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s;filter:saturate(1.05) contrast(1.04)}
.mat:hover .ph .cv{transform:scale(1.1);filter:saturate(1.15) contrast(1.08)}
.mat .ph .crop::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,30,33,.35),transparent 30%,transparent 55%,rgba(7,30,33,.82));pointer-events:none}
.mat .ph em{position:absolute;left:16px;top:16px;z-index:2;font:500 12px Ubuntu;font-style:normal;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:rgba(7,30,33,.72);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);padding:6px 11px;border-radius:999px;transition:background .4s,color .4s,border-color .4s}
.mat:hover .ph em{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.mat .ph b{position:absolute;right:18px;bottom:10px;z-index:2;font:700 64px/1 Ubuntu;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.75);letter-spacing:-.02em;transition:-webkit-text-stroke-color .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
.mat:hover .ph b{-webkit-text-stroke-color:var(--gold);transform:translateY(-4px)}
.mat .mi{position:absolute;left:22px;bottom:-28px;z-index:2;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--gold);border:4px solid #fff;box-shadow:0 10px 24px -8px rgba(7,30,33,.45);transition:transform .5s cubic-bezier(.2,1.4,.4,1)}
.mat .mi svg{width:24px;height:24px;fill:none;stroke:var(--ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mat:hover .mi{transform:rotate(-10deg) scale(1.08)}
.mat .bd{display:flex;flex-direction:column;flex:1;padding:46px 26px 26px}
.mat h3{font-size:22px;font-weight:500;margin-bottom:8px;color:var(--ink)}
.mat p{font-size:15px;line-height:1.65;color:#4a5b5d}
.mat small{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:20px}
.mat small span{font:500 12px Ubuntu;letter-spacing:.04em;padding:6px 12px;border-radius:999px;border:1px solid #dfe3e3;color:var(--ink);background:#f6f7f7;transition:border-color .5s,background .5s}
.mat:hover small span{border-color:rgba(185,134,47,.45);background:#fff6e8}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s;position:relative}
.steps::before{content:"";position:absolute;top:51px;left:12.5%;right:12.5%;height:1px;background:linear-gradient(90deg,rgba(255,195,108,.55),rgba(255,195,108,.12))}
.step{position:relative;text-align:center;padding:28px 22px 30px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012));border:1px solid rgba(255,255,255,.07);transition:border-color .3s,transform .3s}
.step:hover{border-color:rgba(255,195,108,.32);transform:translateY(-4px)}
.step::before{counter-increment:s;content:counter(s,decimal-leading-zero);position:relative;z-index:1;display:grid;place-items:center;width:46px;height:46px;margin:0 auto 22px;border-radius:50%;font:500 14px Ubuntu;background:var(--gold);color:var(--ink);box-shadow:0 0 0 6px rgba(255,195,108,.12),0 10px 28px -8px rgba(255,195,108,.5)}
.step h3{font-size:20px;font-weight:500;margin-bottom:10px}
.step p{font-size:15px;line-height:1.6;color:#9fb3b5}
.sec:not(.dark) .steps::before{background:var(--line)}

/* price factors / packages */
.pkgs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.pkg{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;padding:34px 30px;background:#fff;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
.pkg:hover{transform:translateY(-6px);box-shadow:0 30px 60px -34px rgba(7,30,33,.4)}
.pkg.hi{background:var(--ink);color:#fff;border-color:var(--ink);position:relative}
.pkg.hi .tagx{position:absolute;top:-12px;left:30px;background:var(--gold);color:var(--ink);font:500 12px Ubuntu;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border-radius:999px}
.pkg h3{font-size:24px;font-weight:500}
.pkg .sub{font-size:14px;color:var(--mute);margin:6px 0 22px}
.pkg.hi .sub{color:#9fb3b5}
.pkg .ticks{margin:0 0 28px;font-size:15px}
.pkg .btn{margin-top:auto}
.pkg.hi .btn.o{color:#fff;border-color:rgba(255,255,255,.4)}

/* project grid */
.filters{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:44px}
.filters button{background:none;border:1px solid #ddd;border-radius:40px;padding:10px 20px;font:500 14px Ubuntu;color:var(--mute);transition:all .3s}
.filters button:hover{border-color:var(--ink);color:var(--ink)}
.filters button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.filters button i{font-style:normal;opacity:.55;margin-left:6px;font-size:12px}
.pgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:28px}
.pgrid>.pcard{flex:0 0 calc((100% - 56px)/3)}
.pgrid.c4>.pcard{flex-basis:calc((100% - 84px)/4)}
.pcard{position:relative;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 30px 60px -46px rgba(7,30,33,.55);transition:opacity .8s,transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.pcard.hide{display:none}
.pcard.in:hover{transform:translateY(-8px);transition-delay:0s;border-color:rgba(185,134,47,.45);box-shadow:0 44px 70px -36px rgba(7,30,33,.6)}
.pcard::before{content:"";position:absolute;left:0;top:0;z-index:3;height:3px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.pcard:hover::before{transform:scaleX(1)}
.pcard .ph{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--ink)}
.pcard .ph .cv{position:absolute;inset:0;transform:scale(1.02);transition:transform 1.2s cubic-bezier(.2,.8,.2,1),filter .6s}
.pcard:hover .ph .cv{transform:scale(1.09);filter:saturate(1.1)}
.pcard .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,30,33,.3),transparent 35%);pointer-events:none}
.pcard .num{position:absolute;left:18px;top:16px;z-index:1;font:500 12px Ubuntu;letter-spacing:.14em;color:#fff;background:rgba(7,30,33,.72);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);padding:6px 11px;border-radius:999px}
.pcard .bd{display:flex;flex-direction:column;flex:1;padding:24px 26px 24px}
.pcard .cat{font:500 12px Ubuntu;letter-spacing:.16em;text-transform:uppercase;color:#8a5f14;display:flex;align-items:center;gap:10px}
.pcard .cat::before{content:"";width:22px;height:1px;background:currentColor}
.pcard h3{font-size:23px;font-weight:500;line-height:1.2;margin:10px 0 8px;color:var(--ink)}
.pcard p{font-size:15px;line-height:1.6;color:#4a5b5d;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pcard .more{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:18px;border-top:1px solid var(--line);font:500 14px Ubuntu;color:var(--ink)}
.pcard .bd p+.more{margin-top:20px}
.pcard .go{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:17px;border:1px solid #dfe3e3;transition:all .5s cubic-bezier(.2,.8,.2,1)}
.pcard:hover .go{background:var(--gold);border-color:var(--gold);transform:rotate(-45deg)}

/* project detail */
.pd-meta{display:grid;grid-template-columns:repeat(var(--n,4),1fr);border:1px solid var(--line);border-radius:14px;background:#fff;margin-top:-56px;position:relative;z-index:2;box-shadow:0 30px 60px -40px rgba(7,30,33,.4)}
.pd-meta div{padding:24px 26px;border-right:1px solid var(--line)}
.pd-meta div:last-child{border-right:0}
.pd-meta span{display:block;font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:6px}
.pd-meta b{font:500 16px Ubuntu}
.pd-body{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(36px,6vw,90px)}
.pd-body h2{font-size:clamp(26px,2.6vw,34px);font-weight:500}
.pd-body .blk+.blk{margin-top:40px}
.pd-body .blk p{color:var(--mute);font-size:17px;line-height:1.75;margin-top:14px}
.gal{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.gal a{position:relative;aspect-ratio:4/3;border-radius:12px;overflow:hidden;cursor:zoom-in}
.gal a:first-child,.gal a:last-child:nth-child(even){grid-column:span 2;aspect-ratio:16/9}
.gal .cv{position:absolute;inset:0;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.gal a:hover .cv{transform:scale(1.05)}
.lb{position:fixed;inset:0;z-index:100;background:rgba(3,10,10,.92);display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .3s;padding:30px}
.lb.on{opacity:1;pointer-events:auto}
.lb img{max-height:88vh;max-width:92vw;border-radius:8px;transform:scale(.96);transition:transform .4s}
.lb.on img{transform:none}
.lb button{position:absolute;top:22px;right:22px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:none;color:#fff;font-size:18px}
.quote{background:var(--ink);color:#fff;border-radius:16px;padding:40px;position:relative;overflow:hidden}
.quote::before{content:"“";position:absolute;right:26px;top:-10px;font:700 140px/1 Ubuntu,Arial,sans-serif;color:rgba(255,195,108,.15)}
.quote q{display:block;font:400 22px/1.5 Ubuntu,Arial,sans-serif;quotes:"„" "“"}
.quote small{display:block;margin-top:18px;color:#9fb3b5}
.pager{display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--line);padding-top:30px}
.pager a{display:block;padding:10px 0}
.pager a:last-child{text-align:right}
.pager span{font-size:13px;color:var(--mute)}
.pager b{display:block;font:500 22px Ubuntu;margin-top:4px;transition:color .3s}
.pager a:hover b{color:var(--gold2)}

/* compare (before/after style split cards) */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.duo .c{border-radius:16px;padding:36px;border:1px solid var(--line)}
.duo .c.hi{background:var(--ink);color:#fff;border-color:var(--ink)}
.duo .c h3{font-size:22px;font-weight:500;margin-bottom:18px}
.duo .c.hi .ticks li::before{background-color:var(--gold)}
.duo .c:not(.hi) .ticks li::before{background:#eee url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M17 7L7 17' fill='none' stroke='%235d6f71' stroke-width='2.2'/%3E%3C/svg%3E") center/12px no-repeat}
.duo .c:not(.hi) li{color:var(--mute)}

/* stats strip */
.nums{position:relative;display:grid;grid-template-columns:repeat(4,1fr);text-align:center;border:1px solid rgba(7,30,33,.1);border-radius:20px;background:#fff;overflow:hidden}
.nums>div{position:relative;padding:44px 20px 40px;transition:background .5s}
.nums>div+div{border-left:1px solid rgba(7,30,33,.1)}
.nums>div::before{content:'';position:absolute;left:50%;top:0;width:0;height:2px;background:var(--gold);transform:translateX(-50%);transition:width .9s cubic-bezier(.2,.8,.2,1) .2s}
.nums>div.in::before{width:48px}
.nums>div:hover::before{width:100%;transition-delay:0s}
.nums>div:hover{background:rgba(255,195,108,.06)}
.nums b{display:block;font:500 clamp(42px,4.6vw,64px)/1 Ubuntu;letter-spacing:-.02em;font-variant-numeric:tabular-nums;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.nums>div:hover b{transform:translateY(-4px)}
.nums span{display:block;margin-top:14px;font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.dark .nums{border-color:rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));box-shadow:0 30px 80px -40px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06);}
.dark .nums>div+div{border-left-color:rgba(255,255,255,.08)}
.dark .nums b{background:linear-gradient(180deg,#ffe0a8 0%,var(--gold) 55%,#d99a3c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(255,195,108,.15)}
.dark .nums span{color:#9fb3b5}

/* timeline (about) */
.tl{position:relative;max-width:1080px;margin:0 auto;padding:0;list-style:none;--p:0}
.tl::before,.tl::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--line);border-radius:2px}
.tl::after{background:linear-gradient(180deg,var(--gold),var(--gold2));transform:scaleY(var(--p));transform-origin:top}
.tl li{display:grid;grid-template-columns:1fr 96px 1fr;align-items:center;padding:0 0 72px;position:relative}
.tl li:last-child{padding-bottom:0}
.tl .m{grid-column:1;grid-row:1;position:relative;aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:var(--ink);box-shadow:0 30px 60px -35px rgba(7,30,33,.55)}
.tl .m .cv{position:absolute;inset:0;transform:scale(1.04);filter:saturate(.75);transition:transform 1.2s cubic-bezier(.2,.8,.2,1),filter .6s}
.tl .m::after{content:"";position:absolute;inset:0;background:linear-gradient(200deg,transparent 40%,rgba(7,30,33,.8))}
.tl .m b{position:absolute;left:24px;bottom:14px;z-index:1;font:500 clamp(40px,5vw,64px)/1 Ubuntu;color:#fff;letter-spacing:-.02em}
.tl li:hover .m .cv{transform:scale(1.1);filter:none}
.tl .dot{grid-column:2;grid-row:1;justify-self:center;position:relative;z-index:1;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--line);transition:all .5s cubic-bezier(.2,.8,.2,1)}
.tl li.on .dot{border-color:var(--gold);background:var(--gold);box-shadow:0 0 0 7px rgba(255,195,108,.2)}
.tl .t{grid-column:3;grid-row:1;padding:8px 0}
.tl .t small{display:block;font:500 12px Ubuntu;letter-spacing:.16em;text-transform:uppercase;color:var(--gold2);margin-bottom:10px}
.tl h3{font-size:clamp(22px,2.2vw,28px);font-weight:500;margin-bottom:10px}
.tl p{color:var(--mute);font-size:17px;max-width:380px}
.tl li:nth-child(odd) .m{grid-column:3}
.tl li:nth-child(odd) .t{grid-column:1;text-align:right}
.tl li:nth-child(odd) .t p{margin-left:auto}
.tl li.rv .m{transform:translateX(-40px);transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.tl li.rv:nth-child(odd) .m{transform:translateX(40px)}
.tl li.rv.in .m{transform:none}
.tl li.last .m{box-shadow:0 0 0 2px var(--gold),0 30px 60px -35px rgba(7,30,33,.55)}

/* team */
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.team.owners{grid-template-columns:repeat(2,1fr);max-width:820px;margin:0 auto;gap:28px}
.team.owners .mem h3{font-size:24px}
.mem{position:relative;border-radius:16px;overflow:hidden;background:var(--ink);isolation:isolate;box-shadow:0 2px 8px rgba(7,30,33,.06);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.mem:hover,.team .mem.rv.in:hover{transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s;transition-delay:0s;transform:translateY(-8px);box-shadow:0 28px 50px -22px rgba(7,30,33,.55)}
.mem .ph{aspect-ratio:3/4;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(70% 55% at 50% 38%,rgba(255,195,108,.16),transparent 70%),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 34px),linear-gradient(160deg,#0e2f33,#071e21 70%);background-size:cover;background-position:center;transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.mem:hover .ph{transform:scale(1.06)}
.mem .ph::before{content:"";position:absolute;inset:12px;border:1px solid rgba(255,195,108,.22);border-radius:10px;z-index:2;transition:inset .5s,border-color .5s}
.mem:hover .ph::before{inset:8px;border-color:rgba(255,195,108,.5)}
.mem .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(7,30,33,.55) 70%,rgba(7,30,33,.95));z-index:1}
.mem .ini{font:400 clamp(90px,9vw,140px)/1 Ubuntu,Arial,sans-serif;color:transparent;-webkit-text-stroke:1px rgba(255,195,108,.7);margin-top:-18%;transition:transform .8s cubic-bezier(.2,.8,.2,1),color .6s}
.mem:hover .ini{transform:translateY(-6px) scale(1.04);color:rgba(255,195,108,.12)}
.mem .ph[style] .ini{display:none}
.mem .inf{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:0 26px 26px;color:#fff}
.mem .inf small{display:flex;align-items:center;gap:10px;font:500 12px Ubuntu;letter-spacing:.2em;color:var(--gold)}
.mem .inf small::after{content:"";height:1px;width:24px;background:var(--gold);transition:width .5s cubic-bezier(.2,.8,.2,1)}
.mem:hover .inf small::after{width:56px}
.mem h3{font-size:20px;font-weight:500;margin-top:10px;color:#fff}
.mem p{font-size:14px;color:rgba(255,255,255,.65);margin-top:2px}

/* contact */
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.office{position:relative;border:1px solid rgba(7,30,33,.06);border-radius:18px;overflow:hidden;background:#f7f2e8;color:var(--ink);display:flex;flex-direction:column;box-shadow:0 30px 60px -46px rgba(7,30,33,.55);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.office::before{content:"";position:absolute;left:0;top:0;z-index:3;height:3px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.office:hover{transform:translateY(-6px);box-shadow:0 30px 60px -20px rgba(7,30,33,.45),0 0 0 2px var(--gold),0 10px 50px -10px rgba(255,195,108,.35)}
.office:hover::before{transform:scaleX(1)}
.office .map{position:relative;height:280px;background:#e9e2d3}
.office .map::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:70px;background:linear-gradient(180deg,rgba(247,242,232,0),#f7f2e8);pointer-events:none}
.office iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(1) sepia(.35) saturate(1.3) contrast(.92) brightness(1.03);transition:filter .6s}
.office:hover iframe{filter:sepia(.1) saturate(1.05)}
.office .num{position:absolute;left:18px;bottom:22px;z-index:2;font:500 12px Ubuntu;letter-spacing:.14em;color:#fff;background:rgba(5,9,9,.82);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);padding:6px 11px;border-radius:999px}
.office .bd{position:relative;display:flex;flex-direction:column;flex:1;padding:14px 30px 26px}
.office .cat{font:500 12px Ubuntu;letter-spacing:.16em;text-transform:uppercase;color:#8a5f14;display:flex;align-items:center;gap:10px}
.office .cat::before{content:"";width:22px;height:1px;background:currentColor}
.office h3{font-size:30px;font-weight:500;margin:10px 0 14px;color:var(--ink)}
.office dl{display:grid;grid-template-columns:120px 1fr;gap:0;margin:0;font-size:15px}
.office dt,.office dd{padding:12px 0;border-bottom:1px solid rgba(7,30,33,.1)}
.office dl>:nth-last-child(-n+2){border-bottom:0}
.office dt{color:#7a6a4f;font:500 12px/1.9 Ubuntu;letter-spacing:.12em;text-transform:uppercase}
.office dd{margin:0;color:var(--ink)}
.office dd a{color:var(--ink);font-weight:500;transition:color .3s}.office dd a:hover{color:#8a5f14}
.office .more{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:18px;border-top:1px solid rgba(0,0,0,.12);font:500 14px Ubuntu;color:var(--ink)}
.office .go{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:17px;border:1px solid rgba(7,30,33,.18);transition:all .5s cubic-bezier(.2,.8,.2,1)}
.office .more:hover .go,.office:hover .go{background:var(--gold);border-color:var(--gold);transform:rotate(-45deg)}
.office .note{background:rgba(255,195,108,.18);color:#8a5f14;border:1px dashed rgba(185,134,47,.5)}
.chan-sec{position:relative;z-index:3;margin-top:-64px;padding-bottom:90px}
.chan{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.ch{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;padding:34px 32px 30px;min-height:300px;justify-content:flex-end;border-radius:18px;background:var(--ink);color:#fff;border:1px solid rgba(255,195,108,.14);box-shadow:0 30px 60px -40px rgba(7,30,33,.45);overflow:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.ch::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,22,24,.78) 0%,rgba(5,22,24,.72) 35%,rgba(5,22,24,.9) 70%,rgba(5,22,24,.97) 100%),var(--ph) center/cover;transform:scale(1.02);transition:transform 1.2s cubic-bezier(.2,.8,.2,1),filter .6s;filter:saturate(.7) brightness(.9)}
.chan .ch:nth-child(1){--ph:url(../img/opt/kitchen-1400.webp)}
.chan .ch:nth-child(2){--ph:url(../img/opt/bungalo-1400.webp)}
.chan .ch:nth-child(3){--ph:url(../img/opt/airbnb-1400.webp)}
.chan .ch{transition:opacity .8s,transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.chan .ch:hover{transform:translateY(-8px);border-color:rgba(255,195,108,.45);box-shadow:0 40px 70px -36px rgba(7,30,33,.7)}
.ch:hover::after{transform:scale(1.08);filter:saturate(.95) brightness(1)}
.ch .ico{position:absolute;left:32px;top:34px;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:rgba(255,195,108,.14);border:1px solid rgba(255,195,108,.35);transition:background .4s,transform .5s cubic-bezier(.2,1.4,.4,1)}
.ch .ico svg{width:24px;height:24px;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}
.ch:hover .ico{background:var(--gold);transform:rotate(-8deg) scale(1.06)}
.ch:hover .ico svg{stroke:var(--ink)}
.ch .k{font:500 12px Ubuntu;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.ch b{font:500 clamp(20px,1.8vw,24px) Ubuntu;margin:8px 0 6px;word-break:break-word;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.ch small{font-size:14px;color:rgba(255,255,255,.72)}
.ch .go{position:absolute;right:28px;top:34px;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);backdrop-filter:blur(6px);display:grid;place-items:center;overflow:hidden;transition:background .45s,border-color .45s,transform .5s cubic-bezier(.2,1.4,.4,1),box-shadow .45s}
.ch .go svg{grid-area:1/1;width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s cubic-bezier(.2,.8,.2,1),stroke .4s}
.ch .go svg+svg{transform:translate(-150%,150%)}
.ch:hover .go{background:var(--gold);border-color:var(--gold);transform:scale(1.06);box-shadow:0 10px 30px -8px rgba(255,195,108,.55)}
.ch:hover .go svg{transform:translate(150%,-150%);stroke:var(--ink)}
.ch:hover .go svg+svg{transform:none}
.ch.hi .go{background:var(--gold);border-color:var(--gold)}.ch.hi .go svg{stroke:var(--ink)}
.ch.hi{border-color:rgba(255,195,108,.4)}

/* inline form (contacts) */
.iform{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.iform .full{grid-column:span 2}
.iform input,.iform textarea,.iform select{font:15px Ubuntu;color:var(--ink);background:#fff;border:1px solid var(--line);padding:15px;border-radius:8px;width:100%;outline:none;transition:border-color .3s}
.iform input:focus,.iform textarea:focus,.iform select:focus{border-color:var(--gold)}
.iform .agree{display:flex;gap:8px;font-size:13px;color:var(--mute);align-items:start}
.iform .agree input{width:auto;margin-top:3px}
.iform .ok{display:none}
.iform.sent>*{display:none}.iform.sent .ok{display:block;grid-column:span 2;padding:40px;text-align:center;background:#fff;border-radius:12px}
.iform .ok b{font:500 26px Ubuntu;display:block;margin-bottom:8px}

/* brands strip */
.brands{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:30px 50px}
.brands img{max-height:46px;max-width:130px;object-fit:contain;filter:grayscale(1);opacity:.7;transition:.3s}
.brands img:hover{filter:none;opacity:1}

/* legal prose */
.prose{max-width:780px;margin:0 auto}
.prose h2{font-size:28px;font-weight:500;margin:56px 0 14px;padding-top:20px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:19px;font-weight:500;margin:26px 0 8px}
.prose p,.prose li{color:#3f5254;line-height:1.75;margin-bottom:12px}
.prose ul{list-style:disc;padding-left:22px}
.toc{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:50px}
.toc a{border:1px solid var(--line);border-radius:999px;padding:9px 18px;font-size:14px}
.toc a:hover{border-color:var(--ink)}

/* thank-you */
.thanks{min-height:100vh;display:grid;place-items:center;text-align:center;background:radial-gradient(ellipse 70% 60% at 50% 0,#0c2a2d,#03100f 70%);color:#fff;padding:120px 24px}
.thanks .ring{width:96px;height:96px;margin:0 auto 30px;border-radius:50%;border:2px solid var(--gold);display:grid;place-items:center;animation:pop .8s cubic-bezier(.2,1.4,.4,1) backwards}
.thanks .ring svg{width:44px;stroke:var(--gold);stroke-width:2.4;fill:none;stroke-dasharray:30;stroke-dashoffset:30;animation:draw .6s .5s forwards}
@keyframes pop{from{transform:scale(.4);opacity:0}}
@keyframes draw{to{stroke-dashoffset:0}}
.thanks h1{font:500 clamp(40px,5vw,72px)/1.05 Ubuntu,Arial,sans-serif}
.thanks p{color:#9fb3b5;max-width:520px;margin:14px auto 0;font-size:17px}
.thanks ol{max-width:520px;margin:40px auto;padding:0;list-style:none;text-align:left;display:grid;gap:12px;counter-reset:t}
.thanks ol li{display:flex;gap:14px;align-items:center;background:rgba(255,255,255,.04);border:1px solid #1d3a3d;border-radius:12px;padding:16px 20px}
.thanks ol li::before{counter-increment:t;content:counter(t);flex:0 0 30px;height:30px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;font:500 14px Ubuntu}
.thanks .acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.thanks .btn.o{color:#fff;border-color:rgba(255,255,255,.4)}

/* ---------- FAQ (same as home) ---------- */
.faq{background:#eee;padding:110px 0;position:relative;overflow:hidden}
.faq::before{content:"?";position:absolute;left:50%;top:40px;transform:translateX(-50%);font:700 420px/1 Ubuntu;color:rgba(7,30,33,.035);pointer-events:none}
.faq .list{max-width:880px;margin:0 auto;display:grid;gap:14px;position:relative;counter-reset:q}
.faq .it{background:#fff;border-radius:14px;border:1px solid rgba(7,30,33,.06);box-shadow:0 2px 6px rgba(7,30,33,.04);position:relative;overflow:hidden;transition:box-shadow .4s,transform .4s,border-color .4s}
.faq .it:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(7,30,33,.08)}
.faq .it.on{border-color:rgba(255,195,108,.6);box-shadow:0 18px 40px rgba(7,30,33,.10)}
.faq .q{all:unset;box-sizing:border-box;width:100%;display:grid;grid-template-columns:44px 1fr 40px;align-items:center;gap:14px;padding:22px 26px;cursor:pointer;font:500 18px Ubuntu;color:var(--ink)}
.faq .q:focus-visible{outline:2px solid var(--gold);outline-offset:-4px;border-radius:14px}
.faq .q::before{counter-increment:q;content:counter(q,decimal-leading-zero);font:500 14px Ubuntu;color:var(--mute);letter-spacing:.06em;transition:color .3s}
.faq .it.on .q::before{color:#8a5f14}
.faq .pm{width:40px;height:40px;border-radius:50%;background:#f3f3f3;position:relative;transition:background .4s,transform .5s cubic-bezier(.2,.8,.2,1)}
.faq .pm::before,.faq .pm::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:var(--ink);border-radius:2px;transform:translate(-50%,-50%);transition:transform .4s,background .4s}
.faq .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq .it.on .pm{background:var(--ink);transform:rotate(180deg)}
.faq .it.on .pm::before,.faq .it.on .pm::after{background:var(--gold)}
.faq .it.on .pm::after{transform:translate(-50%,-50%) rotate(0)}
.faq .a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.2,.8,.2,1)}
.faq .it.on .a{grid-template-rows:1fr}
.faq .a>div{overflow:hidden}
.faq .a p{margin:0;padding:0 80px 26px 84px;font-size:16px;line-height:1.7;color:var(--mute);opacity:0;transform:translateY(-6px);transition:opacity .4s,transform .4s}
.faq .it.on .a p{opacity:1;transform:none;transition-delay:.12s}

/* ---------- footer ---------- */
.ft{padding:100px 0 50px}
.ft .cta{position:relative;isolation:isolate;overflow:hidden;text-align:center;color:#fff;border-radius:14px;padding:110px 24px;background:var(--ink)}
.ft .cta::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at center,rgba(7,30,33,.5),rgba(7,30,33,.88) 78%),url(../hero/f145.jpg) center 45%/cover;transform:scale(1.12);transition:transform 2.4s cubic-bezier(.2,.8,.2,1)}
.ft .cta.in::before{transform:scale(1)}
.ft .cta::after{content:"";position:absolute;inset:16px;z-index:-1;border:1px solid rgba(255,195,108,.35);border-radius:8px;pointer-events:none}
.ft .cta h2{font:500 clamp(34px,4vw,54px)/1.1 Ubuntu,Arial,sans-serif;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.ft .cta p{color:rgba(255,255,255,.78);margin:12px 0 28px}
.ft .cta div{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ft .cta .btn{min-width:200px}
.ft .cta .btn.o{color:#fff;border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.06)}
.ft .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:24px;border-top:1px solid #eee;margin-top:80px;padding-top:36px;font-size:14px;line-height:2.1}
.ft .cols a:hover{color:#b9822c}
.ft .cols .eyebrow{display:block;margin-bottom:4px}
.ft .copy{display:flex;justify-content:space-between;margin-top:40px;font-size:12px;color:#5f6b6c;flex-wrap:wrap;gap:10px}
.ft .copy a:hover{color:var(--ink)}

/* ---------- side panel form ---------- */
.ov{position:fixed;inset:0;background:rgba(7,30,33,.55);opacity:0;pointer-events:none;transition:opacity .35s;z-index:80}
.panel{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);background:#fff;z-index:90;transform:translateX(100%);transition:transform .45s cubic-bezier(.2,.8,.2,1);padding:30px 34px;display:flex;flex-direction:column;overflow:auto}
body.open .ov{opacity:1;pointer-events:auto}
body.open .panel{transform:none}
body.open{overflow:hidden}
.panel .hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.panel h3{font-size:28px}
.panel .x{background:#fff3dc;color:#b9822c;border:0;border-radius:8px;width:38px;height:38px;font-size:18px}
.panel .intro{color:var(--mute);font-size:14px;margin-bottom:20px}
.panel form{display:flex;flex-direction:column;gap:12px;flex:1}
.panel input,.panel textarea{font:15px Ubuntu;color:var(--ink);background:#fff6e8;border:1px solid transparent;padding:14px;border-radius:8px;width:100%;outline:none}
.panel input:focus,.panel textarea:focus{border-color:var(--gold)}
.panel .tel{display:grid;grid-template-columns:96px 1fr;gap:8px}
.panel .tel span{background:#fff6e8;border-radius:8px;padding:14px;font-size:14px}
.panel .lbl{font-size:13px;color:var(--mute);margin-top:4px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{cursor:pointer}
.chips input{display:none}
.chips span{display:inline-block;border:1px solid var(--ink);border-radius:999px;padding:7px 14px;font-size:14px;transition:.2s}
.chips input:checked+span{background:var(--gold);border-color:var(--gold)}
.panel .agree{display:flex;gap:8px;font-size:13px;color:var(--mute);align-items:start}
.panel .agree input{width:auto;margin-top:3px}
.panel .agree a{text-decoration:underline}
.panel .send{margin-top:auto;border-radius:8px;padding:16px}

/* ---------- floating viber (mobile) ---------- */
.fab{position:fixed;right:18px;bottom:18px;z-index:30;display:none;width:56px;height:56px;border-radius:50%;background:#7360f2;color:#fff;place-items:center;font:500 12px Ubuntu;box-shadow:0 10px 30px -8px rgba(115,96,242,.7)}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
.stag>.rv:nth-child(2){transition-delay:.08s}.stag>.rv:nth-child(3){transition-delay:.16s}.stag>.rv:nth-child(4){transition-delay:.24s}.stag>.rv:nth-child(5){transition-delay:.32s}.stag>.rv:nth-child(6){transition-delay:.4s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.phero .bgi{animation:none;transform:none}}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .menu{display:none}.burger{display:block}
  .hdr.mopen{background:var(--ink)}
  .hdr.mopen .menu{display:flex;flex-direction:column;position:absolute;top:76px;left:0;right:0;background:var(--ink);padding:20px 34px 30px;gap:16px}
  .split,.pd-body,.cgrid{grid-template-columns:1fr}.split.rev>:first-child{order:0}
  .split .img{aspect-ratio:16/11}
  .tiles,.mats{grid-template-columns:repeat(2,1fr)}
  .feats,.feats.c4,.pkgs,.team{grid-template-columns:repeat(2,1fr)}
  .pgrid>.pcard,.pgrid.c4>.pcard{flex-basis:calc((100% - 28px)/2)}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:44px}.steps::before{display:none}
  .pd-meta{grid-template-columns:repeat(2,1fr)}.pd-meta div:nth-child(2){border-right:0}.pd-meta div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .nums{grid-template-columns:repeat(2,1fr)}.nums>div:nth-child(3){border-left:0}.nums>div:nth-child(n+3){border-top:1px solid rgba(7,30,33,.1)}.dark .nums>div:nth-child(n+3){border-top-color:rgba(255,255,255,.08)}.nums>div{padding:32px 14px 28px}
  .ft .cols{grid-template-columns:1fr 1fr}
  .chan{grid-template-columns:1fr}.chan-sec{margin-top:-40px;padding-bottom:70px}
}
@media (max-width:640px){
  .wrap{padding:0 20px}.hdr .wrap{padding:0 20px}.hdr .btn{display:none}
  .sec{padding:80px 0}
  .phero .wrap{padding-bottom:56px}.phero .facts{gap:26px}
  .tiles,.tiles.c3,.feats,.feats.c4,.pkgs,.team,.mats,.duo,.gal{grid-template-columns:1fr}
  .team.owners{grid-template-columns:1fr;max-width:420px}
  .pgrid>.pcard,.pgrid.c4>.pcard{flex-basis:100%}
  .gal a:first-child{grid-column:auto}
  .mat .bd{padding:44px 22px 24px}.mat .ph b{font-size:52px}
  .steps{grid-template-columns:1fr}
  .tl::before,.tl::after{left:9px}.tl li{grid-template-columns:1fr;gap:18px;padding:0 0 48px 40px}
  .tl .dot{position:absolute;left:0;top:0}
  .tl .m,.tl li:nth-child(odd) .m,.tl .t,.tl li:nth-child(odd) .t{grid-column:1;grid-row:auto;text-align:left}
  .tl li:nth-child(odd) .t p{margin-left:0}
  .tl li.rv .m,.tl li.rv:nth-child(odd) .m{transform:none}
  .iform{grid-template-columns:1fr}.iform .full{grid-column:auto}
  .faq .q{grid-template-columns:30px 1fr 36px;padding:18px;font-size:16px;gap:10px}.faq .pm{width:36px;height:36px}.faq .a p{padding:0 18px 22px 58px}
  .ft .cta{padding:80px 20px;border-radius:10px}.ft .cta::after{inset:10px}
  .fab{display:grid}
}

/* before/after slider */
.ba{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;--p:50%;user-select:none;box-shadow:0 40px 80px -50px rgba(0,0,0,.8)}
.ba .cv{position:absolute;inset:0}
.ba .after{clip-path:inset(0 0 0 var(--p))}
.ba .knob{position:absolute;top:0;bottom:0;left:var(--p);width:2px;background:var(--gold);transform:translateX(-1px);pointer-events:none}
.ba .knob::after{content:"⟷";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;font-size:20px;box-shadow:0 0 0 8px rgba(255,195,108,.25)}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.ba .lb1,.ba .lb2{position:absolute;bottom:18px;font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;background:rgba(7,30,33,.65);color:#fff;padding:7px 12px;border-radius:999px;pointer-events:none}
.ba .lb1{left:18px}.ba .lb2{right:18px;color:var(--gold)}

/* ---------- inquiry (kontakti) ---------- */
.inq{position:relative;background:linear-gradient(180deg,#fff 0%,var(--bg) 100%);overflow:hidden}
.inq::before{content:"";position:absolute;right:-10%;top:-20%;width:60%;height:120%;background:radial-gradient(closest-side,rgba(255,195,108,.18),transparent);pointer-events:none}
.inq .wrap{position:relative}
.inq .split{align-items:start}
.inq-l{padding-top:20px}
.inq-l .eyebrow{color:var(--gold2);display:inline-flex;align-items:center;gap:12px}
.inq-l .eyebrow::before{content:"";width:28px;height:1px;background:var(--gold2)}
.inq-steps{list-style:none;padding:0;margin:34px 0 0;display:grid;gap:12px}
.inq-steps li{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;transition:transform .4s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s}
.inq-steps li:hover{transform:translateX(6px);border-color:rgba(255,195,108,.6);box-shadow:0 14px 30px -18px rgba(7,30,33,.35)}
.inq-steps b{flex:0 0 40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--gold);font:500 13px Ubuntu;letter-spacing:.06em}
.inq-steps strong{display:block;font:500 16px Ubuntu;color:var(--ink)}
.inq-steps span{font-size:14px;color:var(--mute)}
.inq-alt{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:28px;font-size:14px;color:var(--mute)}
.inq-alt a{padding:9px 16px;border-radius:999px;border:1px solid var(--ink);color:var(--ink);font-weight:500;transition:all .3s}
.inq-alt a:hover{background:var(--ink);color:#fff}
.inq-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:34px;gap:14px;box-shadow:0 40px 80px -40px rgba(7,30,33,.35);overflow:hidden}
.inq-card::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold2),var(--gold))}
.inq-hd{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.inq-hd b{font:500 22px Ubuntu}
.inq-hd span{font-size:13px;color:var(--mute)}
.inq-card .fl{position:relative;display:block}
.inq-card .fl input,.inq-card .fl textarea,.inq-card .fl select{background-color:#fafafa;padding:22px 15px 8px;border-radius:10px;resize:vertical;appearance:none;-webkit-appearance:none}
.inq-card .fl select{background:#fafafa url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23071e21' stroke-width='2'/%3E%3C/svg%3E") right 14px center/16px no-repeat;cursor:pointer}
.inq-card .fl input:focus,.inq-card .fl textarea:focus,.inq-card .fl select:focus{background-color:#fff;border-color:var(--gold);box-shadow:0 0 0 4px rgba(255,195,108,.2)}
.inq-card .fl>span{position:absolute;left:16px;top:16px;font-size:15px;color:#8a9697;pointer-events:none;transition:all .25s}
.inq-card .fl input:focus+span,.inq-card .fl input:not(:placeholder-shown)+span,.inq-card .fl textarea:focus+span,.inq-card .fl textarea:not(:placeholder-shown)+span,.inq-card .fl.sel>span{top:7px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold2)}
.inq-card .chips{border:0;padding:0;margin:4px 0 2px;display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.inq-card .chips legend{font-size:13px;color:var(--mute);margin-bottom:10px;padding:0}
.inq-card .chips label{cursor:pointer}
.inq-card .chips input{position:absolute;opacity:0;pointer-events:none}
.inq-card .chips span{display:inline-block;padding:9px 16px;border-radius:999px;border:1px solid var(--line);background:#fafafa;font-size:14px;transition:all .25s}
.inq-card .chips label:hover span{border-color:var(--gold)}
.inq-card .chips input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.inq-card .chips input:focus-visible+span{box-shadow:0 0 0 3px rgba(255,195,108,.5)}
.inq-card .agree{margin-top:2px}
.inq-card .agree input{accent-color:var(--ink)}
.inq-btn{position:relative;overflow:hidden;padding:17px 26px;border-radius:10px;font-size:16px;margin-top:4px}
.inq-btn::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,195,108,.35) 50%,transparent 70%);transform:translateX(-100%);transition:transform .8s}
.inq-btn:hover::before{transform:translateX(100%)}
.inq-btn span{display:inline-block;color:var(--gold);transition:transform .3s}
.inq-btn:hover span{transform:translateX(5px)}
.inq-safe{font-size:12px;color:#8a9697;text-align:center}
/* dark, high-contrast form card */
.inq-card{background:radial-gradient(ellipse 90% 60% at 100% 0,#123a3e,var(--ink) 65%);border-color:var(--ink);color:#fff;box-shadow:0 50px 90px -40px rgba(7,30,33,.7)}
.inq-card::after{content:"";position:absolute;right:-80px;top:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,195,108,.22),transparent);pointer-events:none}
.inq-card>*{position:relative;z-index:1}
.inq-hd b{color:#fff}.inq-hd span{color:var(--gold)}
.inq-card .fl input,.inq-card .fl textarea,.inq-card .fl select{background-color:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#fff}
.inq-card .fl select{background:rgba(255,255,255,.06) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23ffc36c' stroke-width='2'/%3E%3C/svg%3E") right 14px center/16px no-repeat}
.inq-card .fl select option{color:var(--ink);background:#fff}
.inq-card .fl input:hover,.inq-card .fl textarea:hover,.inq-card .fl select:hover{border-color:rgba(255,255,255,.32)}
.inq-card .fl input:focus,.inq-card .fl textarea:focus,.inq-card .fl select:focus{background-color:rgba(255,255,255,.1);border-color:var(--gold);box-shadow:0 0 0 4px rgba(255,195,108,.18)}
.inq-card .fl>span{color:#a9bcbe}
.inq-card .fl input:focus+span,.inq-card .fl input:not(:placeholder-shown)+span,.inq-card .fl textarea:focus+span,.inq-card .fl textarea:not(:placeholder-shown)+span,.inq-card .fl.sel>span{color:var(--gold)}
.inq-card .chips legend{color:#c9d6d7}
.inq-card .chips span{background:transparent;border-color:rgba(255,255,255,.22);color:#fff}
.inq-card .chips label:hover span{border-color:var(--gold);color:var(--gold)}
.inq-card .chips input:checked+span{background:var(--gold);border-color:var(--gold);color:var(--ink);font-weight:500}
.inq-card .agree{color:#c9d6d7}.inq-card .agree a{color:var(--gold)}
.inq-card .agree input{accent-color:var(--gold)}
.inq-card .inq-btn{background:var(--gold);border-color:var(--gold);color:var(--ink);font-weight:500;box-shadow:0 14px 30px -12px rgba(255,195,108,.55)}
.inq-card .inq-btn:hover{background:#ffd08a}
.inq-card .inq-btn::before{background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.5) 50%,transparent 70%)}
.inq-card .inq-btn span{color:var(--ink)}
.inq-card .inq-safe{font-size:13px;line-height:1.5;color:#8fa5a7;margin:0}
.inq-card.sent .ok{background:transparent;color:#fff}
.inq-card .fl input:-webkit-autofill{-webkit-text-fill-color:#fff;-webkit-box-shadow:0 0 0 100px #14383b inset;caret-color:#fff}
@media (max-width:640px){.inq-card{padding:24px 18px}}

/* ---- kuhni: 3D compare ---- */
.viz-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(36px,5vw,80px);align-items:center}
.viz-txt>p{color:#9fb3b5;font-size:17px;line-height:1.7;max-width:480px}
.viz-steps{margin:30px 0 34px;display:grid;gap:4px;counter-reset:s}
.viz-steps li{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:16px 0;border-top:1px solid rgba(255,255,255,.08)}
.viz-steps li:last-child{border-bottom:1px solid rgba(255,255,255,.08)}
.viz-steps b{font:500 13px Ubuntu;color:var(--gold);letter-spacing:.08em;padding-top:3px}
.viz-steps h3{font-size:18px;font-weight:500;margin-bottom:4px}
.viz-steps p{color:#9fb3b5;font-size:14.5px;line-height:1.6}
.cmp{position:relative;aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:var(--ink);box-shadow:0 40px 80px -30px rgba(0,0,0,.7),0 0 0 1px rgba(255,195,108,.14);user-select:none;transition:opacity .25s}
.cmp.swap{opacity:.35}
.cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cmp .plan{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--x)) 0 0);background:var(--ink)}
.cmp .plan img{filter:url(#bp)}
.cmp.ba .plan img{filter:none}.cmp.ba .plan::after{display:none} /* real before photo instead of blueprint */
.cmp .plan::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,195,108,.07) 1px,transparent 1px) 0 0/28px 28px,linear-gradient(90deg,rgba(255,195,108,.07) 1px,transparent 1px) 0 0/28px 28px;mix-blend-mode:screen}
.cmp .bar{position:absolute;top:0;bottom:0;left:var(--x);width:2px;margin-left:-1px;background:var(--gold);pointer-events:none}
.cmp .bar i{position:absolute;top:50%;left:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;font-style:normal;font-size:20px;box-shadow:0 0 0 8px rgba(255,195,108,.2)}
.cmp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.cmp .tag{position:absolute;top:18px;font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;padding:8px 12px;border-radius:30px;pointer-events:none}
.cmp .tag.l{left:18px;color:var(--gold);border:1px solid rgba(255,195,108,.5);background:rgba(7,30,33,.6)}
.cmp .tag.r{right:18px;color:var(--ink);background:rgba(255,255,255,.9)}
.viz-thumbs{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.viz-thumbs button{width:64px;height:48px;border-radius:8px;border:2px solid transparent;background-size:cover;background-position:center;opacity:.55;transition:.25s;padding:0}
.viz-thumbs button:hover{opacity:.9}
.viz-thumbs button.on{opacity:1;border-color:var(--gold)}
.viz-thumbs span{margin-left:auto;font-size:12.5px;color:#7f9799}

/* ---- kuhni: price formula (sum card + six factor cards with impact meter) ---- */
.fx-head{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:end;margin-bottom:54px}
.fx-head .h2{margin:0}
.fx-head p{color:var(--mute);font-size:17px;line-height:1.7}
.fx-grid{display:grid;grid-template-columns:1.15fr repeat(3,1fr);gap:18px}
.fx-sum{grid-row:span 2;position:relative;overflow:hidden;display:flex;flex-direction:column;padding:34px 32px;border-radius:20px;color:#fff;background:radial-gradient(120% 70% at 50% 0,#12393d,#071e21 60%,#041314)}
.fx-k{font:500 13px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.fx-eq{font:400 clamp(26px,2.3vw,34px)/1.2 Ubuntu;margin-top:14px}
.fx-eq b{font:italic 400 1.25em Ubuntu,Arial,sans-serif;color:var(--gold)}
.fx-dial{position:relative;width:min(230px,80%);aspect-ratio:1;margin:auto;display:grid;place-items:center}
.fx-dial .ring{position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(rgba(255,195,108,.55) 0 1.2deg,transparent 1.2deg 7.5deg);
  -webkit-mask:radial-gradient(circle,transparent 58%,#000 59% 70%,transparent 71%);mask:radial-gradient(circle,transparent 58%,#000 59% 70%,transparent 71%);animation:fxSpin 40s linear infinite}
.fx-dial .core{width:44%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font:300 56px/1 Ubuntu;font-style:normal;color:var(--ink);background:radial-gradient(circle at 35% 30%,#ffe1ad,var(--gold) 60%,#e9a94d);box-shadow:0 0 0 10px rgba(255,195,108,.08),0 20px 50px -10px rgba(255,195,108,.45)}
@keyframes fxSpin{to{transform:rotate(360deg)}}
.fx-note{font-size:14px;line-height:1.6;color:#9fb3b5;margin:10px 0 20px}
.fx-sum .btn{align-self:flex-start}
.fx-c{position:relative;display:flex;flex-direction:column;padding:28px 26px 24px;border-radius:20px;background:#fff;border:1px solid var(--line);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.fx-grid .fx-c{transition:opacity .8s,transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.fx-grid .fx-c:nth-child(3){transition-delay:.06s}.fx-grid .fx-c:nth-child(4){transition-delay:.12s}.fx-grid .fx-c:nth-child(5){transition-delay:.18s}.fx-grid .fx-c:nth-child(6){transition-delay:.24s}.fx-grid .fx-c:nth-child(7){transition-delay:.3s}
.fx-grid .fx-c.rv.in:hover{transform:translateY(-6px);box-shadow:0 30px 60px -36px rgba(7,30,33,.45);border-color:transparent;transition-delay:0s}
.fx-c svg{width:56px;height:56px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:22px}
.fx-c svg *{stroke-dasharray:220;stroke-dashoffset:0;transition:stroke .4s}
.fx-c svg .dash{stroke:var(--gold2);stroke-dasharray:3 4}
.fx-c:hover svg *:not(.dash){stroke:var(--gold2);animation:fxDraw 1.1s cubic-bezier(.6,0,.2,1)}
@keyframes fxDraw{from{stroke-dashoffset:220}}
.fx-c h3{font-size:20px;font-weight:500;margin-bottom:8px}
.fx-c p{font-size:15px;line-height:1.6;color:var(--mute);flex:1}
.fx-m{display:flex;align-items:center;gap:6px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.fx-m span{font-size:12px;letter-spacing:.06em;color:var(--mute);margin-right:auto}
.fx-m i{width:22px;height:6px;border-radius:3px;background:#e7eaea;position:relative;overflow:hidden}
.fx-m i::after{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.fx-c.in[data-lv="1"] .fx-m i:nth-of-type(-n+1)::after,.fx-c.in[data-lv="2"] .fx-m i:nth-of-type(-n+2)::after,.fx-c.in[data-lv="3"] .fx-m i:nth-of-type(-n+3)::after{transform:none}
.fx-c.in .fx-m i:nth-of-type(2)::after{transition-delay:.15s}.fx-c.in .fx-m i:nth-of-type(3)::after{transition-delay:.3s}
@media (max-width:1000px){.fx-head{grid-template-columns:1fr;gap:14px}.fx-grid{grid-template-columns:1fr 1fr}.fx-sum{grid-column:1/-1;grid-row:auto}.fx-dial{width:170px;margin:24px 0}}
@media (max-width:640px){.fx-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.fx-dial .ring{animation:none}}
@media (max-width:1000px){
  .viz-grid{grid-template-columns:1fr}
}
@media (max-width:1000px){.cmp{aspect-ratio:4/3}} /* tablet: 4/5 would be ~900px tall */
@media (max-width:640px){.cmp{aspect-ratio:4/5}.viz-thumbs span{margin-left:0;width:100%}}

/* ---------- vs: one contractor instead of five ---------- */
.vs{position:relative;display:grid;grid-template-columns:1fr 1fr;border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:0 40px 80px -60px rgba(7,30,33,.6)}
.vs-c{position:relative;isolation:isolate;padding:44px clamp(26px,3.4vw,52px) 30px}
.vs-c.old{background:#f3f1ec;color:var(--ink)}
.vs-c.new{color:#fff;background:var(--ink)}
.vs-c.new::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--bg) center/cover;transform:scale(1.06);transition:transform 2.4s cubic-bezier(.2,.8,.2,1)}
.vs-c.new::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,rgba(7,30,33,.8),rgba(7,30,33,.93) 55%)}
.vs.in .vs-c.new::before{transform:none}
.vs-c .k{display:inline-block;font:500 12px Ubuntu;letter-spacing:.16em;text-transform:uppercase;color:#5d6869;padding:6px 12px;border-radius:999px;border:1px solid #d9d6cd}
.vs-c.new .k{color:var(--ink);background:var(--gold);border-color:var(--gold)}
.vs-c h3{display:flex;align-items:baseline;gap:14px;margin:22px 0 18px;font:400 clamp(30px,3vw,42px)/1 Ubuntu;color:#6b7475}
.vs-c h3 b{font:700 clamp(80px,9vw,124px)/.8 Ubuntu;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px #9aa2a3}
.vs-c.new h3{color:#fff}
.vs-c.new h3 b{color:var(--gold);-webkit-text-stroke:0}
.vs-c .chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:26px;min-height:30px}
.vs-c .chips span{font:500 12px Ubuntu;padding:6px 11px;border-radius:8px;background:#fff;border:1px dashed #c9c5ba;color:#5d6869}
.vs-c .chips span:nth-child(2n){transform:rotate(-2deg)}.vs-c .chips span:nth-child(3n){transform:rotate(2deg)}
.vs-c.new .chips span{background:rgba(255,195,108,.12);border:1px solid rgba(255,195,108,.45);color:var(--gold);transform:none}
.vs-c .r{display:flex;gap:14px;align-items:flex-start;min-height:84px;padding:18px 0;border-top:1px solid #dedad0}
.vs-c.new .r{border-color:rgba(255,255,255,.14)}
.vs-c .r i{flex:0 0 26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#e4e1d8;margin-top:1px}
.vs-c .r i svg{width:14px;height:14px;fill:none;stroke:#6b7475;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.vs-c.new .r i{background:var(--gold)}
.vs-c.new .r i svg{stroke:var(--ink);stroke-width:2.6}
.vs-c .r p{font-size:16px;line-height:1.5;color:#4a5556}
.vs-c.old .r p{text-decoration:line-through;text-decoration-color:rgba(74,85,86,.35);text-decoration-thickness:1px}
.vs-c.new .r p{color:#fff;font-weight:500}
.vs-c .r small{display:block;margin-top:5px;font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:#7b8586}
.vs-c.new .r small{color:rgba(255,195,108,.8)}
.vs-mid{position:absolute;left:50%;top:150px;z-index:2;width:58px;height:58px;margin-left:-29px;border-radius:50%;display:grid;place-items:center;font:italic 400 20px Ubuntu,Arial,sans-serif;color:var(--ink);background:#fff;border:1px solid var(--line);box-shadow:0 14px 30px -12px rgba(7,30,33,.45)}
.vs-sum{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:18px;padding:22px 26px 22px 32px;border-radius:16px;background:var(--ink);box-shadow:0 18px 40px -18px rgba(7,30,33,.55)}
.vs-sum p{font:500 clamp(18px,1.6vw,22px)/1.35 Ubuntu;color:#fff}
.vs-sum p span{color:var(--gold);font-weight:700}
@media (max-width:760px){
  .vs{grid-template-columns:1fr}
  .vs-mid{top:auto;bottom:auto;position:relative;left:auto;margin:-29px auto;grid-row:2}
  .vs-c.new{grid-row:3}
  .vs-c .r{min-height:0}
  .vs-sum{padding:20px}
}

/* =====================================================================
   HOME LOOK — inner-page sections restyled to match the sections of index.html
   (svc cards, tm cream cards, adv icons, pr process, faq on photo)
   ===================================================================== */

/* page hero → next section slides up over it like a card (as hero → stats on home) */
.phero .wrap{padding-bottom:96px}
.phero+.sec:not([data-tx]){position:relative;z-index:3;margin-top:-40px;border-radius:22px 22px 0 0;background:#fff}
.phero+.sec.gray:not([data-tx]){background:var(--bg)}

/* dark sections: ink with soft gold corner glows (2B services / 5C process) */
.sec.dark{position:relative;overflow:hidden}
.sec.dark::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 0% 0%,rgba(255,195,108,.08),transparent 70%),radial-gradient(50% 60% at 100% 100%,rgba(255,195,108,.06),transparent 70%);pointer-events:none}
.sec.dark>.wrap{position:relative}
.dark .shead .eyebrow,.faq .shead .eyebrow{color:var(--gold)}

/* tiles → 2B service cards */
.tile{border:1px solid rgba(7,30,33,.08);transition:transform .5s cubic-bezier(.2,.7,.2,1),border-color .5s,box-shadow .5s}
.dark .tile{border-color:rgba(255,255,255,.08)}
.tile .cv{filter:saturate(.85) brightness(.85);transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .6s}
.tile::before{background:linear-gradient(180deg,rgba(7,30,33,.15) 0%,transparent 35%,rgba(7,30,33,.95) 100%)}
.tile::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s}
.tile:hover{transform:translateY(-8px);border-color:rgba(255,195,108,.5);box-shadow:0 24px 50px -20px rgba(7,30,33,.6),0 10px 40px -12px rgba(255,195,108,.2)}
.tile:hover::after{transform:scaleX(1)}
.tile:hover .cv{filter:saturate(1.05) brightness(1)}
.tile .ar{position:absolute;right:14px;top:12px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:var(--ink);font-size:16px;font-style:normal;opacity:0;transform:scale(.6) rotate(-45deg);transition:opacity .4s,transform .4s}
.tile:hover .ar{opacity:1;transform:none}
.tile h3{font-size:20px;line-height:1.25}
.tile p{color:#b9c8c9}

/* project cards → 7D cream review cards */
.pcard{background:#f7f2e8;border-color:rgba(7,30,33,.06)}
.pcard .ph::after{background:linear-gradient(180deg,rgba(7,30,33,.3),transparent 35%,transparent 70%,rgba(247,242,232,.6) 90%,#f7f2e8);inset:0 0 -2px}
.pcard .num{background:rgba(5,9,9,.82);border-color:rgba(255,255,255,.15)}
.pcard .more{border-top-color:rgba(0,0,0,.12)}
.pcard .go{border-color:rgba(7,30,33,.18)}
.pcard.in:hover{box-shadow:0 30px 60px -20px rgba(7,30,33,.45),0 0 0 2px var(--gold),0 10px 50px -10px rgba(255,195,108,.35)}


/* steps → always the dark 5C process look, even when the section is light */
.sec:has(.steps):not(.dark){background:radial-gradient(ellipse 70% 60% at 50% 0,#0c2a2d,#03100f 70%);color:#fff;position:relative;overflow:hidden}
.sec:has(.steps):not(.dark) .shead p{color:#9fb3b5}
.sec:not(.dark) .steps::before{background:linear-gradient(90deg,rgba(255,195,108,.55),rgba(255,195,108,.12))}

/* packages + compare + quote → gold-accent cards */
.pkg,.duo .c{position:relative;overflow:hidden;border-radius:16px}
.pkg::after,.duo .c::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s}
.pkg:hover::after,.duo .c:hover::after{transform:scaleX(1)}
.pkg.hi{overflow:visible;background:radial-gradient(70% 60% at 0% 0%,rgba(255,195,108,.12),transparent 70%),var(--ink)}
.pkg.hi:hover{box-shadow:0 30px 60px -24px rgba(7,30,33,.7),0 0 0 2px var(--gold)}
.quote::after{content:"";position:absolute;inset:12px;border:1px solid rgba(255,195,108,.22);border-radius:10px;pointer-events:none}

/* split images → gold underline + dark pill badge like home photos */
.split .img{box-shadow:0 30px 70px -40px rgba(7,30,33,.45)}
.split .img::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s}
.split .img:hover::after{transform:scaleX(1)}
.split .img .badge{background:rgba(5,9,9,.82);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(6px)}

/* FAQ → 10D: dark photo background, gold frame, white heading, call box */
.faq{background:linear-gradient(180deg,rgba(7,30,33,.93) 0%,rgba(7,30,33,.80) 45%,rgba(7,30,33,.95) 100%),url(../img/stilna-kuhnya.webp) center 40%/cover fixed var(--ink);color:#fff}
.faq::before{color:rgba(255,195,108,.06)}
.faq::after{content:"";position:absolute;inset:24px;border:1px solid rgba(255,195,108,.18);border-radius:18px;pointer-events:none}
.faq .shead{position:relative;margin-bottom:50px}
.faq .shead h2{color:#fff}
.faq .shead p{color:rgba(255,255,255,.72)}
.faq .it:hover .pm{background:#e9e9e9}.faq .it.on:hover .pm{background:var(--ink)}
.faq .call{max-width:880px;margin:30px auto 0;background:rgba(255,255,255,.07);border:1px solid rgba(255,195,108,.3);color:#fff;border-radius:14px;padding:26px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;position:relative}
.faq .call span{display:block;font-size:14px;color:#9fb0b2}
.faq .call b{font:500 22px Ubuntu}
.faq .call .btns{display:flex;gap:10px;flex-wrap:wrap}
.faq .call .btn.o{color:#fff;border-color:rgba(255,255,255,.35)}
.faq .call .btn.o:hover{border-color:var(--gold);color:var(--gold)}
@media (max-width:900px){.faq{background-attachment:scroll}.faq::after{inset:10px}}
@media (max-width:640px){.faq .call{flex-direction:column;text-align:center}.phero+.sec:not([data-tx]){margin-top:-24px;border-radius:18px 18px 0 0}}
@media (hover:none){.tile .ar{opacity:1;transform:none}}

/* ---------- za-nas: owners (editorial split: story left, staggered portraits right) ---------- */
.own{position:relative;overflow:hidden}
.own::before{content:"БИЖУ";position:absolute;right:-2vw;bottom:-6vw;font:700 clamp(160px,22vw,340px)/1 Ubuntu;letter-spacing:-.04em;color:rgba(7,30,33,.035);pointer-events:none}
.own .wrap{position:relative;display:grid;grid-template-columns:.9fr 1.25fr;gap:clamp(40px,6vw,90px);align-items:center}
.own-txt .eyebrow{display:inline-flex;align-items:center;gap:12px;color:#8a5f14}
.own-txt .eyebrow::before{content:"";width:28px;height:1px;background:var(--gold)}
.own-txt h2{font-size:clamp(34px,3.8vw,52px);font-weight:500;letter-spacing:-.01em;margin:16px 0 20px}
.own-txt .lead{color:var(--mute);font-size:17px;line-height:1.75}
.own-pts{display:grid;gap:0;margin:30px 0 28px;border-top:1px solid rgba(7,30,33,.1)}
.own-pts li{display:grid;grid-template-columns:84px 1fr;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid rgba(7,30,33,.1)}
.own-pts b{font:500 30px/1 Ubuntu;color:var(--ink);font-variant-numeric:tabular-nums}
.own-pts span{font-size:15px;color:var(--mute)}
/* handwritten signature: letters 'write' in left→right, then a gold flourish is drawn under them */
.own-txt .sig{display:inline-block;margin:4px 0 30px;font:400 46px/1.15 'Marck Script',Ubuntu,cursive;color:var(--ink);transform:rotate(-2.5deg);transform-origin:left center}
.own-txt .sig span{display:inline-block;padding:0 .12em 0 .02em;clip-path:inset(-20% 100% -20% 0);transition:clip-path 1.8s cubic-bezier(.55,0,.25,1) .25s}
.own-txt.in .sig span{clip-path:inset(-20% -5% -20% 0)}
.own-txt .sig svg{display:block;width:82%;height:18px;margin:-6px 0 0 4%;overflow:visible}
.own-txt .sig path{fill:none;stroke:var(--gold);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s cubic-bezier(.6,0,.2,1) 1.7s}
.own-txt.in .sig path{stroke-dashoffset:0}
@media (max-width:640px){.own-txt .sig{font-size:38px}}
@media (prefers-reduced-motion:reduce){.own-txt .sig span{clip-path:none;transition:none}.own-txt .sig path{stroke-dashoffset:0;transition:none}}
.own-txt .acts{display:flex;gap:10px;flex-wrap:wrap}

.own-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.own-c{margin:0;position:relative;background:#fff;border-radius:18px;overflow:hidden;border:1px solid rgba(7,30,33,.06);box-shadow:0 30px 60px -38px rgba(7,30,33,.5);transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s}
.own-c:nth-child(2){margin-top:72px}
.own-cards .own-c.rv.in:hover{transform:translateY(-8px);transition-delay:0s;box-shadow:0 40px 70px -34px rgba(7,30,33,.6),0 0 0 2px var(--gold)}
.own-c .ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--ink)}

.own-c .cv{position:absolute;inset:0;background-size:cover;transform:scale(1.02);transition:transform 1.4s cubic-bezier(.2,.8,.2,1)}
.own-c .ph::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 60%,rgba(7,30,33,.35));pointer-events:none}
.own-c .ph::after{content:"";position:absolute;inset:12px;z-index:2;border:1px solid rgba(255,255,255,.35);border-radius:10px;pointer-events:none;transition:inset .5s,border-color .5s}
.own-c:hover .cv{transform:scale(1.07)}
.own-c:hover .ph::after{inset:8px;border-color:rgba(255,195,108,.7)}
.own-c .no{position:absolute;left:24px;top:22px;z-index:3;font:500 12px Ubuntu;letter-spacing:.2em;color:#fff;background:rgba(5,9,9,.7);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);padding:6px 11px;border-radius:999px}
.own-c figcaption{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:22px 24px 22px;border-top:2px solid var(--gold)}
.own-c h3{font-size:22px;font-weight:500}
.own-c figcaption p{font:500 12px Ubuntu;letter-spacing:.16em;text-transform:uppercase;color:#8a5f14;margin-top:6px}
.own-c .loc{font-size:13px;color:var(--mute);white-space:nowrap}

@media (max-width:1000px){.own .wrap{grid-template-columns:1fr}.own-txt{max-width:640px}}
@media (max-width:640px){.own-cards{grid-template-columns:1fr;max-width:420px;margin:0 auto}.own-c:nth-child(2){margin-top:0}.own-c figcaption{flex-direction:column;align-items:flex-start}}

/* Viber buttons: brand purple on hover */
a.btn[href^="viber:"]:hover,.faq .call a.btn.o[href^="viber:"]:hover,.inq-alt a[href^="viber:"]:hover{background:#7360f2;border-color:#7360f2;color:#fff}

/* ---- kuhni: price sum card v2 — real kitchen photo behind, "bill" of the six factors instead of the dial ---- */
.fx-sum{isolation:isolate;background:var(--ink);border:1px solid rgba(255,195,108,.18)}
.fx-sum::before{content:"";position:absolute;inset:0;z-index:-2;background:url(../img/opt/k5-1400.webp) 58% 50%/cover;transform:scale(1.04);transition:transform 1.6s cubic-bezier(.2,.8,.2,1)}
.fx-sum::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(4,19,20,.92) 0%,rgba(7,30,33,.62) 30%,rgba(7,30,33,.78) 55%,rgba(4,19,20,.96) 100%)}
.fx-sum:hover::before{transform:scale(1.1)}
.fx-bill{list-style:none;margin:30px 0 0;padding:0;counter-reset:b}
.fx-bill li{counter-increment:b;display:flex;align-items:baseline;gap:12px;padding:8px 0;font-size:14px;color:#cfdcdc;border-bottom:1px dashed rgba(255,255,255,.14);transition:color .3s,padding .3s}
.fx-bill li::before{content:counter(b,decimal-leading-zero);font:500 12px Ubuntu;letter-spacing:.12em;color:rgba(255,195,108,.65);transition:color .3s}
.fx-bill li::after{content:"+";margin-left:auto;font:300 16px/1 Ubuntu;color:rgba(255,255,255,.35);transition:color .3s,transform .3s}
.fx-bill li:first-child::after{content:""}
.fx-bill li.on{color:#fff;padding-left:6px}
.fx-bill li.on::before,.fx-bill li.on::after{color:var(--gold)}
.fx-bill li.on::after{transform:scale(1.3)}
.fx-tot{display:flex;align-items:center;gap:14px;margin:16px 0 0;padding:14px 16px;border-radius:12px;background:rgba(255,195,108,.12);border:1px solid rgba(255,195,108,.4);backdrop-filter:blur(6px)}
.fx-tot i{width:34px;height:34px;flex:0 0 34px;border-radius:50%;display:grid;place-items:center;font:300 22px/1 Ubuntu;font-style:normal;color:var(--ink);background:radial-gradient(circle at 35% 30%,#ffe1ad,var(--gold) 60%,#e9a94d);box-shadow:0 0 0 5px rgba(255,195,108,.15)}
.fx-tot b{font:italic 400 22px Ubuntu,Arial,sans-serif;color:#fff}
.fx-free{margin:14px 0 auto;font-size:13px;color:#b9c8c9}
.fx-free span{display:inline-block;margin-right:8px;font:500 10px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--gold);padding:4px 8px;border-radius:999px;vertical-align:1px}
.fx-sum .fx-note{margin-top:22px}

/* ---------- 5C process (shared; home has same rules inline) ---------- */
.pr{background:radial-gradient(ellipse 70% 60% at 50% 0,#0c2a2d,#03100f 70%);color:#fff;padding:110px 0;position:relative;overflow:hidden}
.pr .head{text-align:center;max-width:640px;margin:0 auto}
.pr .eyebrow{display:inline-block;font:500 12px Ubuntu;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.pr h2{font-size:clamp(30px,3.4vw,46px);font-weight:500}
.pr .sub{color:#9fb3b5;margin:10px 0 0;font-size:17px}
.pr .line{position:relative;display:grid;grid-template-columns:repeat(3,1fr);margin:64px 0 28px}
.pr .line::before,.pr .line i{content:"";position:absolute;top:50%;left:16.66%;right:16.66%;height:1px;background:#1d3a3d}
.pr .line i{background:linear-gradient(90deg,var(--gold),#ffdca6);transform:scaleX(0);transform-origin:left;transition:transform 1.6s cubic-bezier(.6,0,.2,1) .3s}
.pr .line.in i{transform:scaleX(1)}
.pr .line b{justify-self:center;position:relative;z-index:1;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font:500 14px Ubuntu;color:#9fb3b5;background:#03100f;border:1px solid #1d3a3d;transition:all .5s}
.pr .line.in b{color:var(--ink);background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 6px rgba(255,195,108,.12)}
.pr .line.in b:nth-of-type(1){transition-delay:.3s}.pr .line.in b:nth-of-type(2){transition-delay:1.1s}.pr .line.in b:nth-of-type(3){transition-delay:1.9s}
.pr .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pr .c{display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));border:1px solid #1d3a3d;border-radius:16px;padding:14px;position:relative;transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .5s}
.pr .c::after{content:"";position:absolute;left:24px;right:24px;top:-1px;height:2px;background:var(--gold);transform:scaleX(0);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.pr .c:hover{transform:translateY(-8px);border-color:rgba(255,195,108,.45);box-shadow:0 30px 60px -30px rgba(0,0,0,.8),0 0 40px -20px rgba(255,195,108,.35)}
.pr .c:hover::after{transform:scaleX(1)}
.pr .c .ph{position:relative;aspect-ratio:4/3;border-radius:10px;overflow:hidden}
.pr .c .cv{position:absolute;inset:0;filter:grayscale(.55) brightness(.75);transform:scale(1.02);transition:transform 1.2s cubic-bezier(.2,.8,.2,1),filter .6s}
.pr .c .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(3,16,15,.75))}
.pr .c:hover .cv{filter:none;transform:scale(1.1)}
.pr .c .tag{position:absolute;left:14px;bottom:12px;z-index:1;font:500 12px Ubuntu;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.pr .c .bd{padding:22px 10px 10px;text-align:center;display:flex;flex-direction:column;flex:1}
.pr .c h3{font-size:26px;font-weight:400;margin-bottom:10px}
.pr .c p{font-size:15px;line-height:1.6;color:#9fb3b5;min-height:3.2em}
.pr .cards .c.rv.in{animation:prIn .9s cubic-bezier(.2,.8,.2,1) backwards}
.pr .cards .c:nth-child(2).in{animation-delay:.15s}.pr .cards .c:nth-child(3).in{animation-delay:.3s}
@keyframes prIn{from{opacity:0;transform:translateY(40px)}}
.pr .cta{text-align:center;margin-top:48px}
.pr .cta small{display:block;color:#7f9799;font-size:13px;margin-top:12px}
.pr.n4 .line,.pr.n4 .cards{grid-template-columns:repeat(4,1fr)}
.pr.n4 .line::before,.pr.n4 .line i{left:12.5%;right:12.5%}
.pr .line.in b:nth-of-type(4){transition-delay:2.7s}
.pr .cards .c:nth-child(4).in{animation-delay:.45s}
@media (max-width:1000px){.pr .cards{gap:14px}.pr .c h3{font-size:22px}.pr.n4 .line{display:none}.pr.n4 .cards{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.pr .cards,.pr.n4 .cards{grid-template-columns:1fr}.pr .line{display:none}.pr .cards{max-width:440px;margin:40px auto 0}}

/* ---------- numbers on a photo (za-nas, proekti): real interior behind, heading left, frosted number strip ---------- */
.sec.nums-ph{padding:110px 0;background:#041314;isolation:isolate}
.sec.nums-ph::before{display:none}
.np-bg{position:absolute;inset:0;z-index:-1;background-size:cover;background-position:center 45%;transform:scale(1.08);animation:npDrift 24s ease-in-out infinite alternate}
.np-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,19,20,.94) 0%,rgba(4,19,20,.6) 55%,rgba(4,19,20,.8) 100%),linear-gradient(0deg,rgba(4,19,20,.92) 0%,rgba(4,19,20,.2) 55%,rgba(4,19,20,.55) 100%)}
@keyframes npDrift{to{transform:scale(1)}}
.np-head{display:grid;grid-template-columns:1fr 1fr;gap:20px 60px;align-items:end;margin-bottom:46px}
.np-head .eyebrow{grid-column:1/-1;display:inline-flex;align-items:center;gap:12px;color:var(--gold)}
.np-head .eyebrow::before{content:"";width:28px;height:1px;background:var(--gold)}
.np-head h2{font-size:clamp(32px,3.6vw,52px);font-weight:500;letter-spacing:-.01em;color:#fff}

.np-head p{color:#c3d1d2;font-size:17px;line-height:1.7;max-width:440px;justify-self:end;padding-left:28px;border-left:1px solid rgba(255,255,255,.18)}
/* plain numbers: no box, no dividers, no gold ticks, no hover */
.sec.nums-ph .nums{background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;overflow:visible}
.sec.nums-ph .nums>div{padding:10px 20px;background:none !important}
.sec.nums-ph .nums>div+div{border-left:0}
.sec.nums-ph .nums>div::before{display:none}
.sec.nums-ph .nums>div:hover b{transform:none}
.sec.nums-ph .nums span{color:#d5e0e0}
@media (max-width:1000px){.np-head{grid-template-columns:1fr}.np-head p{justify-self:start;padding-left:0;border-left:0}}
@media (prefers-reduced-motion:reduce){.np-bg{animation:none}}

/* timeline reveal: when the gold line reaches a dot, photo opens like a curtain from the line, year rises, text staggers in */
.tl .m{clip-path:inset(0 0 0 100% round 16px);transition:clip-path 1.1s cubic-bezier(.7,0,.2,1),transform 1s cubic-bezier(.2,.8,.2,1)}
.tl li:nth-child(odd) .m{clip-path:inset(0 100% 0 0 round 16px)}
.tl li.on .m{clip-path:inset(0 0 0 0 round 16px)}
.tl .m .cv{transform:scale(1.25);filter:grayscale(1) brightness(.7);transition:transform 1.6s cubic-bezier(.2,.8,.2,1),filter 1.2s .3s}
.tl li.on .m .cv{transform:scale(1.04);filter:saturate(.75)}
.tl li.on:hover .m .cv{transform:scale(1.1);filter:none}
.tl .m b{transform:translateY(110%);opacity:0;transition:transform .9s cubic-bezier(.2,.8,.2,1) .55s,opacity .6s .55s}
.tl li.on .m b{transform:none;opacity:1}
.tl .t>*{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .7s cubic-bezier(.2,.8,.2,1)}
.tl li.on .t>*{opacity:1;transform:none}
.tl li.on .t>:nth-child(2){transition-delay:.1s}.tl li.on .t>:nth-child(3){transition-delay:.2s}.tl li.on .t>:nth-child(4){transition-delay:.3s}
.tl li.on .dot::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid var(--gold);animation:tlPing 1.2s cubic-bezier(.2,.8,.2,1) 1}
@keyframes tlPing{from{transform:scale(1);opacity:1}to{transform:scale(3.2);opacity:0}}
@media (prefers-reduced-motion:reduce){.tl .m,.tl li:nth-child(odd) .m{clip-path:none}.tl .m b,.tl .t>*{opacity:1;transform:none}}

/* primary accent button (site-wide): gold, rounded, soft glow, light sweep on hover — same as contact form submit */
.btn:not(.o):not(.dk){position:relative;overflow:hidden;isolation:isolate;border-radius:10px;font-weight:500;box-shadow:0 14px 30px -12px rgba(255,195,108,.55);transition:transform .2s,background .3s,box-shadow .3s,color .2s,border-color .2s}
.btn:not(.o):not(.dk)::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.5) 50%,transparent 70%);transform:translateX(-100%);transition:transform .8s}
.btn:not(.o):not(.dk):hover{background:#ffd08a;border-color:#ffd08a;box-shadow:0 18px 36px -12px rgba(255,195,108,.7)}
.btn:not(.o):not(.dk):hover::before{transform:translateX(100%)}

/* ============ unified card system — same look as .pcard everywhere ============ */
:root{--card:#f7f2e8;--card-bd:rgba(7,30,33,.06);--card-sh:0 30px 60px -46px rgba(7,30,33,.55);--card-sh-hover:0 30px 60px -20px rgba(7,30,33,.45),0 0 0 2px var(--gold),0 10px 50px -10px rgba(255,195,108,.35);--card-txt:#4a5b5d;--eyebrow:#8a5f14}
.feat,.step,.pkg:not(.hi),.duo .c:not(.hi),.own-c,.faq .it{background:var(--card);border:1px solid var(--card-bd);border-radius:16px;box-shadow:var(--card-sh);color:var(--ink)}
.feat,.step,.pkg,.duo .c{position:relative;overflow:hidden;transition:opacity .8s,transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.feat:hover,.step:hover,.pkg:hover,.duo .c:hover,.own-cards .own-c.rv.in:hover{transform:translateY(-8px);border-color:var(--card-bd);box-shadow:var(--card-sh-hover)}
.feat::after,.step::after,.pkg::after,.duo .c::after{content:"";position:absolute;left:0;right:auto;top:0;z-index:3;height:3px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.feat:hover::after,.step:hover::after,.pkg:hover::after,.duo .c:hover::after{transform:scaleX(1)}
.feat h3,.step h3,.pkg:not(.hi) h3,.duo .c:not(.hi) h3{color:var(--ink);font-weight:500}
.feat p,.step p,.duo .c:not(.hi) li{color:var(--card-txt)}
/* number / icon badge — dark pill like .pcard .num */
.feat{text-align:center;padding:32px 28px}
.feat p{max-width:300px;margin:0 auto}
.feat .ic{margin:0 auto 18px;width:52px;height:52px;border-radius:50%;background:rgba(5,9,9,.86);color:#fff;font:500 13px Ubuntu;letter-spacing:.1em;border:1px solid rgba(255,255,255,.15)}
.feat .ic:has(img){background:#fff;border:1px solid rgba(185,134,47,.35)}
.step::before{background:rgba(5,9,9,.86);color:#fff;border:1px solid rgba(255,255,255,.15);font-size:13px;letter-spacing:.1em;box-shadow:none}
.steps::before{background:linear-gradient(90deg,rgba(255,195,108,.55),rgba(255,195,108,.2))}
.step h3{font-size:22px}
.pkg .sub{color:var(--card-txt)}
.pkg.hi{border-radius:16px}
/* faq */
.faq .it{box-shadow:0 10px 30px -22px rgba(7,30,33,.5)}
.faq .it.on{border-color:var(--gold);box-shadow:var(--card-sh-hover)}
.faq .pm{background:rgba(7,30,33,.06)}
.faq .it:hover .pm{background:rgba(7,30,33,.1)}
.faq .a p{color:var(--card-txt)}
/* split images — same badge as cards */
.split .img{border-radius:16px}
.split .img .badge{border-radius:12px}
.split .img .badge b{color:var(--gold)}

/* .feat cards: raised 3D look (bevel + thickness + drop shadow), no hover */
.feat{background:linear-gradient(180deg,#fbf7ef 0%,#f3ece0 100%);border:1px solid #e6dccb;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.95),inset 0 -3px 0 rgba(185,134,47,.10),0 1px 0 #e3d8c4,0 6px 0 #e6dccb,0 7px 0 #d9ccb4,0 22px 34px -14px rgba(7,30,33,.28)}
.feat:hover{transform:none;border-color:#e6dccb;box-shadow:inset 0 2px 0 rgba(255,255,255,.95),inset 0 -3px 0 rgba(185,134,47,.10),0 1px 0 #e3d8c4,0 6px 0 #e6dccb,0 7px 0 #d9ccb4,0 22px 34px -14px rgba(7,30,33,.28)}
.feat::after,.feat:hover::after{display:none}
.feat .ic:has(img){background:linear-gradient(180deg,#fff,#f6f1e8);border:1px solid #e6dccb;box-shadow:inset 0 2px 0 #fff,0 3px 0 #e2d6c1,0 8px 14px -6px rgba(7,30,33,.25)}
.feats{row-gap:30px}

/* ===== proekti.html — "Фокус" cinema scroll (variant P13 from proekti-kino.html) ===== */
.kino{position:relative;height:calc(var(--n)*85vh);background:#02100f}
.kino .stage{position:sticky;top:76px;height:calc(100vh - 76px);height:calc(100svh - 76px);overflow:hidden}
.kino .sl{position:absolute;inset:0;overflow:hidden}
.kino .sl>.cv{position:absolute;inset:0;will-change:transform,filter}
.kino .stage::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:4;background:linear-gradient(90deg,rgba(3,16,15,.92) 0%,rgba(3,16,15,.78) 35%,rgba(3,16,15,.4) 65%,rgba(3,16,15,.15) 100%),linear-gradient(0deg,rgba(3,16,15,.85) 0%,rgba(3,16,15,.35) 40%,transparent 65%)}
.kino .txt{text-shadow:0 2px 18px rgba(0,0,0,.45)}
.kino .txt{position:absolute;left:max(34px,calc(50% - 588px));bottom:10vh;z-index:6;max-width:540px;color:#fff}
.kino .cnt{font:500 13px Ubuntu;color:var(--gold);letter-spacing:.12em;text-transform:uppercase}
.kino .cnt b{font:500 64px/1 Ubuntu;display:block;margin-bottom:8px;letter-spacing:0}
.kino h3{font:500 clamp(36px,4.6vw,64px)/1.05 Ubuntu;margin:12px 0 14px;color:#fff}
.kino .txt p{color:rgba(255,255,255,.8);font-size:16px;line-height:1.55}
.kino .txt>*{transition:opacity .35s,transform .35s}.kino .txt.sw>*{opacity:0;transform:translateY(14px)}
.kino .more{display:inline-flex;align-items:center;gap:10px;font:500 15px Ubuntu;margin-top:24px;color:#fff}
.kino .more i{width:44px;height:44px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;font-style:normal;transition:all .3s}
.kino .more:hover i{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.kino .bar{position:absolute;right:max(34px,calc(50% - 588px));bottom:10vh;z-index:6;display:flex;flex-direction:column;gap:8px}
.kino .bar button{width:3px;height:34px;padding:0;border:0;background:rgba(255,255,255,.25);border-radius:3px;overflow:hidden;position:relative;cursor:pointer}
.kino .bar button::after{content:"";position:absolute;left:0;right:0;top:0;height:var(--f,0%);background:var(--gold)}
@media (max-width:760px){.kino .txt{left:20px;right:56px;bottom:8vh}.kino .cnt b{font-size:44px}.kino .bar{right:20px;bottom:8vh}}

/* ---------- mobile contact bar (phone · Viber · inquiry), always reachable on small screens ---------- */
.mbar{display:none}
@media (max-width:640px){
  .fab{display:none !important}
  .mbar{position:fixed;left:10px;right:10px;bottom:10px;z-index:35;display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:6px;padding:6px;border-radius:16px;background:rgba(7,30,33,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,195,108,.25);box-shadow:0 14px 40px -10px rgba(0,0,0,.6);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
  .mbar a,.mbar button{display:flex;align-items:center;justify-content:center;gap:7px;height:46px;border-radius:11px;border:0;background:rgba(255,255,255,.06);color:#fff;font:500 14px Ubuntu,Arial,sans-serif;cursor:pointer}
  .mbar .go{background:var(--gold);color:var(--ink)}
  .mbar svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  body.open .mbar{transform:translateY(140%)}
  body{padding-bottom:72px}
}

/* pcard: no gold line / gold ring on hover (body prefix beats index.html inline copy) */
body .pcard::before{display:none}
body .pcard.in:hover{border-color:var(--line);box-shadow:0 30px 60px -20px rgba(7,30,33,.45)}

/* hover seam fix: no dark hairline under the photo */
.pcard .ph{background:#f7f2e8;margin-bottom:-1px;transform:translateZ(0)}.pcard .ph::after{inset:-1px -1px -2px}.pcard .bd{position:relative;z-index:1;background:#f7f2e8}
.office .map{margin-bottom:-1px;transform:translateZ(0)}.office .bd{z-index:1;background:#f7f2e8}

/* ===== NO HOVER LINES (site-wide): no gold bars, gold rings or gold borders on cards when hovered.
   "body" prefix so these win over the inline copies in index.html. Lift, shadow and photo zoom stay. ===== */
body .feat::after,body .mat::before,body .pcard::before,body .office::before,body .ch:not(.hi)::before,
body .tile::after,body .pkg::after,body .duo .c::after,body .step::after,body .split .img::after,
body .pr .c::after,body .svc .card::after,body .tm .t .b::after{display:none}
body .mats .mat.in:hover{border-color:var(--line)}
body .step:hover{border-color:var(--card-bd)}
body .pcard.in:hover{border-color:var(--line)}
body .office:hover{border-color:rgba(255,255,255,.06);box-shadow:0 40px 70px -30px rgba(7,30,33,.75)}
body .chan .ch:not(.hi):hover{border-color:rgba(255,195,108,.14)}
body .inq-steps li:hover{border-color:var(--line)}
body .tile:hover{border-color:rgba(7,30,33,.08);box-shadow:0 24px 50px -20px rgba(7,30,33,.6)}
body .dark .tile:hover{border-color:rgba(255,255,255,.08)}
body .pkg.hi:hover{box-shadow:0 30px 60px -24px rgba(7,30,33,.7)}
body .own-cards .own-c.rv.in:hover{box-shadow:0 40px 70px -34px rgba(7,30,33,.6)}
body .own-c:hover .ph::after{inset:12px;border-color:rgba(255,255,255,.35)}
body .mem:hover .ph::before{inset:12px;border-color:rgba(255,195,108,.22)}
body .pr .c:hover{border-color:#1d3a3d;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
body .svc .card:hover{border-color:rgba(255,255,255,.08);box-shadow:0 24px 50px -20px rgba(0,0,0,.8)}
body .tm .t:hover .b{border-color:rgba(255,255,255,.9);box-shadow:0 30px 60px -20px rgba(0,0,0,.95)}

/* ===== proekti.html — title bar (no hero), reviews, gallery (assets/galeria.js) ===== */
.ptop{background:var(--ink);color:#fff;padding:112px 0 30px}
.ptop .wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.ptop .crumbs{margin-bottom:10px}
.ptop h1{font:500 clamp(34px,4vw,54px)/1.05 Ubuntu;letter-spacing:-.01em}
.ptop p{color:#9fb3b5;font-size:15px}.ptop p b{color:var(--gold);font-weight:500}
.ptop p a{color:#fff;border-bottom:1px solid var(--gold);margin-left:4px}
.pq{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.pq figure{margin:0;padding:30px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(6px);display:flex;flex-direction:column;color:#fff}
.pq .st{color:var(--gold);letter-spacing:3px;font-size:14px}
.pq blockquote{margin:14px 0 24px;font:400 17px/1.6 Ubuntu;color:#e3ebeb}
.pq figcaption{margin-top:auto;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12)}
.pq figcaption a{color:var(--gold)}
.mas{columns:3;column-gap:18px}
.mi{display:block;position:relative;break-inside:avoid;margin-bottom:18px;border-radius:14px;overflow:hidden;background:#e9ecec;cursor:zoom-in;opacity:0;transform:translateY(16px);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1)}
.mi.in{opacity:1;transform:none}
.mi img{display:block;width:100%;height:auto;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.mi .cv{position:absolute;inset:0;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.mi:hover img,.mi:hover .cv{transform:scale(1.05)}
.mi .cap{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 14px;color:#fff;font:500 15px Ubuntu;background:linear-gradient(transparent,rgba(7,30,33,.85));opacity:0;transform:translateY(8px);transition:all .4s}
.mi .cap small{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.mi:hover .cap{opacity:1;transform:none}
.mi.det::after{content:"детайл";position:absolute;left:14px;top:14px;background:rgba(255,255,255,.92);color:var(--ink);border-radius:999px;padding:5px 10px;font:500 10px Ubuntu;letter-spacing:.14em;text-transform:uppercase}
.mas-more{text-align:center;margin-top:30px}
.lb .lb-nav{position:absolute;top:50%;width:54px;height:54px;margin-top:-27px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.25);color:#fff;font-size:20px;cursor:pointer;transition:all .3s}
.lb .lb-nav:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.lb .lb-nav.p{left:24px}.lb .lb-nav.n{right:24px}
.lb-cap{position:absolute;left:0;right:0;bottom:20px;text-align:center;color:#fff;font-size:15px}
.lb-cap span{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.lb-cap a{color:var(--gold);margin-left:8px}
@media (max-width:900px){.pq{grid-template-columns:1fr}.mas{columns:2}.ptop{padding-top:100px}}
@media (max-width:520px){.mas{columns:1}.lb .lb-nav{width:44px;height:44px}.lb .lb-nav.p{left:8px}.lb .lb-nav.n{right:8px}}

/* unified arrow button + calm hover (no top gold line) — cards, offices */
.pcard::before,.office::before,.feat::after,.step::after,.pkg::after,.duo .c::after{display:none}
.pcard .go,.office .go{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(7,30,33,.18);background:transparent;transform:none;transition:background .45s,border-color .45s,transform .5s cubic-bezier(.2,1.4,.4,1),box-shadow .45s}
.pcard .go svg,.office .go svg{grid-area:1/1;width:18px;height:18px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.pcard .go svg+svg,.office .go svg+svg{transform:translate(-150%,150%)}
.pcard:hover .go,.office:hover .go,.office .more:hover .go{background:var(--gold);border-color:var(--gold);transform:scale(1.06);box-shadow:0 10px 26px -8px rgba(255,195,108,.6)}
.pcard:hover .go svg,.office:hover .go svg{transform:translate(150%,-150%)}
.pcard:hover .go svg+svg,.office:hover .go svg+svg{transform:none}
.pcard.in:hover,.office:hover,.feat:hover,.step:hover,.pkg:hover,.duo .c:hover,.own-cards .own-c.rv.in:hover{transform:translateY(-6px);border-color:rgba(185,134,47,.35);box-shadow:0 34px 60px -30px rgba(7,30,33,.45)}
.pkg.hi:hover{border-color:var(--ink)}
.office:hover iframe{filter:grayscale(.6) sepia(.25) saturate(1.2) contrast(.95)}

/* numbers on a photo right after the page hero: slides over it like a card instead of a hard photo-on-photo cut */
.phero+.sec.nums-ph{position:relative;z-index:3;margin-top:-48px;border-radius:32px 32px 0 0;overflow:hidden;border-top:1px solid rgba(255,195,108,.4);box-shadow:0 -30px 60px -20px rgba(0,0,0,.6)}
.phero+.sec.nums-ph .np-bg{background-position:center 72%}
.phero+.sec.nums-ph .np-bg::after{background:linear-gradient(180deg,rgba(4,19,20,.97) 0%,rgba(4,19,20,.72) 30%,rgba(4,19,20,.55) 60%,rgba(4,19,20,.92) 100%),linear-gradient(90deg,rgba(4,19,20,.7),transparent 60%)}
.phero+.sec.nums-ph::after{content:"";position:absolute;left:50%;top:0;width:min(420px,60%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--gold),transparent);z-index:2}
@media (max-width:640px){.phero+.sec.nums-ph{margin-top:-28px;border-radius:22px 22px 0 0}}

/* custom dropdown + checkbox (inquiry form) */
.inq-card .fl.dd select{position:absolute;inset:0;opacity:0;pointer-events:none}
.inq-card .dd-btn{all:unset;box-sizing:border-box;display:block;width:100%;padding:24px 44px 9px 15px;border-radius:10px;font:15px Ubuntu;color:#fff;background:rgba(255,255,255,.06) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23ffc36c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 15px center/16px no-repeat;border:1px solid rgba(255,255,255,.16);cursor:pointer;transition:border-color .3s,background-color .3s,box-shadow .3s}
.inq-card .dd-btn:hover{border-color:rgba(255,255,255,.32)}
.inq-card .dd-btn:focus-visible,.inq-card .dd.open .dd-btn{background-color:rgba(255,255,255,.1);border-color:var(--gold);box-shadow:0 0 0 4px rgba(255,195,108,.18)}
.inq-card .dd.open .dd-btn{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 15l6-6 6 6' fill='none' stroke='%23ffc36c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.inq-card .fl.dd{z-index:5}
.inq-card .dd-list{position:absolute;left:0;right:0;top:calc(100% + 8px);margin:0;padding:6px;list-style:none;border-radius:12px;background:#0d2a2d;border:1px solid rgba(255,195,108,.28);box-shadow:0 24px 50px -16px rgba(0,0,0,.65);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .25s,transform .3s cubic-bezier(.2,.8,.2,1),visibility .25s}
.inq-card .dd.open .dd-list{opacity:1;visibility:visible;transform:none}
.inq-card .dd-list li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border-radius:8px;font-size:15px;color:#e6eeee;cursor:pointer;outline:none;transition:background .2s,color .2s}
.inq-card .dd-list li:hover,.inq-card .dd-list li:focus{background:rgba(255,195,108,.1);color:var(--gold)}
.inq-card .dd-list li svg{width:16px;height:16px;fill:none;stroke:var(--gold);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.inq-card .dd-list li[aria-selected="true"]{color:var(--gold);font-weight:500}
.inq-card .dd-list li[aria-selected="true"] svg{opacity:1}
.inq-card .agree{align-items:center;gap:12px;cursor:pointer}
.inq-card .agree input{appearance:none;-webkit-appearance:none;flex:0 0 20px;width:20px;height:20px;margin:0;padding:0;border-radius:6px;border:1.5px solid rgba(255,255,255,.35);background:rgba(255,255,255,.06) center/14px no-repeat;cursor:pointer;transition:background-color .25s,border-color .25s,box-shadow .25s}
.inq-card .agree input:hover{border-color:var(--gold)}
.inq-card .agree input:focus-visible{box-shadow:0 0 0 4px rgba(255,195,108,.25)}
.inq-card .agree input:checked{background-color:var(--gold);border-color:var(--gold);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23071e21' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.inq-card .agree a{text-underline-offset:3px}
.inq-card .fl.dd>span{z-index:1}

/* icon-only contact buttons; phone number slides out on hover (desktop) */
.inq-alt .ia{display:inline-flex;align-items:center;height:48px;min-width:48px;padding:0 14px;gap:0;border-radius:999px;border:1px solid rgba(7,30,33,.22);background:#fff;color:var(--ink);overflow:hidden;white-space:nowrap;transition:background .4s,border-color .4s,color .4s,gap .45s cubic-bezier(.2,.8,.2,1),box-shadow .4s,transform .4s}
.inq-alt .ia svg{flex:0 0 18px;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.inq-alt .ia span{max-width:0;opacity:0;font:500 15px Ubuntu;transition:max-width .5s cubic-bezier(.2,.8,.2,1),opacity .3s}
.inq-alt .ia:hover{transform:translateY(-2px);box-shadow:0 12px 26px -12px rgba(7,30,33,.45)}
.inq-alt .ia-tel:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.inq-alt .ia-viber:hover{background:#7360f2;border-color:#7360f2;color:#fff}
@media (hover:hover){.inq-alt .ia-tel:hover,.inq-alt .ia-tel:focus-visible{gap:10px;padding-right:20px}.inq-alt .ia-tel:hover span,.inq-alt .ia-tel:focus-visible span{max-width:180px;opacity:1}}

/* ---------- kuhni: reviews, compact materials list, city links, swipe rows on phone ---------- */
.qgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.qgrid .quote{display:flex;flex-direction:column;padding:36px 34px 32px}
.qgrid .quote q{font-size:19px;flex:1;margin:12px 0 0}
.quote .st{color:var(--gold);letter-spacing:3px;font-size:14px;position:relative}
.qgrid .quote small{padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
.mats{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:0 56px;border-top:1px solid rgba(7,30,33,.12)}
.mats li{display:grid;grid-template-columns:44px 200px 1fr;gap:18px;align-items:baseline;padding:24px 0;border-bottom:1px solid rgba(7,30,33,.12)}
.mats li>b{font:500 13px Ubuntu;letter-spacing:.08em;color:#b9862f}
.mats h3{font-size:19px;font-weight:500;margin:0 0 4px}
.mats span{font-size:12.5px;letter-spacing:.06em;color:#8a5f14}
.mats p{margin:0;font-size:15px;line-height:1.6;color:var(--mute)}
.cities{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.city{position:relative;isolation:isolate;overflow:hidden;border-radius:16px;aspect-ratio:16/8;display:flex;flex-direction:column;justify-content:flex-end;padding:30px 34px;color:#fff}
.city .cv{position:absolute;inset:0;z-index:-2;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.city::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,30,33,.1) 30%,rgba(7,30,33,.88))}
.city::after{content:"";position:absolute;inset:12px;border:1px solid rgba(255,195,108,0);border-radius:10px;transition:border-color .5s;pointer-events:none}
.city:hover .cv{transform:scale(1.06)}
.city:hover::after{border-color:rgba(255,195,108,.5)}
.city span{font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.city h3{font-size:clamp(24px,2.4vw,32px);font-weight:500;margin-top:6px}
.city i{position:absolute;right:30px;bottom:30px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:18px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);transition:.4s}
.city:hover i{background:var(--gold);border-color:var(--gold);color:var(--ink);transform:rotate(-45deg)}
@media (max-width:1000px){.qgrid{grid-template-columns:1fr}.mats{grid-template-columns:1fr}}
@media (max-width:640px){
  .pgrid.swipe{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-left:-20px;margin-right:-20px;padding:0 20px 24px;gap:14px}
  .pgrid.swipe::-webkit-scrollbar{display:none}
  .pgrid.swipe>.pcard{flex:0 0 82%;scroll-snap-align:center;opacity:1;transform:none}
  .qgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -20px;padding:0 20px 10px;gap:14px}
  .qgrid::-webkit-scrollbar{display:none}
  .qgrid .quote{flex:0 0 86%;scroll-snap-align:center;opacity:1;transform:none;padding:30px 26px}
  .qgrid .quote q{font-size:17px}
  .mats li{grid-template-columns:34px 1fr;gap:4px 12px;padding:18px 0}
  .mats li p{grid-column:2}
  .cities{grid-template-columns:1fr;gap:14px}
  .city{aspect-ratio:16/9;padding:22px 24px}.city i{right:22px;bottom:22px;width:42px;height:42px}
}

/* ===== za-nas.html — owners cards v2: full-bleed portrait, frosted name plate on the photo, no watermark ===== */
.own::before{display:none}
.own .wrap{align-items:center}
body .own-c,body .own-c:hover{background:var(--ink);border:0;border-radius:22px;box-shadow:0 40px 70px -40px rgba(7,30,33,.65)}
.own-c:nth-child(2){margin-top:44px}
.own-c .ph{aspect-ratio:4/5.3}
.own-c .ph::before{background:linear-gradient(180deg,rgba(7,30,33,.25) 0%,transparent 22%,transparent 52%,rgba(7,30,33,.75) 100%)}
.own-c .ph::after,body .own-c:hover .ph::after{display:none}
.own-c .no{left:18px;top:18px;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.25)}
.own-c figcaption{position:absolute;left:14px;right:14px;bottom:14px;z-index:3;border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:18px 20px;
  background:rgba(7,30,33,.42);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);color:#fff;align-items:center;
  transition:transform .6s cubic-bezier(.2,.8,.2,1),background .6s}
.own-c:hover figcaption{transform:translateY(-6px);background:rgba(7,30,33,.6)}
.own-c h3{font-size:23px;color:#fff;letter-spacing:-.01em}
.own-c figcaption p{color:var(--gold);margin-top:7px}
.own-c .loc{display:inline-flex;align-items:center;gap:6px;color:rgba(255,255,255,.75);font-size:12px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
.own-c .loc::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(255,195,108,.2)}
@media (max-width:640px){.own-c:nth-child(2){margin-top:0}.own-c figcaption{flex-direction:row;align-items:center}.own-c h3{font-size:20px}}
/* original brand icons: filled phone (green) + Viber logo (purple) */
.inq-alt .ia svg{fill:currentColor;stroke:none;width:20px;height:20px;flex-basis:20px}
.inq-alt .ia-tel{color:#25a244}
.inq-alt .ia-viber{color:#7360f2}
.inq-alt .ia-tel:hover{background:#25a244;border-color:#25a244;color:#fff}
.own-c .ph .loc{position:absolute;right:18px;top:18px;z-index:3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(7,30,33,.35)}

/* ---------- kuhni reviews: same card as the homepage testimonials (.tm .t), three in a row ---------- */
.rvw .mos{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.rvw .t{margin:0}
.rvw .t:nth-child(3n+2){transition-delay:.12s}.rvw .t:nth-child(3n){transition-delay:.24s}
.rvw .t .b{position:relative;height:100%;display:flex;flex-direction:column;background:#f7f2e8;color:var(--ink);border:1px solid rgba(255,255,255,.9);box-shadow:0 20px 50px -24px rgba(0,0,0,.9);border-radius:14px;overflow:hidden;transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .45s,box-shadow .45s}
.rvw .t .b::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;z-index:3;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);transition:transform .6s}
.rvw .t:hover .b{transform:translateY(-8px);border-color:rgba(255,195,108,.45);box-shadow:0 30px 60px -20px rgba(0,0,0,.95),0 0 0 2px var(--gold),0 10px 50px -10px rgba(255,195,108,.35)}
.rvw .t:hover .b::after{transform:scaleX(1)}
.rvw .ph{position:relative;aspect-ratio:16/10}
.rvw .ph .cv{position:absolute;inset:0;transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .6s;filter:saturate(1.08) contrast(1.06)}
.rvw .ph::after{content:"";position:absolute;inset:0 0 -2px;background:linear-gradient(180deg,transparent 70%,rgba(247,242,232,.6) 90%,#f7f2e8)}
.rvw .ph-in{position:absolute;inset:0 0 -1px;overflow:hidden}
.rvw .t:hover .ph .cv{transform:scale(1.08);filter:saturate(1.15) contrast(1.1)}
.rvw .tag{position:absolute;left:18px;top:18px;z-index:1;font:500 12px Ubuntu;letter-spacing:.12em;text-transform:uppercase;background:var(--gold);border:1px solid var(--gold);padding:6px 10px;border-radius:999px;color:var(--ink);box-shadow:0 6px 18px -6px rgba(0,0,0,.45)}
.rvw .qm{position:absolute;right:22px;bottom:-24px;z-index:2;width:48px;height:48px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23EA4335' d='M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z'/%3E%3Cpath fill='%234285F4' d='M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z'/%3E%3Cpath fill='%23FBBC05' d='M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z'/%3E%3Cpath fill='%2334A853' d='M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z'/%3E%3C/svg%3E") center/24px no-repeat;box-shadow:0 0 0 2px var(--gold),0 12px 26px -6px rgba(7,30,33,.6);border:3px solid var(--ink);transition:transform .45s}
.rvw .t:hover .qm{transform:rotate(-12deg) scale(1.08)}
.rvw .tx{display:flex;flex-direction:column;flex:1;padding:26px 26px 24px}
.rvw .st{color:#a5680a;letter-spacing:3px;font-size:14px}
.rvw .t q{display:block;font-size:16px;line-height:1.6;color:#1a2122;font-weight:500;margin:12px 0 22px;quotes:"„" "“"}
.rvw .au{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:18px;border-top:1px solid rgba(0,0,0,.12)}
.rvw .au i{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font:500 15px Ubuntu;font-style:normal;color:var(--ink);border:0;background:var(--gold)}
.rvw .au b{display:block;font:500 15px Ubuntu}
.rvw .au small{color:#5d6869;font-size:13px}
@media (max-width:1000px){.rvw .mos{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .rvw .mos{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -20px;padding:10px 20px 34px;gap:14px}
  .rvw .mos::-webkit-scrollbar{display:none}
  .rvw .t{flex:0 0 86%;scroll-snap-align:center;opacity:1;transform:none}
}

/* za-nas owners: "БИЖУ" draws itself in the background (stroke), then softly fills */
.own-c .ph .loc{display:none}
.own-bg{position:absolute;left:50%;top:50%;width:min(1500px,118vw);transform:translate(-50%,-50%);z-index:0;pointer-events:none;overflow:visible}
.own .wrap{z-index:1}
/* БИЖУ watermark: outline draws itself → letters fill with a real project photo → a gold glint keeps sweeping the outline; drifts with scroll (site.js) */
.own-bg text{font:700 300px/1 Ubuntu,Arial,sans-serif;letter-spacing:-12px}
.own-bg .ln{fill:none;stroke:rgba(185,134,47,.42);stroke-width:1.4;stroke-dasharray:2600;stroke-dashoffset:2600}
.own-bg.in .ln{animation:ownDraw 3.2s cubic-bezier(.45,0,.2,1) .2s forwards,ownSoft 1.4s ease 3s forwards}
.own-bg .ph{fill:url(#ownPh);stroke:none;opacity:0;filter:sepia(.35) saturate(.7) brightness(1.15);transition:opacity 1.8s ease 2.4s}
.own-bg.in .ph{opacity:.1}
.own-bg .own-ph{transform-box:fill-box;transform-origin:center;transform:scale(1.18);transition:transform 9s cubic-bezier(.2,.7,.2,1) 2.4s}
.own-bg.in .own-ph{transform:scale(1)}
.own-bg .gl{fill:none;stroke:url(#ownGl);stroke-width:2.2;opacity:0;transition:opacity 1s ease 3.4s}
.own-bg.in .gl{opacity:.95}
@keyframes ownDraw{to{stroke-dashoffset:0}}
@keyframes ownSoft{to{stroke:rgba(185,134,47,.26)}}
@media (max-width:640px){.own-bg.in .ph{opacity:.08}}
@media (prefers-reduced-motion:reduce){.own-bg .ln{stroke-dashoffset:0;animation:none}.own-bg .ph{opacity:.1;transition:none}.own-bg .own-ph{transform:none;transition:none}.own-bg .gl{display:none}}

/* ---------- kuhni materials: big photo + list, active row swaps the photo (ref: Sunday "anatomy", YLLW material boards) ---------- */
.matx-head{display:grid;grid-template-columns:1fr 1fr;gap:20px 60px;align-items:end;margin-bottom:56px}
.matx-head .eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--gold)}
.matx-head .eyebrow::before{content:"";width:28px;height:1px;background:var(--gold)}
.matx-head p{color:#b9c8c9;font-size:17px;line-height:1.7;max-width:440px;justify-self:end;padding-left:28px;border-left:1px solid rgba(255,255,255,.18)}
.matx-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(36px,5vw,80px);align-items:start}
.matx-ph{position:sticky;top:110px;aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:#041314;box-shadow:0 50px 90px -50px rgba(0,0,0,.9),0 0 0 1px rgba(255,195,108,.2)}
.matx-ph .cv{position:absolute;inset:0;opacity:0;transform:scale(1.08);transition:opacity .8s,transform 1.6s cubic-bezier(.2,.8,.2,1)}
.matx-ph .cv.on{opacity:1;transform:scale(1)}
.matx-ph::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 55%,rgba(4,19,20,.85));pointer-events:none}
.matx-ph::after{content:"";position:absolute;inset:14px;z-index:1;border:1px solid rgba(255,195,108,.28);border-radius:10px;pointer-events:none}
.matx-cap{position:absolute;left:34px;right:34px;bottom:30px;z-index:2;display:flex;flex-direction:column;gap:6px}
.matx-cap span{font:500 12px Ubuntu;letter-spacing:.16em;color:var(--gold)}
.matx-cap b{font:500 clamp(24px,2.4vw,34px) Ubuntu;color:#fff}
.matx-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.12)}
.matx-list li{position:relative;display:grid;grid-template-columns:46px 1fr 32px;gap:16px;align-items:start;padding:24px 4px 24px 0;border-bottom:1px solid rgba(255,255,255,.12);cursor:pointer;outline:0}
.matx-list li::before{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.matx-list li.on::before{transform:scaleX(1)}
.matx-list li>b{font:500 13px Ubuntu;letter-spacing:.08em;color:#6f8586;padding-top:7px;transition:color .4s}
.matx-list h3{font-size:22px;font-weight:500;color:#cfdcdc;transition:color .4s}
.matx-list span{display:block;margin-top:4px;font-size:12.5px;letter-spacing:.08em;color:#8a9d9e}
.matx-list .mx-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.2,.8,.2,1)}
.matx-list .mx-a p{overflow:hidden;margin:0;color:#b9c8c9;font-size:15.5px;line-height:1.7;opacity:0;transition:opacity .4s}
.matx-list li.on .mx-a{grid-template-rows:1fr}
.matx-list li.on .mx-a p{opacity:1;padding-top:12px;transition-delay:.1s}
.matx-list li.on>b,.matx-list li.on span{color:var(--gold)}
.matx-list li.on h3,.matx-list li:hover h3{color:#fff}
.matx-list li>i{position:relative;width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.2);margin-top:2px;transition:.4s}
.matx-list li>i::before,.matx-list li>i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:#cfdcdc;transform:translate(-50%,-50%)}
.matx-list li>i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .4s}
.matx-list li.on>i{background:var(--gold);border-color:var(--gold)}
.matx-list li.on>i::before,.matx-list li.on>i::after{background:var(--ink)}
.matx-list li.on>i::after{transform:translate(-50%,-50%) rotate(0)}
.matx-list li:focus-visible{box-shadow:inset 0 0 0 2px rgba(255,195,108,.5);border-radius:6px}
@media (max-width:1000px){.matx-head{grid-template-columns:1fr}.matx-head p{justify-self:start;padding-left:0;border-left:0}.matx-grid{grid-template-columns:1fr}.matx-ph{position:relative;top:0;aspect-ratio:16/11}}
@media (max-width:640px){.matx-ph{aspect-ratio:4/3}.matx-cap{left:24px;bottom:22px}.matx-list li{grid-template-columns:34px 1fr 30px;gap:10px;padding:18px 0}.matx-list h3{font-size:18px}}
.own-bg.rv,.own-bg.rv.in{opacity:1;transform:translate(-50%,-50%);transition:none}

/* kuhni reviews: chamfered cards (two cut corners, mirrored on the middle card) in a zig-zag */
.rvw .mos{align-items:start;padding-bottom:70px}
.rvw .t{filter:drop-shadow(0 24px 30px rgba(7,30,33,.22))}
.rvw .t .b{border-radius:0;box-shadow:none;clip-path:polygon(44px 0,100% 0,100% calc(100% - 44px),calc(100% - 44px) 100%,0 100%,0 44px)}
.rvw .t:nth-child(2) .b{clip-path:polygon(0 0,calc(100% - 44px) 0,100% 44px,100% 100%,44px 100%,0 calc(100% - 44px))}
.rvw .t:hover .b{box-shadow:none}
.rvw .t .b::after{display:none}
.rvw .tag{left:50px}.rvw .t:nth-child(2) .tag{left:18px}
.rvw .t:nth-child(2){margin-top:70px}
@media (max-width:1000px){.rvw .t:nth-child(2){margin-top:0}.rvw .t:nth-child(even){margin-top:70px}}
@media (max-width:640px){.rvw .t:nth-child(n){margin-top:0}.rvw .mos{padding-bottom:34px}}

/* chamfered cards (like kuhni reviews): two cut corners, mirrored + lifted on the "middle" cards */
.pr .cards,.cgrid,.feats,.adv .g{--cut:40px;filter:drop-shadow(0 22px 28px rgba(7,30,33,.2));align-items:start}
.feats,.adv .g{--cut:30px}
.pr .cards>*,.cgrid>.office,.feats>.feat,.adv .g>div{border-radius:0!important;box-shadow:none!important;border:0!important;clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
.pr:not(.n4) .cards>:nth-child(3n+2),.pr.n4 .cards>:nth-child(even),.cgrid>.office:nth-child(even),.feats:not(.c4)>.feat:nth-child(3n+2),.feats.c4>.feat:nth-child(even),.adv .g>div:nth-child(3n+2){clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)));margin-top:56px}
.pr .cards .num{left:calc(var(--cut) - 4px)}
.pr:not(.n4) .cards>:nth-child(3n+2) .num,.pr.n4 .cards>:nth-child(even) .num{left:18px}
.pr{padding-bottom:150px}
@media (max-width:1000px){.pr .cards>:nth-child(n),.cgrid>.office:nth-child(n),.feats>.feat:nth-child(n),.adv .g>div:nth-child(n){margin-top:0}}

/* SILK — златен фон „коприна“ (img/bg-silk-s4.webp) за тъмни секции. Не слагай на две съседни секции. */
.sec.dark.silk::before{background:linear-gradient(90deg,rgba(3,16,15,.78) 0%,rgba(3,16,15,.35) 55%,rgba(3,16,15,.15) 100%),linear-gradient(180deg,rgba(3,16,15,.25) 0%,transparent 40%,rgba(3,16,15,.6) 100%),url(../img/bg-silk-s4.webp) center/cover no-repeat,#03100f}
.sec.dark.silk-r::before{transform:scaleX(-1);background:linear-gradient(270deg,rgba(3,16,15,.82) 0%,rgba(3,16,15,.4) 55%,rgba(3,16,15,.15) 100%),linear-gradient(180deg,rgba(3,16,15,.25) 0%,transparent 40%,rgba(3,16,15,.6) 100%),url(../img/bg-silk-s4.webp) center/cover no-repeat,#03100f}

/* .feats.ph — карти със снимка за фон (--img на всяка карта), текстът отдолу върху тъмен преход */
.feats.ph .feat{min-height:340px;display:flex;flex-direction:column;justify-content:flex-end;text-align:left;padding:28px 26px;
  background:linear-gradient(180deg,rgba(7,30,33,.05) 0%,rgba(7,30,33,.35) 40%,rgba(7,30,33,.92) 100%),var(--img) center/cover no-repeat !important;border:0}
.feats.ph .feat .ic{position:absolute;left:26px;top:24px;margin:0;background:var(--gold);color:var(--ink);border:0;box-shadow:0 6px 16px -6px rgba(0,0,0,.5)}
.feats.ph .feat h3{color:#fff}
.feats.ph .feat p{color:rgba(255,255,255,.82);margin:0;max-width:none}

/* ===== HOME COMPONENTS on subpages (mirrored from index.html): .svc 2B, .adv 4A, .viz3 3D compare =====
   Silk sections move only their ::before bg layer (perf rule). Never put two silk sections next to each other. */
.svc{position:relative;background:transparent;color:#fff;padding:110px 0 90px;overflow:hidden}
.svc[data-tx="unfold"]{clip-path:none}
.svc::before{content:"";position:absolute;inset:0;will-change:transform;clip-path:inset(0 calc(var(--k,0) * 4.5%) round calc(var(--k,0) * 44px));background:linear-gradient(90deg,rgba(7,30,33,.7) 0%,rgba(7,30,33,.25) 55%,rgba(7,30,33,.1) 100%),linear-gradient(180deg,transparent 45%,rgba(7,30,33,.55) 100%),url(../img/bg-silk-s4.webp) center/cover no-repeat,var(--ink);pointer-events:none}
.svc .wrap{position:relative}
.svc .top{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:end}
.svc h2{font-size:clamp(30px,3.2vw,46px);font-weight:500;line-height:1.15}
.svc .top>div:last-child{padding-left:32px;border-left:1px solid rgba(255,255,255,.12)}
.svc .top p{color:#b9c8c9;line-height:1.7}
.svc .top .acts{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.svc .pgrid{margin-top:64px;padding-bottom:40px}
.svc .tabs{display:flex;justify-content:center;gap:8px;margin-top:20px;flex-wrap:wrap}
.svc .tabs a{padding:9px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:#cfdcdc;font-size:14px;transition:all .3s}
.svc .tabs a:hover,.svc .tabs a.on{border-color:var(--gold);color:var(--gold);background:rgba(255,195,108,.08)}
.svc-hint{display:none}

.adv{background:var(--bg);padding:110px 0}
.adv h2{font-size:clamp(34px,4.6vw,60px);font-weight:500;text-align:center;letter-spacing:-.01em;max-width:820px;margin:0 auto}
.adv .lead{text-align:center;color:var(--mute);font-size:17px;line-height:1.7;max-width:620px;margin:18px auto 0}
.adv .g{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 28px;margin-top:64px;text-align:center}
.adv .g>div{background:linear-gradient(180deg,#fbf7ef 0%,#f3ece0 100%);padding:34px 28px 32px;position:relative;overflow:hidden;transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.adv .ico{display:inline-grid;place-items:center;width:68px;height:68px;border-radius:50%;background:linear-gradient(180deg,#fff,#f6f1e8);border:1px solid #e6dccb;box-shadow:inset 0 2px 0 #fff,0 3px 0 #e2d6c1,0 8px 14px -6px rgba(7,30,33,.25)}
.adv .ico img{width:32px;height:32px;object-fit:contain}
.adv h3{font-size:22px;margin:16px 0 8px}
.adv p{font-size:15px;color:#4a5b5d;max-width:280px;margin:0 auto}
.adv-cta{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:60px}
.adv-cta span{font-size:14px;color:var(--mute)}

.viz3{background:var(--bg);padding:110px 0}
.viz3 .viz-txt h2{font-size:clamp(30px,3.4vw,46px);font-weight:500;margin:14px 0 16px}
.viz3 .viz-txt>p{color:var(--mute)}
.viz-pts{list-style:none;padding:0;margin:28px 0 32px;border-top:1px solid rgba(7,30,33,.1)}
.viz-pts li{display:grid;grid-template-columns:170px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(7,30,33,.1);font-size:15px}
.viz-pts b{font:500 16px Ubuntu}
.viz-pts span{color:var(--mute)}
.viz3 .viz-thumbs span{color:var(--mute)}

/* process with silk: only the bg layer bends in the arch */
.pr.silk{background:transparent}
.pr.silk[data-tx="arch"]{border-radius:0}
.pr.silk::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;will-change:transform;
  border-top-left-radius:50% calc(var(--k,0) * var(--ah,0px));border-top-right-radius:50% calc(var(--k,0) * var(--ah,0px));
  background:radial-gradient(50% 32% at 50% 30%,rgba(3,16,15,.8),transparent 75%),linear-gradient(180deg,rgba(3,16,15,.2) 0%,rgba(3,16,15,.15) 45%,rgba(3,16,15,.7) 100%),url(../img/bg-silk-s4.webp) center/cover no-repeat,#03100f}
.pr.silk>.wrap{position:relative;z-index:1}

@media (max-width:1000px){
  .svc .top{grid-template-columns:1fr;gap:28px}.svc .top>div:last-child{padding-left:0;border-left:0}
  .adv .g{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .svc .pgrid{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:40px -20px 0;padding:0 20px 28px;gap:14px}
  .svc .pgrid::-webkit-scrollbar{display:none}
  .svc .pgrid>.pcard{flex:0 0 82%;scroll-snap-align:center;opacity:1;transform:none}
  .svc .pgrid>.pcard p{-webkit-line-clamp:2}
  .svc-hint{display:block;text-align:center;font-size:12.5px;letter-spacing:.08em;color:#8fa1a2;margin-top:-6px}
  .adv{padding:80px 0}
  .adv .g{grid-template-columns:1fr 1fr;gap:14px;margin-top:40px}
  .adv .g>div{padding:20px 12px 18px}
  .adv .ico{width:50px;height:50px}.adv .ico img{width:24px;height:24px}
  .adv h3{font-size:16px;line-height:1.25;margin:12px 0 6px}
  .adv p{font-size:13px;line-height:1.5}
  .adv-cta{margin-top:40px}
  .viz3{padding:80px 0}.viz-pts li{grid-template-columns:1fr;gap:2px}
}

/* home 6D stats + partner logo marquee (mirrored from index.html) */
.stats{padding:64px 0;border-bottom:1px solid #eee}
.stats>.wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.stat{display:flex;flex-direction:column;align-items:center;flex:1;min-width:180px}
.stat div{display:flex;align-items:center;gap:12px}
.stat img{width:46px;height:46px;object-fit:contain}
.stat b{font:700 52px Ubuntu}
.stat p{font-size:14px;color:var(--mute)}
.lstrip{max-width:var(--wrap);margin:44px auto 0;padding:0 32px;display:flex;align-items:center;gap:28px}
.lstrip>span{flex:0 0 auto;font:500 12px Ubuntu;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.lstrip-v{flex:1;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.lstrip-t{display:flex;align-items:center;gap:56px;width:max-content;animation:lsMove 60s linear infinite}
.lstrip-v:hover .lstrip-t{animation-play-state:paused}
.lstrip-t img{height:34px;width:auto;max-width:120px;object-fit:contain;filter:grayscale(1);opacity:.6;transition:filter .3s,opacity .3s}
.lstrip-t img:hover{filter:none;opacity:1}
@keyframes lsMove{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.lstrip-t{animation:none}}
@media (max-width:640px){.lstrip{padding:0 20px;flex-direction:column;align-items:stretch;gap:14px;text-align:center}.lstrip-t img{height:28px}}
/* silk card right after a page hero: keep a light gap so the rounded card does not touch the photo */
.phero+.svc{margin-top:clamp(40px,5vw,80px)}

/* форма за запитване — златна „коприна“ отзад, по-плътно затъмнена заради полетата */
.inq-card{background:linear-gradient(160deg,rgba(7,30,33,.9) 0%,rgba(7,30,33,.72) 55%,rgba(7,30,33,.55) 100%),url(../img/bg-silk-s4.webp) 70% center/cover no-repeat,var(--ink)}
.inq-card::after{display:none}

/* ---------- RESPONSIVE AUDIT (2026-11-05) ---------- */
body{overflow-x:clip} /* safety net: off-screen reveal offsets never cause sideways scroll; clip keeps position:sticky working */
section:has(>.wrap>.tl){overflow-x:clip} /* za-nas timeline slides in from ±40px */
.burger{min-width:44px;min-height:44px;padding:0;cursor:pointer}
/* iOS Safari (phone + iPad) zooms into any field under 16px on focus */
@media (max-width:1100px){.panel input,.panel textarea,.iform input,.iform textarea,.iform select,.inq-card .fl input,.inq-card .fl textarea,.inq-card .fl select{font-size:16px}}
@media (max-width:640px){
  .agree input[type=checkbox]{width:20px;height:20px;flex:0 0 20px;margin-top:0}
  .agree{align-items:center}
  /* footer links: finger-sized rows */
  .ft .cols{line-height:1.5;row-gap:28px}
  .ft .cols a{display:inline-block;padding:7px 0}
  .ft .copy a{display:inline-block;padding:8px 2px}
  .crumbs a{display:inline-block;padding:10px 0}
}

/* ---------- GLASS NAV (2026-11-05): on scroll the bar lifts into a floating frosted pill ---------- */
.hdr,.hdr.solid,.hdr.mopen{background:transparent;box-shadow:none}
.hdr .wrap{position:relative;border:1px solid transparent;border-radius:0;
  transition:height .55s cubic-bezier(.2,.8,.2,1),margin .55s cubic-bezier(.2,.8,.2,1),padding .55s cubic-bezier(.2,.8,.2,1),border-radius .55s cubic-bezier(.2,.8,.2,1),background-color .45s,border-color .45s,box-shadow .45s}
.hdr.solid .wrap,.hdr.mopen .wrap{height:60px;margin:10px max(12px,calc((100% - 1320px)/2)) 0;padding:0 12px 0 16px;border-radius:18px;
  background:rgba(7,30,33,.82);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);
  border-color:rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 20px 44px -20px rgba(0,0,0,.6)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.hdr.solid .wrap,.hdr.mopen .wrap{background:rgba(7,30,33,.94)}}
.hdr .logo img{transition:height .55s cubic-bezier(.2,.8,.2,1),transform .4s cubic-bezier(.2,.8,.2,1)}
.hdr.solid .logo img,.hdr.mopen .logo img{height:38px}
.hdr .btn{transition:padding .55s cubic-bezier(.2,.8,.2,1),transform .3s,background .3s,box-shadow .3s}
.hdr.solid .btn{padding:9px 16px}
/* menu: soft glass highlight slides to the hovered item, rests on the current page */
.menu{position:relative;isolation:isolate}
.menu a::after{display:none}
.menu .ink{position:absolute;left:0;top:50%;height:34px;margin-top:-17px;border-radius:999px;z-index:-1;pointer-events:none;opacity:0;
  background:var(--gold);box-shadow:0 6px 18px -8px rgba(255,195,108,.7);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),width .45s cubic-bezier(.2,.8,.2,1),opacity .3s}
.menu .ink.go{opacity:1}
.menu a{transition:color .3s}
@media (min-width:1001px){.menu a.hl,.menu a.hl:hover{color:var(--ink);text-shadow:none}} /* dark text on the solid gold pill (pill is desktop-only) */
.menu .ink.still{transition:none}
@media (max-width:1000px){
  .menu .ink{display:none}
  .hdr.mopen .menu{top:78px;left:max(12px,calc((100% - 1320px)/2));right:max(12px,calc((100% - 1320px)/2));padding:18px 22px 24px;border-radius:18px;
    background:rgba(7,30,33,.95);-webkit-backdrop-filter:blur(24px) saturate(1.6);backdrop-filter:blur(24px) saturate(1.6);border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 60px -24px rgba(0,0,0,.7)}
  .hdr.mopen .menu a{padding:8px 0}
}
@media (max-width:640px){.hdr.solid .wrap,.hdr.mopen .wrap{margin:8px 8px 0;height:56px;padding:0 6px 0 12px}.hdr.mopen .menu{top:70px;left:8px;right:8px}}
@media (prefers-reduced-motion:reduce){.hdr .wrap,.hdr .logo img,.menu .ink{transition:none}}

/* проекти — заглавна лента с „коприна“ (ниска и широка, затова се показва средната ивица на снимката) */
.ptop{background:linear-gradient(90deg,rgba(7,30,33,.85) 0%,rgba(7,30,33,.45) 50%,rgba(7,30,33,.25) 100%),url(../img/bg-silk-s4.webp) center 40%/cover no-repeat,var(--ink)}

/* .rvw.sm — по-компактни карти с отзиви (proekti.html) */
.rvw.sm .mos{max-width:1040px;margin:0 auto;gap:20px;padding-bottom:40px}
.rvw.sm .ph{aspect-ratio:16/9}
.rvw.sm .tx{padding:20px 20px 18px}
.rvw.sm .t q{font-size:14.5px;margin:10px 0 16px}
.rvw.sm .au{padding-top:14px}
.rvw.sm .au i{width:34px;height:34px;font-size:13px}
.rvw.sm .au b{font-size:14px}
.rvw.sm .qm{width:40px;height:40px;bottom:-20px;right:18px}
.rvw.sm .mos{align-items:stretch;padding-bottom:0}
.rvw.sm .t:nth-child(n){margin-top:0}
.rvw.sm .t .b,.rvw.sm .t:nth-child(2) .b{clip-path:none;border-radius:16px;overflow:hidden}
.rvw.sm .tag,.rvw.sm .t:nth-child(2) .tag{left:16px;top:16px}


/* readability pass 2026-11-05: text that sits on the bright gold silk streaks */
.svc .top p{color:#e3ebeb;text-shadow:0 1px 2px rgba(3,16,15,.85),0 0 22px rgba(3,16,15,.95)}
.pr .sub,.tm .sub{color:#d5e0e0;text-shadow:0 1px 2px rgba(3,16,15,.8),0 0 18px rgba(3,16,15,.9)}
.sec.dark.silk .viz-txt>p,.sec.dark.silk .shead p{text-shadow:0 1px 2px rgba(3,16,15,.8),0 0 18px rgba(3,16,15,.9)}
/* ВСИЧКИ карти — само правоъгълни (без скосени ъгли), навсякъде в сайта. Зигзагът остава. */
.pr .cards>*,.pr .cards>:nth-child(n),.cgrid>.office,.cgrid>.office:nth-child(n),.feats>.feat,.feats>.feat:nth-child(n),
.adv .g>div,.adv .g>div:nth-child(n),.rvw .t .b,.rvw .t:nth-child(n) .b{clip-path:none!important;border-radius:0!important}
.rvw .tag,.rvw .t:nth-child(n) .tag{left:18px}
.ft .copy .made a{color:var(--gold2,#b9862f)}

/* cookie table on pravni.html */
.ck-wrap{overflow-x:auto;margin:14px 0 8px}
.ck{width:100%;min-width:560px;border-collapse:collapse;font-size:14.5px;line-height:1.5}
.ck th,.ck td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid #e3dccd}
.ck th{font:500 12px Ubuntu;letter-spacing:.12em;text-transform:uppercase;color:#5f6b6c;background:#f3ece0}
.ck td small{color:#5f6b6c}
.ck .ck-g td{background:#faf6ef;color:var(--ink);padding-top:16px}
