/* ============================================================
   ARTVAN GROUP v1.4 — Design System
   FIXED vs v1.3:
   G-01 Hero stats counter (data-t fix)
   G-02 SVG logo — transparent background
   G-03 Body scroll lock on mobile nav
   G-04 Font fallback stack
   G-05 Favicon
   G-06 Footer 4-col correct
   B-01 Stats IntersectionObserver fixed
   B-07 Services page rebuilt as full accordion
   B-08 Quick nav anchors added
   B-10 RTL direction reset on mobile
   B-11 Portfolio filter grid-gap fix
   B-14 Proj-layout responsive fix
   B-16 Breadcrumb HTML fix
   B-17 Stats on about fixed
   B-18 Team avatar CSS circles
   B-20 Single modal ID
   D-01 Hero h1 text-shadow
   D-03 Values icons → typographic
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Inter:wght@300;400;500;600;700&family=Bebas+Neue&display=swap');

:root {
  --red:      #E0433B;
  --red-dk:   #c83530;
  --bg:       #0C0C0C;
  --bg-card:  #161616;
  --bg-mid:   #1C1C1C;
  --white:    #FFFFFF;
  --grey:     #686868;
  --grey-lt:  #A8A8A8;
  --brd:      #252525;
  --brd-md:   #343434;
  --font-h:   'Cormorant Garamond', Georgia, serif;
  --font-b:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-n:   'Bebas Neue', Impact, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-b);
  background:var(--bg); color:var(--white);
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
  line-height:1.6;
}
/* body scroll lock when mobile nav open */
body.nav-open{overflow:hidden}

h1,h2,h3,h4{font-family:var(--font-h);font-weight:500;line-height:1.08;letter-spacing:-.015em}
h1{font-size:clamp(2.8rem,6vw,5.6rem)}
h2{font-size:clamp(2rem,4vw,3.6rem)}
h3{font-size:clamp(1.2rem,2vw,2rem)}
p{font-size:.88rem;line-height:1.82;color:var(--grey-lt)}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}

/* ─── HEADER ─── */
.hdr{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 60px;height:70px;
  transition:background .4s,border-bottom .4s;
}
.hdr.solid{
  background:rgba(8,8,8,.97);
  border-bottom:1px solid var(--brd);
  backdrop-filter:blur(20px);
}
.hdr-logo img{height:40px;width:auto;display:block}
/* v2.9 FIX: group nav+lang+cta+burger on the right so menu doesn't drift left */
.hdr-right{display:flex;align-items:center;gap:36px}
.hdr-nav{display:flex;gap:36px;list-style:none}
.hdr-nav a{
  font-size:.69rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;
  color:rgba(255,255,255,.58);transition:color .2s;
}
.hdr-nav a:hover,.hdr-nav a.on{color:#fff}
.hdr-cta{
  font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:#fff;border:1px solid rgba(255,255,255,.38);padding:9px 22px;
  background:transparent;cursor:pointer;transition:all .22s;font-family:var(--font-b);
}
.hdr-cta:hover{background:var(--red);border-color:var(--red)}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;border:none;background:none;padding:4px}
.burger span{width:24px;height:1.5px;background:#fff;display:block;transition:transform .3s,opacity .3s}
.burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* Mobile nav */
.mob-nav{
  position:fixed;inset:0;z-index:999;background:#060606;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;
  transform:translateX(100%);transition:transform .38s cubic-bezier(.4,0,.2,1);
}
.mob-nav.open{transform:translateX(0)}
.mob-nav a{font-family:var(--font-h);font-size:2.8rem;font-weight:400;color:#fff;letter-spacing:.04em;transition:color .2s}
.mob-nav a:hover{color:var(--red)}
.mob-nav .m-cta{color:var(--red)!important;font-size:1.4rem!important}

/* ─── HERO ─── */
.hero{
  position:relative;height:100vh;min-height:680px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  transition:opacity .6s ease;
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(0,0,0,.55) 0%,rgba(0,0,0,.72) 65%,rgba(0,0,0,.9) 100%);
}
.hero-vig{
  position:absolute;inset:0;
  background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,0,.62) 100%);
}
.slides{position:absolute;inset:0}
.slide{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:70px 48px 120px;
  opacity:0;pointer-events:none;transition:opacity .9s ease;z-index:2;
}
.slide.active{opacity:1;pointer-events:auto}
.slide-label{
  font-size:1.1rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--red);font-weight:700;margin-bottom:22px;
  display:flex;align-items:center;justify-content:center;gap:16px;
  text-shadow:0 1px 12px rgba(0,0,0,.85), 0 0 2px rgba(0,0,0,.6);
}
.slide-label::before,.slide-label::after{content:'';display:block;width:40px;height:1px;background:var(--red)}
/* D-01 FIX: text-shadow for hero h1 */
.slide h1{
  color:#fff;max-width:820px;margin-bottom:22px;
  text-shadow:0 2px 18px rgba(0,0,0,.75), 0 1px 3px rgba(0,0,0,.5);
}
.slide .sub{font-size:1rem;color:rgba(255,255,255,.82);max-width:520px;margin:0 auto 40px;line-height:1.75;text-shadow:0 1px 10px rgba(0,0,0,.8)}
.slide-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* Hero bottom */
.hero-foot{
  position:absolute;bottom:0;left:0;right:0;z-index:3;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 60px 36px;
}
.dots{display:flex;gap:8px}
.dot{
  width:32px;height:2px;background:rgba(255,255,255,.2);
  border:none;cursor:pointer;padding:0;transition:width .35s,background .3s;
}
.dot.on{width:56px;background:var(--red)}
.slide-num{font-size:.67rem;letter-spacing:.18em;color:rgba(255,255,255,.28)}
.scroll-line{width:1px;height:44px;background:rgba(255,255,255,.15);animation:spl 2s infinite}
@keyframes spl{0%,100%{opacity:.15}50%{opacity:.5}}

/* ─── BUTTONS ─── */
.btn{
  display:inline-block;font-family:var(--font-b);
  font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  padding:13px 28px;border:1px solid rgba(255,255,255,.38);color:#fff;
  background:transparent;cursor:pointer;transition:all .22s;
}
.btn:hover{background:var(--red);border-color:var(--red)}
.btn-red{background:var(--red);border-color:var(--red)}
.btn-red:hover{background:var(--red-dk);border-color:var(--red-dk)}
.btn-wf{background:#fff;border-color:#fff;color:var(--red)}
.btn-wf:hover{background:transparent;color:#fff}
.btn-lg{padding:15px 44px;font-size:.74rem}
.btn-sm{padding:8px 18px;font-size:.65rem}

/* ─── STATS (B-01 FIX: data-t attribute, not data-target) ─── */
.stats{background:var(--bg-card);border-top:1px solid var(--brd);border-bottom:1px solid var(--brd)}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:46px 40px;border-right:1px solid var(--brd);position:relative;overflow:hidden}
.stat:last-child{border-right:none}
.stat-n{font-family:var(--font-n);font-size:4rem;line-height:1;color:#fff;display:block}
.stat-u{font-family:var(--font-n);font-size:1.4rem;color:var(--red);margin-left:3px}
.stat-l{font-size:.69rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);margin-top:10px;display:block}
.stat-bar{position:absolute;bottom:0;left:40px;height:2px;background:var(--red);width:0;transition:width 1.5s cubic-bezier(.4,0,.2,1)}
.stat.go .stat-bar{width:60px}

/* ─── SECTION ─── */
.sec{padding:100px 60px}
.sec-dark{background:var(--bg)}
.sec-card{background:var(--bg-card)}
.sec-mid{background:var(--bg-mid)}

.ey{/* eyebrow */
  font-size:.67rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--red);font-weight:500;margin-bottom:14px;
  display:flex;align-items:center;gap:12px;
}
.ey::before{content:'';display:inline-block;width:28px;height:1px;background:var(--red)}

/* ─── SERVICES ACCORDION (B-07 FIX: proper full-width accordion) ─── */
.srv-list{margin-top:60px}
.srv-item{border-top:1px solid var(--brd)}
.srv-item:last-child{border-bottom:1px solid var(--brd)}
.srv-head{
  display:grid;grid-template-columns:72px 1fr auto 44px;
  align-items:center;gap:24px;padding:26px 0;cursor:pointer;
}
.srv-head:hover .srv-htitle{opacity:.7}
.srv-num{
  font-family:var(--font-n);font-size:2.6rem;color:rgba(255,255,255,.07);
  line-height:1;transition:color .3s;
}
.srv-item.open .srv-num{color:var(--red)}
.srv-htitle h3{font-size:1.45rem;margin-bottom:3px}
.srv-htitle small{font-size:.73rem;color:var(--grey)}
.srv-tags{display:flex;gap:6px;flex-wrap:wrap}
.srv-tag{font-size:.59rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--brd-md);padding:3px 9px;color:rgba(255,255,255,.28)}
.srv-tog{
  width:44px;height:44px;border:1px solid var(--brd);
  display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;font-family:var(--font-b);font-weight:300;
  transition:transform .35s,background .22s,border-color .22s;
  background:transparent;color:#fff;cursor:pointer;flex-shrink:0;
}
.srv-item.open .srv-tog{transform:rotate(45deg);background:var(--red);border-color:var(--red)}

.srv-body{
  display:grid;grid-template-columns:1fr 1fr;
  max-height:0;overflow:hidden;
  transition:max-height .55s ease,border-top .2s;
}
.srv-item.open .srv-body{max-height:620px;border-top:1px solid var(--brd)}
.srv-img{overflow:hidden;min-height:280px;background:var(--bg-mid)}
.srv-img img{width:100%;height:100%;object-fit:cover;opacity:.78;transition:transform .6s ease}
.srv-item.open .srv-img img{transform:scale(1.04)}
.srv-text{padding:44px 48px}
.srv-text p{margin-bottom:18px;font-size:.87rem;color:rgba(255,255,255,.48)}
.srv-inc{list-style:none;margin-bottom:24px}
.srv-inc li{
  padding:9px 0;border-bottom:1px solid var(--brd);
  font-size:.81rem;color:rgba(255,255,255,.42);
  display:flex;align-items:center;gap:14px;
}
.srv-inc li::before{content:'';width:18px;height:1px;background:var(--red);flex-shrink:0}
.srv-inc li:last-child{border-bottom:none}

/* ─── ABOUT 2-COL ─── */
.about-g{display:grid;grid-template-columns:1fr 1fr}
.about-txt{padding:100px 60px;display:flex;flex-direction:column;justify-content:center}
.about-vis{position:relative;overflow:hidden;min-height:500px}
.about-vis img{width:100%;height:100%;object-fit:cover;object-position:center top}
.about-fade{position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,transparent 45%)}
.about-nums{display:flex;border-top:1px solid rgba(255,255,255,.06);margin-top:40px}
.abt-n{flex:1;padding:24px 0;border-right:1px solid rgba(255,255,255,.06);text-align:center}
.abt-n:last-child{border-right:none}
.abt-n strong{display:block;font-family:var(--font-n);font-size:2rem;color:#fff}
.abt-n span{font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--grey)}

/* ─── PORTFOLIO GRID (B-11 FIX) ─── */
.port-g{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:48px}
.port-c{
  position:relative;overflow:hidden;aspect-ratio:4/3;
  background:var(--bg-card);cursor:pointer;display:block;
}
.port-c.w2{grid-column:span 2;aspect-ratio:16/7}
.port-c img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.port-c:hover img{transform:scale(1.06)}
.port-ov{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.18) 55%,transparent 100%);
  display:flex;flex-direction:column;justify-content:flex-end;padding:24px;
  opacity:0;transition:opacity .32s;
}
.port-c:hover .port-ov{opacity:1}
.port-ov h3{color:#fff;font-size:1rem;margin-bottom:5px}
.port-ov p{font-size:.75rem;color:rgba(255,255,255,.6)}
.port-bdg{
  position:absolute;top:16px;left:16px;
  font-size:.59rem;letter-spacing:.16em;text-transform:uppercase;
  background:var(--red);color:#fff;padding:3px 10px;
}

/* Portfolio filter — B-11 FIX: hide empty grid cells */
.port-c[style*="display: none"]{display:none!important}

/* ─── PROJECT SINGLE ─── */
.proj-hero{position:relative;height:60vh;min-height:460px;overflow:hidden}
.proj-hero img{width:100%;height:100%;object-fit:cover}
.proj-hero-ov{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.15) 60%,transparent 100%);
}
.proj-hero-ct{position:absolute;bottom:0;left:0;right:0;padding:52px 60px;z-index:2}
.proj-hero-ct h1{color:#fff;font-size:clamp(2rem,4vw,3.4rem)}

/* B-14 FIX: proj layout responsive */
.proj-wrap{
  display:grid;grid-template-columns:1fr 340px;gap:56px;
  padding:80px 60px;background:var(--bg);
}
.proj-body h2{color:#fff;margin-bottom:24px}
.proj-body h3{color:#fff;margin:32px 0 14px}
.proj-body p{font-size:.9rem;color:rgba(255,255,255,.52);line-height:1.85;margin-bottom:20px}
.proj-gal{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;margin:32px 0}
.proj-gal img{width:100%;height:220px;object-fit:cover;cursor:zoom-in;transition:opacity .2s}
.proj-gal img:hover{opacity:.85}
.proj-did{margin-top:36px;padding-top:32px;border-top:1px solid var(--brd)}
.did-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.did-item{display:flex;align-items:center;gap:12px;font-size:.83rem;color:rgba(255,255,255,.48)}
.did-item::before{content:'';width:18px;height:1px;background:var(--red);flex-shrink:0;display:block}

/* Sidebar */
.proj-sidebar{}
.proj-meta{background:var(--bg-card);border:1px solid var(--brd);padding:32px}
.proj-meta h4{font-family:var(--font-b);font-size:.63rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.28);margin-bottom:18px;font-weight:500}
.pm-row{padding:12px 0;border-bottom:1px solid var(--brd)}
.pm-row:last-child{border-bottom:none}
.pm-lbl{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.22);margin-bottom:3px}
.pm-val{font-size:.87rem;color:rgba(255,255,255,.68)}
.proj-more{margin-top:18px;background:var(--bg-card);border:1px solid var(--brd);padding:28px}
.proj-more-lbl{font-size:.63rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:14px}
.proj-more a{display:block;padding:13px 0;border-bottom:1px solid var(--brd);color:rgba(255,255,255,.62);font-size:.83rem;transition:color .2s}
.proj-more a:hover{color:#fff}
.proj-more a:last-child{border-bottom:none;padding-bottom:0}
.proj-more a small{display:block;font-size:.7rem;color:var(--grey);margin-top:2px}

/* prev/next nav */
.proj-nav{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:48px}
.proj-nav a{
  display:flex;flex-direction:column;gap:6px;padding:24px 28px;
  background:var(--bg-card);border:1px solid var(--brd);transition:border-color .22s;
}
.proj-nav a:hover{border-color:var(--red)}
.proj-nav a small{font-size:.63rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.proj-nav a span{font-size:.9rem;color:#fff}
.proj-nav a.next{text-align:right}

/* ─── FEATURED ─── */
.feat{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--brd)}
.feat-img{overflow:hidden;min-height:440px;position:relative;background:var(--bg-card)}
.feat-img img{width:100%;height:100%;object-fit:cover;opacity:.82}
.feat-img::after{position:absolute;inset:0;content:'';background:linear-gradient(to right,rgba(0,0,0,.28),transparent)}
.feat-bdg{position:absolute;top:22px;left:22px;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;background:var(--red);color:#fff;padding:3px 10px}
.feat-ct{padding:60px;display:flex;flex-direction:column;justify-content:center}
.feat-ey{font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:12px}
.feat-ct h3{color:#fff;font-size:2.2rem;margin-bottom:16px}
.feat-specs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}
.fsl{font-size:.59rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.22);margin-bottom:3px}
.fsv{font-size:.86rem;color:rgba(255,255,255,.65)}

/* ─── PARTNERS ─── */
.partners{padding:46px 0;background:#080808;border-top:1px solid var(--brd);border-bottom:1px solid var(--brd);overflow:hidden}
.partners-lbl{text-align:center;font-size:.63rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.18);margin-bottom:24px}
.mq-track{display:flex;gap:60px;animation:mq 28s linear infinite;width:max-content}
.mq-track:hover,.mq-track.paused{animation-play-state:paused}
.mq-item{height:26px;display:flex;align-items:center;font-size:.74rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:#fff;opacity:.26;filter:grayscale(1);white-space:nowrap;transition:opacity .2s,filter .2s;cursor:default}
.mq-item:hover{opacity:.72;filter:grayscale(0%)}
@keyframes mq{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ─── CTA BAND ─── */
.cta-band{padding:112px 60px;background:var(--red);text-align:center}
.cta-band h2{color:#fff;font-size:clamp(2rem,4.5vw,3.8rem);margin-bottom:14px}
.cta-band p{color:rgba(255,255,255,.72);font-size:1rem;margin-bottom:40px}

/* ─── FAQ ─── */
.faq{margin-top:48px;max-width:840px}
.faq-item{border-bottom:1px solid var(--brd)}
.faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;
  padding:21px 0;background:none;border:none;color:#fff;
  font-family:var(--font-b);font-size:.9rem;font-weight:500;
  text-align:left;cursor:pointer;gap:20px;transition:color .2s;
}
.faq-q:hover{color:rgba(255,255,255,.65)}
.faq-ico{
  width:28px;height:28px;border:1px solid var(--brd);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;flex-shrink:0;
  transition:transform .3s,background .22s,border-color .22s;
}
.faq-item.open .faq-ico{transform:rotate(45deg);background:var(--red);border-color:var(--red)}
.faq-ans{max-height:0;overflow:hidden;transition:max-height .4s ease}
.faq-item.open .faq-ans{max-height:260px}
.faq-ans-in{padding:0 0 20px;font-size:.85rem;color:rgba(255,255,255,.55);line-height:1.82}

/* ─── VALUES (D-03 FIX: typographic icons) ─── */
.val-g{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:52px}
.val-c{padding:40px 36px;background:var(--bg-card);border:1px solid var(--brd);transition:border-color .25s}
.val-c:hover{border-color:rgba(224,67,59,.3)}
/* large typographic number as icon */
.val-c .v-num{font-family:var(--font-n);font-size:3.2rem;color:var(--red);line-height:1;margin-bottom:16px;display:block;opacity:.7}
.val-c h3{color:#fff;font-size:1.05rem;margin-bottom:10px}

/* ─── TEAM (B-18 FIX: CSS avatar circles) ─── */
.team-g{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:52px}
.team-c{background:var(--bg-card);border:1px solid var(--brd);padding:32px 22px;text-align:center;transition:border-color .25s}
.team-c:hover{border-color:rgba(224,67,59,.25)}
.team-av{
  width:72px;height:72px;border-radius:50%;
  background:linear-gradient(135deg,#222 0%,#2e2e2e 100%);
  margin:0 auto 16px;border:1px solid var(--brd);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-n);font-size:1.6rem;color:rgba(255,255,255,.2);
}
.team-c h3{font-size:.9rem;color:#fff;margin-bottom:5px}
.team-c span{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}

/* ─── CONTACTS ─── */
.contact-g{display:grid;grid-template-columns:1fr 1fr}
.contact-info{padding:80px 60px;background:var(--bg-mid);border-right:1px solid var(--brd)}
.contact-fc{padding:80px 60px;background:var(--bg)}
.ci{margin-bottom:28px}
.ci-lbl{font-size:.59rem;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:7px}
.ci a,.ci p{font-size:.88rem;color:rgba(255,255,255,.56);display:block;line-height:1.65}
.ci a:hover{color:#fff}
.hrs-r{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.04);font-size:.81rem;color:rgba(255,255,255,.42)}
.hrs-r strong{color:rgba(255,255,255,.62)}
.dl-btn{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.03);border:1px solid var(--brd);padding:14px 18px;color:rgba(255,255,255,.52);font-size:.8rem;margin-top:10px;transition:all .2s}
.dl-btn:hover{border-color:rgba(255,255,255,.18);color:#fff}
.map-ph{
  height:280px;background:var(--bg-card);border:1px solid var(--brd);
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;
  color:var(--grey);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;
}
.map-ico{font-size:2.2rem;opacity:.4}

/* ─── PAGE HERO ─── */
.phero{padding:148px 60px 68px;position:relative;overflow:hidden;background:var(--bg);border-bottom:1px solid var(--brd)}
.phero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);background-size:88px 88px}
.phero-in{position:relative;z-index:1;max-width:700px}
/* B-16 FIX: correct breadcrumb HTML */
.bc{font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.24);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.bc a{color:var(--red)}
.bc-sep{color:rgba(255,255,255,.24)}

/* ─── QUICK NAV (B-08 FIX: anchors) ─── */
.qnav{position:sticky;top:70px;z-index:100;background:rgba(8,8,8,.96);border-bottom:1px solid var(--brd);backdrop-filter:blur(16px);padding:0 60px;display:flex;overflow-x:auto;scrollbar-width:none}
.qnav::-webkit-scrollbar{display:none}
.qnav a{padding:15px 22px;font-size:.65rem;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.35);white-space:nowrap;border-bottom:2px solid transparent;transition:all .2s}
.qnav a:hover,.qnav a.on{color:#fff;border-bottom-color:var(--red)}

/* ─── SERVICE PAGE SECTIONS (B-07 FIX) ─── */
.srv-sec{padding:80px 60px;border-bottom:1px solid var(--brd)}
.srv-sec:nth-child(even){background:var(--bg-card)}
.srv-layout{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;margin-top:48px}
.srv-visual{aspect-ratio:4/3;background:var(--bg-mid);overflow:hidden;position:relative}
.srv-visual img{width:100%;height:100%;object-fit:cover;opacity:.8}
.srv-vnum{position:absolute;top:14px;right:18px;font-family:var(--font-n);font-size:4rem;color:rgba(255,255,255,.05);line-height:1}
.inc-item{display:flex;align-items:flex-start;gap:14px;padding:11px 0;border-bottom:1px solid var(--brd)}
.inc-item:last-child{border-bottom:none}
.inc-dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex-shrink:0;margin-top:6px}
.inc-item p{margin:0;font-size:.83rem;color:rgba(255,255,255,.48)}
.stags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.stag{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--brd);padding:5px 12px;color:rgba(255,255,255,.28)}
.intl-b{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
.intlb{background:rgba(255,255,255,.03);border:1px solid var(--brd);padding:7px 13px;font-size:.68rem;letter-spacing:.08em;color:rgba(255,255,255,.32)}

/* ─── FOOTER ─── */
.ftr{background:#060606;border-top:1px solid var(--brd);padding:76px 60px 38px}
/* G-06 FIX: 4-column correct */
.ftr-g{display:grid;grid-template-columns:2fr 1fr 1fr 1.6fr;gap:52px;margin-bottom:52px}
.ftr-logo{display:block;margin-bottom:14px}
.ftr-logo img{height:28px;width:auto}
.ftr-about{font-size:.81rem;color:var(--grey);max-width:250px}
.ftr-col h5{font-family:var(--font-b);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.26);margin-bottom:16px;font-weight:500}
.ftr-col ul{list-style:none}
.ftr-col li{margin-bottom:9px}
.ftr-col a{font-size:.82rem;color:rgba(255,255,255,.46);transition:color .2s}
.ftr-col a:hover{color:#fff}
.fcl{font-size:.59rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:4px}
.fcv{font-size:.82rem;color:rgba(255,255,255,.58);display:block;margin-bottom:11px;line-height:1.6}
.fcv a{color:rgba(255,255,255,.46)}
.fcv a:hover{color:#fff}
.socials{display:flex;gap:9px;margin-top:16px}
.soc{width:34px;height:34px;border:1px solid var(--brd);display:flex;align-items:center;justify-content:center;font-size:.64rem;color:rgba(255,255,255,.3);transition:all .2s}
.soc:hover{border-color:var(--red);color:var(--red)}
.ftr-bot{border-top:1px solid var(--brd);padding-top:26px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.ftr-copy{font-size:.73rem;color:rgba(255,255,255,.35)}
.ftr-lnks{display:flex;gap:18px}
.ftr-lnks a{font-size:.71rem;color:rgba(255,255,255,.35);transition:color .2s}
.ftr-lnks a:hover{color:rgba(255,255,255,.4)}

/* ─── MODAL (B-20 FIX: single id, no duplicate) ─── */
.modal{
  position:fixed;inset:0;z-index:9999;
  background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.modal.open{opacity:1;pointer-events:auto}
.modal-box{
  background:var(--bg-card);border:1px solid var(--brd);
  max-width:540px;width:100%;padding:52px;position:relative;
  transform:translateY(22px);transition:transform .35s;
}
.modal.open .modal-box{transform:translateY(0)}
.modal-x{position:absolute;top:17px;right:21px;font-size:1.3rem;cursor:pointer;color:var(--grey);background:none;border:none;line-height:1;transition:color .2s}
.modal-x:hover{color:#fff}
.modal-box h3{color:#fff;font-size:1.9rem;margin-bottom:6px}
.modal-sub{font-size:.83rem;color:var(--grey);margin-bottom:28px}
.fg{margin-bottom:16px}
.fg label{display:block;font-size:.61rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:7px}
.fg input,.fg select,.fg textarea{
  width:100%;background:rgba(255,255,255,.04);border:1px solid var(--brd);
  color:#fff;padding:12px 14px;font-family:var(--font-b);font-size:.85rem;
  outline:none;border-radius:0;transition:border-color .2s;-webkit-appearance:none;
}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:rgba(255,255,255,.24)}
.fg input::placeholder{color:rgba(255,255,255,.16)}
.fg select{cursor:pointer}
.fg select option{background:var(--bg-card)}
.fg textarea{resize:vertical;min-height:88px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fchk{display:flex;gap:10px;align-items:flex-start;margin-bottom:20px}
.fchk input{width:auto;flex-shrink:0;margin-top:3px;accent-color:var(--red)}
.fchk label{text-transform:none;letter-spacing:0;color:rgba(255,255,255,.27);font-size:.76rem;line-height:1.5}
.fchk a{color:var(--red)}
.fsub button{width:100%;padding:15px;text-align:center;font-size:.74rem}
.succ{display:none;text-align:center;padding:20px 0}
.succ-ico{font-size:2.8rem;display:block;margin-bottom:11px}

/* ─── SCROLL FADE ─── */
.fi{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
.fi.in{opacity:1;transform:translateY(0)}

/* ─── RESPONSIVE ─── */
@media(max-width:1100px){
  .sec,.srv-sec,.phero,.contact-info,.contact-fc,.proj-wrap{padding:72px 40px}
  .hdr{padding:0 40px}
  .ftr{padding:60px 40px 36px}
  .ftr-g{grid-template-columns:1fr 1fr;gap:40px}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .about-g{grid-template-columns:1fr}
  .about-vis{min-height:340px}
  .feat{grid-template-columns:1fr}
  .feat-img{min-height:280px}
  .val-g{grid-template-columns:repeat(2,1fr)}
  .team-g{grid-template-columns:repeat(2,1fr)}
  .port-g{grid-template-columns:repeat(2,1fr)}
  .port-c.w2{grid-column:span 1;aspect-ratio:4/3}
  .proj-wrap{grid-template-columns:1fr}
  .srv-layout{grid-template-columns:1fr}
  .srv-body{grid-template-columns:1fr}
  .srv-img{min-height:220px}
  .qnav{padding:0 40px}
  .cta-band{padding:88px 40px}
  .hero-foot{padding:0 40px 32px}
}
@media(max-width:768px){
  .sec,.srv-sec,.phero,.contact-info,.contact-fc,.proj-wrap{padding:56px 24px}
  .hdr{padding:0 24px;height:60px}
  .hdr-nav,.hdr-cta{display:none}
  .burger{display:flex}
  .slide{padding:60px 24px 100px}
  .hero-foot{padding:0 24px 28px}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .contact-g{grid-template-columns:1fr}
  .contact-info{border-right:none;border-bottom:1px solid var(--brd)}
  .port-g{grid-template-columns:1fr}
  .team-g{grid-template-columns:repeat(2,1fr)}
  .val-g{grid-template-columns:1fr}
  .ftr{padding:52px 24px 30px}
  .ftr-g{grid-template-columns:1fr}
  .qnav{padding:0 24px}
  .srv-head{grid-template-columns:56px 1fr 44px}
  .srv-tags{display:none}
  .frow{grid-template-columns:1fr}
  .modal-box{padding:32px 22px}
  .cta-band{padding:72px 24px}
  .proj-gal{grid-template-columns:1fr}
  .proj-nav{grid-template-columns:1fr}
  .proj-nav a.next{text-align:left}
  .did-grid{grid-template-columns:1fr}
  /* B-10 FIX: reset rtl on mobile */
  .srv-layout[style*="direction:rtl"]{direction:ltr}
}

/* ════════════════════════════════════════════════════════
   v1.6 CLIENT-EDIT — additional styles
   Video feedback IMG_3421.MP4
   ════════════════════════════════════════════════════════ */

/* T-04: Team — top-2 leadership large + rest grid */
.team-lead {
  display:grid; grid-template-columns:1fr 1fr; gap:2px;
  margin-top:52px; margin-bottom:2px;
}
.team-lead-card {
  background:var(--bg-card); border:1px solid var(--brd);
  padding:0; display:flex; align-items:stretch; overflow:hidden;
  min-height:220px; transition:border-color .25s;
}
.team-lead-card:hover { border-color:rgba(224,67,59,.35) }
.team-lead-photo {
  width:180px; flex-shrink:0; background:linear-gradient(135deg,#1e1e1e,#2a2a2a);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-n); font-size:2.8rem; color:rgba(255,255,255,.18);
  border-right:1px solid var(--brd);
}
.team-lead-info { padding:36px 32px; display:flex; flex-direction:column; justify-content:center }
.team-lead-info .role { font-size:.63rem; letter-spacing:.18em; text-transform:uppercase; color:var(--red); margin-bottom:10px }
.team-lead-info h3 { color:#fff; font-size:1.6rem; margin-bottom:8px; font-weight:600 }
.team-lead-info p { font-size:.83rem; color:rgba(255,255,255,.55); line-height:1.7; margin:0 }

/* T-08: Portfolio → simple gallery (no case details) */
.gallery-g {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:2px; margin-top:48px;
}
.gallery-item {
  position:relative; overflow:hidden; aspect-ratio:1/1;
  background:var(--bg-card); cursor:pointer;
}
.gallery-item.tall { grid-row:span 2; aspect-ratio:1/2 }
.gallery-item.wide { grid-column:span 2; aspect-ratio:2/1 }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease, filter .4s ease; filter:grayscale(15%) }
.gallery-item:hover img { transform:scale(1.06); filter:grayscale(0%) }
.gallery-item-ov {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(224,67,59,.15), transparent 60%);
  opacity:0; transition:opacity .35s;
  display:flex; align-items:flex-end; padding:20px;
}
.gallery-item:hover .gallery-item-ov { opacity:1 }
.gallery-tag {
  font-size:.6rem; letter-spacing:.14em; text-transform:uppercase;
  color:#fff; background:rgba(0,0,0,.5); padding:4px 10px; backdrop-filter:blur(4px);
}

/* T-09: Partners with links */
.partner-link {
  height:26px; display:flex; align-items:center;
  font-size:.74rem; font-weight:600; letter-spacing:.13em; text-transform:uppercase;
  color:#fff; opacity:.28; filter:grayscale(1); white-space:nowrap;
  transition:opacity .2s,filter .2s,color .2s; text-decoration:none;
}
.partner-link:hover { opacity:.85; filter:grayscale(0%); color:var(--red) }

/* T-10: Smaller CTA band */
.cta-band.compact { padding:72px 60px }
.cta-band.compact h2 { font-size:clamp(1.6rem,3vw,2.6rem); margin-bottom:10px }
.cta-band.compact p { font-size:.9rem; margin-bottom:28px }

/* T-06: Service text-link instead of button */
.srv-textlink {
  display:inline-flex; align-items:center; gap:8px;
  font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:var(--red); transition:gap .2s; margin-top:6px;
}
.srv-textlink:hover { gap:14px; color:#fff }

/* T-11: Contacts ripple animation */
.ripple-card {
  position:relative; overflow:hidden;
  background:var(--bg-card); border:1px solid var(--brd);
  padding:32px; cursor:pointer; transition:border-color .3s;
}
.ripple-card:hover { border-color:rgba(224,67,59,.4) }
.ripple {
  position:absolute; border-radius:50%;
  background:rgba(224,67,59,.25);
  transform:scale(0); animation:rippleFx .7s ease-out;
  pointer-events:none;
}
@keyframes rippleFx {
  to { transform:scale(4); opacity:0 }
}
.contact-cards {
  display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-top:48px;
}
.contact-card {
  position:relative; overflow:hidden;
  background:var(--bg-card); border:1px solid var(--brd);
  padding:40px 32px; transition:border-color .3s, transform .3s;
  cursor:pointer; text-align:center;
}
.contact-card:hover { border-color:rgba(224,67,59,.4); transform:translateY(-3px) }
.contact-card .cc-icon {
  font-family:var(--font-n); font-size:2.4rem; color:var(--red);
  opacity:.7; margin-bottom:16px; display:block;
}
.contact-card h4 { color:#fff; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; margin-bottom:12px; font-weight:500; font-family:var(--font-b) }
.contact-card a, .contact-card p { color:rgba(255,255,255,.62); font-size:.9rem; line-height:1.7; display:block }
.contact-card a:hover { color:#fff }

/* T-12: Presentation download — styled */
.presentation-band {
  background:linear-gradient(135deg, var(--bg-card), var(--bg-mid));
  border:1px solid var(--brd);
  padding:48px 52px; margin-top:2px;
  display:flex; align-items:center; justify-content:space-between;
  gap:32px; flex-wrap:wrap;
}
.presentation-info h3 { color:#fff; font-size:1.5rem; margin-bottom:8px; font-weight:600 }
.presentation-info p { color:rgba(255,255,255,.55); font-size:.86rem; max-width:440px }
.presentation-dl {
  display:inline-flex; align-items:center; gap:14px;
  background:var(--red); color:#fff; padding:16px 32px;
  font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  transition:background .22s; white-space:nowrap;
}
.presentation-dl:hover { background:var(--red-dk) }
.presentation-dl .dl-ico { font-size:1.2rem }

/* T-03: Section anchor offset for smooth scroll */
section[id], div[id] { scroll-margin-top:80px }

/* T-01/T-13: single CTA in hero */
.slide-btns.single { justify-content:center }

/* Responsive additions v1.6 */
@media(max-width:1100px){
  .gallery-g { grid-template-columns:repeat(3,1fr) }
  .contact-cards { grid-template-columns:1fr }
  .team-lead { grid-template-columns:1fr }
}
@media(max-width:768px){
  .gallery-g { grid-template-columns:repeat(2,1fr) }
  .gallery-item.wide { grid-column:span 2 }
  .gallery-item.tall { grid-row:span 1; aspect-ratio:1/1 }
  .team-lead-card { flex-direction:column }
  .team-lead-photo { width:100%; height:140px; border-right:none; border-bottom:1px solid var(--brd) }
  .presentation-band { flex-direction:column; align-items:flex-start; padding:32px 24px }
  .cta-band.compact { padding:56px 24px }
}

/* v1.6: restore 900px + 400px breakpoints */
@media(max-width:900px){
  .srv-body{grid-template-columns:1fr}
  .srv-layout{grid-template-columns:1fr}
  .gallery-g{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:400px){
  .slide h1{font-size:2.4rem}
  .slide .sub{font-size:.92rem}
  .stat-n{font-size:3rem}
  .mob-nav a{font-size:2.2rem}
  .team-lead-info h3{font-size:1.3rem}
  .gallery-g{grid-template-columns:1fr}
}

/* ════════════════════════════════════════════════════════
   v1.7 STYLISTIC REFINEMENTS
   ════════════════════════════════════════════════════════ */

/* Contact card SVG icons */
.contact-card .cc-icon svg {
  width:34px; height:34px; color:var(--red); opacity:.85;
  transition:transform .3s;
}
.contact-card:hover .cc-icon svg { transform:scale(1.1) }
.contact-card .cc-icon { line-height:0; margin-bottom:18px }

/* Social SVG icons */
.soc svg { width:15px; height:15px; transition:transform .2s }
.soc:hover svg { transform:scale(1.15) }
.soc {
  transition:all .22s;
}

/* Presentation download icon */
.presentation-dl .dl-ico { display:inline-flex; align-items:center; line-height:0 }
.presentation-dl { align-items:center }

/* Team lead avatar refinement */
.team-lead-photo { letter-spacing:.05em }

/* Accent: eyebrow consistency + section headings weight */
.ey { font-weight:600 }

/* Better link hover states site-wide */
.srv-textlink svg { transition:transform .2s }

/* Gallery hover — subtle red accent line */
.gallery-item::after {
  content:''; position:absolute; left:0; bottom:0; height:2px; width:0;
  background:var(--red); transition:width .4s ease; z-index:2;
}
.gallery-item:hover::after { width:100% }

/* Contact cards: red top accent on hover */
.contact-card::before {
  content:''; position:absolute; top:0; left:0; height:2px; width:0;
  background:var(--red); transition:width .35s ease;
}
.contact-card:hover::before { width:100% }

/* Presentation band accent */
.presentation-band { position:relative; overflow:hidden }
.presentation-band::before {
  content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--red);
}


/* ════════════════════════════════════════════════════════
   v1.9 — FOOTER (contacts-style, no duplicate cards)
   ════════════════════════════════════════════════════════ */
.ftr-contact { background:#080808; border-top:1px solid var(--brd); padding:0 }
.ftr-main {
  display:grid; grid-template-columns:1.1fr 2fr; gap:64px;
  padding:72px 60px 52px; max-width:1600px; margin:0 auto;
}
.ftr-brand { display:flex; flex-direction:column }
.ftr-brand .ftr-logo { display:block; margin-bottom:20px }
.ftr-brand .ftr-about {
  font-size:.85rem; color:rgba(255,255,255,.55);
  line-height:1.75; max-width:320px; margin-bottom:26px;
}
.ftr-links-wrap {
  display:grid; grid-template-columns:1fr 1fr; gap:40px; max-width:460px;
}
.ftr-col h5 {
  font-family:var(--font-b); font-size:.62rem; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(255,255,255,.4);
  margin-bottom:18px; font-weight:600;
}
.ftr-col ul { list-style:none; margin:0; padding:0 }
.ftr-col li { margin-bottom:11px }
.ftr-col a {
  font-size:.85rem; color:rgba(255,255,255,.6); transition:color .2s, padding-left .2s;
  position:relative;
}
.ftr-col a:hover { color:#fff; padding-left:6px }
/* red accent line under section headings */
.ftr-col h5::after {
  content:''; display:block; width:24px; height:2px;
  background:var(--red); margin-top:8px;
}
.ftr-contact .ftr-bot {
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:12px; padding:26px 60px;
  border-top:1px solid var(--brd); background:#060606;
}
.ftr-contact .ftr-copy { font-size:.73rem; color:rgba(255,255,255,.35) }
.ftr-contact .ftr-lnks { display:flex; gap:20px }
.ftr-contact .ftr-lnks a { font-size:.72rem; color:rgba(255,255,255,.35); transition:color .2s }
.ftr-contact .ftr-lnks a:hover { color:rgba(255,255,255,.7) }

@media(max-width:1100px){
  .ftr-main { grid-template-columns:1fr; gap:44px; padding:60px 40px 44px }
  .ftr-contact .ftr-bot { padding:24px 40px }
}
@media(max-width:768px){
  .ftr-links-wrap { grid-template-columns:1fr 1fr }
  .ftr-main { padding:48px 24px 36px }
  .ftr-contact .ftr-bot { padding:22px 24px; flex-direction:column; text-align:center }
}
@media(max-width:480px){
  .ftr-links-wrap { grid-template-columns:1fr }
}

/* ════════════════════════════════════════════════════════
   v2.0 — REAL TEAM PHOTOS
   ════════════════════════════════════════════════════════ */
/* Leader cards: photo instead of initials */
.team-lead-photo.photo { padding:0; overflow:hidden; background:var(--bg-mid) }
.team-lead-photo.photo img {
  width:100%; height:100%; object-fit:cover; object-position:center top;
  min-height:220px;
}

/* Team member grid with photos */
.team-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:2px; margin-top:2px;
}
.team-mc {
  position:relative; overflow:hidden; background:var(--bg-card);
  border:1px solid var(--brd); aspect-ratio:3/4;
}
.team-mc-photo { width:100%; height:100%; overflow:hidden }
.team-mc-photo img {
  width:100%; height:100%; object-fit:cover; object-position:center top;
  filter:grayscale(20%); transition:transform .6s ease, filter .4s ease;
}
.team-mc:hover .team-mc-photo img { transform:scale(1.05); filter:grayscale(0%) }
.team-mc-info {
  position:absolute; left:0; right:0; bottom:0; padding:18px 16px;
  background:linear-gradient(to top, rgba(12,12,12,.95) 0%, rgba(12,12,12,.7) 60%, transparent 100%);
}
.team-mc-info h4 {
  color:#fff; font-size:1.25rem; font-weight:600; margin-bottom:3px;
  font-family:var(--font-b);
}
.team-mc-info span {
  font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--red);
}

@media(max-width:1100px){ .team-grid { grid-template-columns:repeat(3,1fr) } }
@media(max-width:768px){ .team-grid { grid-template-columns:repeat(2,1fr) } }
@media(max-width:400px){ .team-grid { grid-template-columns:1fr } }


/* ════════════════════════════════════════════════════════
   v2.1 — КЕРІВНИЦТВО: шахова розкладка, збільшена висота
   ════════════════════════════════════════════════════════ */
.lead-rows { margin-top:52px; display:flex; flex-direction:column; gap:2px }
.lead-row {
  display:grid; grid-template-columns:440px 1fr;
  background:var(--bg-card); border:1px solid var(--brd);
  min-height:440px; overflow:hidden;
}
/* Рядок 2 — дзеркальний: фото справа, текст зліва */
.lead-row.reverse { grid-template-columns:1fr 440px }
.lead-row.reverse .lead-photo { order:2 }
.lead-row.reverse .lead-text { order:1 }

.lead-photo { overflow:hidden; background:var(--bg-mid); min-height:440px; position:relative }
.lead-photo img {
  width:100%; height:100%; object-fit:cover; object-position:center 15%;
  transition:transform .7s ease;
}
.lead-row:hover .lead-photo img { transform:scale(1.03) }
/* subtle gradient tie-in between photo and text panel */
.lead-photo::after {
  content:''; position:absolute; top:0; bottom:0; width:80px; pointer-events:none;
}
.lead-row:not(.reverse) .lead-photo::after {
  right:0; background:linear-gradient(to right, transparent, rgba(22,22,22,.5));
}
.lead-row.reverse .lead-photo::after {
  left:0; background:linear-gradient(to left, transparent, rgba(22,22,22,.5));
}

.lead-text {
  padding:56px 60px; display:flex; flex-direction:column; justify-content:center;
  position:relative;
}
/* v2.9 FIX: on reverse rows (photo on the right), pull the text block toward
   the photo instead of leaving it stranded at the far-left screen edge */
.lead-row.reverse .lead-text{ align-items:flex-end; text-align:left }
.lead-row.reverse .lead-text p{ max-width:460px }
/* red vertical accent on the text side */
.lead-row:not(.reverse) .lead-text::before {
  content:''; position:absolute; left:0; top:56px; bottom:56px; width:3px; background:var(--red);
}
.lead-row.reverse .lead-text::before {
  content:''; position:absolute; right:0; top:56px; bottom:56px; width:3px; background:var(--red);
}
.lead-text .role {
  font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--red); margin-bottom:14px; font-weight:600;
}
.lead-text h3 {
  color:#fff; font-size:2.2rem; margin-bottom:18px; font-weight:600; letter-spacing:-.01em;
}
.lead-text p {
  font-size:.9rem; color:rgba(255,255,255,.62); line-height:1.85; max-width:460px;
}
/* red accent bar */
.lead-text .role::before {
  content:''; display:inline-block; width:28px; height:1px;
  background:var(--red); vertical-align:middle; margin-right:12px;
}

@media(max-width:900px){
  .lead-row, .lead-row.reverse { grid-template-columns:1fr; min-height:0 }
  .lead-row.reverse .lead-photo { order:1 }
  .lead-row.reverse .lead-text { order:2 }
  .lead-photo { min-height:420px }
  .lead-text { padding:40px 32px }
  .lead-text h3 { font-size:1.7rem }
  /* on mobile rows stack, so reset the flex-end pull-to-photo alignment */
  .lead-row.reverse .lead-text{ align-items:flex-start }
}
@media(max-width:480px){
  .lead-photo { min-height:340px }
  .lead-text { padding:32px 24px }
}

/* ════════════════════════════════════════════════════════
   v2.6 — Шахова секція "Про компанію"
   ════════════════════════════════════════════════════════ */
.about-rows { margin-top:48px }
.about-rows .lead-row { min-height:380px }
.about-rows .lead-photo { min-height:380px }
.about-rows .lead-photo img { object-position:center }
.about-rows .lead-text h3 { font-size:1.8rem }
.about-rows .lead-text p { max-width:520px }

@media(max-width:900px){
  .about-rows .lead-photo { min-height:300px }
}

/* ════════════════════════════════════════════════════════
   v2.7 — Індикатор кліку миші (як при записі екрана)
   ════════════════════════════════════════════════════════ */
.click-dot{
  position:fixed; z-index:99999; pointer-events:none;
  width:22px; height:22px; border-radius:50%;
  background:rgba(224,67,59,.55);
  box-shadow:0 0 0 5px rgba(224,67,59,.2);
  transform:translate(-50%,-50%) scale(1);
  animation:clickDot .6s ease-out forwards;
}
.click-ring{
  position:fixed; z-index:99998; pointer-events:none;
  width:22px; height:22px; border-radius:50%;
  border:2px solid rgba(224,67,59,.55);
  transform:translate(-50%,-50%) scale(1);
  animation:clickRing .65s ease-out forwards;
}
@keyframes clickDot{
  0%{opacity:.9; transform:translate(-50%,-50%) scale(.6)}
  55%{opacity:.55}
  100%{opacity:0; transform:translate(-50%,-50%) scale(1.35)}
}
@keyframes clickRing{
  0%{opacity:.65; transform:translate(-50%,-50%) scale(1)}
  100%{opacity:0; transform:translate(-50%,-50%) scale(4.2)}
}

/* ════════════════════════════════════════════════════════
   v3.0 — Мультимовність UA/EN — pill-перемикач (за зразком клієнта)
   ════════════════════════════════════════════════════════ */
.hdr-nav a, .lang-sw{ font-size:.75rem }
.lang-sw{
  display:flex; align-items:center; gap:0;
  letter-spacing:.14em; font-weight:600;
  border:1px solid var(--red); border-radius:6px; overflow:hidden;
}
.lang-sw .lang{
  padding:6px 10px; color:rgba(255,255,255,.55); text-transform:uppercase;
  transition:background-color .2s, color .2s;
}
.lang-sw .lang:hover{ color:#fff }
.lang-sw .lang.on{ background-color:var(--red); color:#fff; border-radius:5px }
.lang-sep{ display:none }
.lang-sw.mob{ justify-content:center; margin:26px auto 0; font-size:1rem; width:fit-content }
@media(max-width:900px){ .hdr .lang-sw{ display:none } }

/* ════════════════════════════════════════════════════════
   v3.0 — Секція #company: фото/текст 50/50, reverse текст праворуч
   ════════════════════════════════════════════════════════ */
section#company .lead-row{ grid-template-columns:50% 1fr }
section#company .lead-row.reverse{ grid-template-columns:1fr 50% }
section#company .lead-row.reverse .lead-text{ align-items:flex-end }
section#company .lead-row.reverse .lead-text p{ text-align:right }
@media(max-width:900px){
  section#company .lead-row, section#company .lead-row.reverse{ grid-template-columns:1fr }
  section#company .lead-row.reverse .lead-text{ align-items:flex-start }
  section#company .lead-row.reverse .lead-text p{ text-align:left }
}

/* ════════════════════════════════════════════════════════
   v3.3 — ФУТЕР: контакти+соцмережі+години повернуто,
   лого збільшено, DV credit
   ════════════════════════════════════════════════════════ */

/* Bigger footer logo */
.ftr-brand .ftr-logo img{ height:58px }

/* Footer socials — square badge style */
.ftr-brand .socials{ display:flex; gap:10px; margin-top:22px }
.ftr-brand .socials .soc{
  width:38px; height:38px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.06); border:1px solid var(--brd);
  color:rgba(255,255,255,.6); transition:all .2s;
}
.ftr-brand .socials .soc svg{ width:17px; height:17px }
.ftr-brand .socials .soc:hover{
  background:var(--red); border-color:var(--red); color:#fff; transform:translateY(-2px);
}

/* 3-column links wrap (Розділи / Послуги / Контакти) */
.ftr-links-wrap{ grid-template-columns:1fr 1fr 1.3fr; max-width:none }

/* Contacts column */
.ftr-cinfo{ list-style:none; margin:0 0 22px; padding:0 }
.ftr-cinfo li{
  display:flex; align-items:flex-start; gap:10px; margin-bottom:14px;
  font-size:.85rem; color:rgba(255,255,255,.65); line-height:1.5;
}
.ftr-cinfo li svg{ width:16px; height:16px; flex-shrink:0; margin-top:2px; color:var(--red) }
.ftr-cinfo li a{ color:rgba(255,255,255,.65); transition:color .2s }
.ftr-cinfo li a:hover{ color:#fff }
.ftr-hours{ display:flex; flex-direction:column; gap:6px }
.ftr-hours div{
  display:flex; justify-content:space-between; gap:16px; max-width:220px;
  font-size:.78rem; color:rgba(255,255,255,.5);
}
.ftr-hours strong{ color:rgba(255,255,255,.75); font-weight:600 }

/* Bottom bar: legal links + DV credit */
.ftr-bot-right{ display:flex; align-items:center; gap:24px; flex-wrap:wrap }
.ftr-dv{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.72rem; color:rgba(255,255,255,.4); transition:color .2s;
}
.ftr-dv:hover{ color:rgba(255,255,255,.8) }
.ftr-dv strong{ color:rgba(255,255,255,.6); font-weight:600 }
.ftr-dv:hover strong{ color:#fff }
.dv-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:20px; height:20px; border-radius:5px;
  background:var(--red); color:#fff; font-size:.6rem; font-weight:700;
  letter-spacing:.02em;
}

@media(max-width:1100px){
  .ftr-links-wrap{ grid-template-columns:1fr 1fr; row-gap:36px }
  .ftr-contact-col{ grid-column:span 2 }
  .ftr-bot{ flex-direction:column; align-items:flex-start; gap:14px }
}
@media(max-width:768px){
  .ftr-links-wrap{ grid-template-columns:1fr }
  .ftr-contact-col{ grid-column:span 1 }
  .ftr-brand .ftr-logo img{ height:48px }
  .ftr-bot-right{ flex-direction:column; align-items:flex-start; gap:10px }
}