/* ========================================
   ИНФОЦЕНТР — типография в Геническе
   Фирменная палитра: оранжевый #F39C12, золотой #F8C537
   ======================================== */

:root{
  /* brand */
  --orange:#F39C12;
  --orange-2:#F5A623;
  --orange-dark:#D87E0A;
  --gold:#F8C537;
  --gold-light:#FDD95F;

  /* neutral */
  --ink:#2B2B2B;
  --ink-2:#3D3D3D;
  --graphite:#555;
  --paper:#ffffff;
  --cream:#FFF8EC;
  --cream-2:#FDF3DF;
  --line:#ECE6D6;
  --mute:#7a7568;

  /* layout */
  --radius:14px;
  --radius-lg:22px;
  --maxw:1280px;
  --shadow-sm:0 2px 8px rgba(43,43,43,.06);
  --shadow-md:0 14px 34px -14px rgba(43,43,43,.18);
  --shadow-lg:0 30px 60px -20px rgba(43,43,43,.22);
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Manrope', system-ui, -apple-system, Segoe UI, sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.display{font-family:'Unbounded', 'Manrope', sans-serif; letter-spacing:-0.015em}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px}

/* ========================================
   BUTTONS
   ======================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 22px; border-radius:999px;
  font-weight:600; font-size:14px; cursor:pointer;
  transition:all .22s ease; border:none; text-decoration:none;
  font-family:'Manrope', sans-serif; white-space:nowrap;
}
.btn-lg{padding:16px 28px; font-size:15px}
.btn-primary{background:var(--orange); color:#fff; box-shadow:0 6px 18px -6px rgba(243,156,18,.5)}
.btn-primary:hover{background:var(--orange-dark); transform:translateY(-1px); box-shadow:0 10px 24px -6px rgba(243,156,18,.55)}
.btn-dark{background:var(--ink); color:#fff}
.btn-dark:hover{background:#000; transform:translateY(-1px)}
.btn-ghost{background:transparent; color:var(--ink); border:1.5px solid var(--ink)}
.btn-ghost:hover{background:var(--ink); color:#fff}

/* ========================================
   TOPBAR
   ======================================== */
.topbar{background:var(--ink); color:#d9d4c6; font-size:13px}
.topbar-inner{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:10px 32px; max-width:var(--maxw); margin:0 auto;
}
.topbar-left{display:flex; gap:24px; flex-wrap:wrap}
.topbar-left span{opacity:.85}
.topbar-right{display:flex; gap:16px; align-items:center; flex-wrap:wrap}
.topbar-right .sep{opacity:.4}
.topbar-right a{transition:color .2s}
.topbar-right a:hover{color:var(--gold)}
.tr-link{display:inline-flex; align-items:center; gap:8px}
.dot{width:7px; height:7px; border-radius:50%; background:var(--gold); display:inline-block}

/* ========================================
   HEADER
   ======================================== */
.header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.4) blur(10px);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:28px; padding:14px 32px; max-width:var(--maxw); margin:0 auto;
}
.logo-link{display:flex; align-items:center}
.logo-img{height:62px; width:auto; display:block}

.nav{display:flex; gap:32px; font-weight:500; font-size:14.5px}
.nav a{
  color:var(--ink); opacity:.85; transition:all .2s;
  position:relative; padding:6px 0;
}
.nav a::after{
  content:''; position:absolute; left:0; right:0; bottom:0;
  height:2px; background:var(--orange); transform:scaleX(0);
  transform-origin:right; transition:transform .3s ease;
}
.nav a:hover{opacity:1; color:var(--ink)}
.nav a:hover::after{transform:scaleX(1); transform-origin:left}

.header-cta{display:flex; gap:16px; align-items:center}
.phone{font-family:'Unbounded', sans-serif; font-weight:600; font-size:15px; white-space:nowrap}
.burger{
  display:none; width:44px; height:44px; border-radius:12px;
  border:1px solid var(--line); background:#fff; cursor:pointer;
  position:relative; flex-shrink:0;
}
.burger span{
  display:block; width:18px; height:2px; background:var(--ink);
  position:absolute; left:13px; top:50%; margin-top:-1px; border-radius:2px;
}
.burger span::before,.burger span::after{
  content:''; position:absolute; left:0; width:18px; height:2px; background:var(--ink); border-radius:2px;
}
.burger span::before{top:-6px}
.burger span::after{top:6px}

/* ========================================
   HERO
   ======================================== */
.hero{
  position:relative; padding:80px 0 110px;
  background:var(--cream);
  overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0; pointer-events:none;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(43,43,43,.08) 1px, transparent 0);
  background-size:22px 22px;
  opacity:.5;
  mask-image:linear-gradient(180deg, transparent, #000 20%, #000 80%, transparent);
}
.hero::before{
  content:''; position:absolute; top:-140px; right:-120px; width:520px; height:520px;
  background:radial-gradient(circle, var(--gold-light) 0%, transparent 65%);
  opacity:.45; pointer-events:none;
}
.hero::after{
  content:''; position:absolute; bottom:-100px; left:-80px; width:400px; height:400px;
  background:radial-gradient(circle, var(--orange) 0%, transparent 65%);
  opacity:.18; pointer-events:none;
}
.hero-deco{
  position:absolute; color:var(--orange); opacity:.12;
  pointer-events:none;
}
.hero-deco.d1{width:180px; height:180px; top:40px; right:52%; animation:spin 40s linear infinite}

.hero-inner{
  position:relative; display:grid; grid-template-columns:1.1fr 1fr; gap:60px; align-items:center;
}
.tag{
  display:inline-flex; align-items:center; gap:9px;
  padding:8px 16px; background:#fff;
  border:1px solid var(--line);
  border-radius:999px; font-size:13px; font-weight:500; color:var(--graphite);
  margin-bottom:28px;
  box-shadow:var(--shadow-sm);
}
.tag .dot{background:var(--orange)}

h1.hero-title, .hero-text h1{
  font-family:'Unbounded', sans-serif;
  font-size:clamp(40px, 5.6vw, 82px);
  line-height:0.98;
  font-weight:700;
  letter-spacing:-0.03em;
  margin:0 0 28px;
  color:var(--ink);
}
.hero-text h1 em{
  font-style:normal;
  background:linear-gradient(120deg, var(--orange) 0%, var(--gold) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-text h1 u{
  text-decoration:none; position:relative; display:inline-block;
}
.hero-text h1 u::after{
  content:''; position:absolute; left:-4px; right:-4px; bottom:10px; height:14px;
  background:var(--gold); z-index:-1; opacity:.55; border-radius:3px;
  transform:skew(-6deg);
}

.hero-lead{
  font-size:18px; color:var(--graphite); max-width:540px; margin:0 0 36px; line-height:1.55;
}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap}

.hero-stats{
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:20px; margin-top:52px; padding-top:32px;
  border-top:1px solid rgba(43,43,43,.1);
}
.stat{transition:all .6s .15s ease}
.js-anim .stat{opacity:0; transform:translateY(10px)}
.js-anim .stat.in{opacity:1; transform:none}
.stat b{font-family:'Unbounded', sans-serif; font-size:28px; font-weight:700; display:block; line-height:1; color:var(--ink)}
.stat small{font-size:12.5px; color:var(--mute); margin-top:6px; display:block; line-height:1.3}

.hero-visual{
  position:relative; aspect-ratio:1/1; max-width:540px; margin-left:auto; width:100%;
}
.hero-card{
  position:absolute; border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-lg);
  background:#fff;
  transition:transform .5s ease;
}
.hero-card:hover{transform:translateY(-6px) rotate(0deg)!important}
.hero-card.c1{
  width:62%; aspect-ratio:4/5; top:0; left:0;
  background:linear-gradient(145deg, var(--orange) 0%, var(--orange-dark) 100%);
  transform:rotate(-5deg);
}
.hero-card.c2{
  width:52%; aspect-ratio:3/4; bottom:0; right:0;
  background:linear-gradient(145deg, var(--ink) 0%, #1a1a1a 100%);
  transform:rotate(6deg);
}
.hero-card.c3{
  width:42%; aspect-ratio:1/1; bottom:12%; left:12%;
  background:linear-gradient(145deg, var(--gold) 0%, var(--gold-light) 100%);
  transform:rotate(-10deg);
}
.hero-card-label{
  position:absolute; inset:auto 18px 18px 18px; color:#fff;
  font-family:'Unbounded', sans-serif; font-size:11px; font-weight:500;
  letter-spacing:.04em; text-transform:uppercase; opacity:.85;
  line-height:1.3;
  text-overflow:ellipsis; overflow:hidden; white-space:nowrap;
}
.hero-card.c3 .hero-card-label{color:var(--ink)}
.hero-card-pattern{
  position:absolute; inset:0;
  background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.07) 0 2px, transparent 2px 22px);
}
.hero-card-big{
  font-family:'Unbounded', sans-serif; font-weight:700;
  font-size:clamp(16px, 2.1vw, 28px); line-height:1.05;
  position:absolute; top:18px; left:18px; right:18px; color:#fff;
  letter-spacing:-.02em;
  word-break:break-word; overflow-wrap:break-word; hyphens:auto;
}
.hero-card.c3 .hero-card-big{color:var(--ink)}
/* Smaller cards (c2, c3) need even smaller text */
.hero-card.c2 .hero-card-big{font-size:clamp(14px, 1.8vw, 22px)}
.hero-card.c3 .hero-card-big{font-size:clamp(13px, 1.6vw, 20px)}

.hero-badge{
  position:absolute; width:110px; height:110px; border-radius:50%;
  background:var(--ink); color:#fff;
  display:grid; place-items:center; text-align:center;
  font-family:'Unbounded', sans-serif; font-size:10px; font-weight:500;
  line-height:1.1; letter-spacing:.08em;
  top:-14px; right:-8px; z-index:3;
  box-shadow:var(--shadow-md);
  animation:spin 14s linear infinite;
  border:3px solid var(--gold);
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ========================================
   MARQUEE
   ======================================== */
.marquee{
  background:var(--ink); color:#fff; padding:18px 0;
  overflow:hidden; font-family:'Unbounded', sans-serif;
  font-size:15px; font-weight:500; letter-spacing:.04em;
  border-top:4px solid var(--orange);
  border-bottom:4px solid var(--gold);
}
.marquee-track{
  display:inline-flex; gap:48px; animation:slide 40s linear infinite;
  white-space:nowrap; padding-left:48px;
}
.marquee-track span{display:inline-flex; align-items:center; gap:8px}
.marquee-track b{color:var(--gold); font-weight:700}
@keyframes slide{to{transform:translateX(-50%)}}

/* ========================================
   SECTION
   ======================================== */
.section{padding:100px 0}
.section-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:40px; margin-bottom:52px; flex-wrap:wrap;
}
.eyebrow{
  display:inline-block; font-size:12px; font-weight:700;
  color:var(--orange); text-transform:uppercase; letter-spacing:.16em;
  margin-bottom:16px;
}
.section h2, h2.display{
  font-family:'Unbounded', sans-serif; font-size:clamp(32px, 4.2vw, 58px);
  line-height:1; font-weight:700; letter-spacing:-.025em;
  margin:0; max-width:720px; color:var(--ink);
}

/* ========================================
   PRODUCTS GRID
   ======================================== */
.products{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:20px;
}
.product{
  position:relative; border-radius:var(--radius-lg);
  overflow:hidden; aspect-ratio:1/1.12; cursor:pointer;
  background:var(--cream); border:1px solid var(--line);
  transition:all .35s ease;
}
.js-anim .product{opacity:0; transform:translateY(16px)}
.js-anim .product.in{opacity:1; transform:none}
.product:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg)}
.product.large{grid-column:span 2; grid-row:span 2; aspect-ratio:auto}

.product-bg{position:absolute; inset:0; overflow:hidden}
/* Dark gradient overlay at the bottom for text legibility on any background */
.product::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:55%; z-index:1;
  background:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.55) 100%);
  pointer-events:none;
}
.product.light::after{
  background:linear-gradient(180deg, transparent 0%, rgba(255,255,255,.7) 100%);
}
.product-inner{
  position:absolute; inset:0; padding:22px;
  display:flex; flex-direction:column; justify-content:space-between;
  color:#fff; z-index:2;
  gap:14px;
}
.product.light .product-inner{color:var(--ink)}
.product-cat{
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  opacity:.95; max-width:75%;
  text-shadow:0 1px 2px rgba(0,0,0,.2);
}
.product.light .product-cat{text-shadow:none}
.product h3{
  font-family:'Unbounded', sans-serif; font-size:22px; font-weight:600;
  line-height:1.05; margin:0; letter-spacing:-.015em;
  word-break:break-word; overflow-wrap:break-word;
  max-width:calc(100% - 56px); /* leave room for arrow */
  text-shadow:0 1px 3px rgba(0,0,0,.25);
}
.product.light h3{text-shadow:none}
.product.large h3{
  font-size:clamp(28px, 3.4vw, 40px); line-height:1;
  max-width:calc(100% - 64px);
}
/* Wrapper row for h3 + arrow */
.product-row{
  display:flex; align-items:flex-end; justify-content:space-between; gap:14px;
}

.product-arrow{
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.25); backdrop-filter:blur(6px);
  display:grid; place-items:center; transition:all .25s;
  border:1px solid rgba(255,255,255,.35); flex-shrink:0;
  align-self:flex-end;
}
.product.light .product-arrow{background:rgba(43,43,43,.1); border-color:rgba(43,43,43,.15)}
.product:hover .product-arrow{background:var(--orange); border-color:var(--orange); transform:rotate(-45deg)}
.product-arrow svg{width:15px; height:15px}

/* Product visuals */
/* Product visuals — compact illustrations positioned in the upper area
   so they don't collide with the text overlay at the bottom */

.pv-vizitki{
  background:linear-gradient(135deg, #2B2B2B 0%, #3D3D3D 100%);
  position:absolute; inset:0;
}
.pv-vizitki::before{
  content:''; position:absolute; width:55%; aspect-ratio:16/9; right:-6%; top:30%;
  background:#fff; border-radius:8px; transform:rotate(-10deg);
  box-shadow:0 14px 30px rgba(0,0,0,.4);
  background-image:linear-gradient(90deg, var(--orange) 0 35%, transparent 35%);
}
.vizitki-card-2{
  position:absolute; width:50%; aspect-ratio:16/9; right:-2%; top:8%;
  background:var(--orange); border-radius:8px; transform:rotate(4deg);
  box-shadow:0 14px 30px rgba(0,0,0,.4);
}
.vizitki-card-2::before{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(180deg, transparent 55%, rgba(0,0,0,.1) 55% 58%, transparent 58%),
    linear-gradient(180deg, transparent 66%, rgba(0,0,0,.1) 66% 69%, transparent 69%),
    linear-gradient(180deg, transparent 77%, rgba(0,0,0,.1) 77% 80%, transparent 80%);
}

.pv-banner{
  background:linear-gradient(135deg, var(--orange) 0%, var(--gold) 100%);
}
.pv-banner::before{
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(-45deg, rgba(255,255,255,.12) 0 12px, transparent 12px 24px);
}
.pv-banner::after{
  content:''; position:absolute; width:65%; height:18%; left:18%; top:18%;
  border:3px solid rgba(255,255,255,.45); border-radius:6px;
}

.pv-buklety{background:var(--cream-2)}
.pv-buklety::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent 33%, rgba(43,43,43,.06) 33% 34%, transparent 34% 66%, rgba(43,43,43,.06) 66% 67%, transparent 67%);
}
.pv-buklety::after{
  content:''; position:absolute; width:48%; aspect-ratio:3/4; right:14%; top:8%;
  background:#fff; border-radius:4px;
  box-shadow:
    -10px 0 0 -2px var(--orange),
    -20px 0 0 -4px var(--ink),
    0 14px 28px rgba(0,0,0,.18);
  background-image:
    linear-gradient(0deg, transparent 10%, rgba(43,43,43,.1) 10% 12%, transparent 12% 20%, rgba(43,43,43,.08) 20% 22%, transparent 22%);
}

.pv-listovki{
  background:linear-gradient(135deg, #4A90E2 0%, #7BB5F0 100%);
}
.pv-listovki::before{
  content:''; position:absolute; width:38%; aspect-ratio:3/4; right:12%; top:8%;
  background:#fff; border-radius:4px; transform:rotate(-8deg);
  box-shadow:0 14px 30px rgba(0,0,0,.25);
}
.pv-listovki::after{
  content:''; position:absolute; width:38%; aspect-ratio:3/4; right:26%; top:14%;
  background:#fff; border-radius:4px; transform:rotate(10deg); opacity:.7;
  box-shadow:0 14px 30px rgba(0,0,0,.25);
}

.pv-nakleiki{
  background:linear-gradient(135deg, #00B894 0%, #55D8B4 100%);
}
.pv-nakleiki::before{
  content:''; position:absolute; width:38%; aspect-ratio:1/1; right:14%; top:10%;
  background:#fff; border-radius:50%;
  box-shadow:0 12px 26px rgba(0,0,0,.22);
}
.pv-nakleiki::after{
  content:''; position:absolute; width:26%; aspect-ratio:1/1; right:32%; top:24%;
  background:var(--gold); border-radius:50%;
  box-shadow:0 12px 26px rgba(0,0,0,.22);
}

.pv-kalendari{background:linear-gradient(135deg, #2D3436 0%, #636E72 100%)}
.pv-kalendari::before{
  content:''; position:absolute; left:18%; right:18%; top:10%; height:46%;
  background:#fff; border-radius:6px;
  background-image:
    linear-gradient(0deg, transparent 0 28%, rgba(43,43,43,.06) 28% 30%, transparent 30%),
    repeating-linear-gradient(90deg, transparent 0 14%, rgba(43,43,43,.05) 14% 14.5%),
    repeating-linear-gradient(0deg, transparent 28%, transparent 38%, rgba(43,43,43,.04) 38% 38.5%);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
}
.pv-kalendari::after{
  content:''; position:absolute; left:18%; right:18%; top:10%; height:8%;
  background:var(--orange); border-radius:6px 6px 0 0;
}

.pv-upakovka{
  background:linear-gradient(135deg, #B08456 0%, #D9A878 100%);
}
.pv-upakovka::before{
  content:''; position:absolute; width:42%; aspect-ratio:4/5; left:50%; top:8%;
  transform:translate(-50%, 0);
  background:#fff;
  clip-path:polygon(10% 20%, 90% 20%, 100% 35%, 100% 100%, 0 100%, 0 35%);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
}
.pv-upakovka::after{
  content:''; position:absolute; width:42%; height:3px; left:50%; top:30%;
  transform:translateX(-50%);
  background:var(--orange);
}

/* ========================================
   ADVANTAGES (dark section)
   ======================================== */
.advantages-wrap{
  background:var(--ink); color:#fff; padding:110px 0;
  position:relative; overflow:hidden;
}
.advantages-wrap::before{
  content:''; position:absolute; top:-60px; right:-60px; width:300px; height:300px;
  background:radial-gradient(circle, var(--orange) 0%, transparent 65%);
  opacity:.15; pointer-events:none;
}
.advantages-wrap .eyebrow{color:var(--gold)}
.advantages-wrap h2{color:#fff}
.adv-lead{
  color:#b5b0a0; max-width:420px; font-size:16px; line-height:1.6; margin:0;
}

.adv-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:0;
  border-top:1px solid rgba(255,255,255,.1);
  position:relative;
}
.adv{
  padding:44px 32px 44px 0;
  border-right:1px solid rgba(255,255,255,.1);
  border-bottom:1px solid rgba(255,255,255,.1);
  display:flex; gap:22px;
  transition:background .3s;
}
.js-anim .adv{opacity:0; transform:translateY(16px); transition:all .6s ease, background .3s}
.js-anim .adv.in{opacity:1; transform:none}
.adv:nth-child(3n){border-right:none}
.adv:nth-child(n+4){padding-left:32px}
.adv:nth-child(1),.adv:nth-child(2),.adv:nth-child(3){padding-top:44px}
.adv:nth-last-child(-n+3){border-bottom:none}
.adv:hover{background:rgba(255,255,255,.02)}

.adv-num{
  font-family:'Unbounded', sans-serif; font-size:14px; font-weight:600;
  color:var(--orange); flex-shrink:0; padding-top:6px;
}
.adv h3{
  font-family:'Unbounded', sans-serif; font-size:22px; font-weight:600;
  margin:0 0 12px; line-height:1.15; letter-spacing:-.01em;
}
.adv p{color:#b5b0a0; margin:0; font-size:15px; line-height:1.55}

/* ========================================
   CALCULATOR
   ======================================== */
.calc-wrap{
  background:var(--cream); padding:100px 0;
  position:relative; overflow:hidden;
}
.calc-wrap::before{
  content:''; position:absolute; top:50%; left:-200px; width:400px; height:400px;
  background:radial-gradient(circle, var(--orange) 0%, transparent 65%);
  opacity:.15; pointer-events:none; transform:translateY(-50%);
}
.calc-grid{
  display:grid; grid-template-columns:1fr 1.15fr; gap:64px; align-items:center;
  position:relative;
}
.calc-left h2{margin-bottom:24px}
.calc-left p{color:var(--graphite); font-size:17px; max-width:480px; margin-bottom:32px; line-height:1.6}
.calc-features{display:flex; flex-direction:column; gap:12px}
.cf{
  display:flex; align-items:center; gap:12px;
  font-size:15px; color:var(--ink);
}
.cf b{
  color:var(--orange); font-size:14px; width:22px; height:22px;
  display:grid; place-items:center; background:#fff;
  border-radius:50%; flex-shrink:0;
  border:1.5px solid var(--orange);
}

.calc-form{
  background:#fff; border-radius:var(--radius-lg); padding:40px;
  box-shadow:var(--shadow-lg);
  border:1px solid var(--line);
}
.calc-form h3{
  font-family:'Unbounded', sans-serif; font-size:24px; margin:0 0 6px;
  font-weight:600; letter-spacing:-.01em;
}
.calc-form .sub{color:var(--mute); font-size:14px; margin-bottom:26px}
.calc-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px}
.calc-field{display:flex; flex-direction:column; gap:6px; margin-bottom:14px}
.calc-row .calc-field{margin-bottom:0}
.calc-field label{font-size:13px; font-weight:600; color:var(--ink)}
.calc-field input, .calc-field select{
  padding:14px 16px; border:1.5px solid var(--line); border-radius:10px;
  font-family:'Manrope', sans-serif; font-size:14px; color:var(--ink);
  background:#fff; outline:none; transition:.2s;
}
.calc-field input:focus, .calc-field select:focus{
  border-color:var(--orange); box-shadow:0 0 0 4px rgba(243,156,18,.12);
}
.calc-btn{width:100%; padding:17px; margin-top:10px}
.calc-foot{font-size:12px; color:var(--mute); margin-top:14px; text-align:center; line-height:1.5}

/* ========================================
   SERVICES
   ======================================== */
.services-list{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:0;
  border-top:1px solid var(--line); border-left:1px solid var(--line);
  border-radius:var(--radius-lg); overflow:hidden;
}
.service{
  padding:36px 28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  transition:all .25s; cursor:pointer; position:relative; overflow:hidden;
  background:#fff; text-decoration:none; color:inherit;
}
/* service cards are always visible — no fade animation */
.service::before{
  content:''; position:absolute; inset:auto 0 0 0; height:3px;
  background:var(--orange); transform:scaleX(0); transform-origin:left;
  transition:.35s;
}
.service:hover::before{transform:scaleX(1)}
.service:hover{background:var(--cream)}

.service-icon{
  width:52px; height:52px; border-radius:14px;
  background:var(--cream); display:grid; place-items:center; margin-bottom:22px;
  color:var(--orange); transition:all .25s;
}
.service:hover .service-icon{background:var(--orange); color:#fff}
.service-icon svg{width:24px; height:24px}

.service h3{
  font-family:'Unbounded', sans-serif; font-size:18px; font-weight:600;
  margin:0 0 10px; line-height:1.15; letter-spacing:-.01em;
}
.service p{font-size:13.5px; color:var(--graphite); margin:0; line-height:1.5}

/* ========================================
   ABOUT
   ======================================== */
.about-wrap{padding:100px 0; background:#fff}
.about-grid{display:grid; grid-template-columns:1.1fr 1fr; gap:80px; align-items:center}
.about-left h2{margin-bottom:28px}
.about-left h2 em{
  font-style:normal;
  background:linear-gradient(120deg, var(--orange), var(--gold));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.about-lead{font-size:18px; color:var(--ink); margin:0 0 18px; line-height:1.55}
.about-left p{color:var(--graphite); margin:0 0 18px; line-height:1.6}
.about-left .btn{margin-top:12px}

.about-right{
  display:grid; grid-template-columns:1fr 1fr; gap:18px;
}
.about-card{
  padding:32px 28px; border-radius:var(--radius-lg);
  display:flex; flex-direction:column; gap:12px;
  transition:all .6s ease;
}
.js-anim .about-card{opacity:0; transform:translateY(16px)}
.js-anim .about-card.in{opacity:1; transform:none}
.about-card b{
  font-family:'Unbounded', sans-serif; font-size:42px; font-weight:700;
  line-height:1; letter-spacing:-.02em;
}
.about-card small{font-size:13.5px; line-height:1.4}
.about-card.ac1{background:var(--orange); color:#fff; transform:translateY(20px); margin-top:20px}
.about-card.ac1.in{transform:none}
.about-card.ac2{background:var(--ink); color:#fff}
.about-card.ac3{background:var(--cream); color:var(--ink); border:1px solid var(--line)}
.about-card.ac4{background:var(--gold); color:var(--ink); transform:translateY(20px); margin-top:20px}
.about-card.ac4.in{transform:none}

/* ========================================
   STEPS / PROCESS
   ======================================== */
.steps{
  display:grid; grid-template-columns:repeat(6, 1fr); gap:24px;
  position:relative;
}
.steps::before{
  content:''; position:absolute; top:22px; left:0; right:0; height:2px;
  background:repeating-linear-gradient(90deg, var(--line) 0 6px, transparent 6px 12px);
  z-index:0;
}
.step{
  position:relative; z-index:1;
  transition:all .6s ease;
}
/* step cards are always visible — no fade animation */
.step-num{
  width:44px; height:44px; border-radius:50%;
  background:#fff; border:2px solid var(--ink);
  display:grid; place-items:center;
  font-family:'Unbounded', sans-serif; font-weight:700; font-size:13px;
  margin-bottom:18px; color:var(--ink);
  transition:all .25s;
}
.step:hover .step-num{background:var(--orange); color:#fff; border-color:var(--orange)}
.step h4{
  font-family:'Unbounded', sans-serif; font-size:17px; font-weight:600;
  margin:0 0 8px; letter-spacing:-.01em;
}
.step p{font-size:13.5px; color:var(--graphite); margin:0; line-height:1.5}

/* ========================================
   CTA BANNER
   ======================================== */
.cta-banner{
  background:linear-gradient(135deg, var(--orange) 0%, var(--gold) 100%);
  padding:84px 0; position:relative; overflow:hidden;
}
.cta-banner::before{
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(-45deg, rgba(255,255,255,.06) 0 2px, transparent 2px 30px);
}
.cta-banner::after{
  content:''; position:absolute; top:-50%; right:-10%; width:600px; height:600px;
  background:radial-gradient(circle, rgba(255,255,255,.25) 0%, transparent 60%);
}
.cta-inner{
  position:relative; display:flex; align-items:center; justify-content:space-between;
  gap:40px; flex-wrap:wrap;
}
.cta-banner h2{color:var(--ink); margin:0 0 14px}
.cta-banner p{color:rgba(43,43,43,.8); margin:0; font-size:17px; max-width:460px}
.cta-actions{display:flex; gap:14px; flex-wrap:wrap}

/* ========================================
   FOOTER
   ======================================== */
.footer{background:var(--ink); color:#c8c2b2; padding:80px 0 0}
.footer-inner{
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:60px;
  padding-bottom:60px;
}
.f-brand .f-logo{
  height:56px; width:auto; margin-bottom:20px;
  filter:brightness(1) saturate(1);
}
.f-brand p{margin:0 0 20px; font-size:14px; line-height:1.55; color:#9e9788; max-width:380px}
.f-socials{display:flex; gap:10px}
.f-socials a{
  width:40px; height:40px; border-radius:10px; background:rgba(255,255,255,.06);
  display:grid; place-items:center; color:#c8c2b2; transition:all .2s;
}
.f-socials a:hover{background:var(--orange); color:#fff}

.f-col h5{
  font-family:'Unbounded', sans-serif; font-size:13px; font-weight:600;
  color:#fff; margin:0 0 20px; text-transform:uppercase; letter-spacing:.12em;
}
.f-col a{
  display:block; color:#c8c2b2; font-size:14px; padding:6px 0;
  transition:color .2s;
}
.f-col a:hover{color:var(--gold)}
.f-big{font-family:'Unbounded', sans-serif; font-size:20px!important; font-weight:600; color:#fff!important; padding:0!important; margin-bottom:10px; display:block}
.f-mute{display:block; color:#9e9788; font-size:14px; margin-top:10px; line-height:1.55}

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.08);
  padding:22px 0;
  font-size:13px;
}
.fb-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; flex-wrap:wrap; color:#8a8476;
}
.fb-links{display:flex; gap:24px; flex-wrap:wrap}
.fb-links a{transition:color .2s}
.fb-links a:hover{color:var(--gold)}

/* ========================================
   MOBILE / RESPONSIVE
   ======================================== */
@media (max-width: 1100px){
  .products{grid-template-columns:repeat(3, 1fr)}
  .product.large{grid-column:span 2; grid-row:span 2}
  .services-list{grid-template-columns:repeat(3, 1fr)}
  .steps{grid-template-columns:repeat(3, 1fr); gap:32px 20px}
  .steps::before{display:none}
  .footer-inner{grid-template-columns:1fr 1fr; gap:40px}
}

@media (max-width: 900px){
  .hero{padding:56px 0 72px}
  .hero-inner{grid-template-columns:1fr; gap:50px}
  .hero-visual{max-width:440px; margin:0 auto}
  .hero-deco.d1{display:none}
  .hero-stats{gap:28px}
  .stat b{font-size:28px}

  .calc-grid{grid-template-columns:1fr; gap:40px}
  .about-grid{grid-template-columns:1fr; gap:48px}
  .adv-grid{grid-template-columns:repeat(2, 1fr)}
  .adv:nth-child(3n){border-right:1px solid rgba(255,255,255,.1)}
  .adv:nth-child(2n){border-right:none}
  .adv:nth-child(n+4){padding-left:0}
  .adv:nth-child(odd){padding-left:0}
  .adv:nth-child(even){padding-left:32px}

  .cta-inner{flex-direction:column; align-items:flex-start}
}

@media (max-width: 740px){
  .wrap{padding:0 20px}
  .topbar{font-size:12px}
  .topbar-inner{padding:8px 20px; gap:10px; flex-wrap:wrap}
  .topbar-left{gap:14px}
  .topbar-right{flex:1; justify-content:flex-end}
  .topbar-right .sep{display:none}

  .header-inner{padding:12px 20px; gap:14px}
  .logo-img{height:40px}
  .nav{
    display:none;
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; gap:0;
    background:#fff; border-top:1px solid var(--line);
    padding:8px 20px 20px;
    box-shadow:var(--shadow-md);
  }
  .nav.is-open{display:flex}
  .nav a{padding:14px 0; border-bottom:1px solid var(--line); font-size:16px}
  .nav a:last-child{border-bottom:none}
  .phone{display:none}
  .header-cta .btn{padding:10px 16px; font-size:13px}
  .burger{display:grid; place-items:center}

  .hero{padding:40px 0 56px}
  .hero-inner{gap:40px}
  .tag{font-size:12px; padding:7px 13px; margin-bottom:20px}
  h1.hero-title, .hero-text h1{font-size:clamp(34px, 10vw, 46px); margin-bottom:20px}
  .hero-lead{font-size:16px; margin-bottom:28px}
  .hero-actions{flex-direction:column; align-items:stretch}
  .hero-actions .btn{width:100%}
  .hero-stats{grid-template-columns:1fr 1fr; gap:20px; margin-top:36px; padding-top:24px}
  .stat b{font-size:24px}
  .stat small{font-size:12px}
  .hero-visual{aspect-ratio:1/.95}
  .hero-badge{width:80px; height:80px; font-size:9px; top:-6px; right:-6px}
  .hero-badge b{font-size:18px!important}
  .hero-card-big{font-size:20px}

  .marquee{font-size:13px; padding:14px 0}

  .section{padding:64px 0}
  .section-head{margin-bottom:32px; gap:18px}
  .section-head .btn{align-self:flex-start}

  .products{grid-template-columns:1fr 1fr; gap:14px}
  .product{aspect-ratio:1/1.15}
  .product.large{grid-column:span 2; grid-row:auto; aspect-ratio:1/1}
  .product-inner{padding:18px}
  .product h3{font-size:18px}
  .product.large h3{font-size:28px}
  .product-arrow{width:38px; height:38px}
  .product-cat{font-size:10px}

  .advantages-wrap{padding:64px 0}
  .adv-grid{grid-template-columns:1fr}
  .adv{padding:28px 0!important; border-right:none!important; gap:16px}
  .adv:last-child{border-bottom:none}
  .adv h3{font-size:18px}

  .calc-wrap{padding:64px 0}
  .calc-form{padding:28px 22px}
  .calc-row{grid-template-columns:1fr}
  .calc-form h3{font-size:20px}

  .services-list{grid-template-columns:1fr 1fr}
  .service{padding:24px 18px}
  .service h3{font-size:16px}
  .service p{font-size:12.5px}
  .service-icon{width:44px; height:44px; margin-bottom:16px}

  .about-wrap{padding:64px 0}
  .about-lead{font-size:16px}
  .about-right{grid-template-columns:1fr 1fr; gap:12px}
  .about-card{padding:22px 20px}
  .about-card b{font-size:30px}
  .about-card small{font-size:12.5px}
  .about-card.ac1,.about-card.ac4{margin-top:0}

  .steps{grid-template-columns:1fr 1fr; gap:24px 16px}
  .step h4{font-size:15px}
  .step p{font-size:12.5px}

  .cta-banner{padding:56px 0}
  .cta-actions{width:100%; flex-direction:column}
  .cta-actions .btn{width:100%}

  .footer{padding:56px 0 0}
  .footer-inner{grid-template-columns:1fr; gap:32px; padding-bottom:40px}
  .fb-inner{flex-direction:column; align-items:flex-start; gap:12px}
  .fb-links{gap:14px 20px}
}

@media (max-width: 420px){
  h1.hero-title, .hero-text h1{font-size:36px}
  .products{grid-template-columns:1fr}
  .product.large{grid-column:span 1}
  .about-right{grid-template-columns:1fr}
  .services-list{grid-template-columns:1fr}
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0s!important; transition-duration:0s!important}
}

/* ============================================
   WORDPRESS-SPECIFIC + INNER PAGES
   ============================================ */

/* Site wrapper */
.site-wrapper{display:flex; flex-direction:column; min-height:100vh}
.site-main{flex:1}

/* Custom logo (WP injects <a> with <img>) */
.custom-logo-link{display:inline-flex; align-items:center; line-height:0}
.custom-logo{height:62px!important; width:auto!important; max-height:62px}
.f-brand .custom-logo{height:56px!important}

/* Native WP nav menu */
.nav .nav-menu, .nav-menu{
  list-style:none; padding:0; margin:0;
  display:flex; gap:32px; font-weight:500; font-size:14.5px;
}
.nav-menu li{position:relative}
.nav-menu a{
  color:var(--ink); opacity:.85; transition:all .2s;
  position:relative; padding:6px 0; text-decoration:none;
}
.nav-menu a::after{
  content:''; position:absolute; left:0; right:0; bottom:0;
  height:2px; background:var(--orange); transform:scaleX(0);
  transform-origin:right; transition:transform .3s ease;
}
.nav-menu a:hover{opacity:1}
.nav-menu a:hover::after{transform:scaleX(1); transform-origin:left}
.nav-menu .sub-menu{
  position:absolute; top:100%; left:0;
  background:#fff; min-width:220px; padding:8px;
  box-shadow:var(--shadow-md); border-radius:12px;
  border:1px solid var(--line);
  list-style:none; margin-top:8px;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:all .2s;
}
.nav-menu li:hover > .sub-menu{opacity:1; visibility:visible; transform:none}
.nav-menu .sub-menu a{padding:8px 12px; display:block; border-radius:8px}
.nav-menu .sub-menu a:hover{background:var(--cream)}
.nav-menu .sub-menu a::after{display:none}

/* Breadcrumbs */
.crumbs-wrap{
  background:var(--cream);
  border-bottom:1px solid var(--line);
  padding:18px 0;
}
.crumbs{
  display:flex; align-items:center; gap:10px;
  font-size:13px; color:var(--mute);
  flex-wrap:wrap;
}
.crumbs a{color:var(--mute); transition:color .2s}
.crumbs a:hover{color:var(--orange)}
.crumbs .c-sep{opacity:.5}
.crumbs .c-current{color:var(--ink); font-weight:600}

/* Page hero (for page.php & single.php) */
.page-hero{
  padding:60px 0 40px;
  background:linear-gradient(180deg, var(--cream) 0%, #fff 100%);
}
.page-hero h1{
  font-family:'Unbounded', sans-serif;
  font-size:clamp(36px, 5vw, 64px);
  line-height:1; font-weight:700;
  letter-spacing:-0.03em; margin:0 0 20px;
  color:var(--ink);
  max-width:900px;
}
.page-lead{
  font-size:18px; color:var(--graphite);
  max-width:700px; margin:0; line-height:1.55;
}
.post-meta{
  font-size:13px; color:var(--mute); display:block; margin-bottom:16px;
  text-transform:uppercase; letter-spacing:.08em; font-weight:600;
}

/* Single thumb */
.single-thumb{margin:40px 0}
.single-thumb img{
  width:100%; height:auto; border-radius:var(--radius-lg);
  max-height:540px; object-fit:cover;
}

/* Entry content (page/post body) */
.wrap-narrow{max-width:820px}
.entry-content{font-size:16px; line-height:1.7; color:var(--ink-2)}
.entry-content h2{
  font-family:'Unbounded', sans-serif; font-weight:600;
  font-size:clamp(24px, 3vw, 34px); line-height:1.1;
  letter-spacing:-.02em; color:var(--ink);
  margin:48px 0 18px; padding-top:12px;
}
.entry-content h3{
  font-family:'Unbounded', sans-serif; font-weight:600;
  font-size:22px; line-height:1.2;
  color:var(--ink); margin:36px 0 14px;
  letter-spacing:-.01em;
}
.entry-content h4{
  font-family:'Unbounded', sans-serif; font-weight:600;
  font-size:18px; color:var(--ink); margin:28px 0 10px;
}
.entry-content p{margin:0 0 16px}
.entry-content ul, .entry-content ol{padding-left:22px; margin:0 0 20px}
.entry-content li{margin-bottom:8px}
.entry-content a{color:var(--orange); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px}
.entry-content a:hover{color:var(--orange-dark)}
.entry-content blockquote{
  border-left:4px solid var(--orange);
  padding:4px 0 4px 24px; margin:24px 0;
  font-style:italic; color:var(--graphite);
  background:var(--cream); padding:16px 24px; border-radius:0 10px 10px 0;
}
.entry-content img{border-radius:var(--radius); margin:20px 0}
.entry-content strong{color:var(--ink); font-weight:700}
.entry-content hr{border:none; border-top:1px solid var(--line); margin:36px 0}

/* Table in content */
.entry-content table{
  width:100%; border-collapse:collapse; margin:24px 0;
  border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
}
.entry-content th, .entry-content td{
  padding:12px 16px; border-bottom:1px solid var(--line);
  text-align:left;
}
.entry-content th{background:var(--cream); font-weight:600; color:var(--ink)}
.entry-content tr:last-child td{border-bottom:none}

/* Lead form (shortcode) */
.ic-form{
  background:#fff; border-radius:var(--radius-lg); padding:40px;
  box-shadow:var(--shadow-lg);
  border:1px solid var(--line);
}
.ic-form h3{
  font-family:'Unbounded', sans-serif; font-size:24px; margin:0 0 6px;
  font-weight:600; letter-spacing:-.01em;
}
.ic-form-sub{color:var(--mute); font-size:14px; margin-bottom:26px}
.ic-form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px}
.ic-field{display:flex; flex-direction:column; gap:6px; margin-bottom:14px}
.ic-form-row .ic-field{margin-bottom:0}
.ic-field label{font-size:13px; font-weight:600; color:var(--ink)}
.ic-field input, .ic-field select, .ic-field textarea{
  padding:14px 16px; border:1.5px solid var(--line); border-radius:10px;
  font-family:'Manrope', sans-serif; font-size:14px; color:var(--ink);
  background:#fff; outline:none; transition:.2s;
  width:100%;
}
.ic-field input:focus, .ic-field select:focus, .ic-field textarea:focus{
  border-color:var(--orange); box-shadow:0 0 0 4px rgba(243,156,18,.12);
}
.ic-form-submit{width:100%; padding:17px; margin-top:10px}
.ic-form-foot{font-size:12px; color:var(--mute); margin-top:14px; text-align:center; line-height:1.5}
.ic-form-success{
  padding:40px 20px; text-align:center;
  background:linear-gradient(135deg, #fff 0%, var(--cream) 100%);
  border-radius:var(--radius);
}
.ic-form-success h3{color:var(--orange); font-size:28px; margin-bottom:12px}
.ic-form-success p{color:var(--graphite); margin:0; line-height:1.6}
.ic-form-success a{color:var(--orange); font-weight:700; text-decoration:none}

/* Contact Form 7 compatibility */
.wpcf7 .wpcf7-form{
  background:#fff; border-radius:var(--radius-lg); padding:40px;
  box-shadow:var(--shadow-lg); border:1px solid var(--line);
}
.wpcf7 label{display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:6px}
.wpcf7 input[type="text"], .wpcf7 input[type="tel"], .wpcf7 input[type="email"], .wpcf7 select, .wpcf7 textarea{
  padding:14px 16px; border:1.5px solid var(--line); border-radius:10px;
  font-family:'Manrope', sans-serif; font-size:14px; color:var(--ink);
  background:#fff; outline:none; transition:.2s; width:100%;
  margin-bottom:14px;
}
.wpcf7 input:focus, .wpcf7 select:focus, .wpcf7 textarea:focus{
  border-color:var(--orange); box-shadow:0 0 0 4px rgba(243,156,18,.12);
}
.wpcf7 input[type="submit"]{
  background:var(--orange); color:#fff; border:none; padding:17px 28px;
  border-radius:999px; font-weight:600; font-size:15px; cursor:pointer;
  font-family:'Manrope', sans-serif; width:100%;
  box-shadow:0 6px 18px -6px rgba(243,156,18,.5);
  transition:all .2s;
}
.wpcf7 input[type="submit"]:hover{background:var(--orange-dark); transform:translateY(-1px)}

/* Posts grid (for index.php) */
.posts-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:24px;
}
.post-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  overflow:hidden; transition:all .3s;
}
.post-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--orange)}
.post-card-thumb{display:block; aspect-ratio:16/10; overflow:hidden}
.post-card-thumb img{width:100%; height:100%; object-fit:cover; transition:transform .5s}
.post-card:hover .post-card-thumb img{transform:scale(1.04)}
.post-card-body{padding:24px}
.post-date{
  font-size:12px; color:var(--mute); display:block; margin-bottom:10px;
  font-weight:600; letter-spacing:.06em; text-transform:uppercase;
}
.post-card h3{
  font-family:'Unbounded', sans-serif; font-size:18px; font-weight:600;
  line-height:1.3; margin:0 0 12px; letter-spacing:-.01em;
}
.post-card h3 a{color:var(--ink)}
.post-card h3 a:hover{color:var(--orange)}
.post-excerpt{color:var(--graphite); font-size:14px; line-height:1.55; margin-bottom:16px}
.post-more{color:var(--orange); font-weight:600; font-size:14px}

.pagination-wrap{margin-top:48px; text-align:center}
.pagination-wrap .page-numbers{
  display:inline-block; padding:10px 16px; margin:0 4px;
  background:#fff; border:1.5px solid var(--line); border-radius:10px;
  color:var(--ink); text-decoration:none; font-weight:600; font-size:14px;
  transition:all .2s;
}
.pagination-wrap .page-numbers.current,
.pagination-wrap .page-numbers:hover{
  background:var(--orange); border-color:var(--orange); color:#fff;
}

/* Widget */
.widget-title{
  font-family:'Unbounded', sans-serif; font-size:13px; font-weight:600;
  color:#fff; margin:0 0 20px; text-transform:uppercase; letter-spacing:.12em;
}

/* Screen-reader only */
.screen-reader-text{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* WP admin bar offset */
body.admin-bar .header{top:32px}
@media (max-width:782px){
  body.admin-bar .header{top:46px}
}

/* Responsive tweaks for WP content */
@media (max-width: 900px){
  .posts-grid{grid-template-columns:repeat(2, 1fr)}
  .page-hero{padding:40px 0 24px}
}
@media (max-width: 740px){
  .posts-grid{grid-template-columns:1fr}
  .custom-logo{height:44px!important}
  .ic-form{padding:28px 22px}
  .ic-form-row{grid-template-columns:1fr}
  .entry-content{font-size:15.5px}
  .entry-content h2{font-size:26px}
  .entry-content h3{font-size:19px}
}

/* Featured image in product/service hero */
.p-hero-image{
  width:100%; aspect-ratio:1/1; border-radius:var(--radius-lg);
  overflow:hidden; box-shadow:var(--shadow-lg);
  position:relative;
}
.p-hero-image img{
  width:100%; height:100%; object-fit:cover; display:block;
}

/* Inline product/service helpers from inner.css — if main.css doesn't have them */
.sh-desc{color:var(--graphite); max-width:480px; font-size:16px; line-height:1.6; margin:0}

/* ============================================
   YANDEX MAP (ic-site-footer__map)
   ============================================ */
.ic-site-footer__map{
  position:relative; width:100%; min-height:400px;
  background:var(--cream);
  border-top:4px solid var(--orange);
  overflow:hidden;
}
.ic-site-footer__map--fullbleed{
  margin-left:calc(-50vw + 50%);
  margin-right:calc(-50vw + 50%);
}
.ic-site-footer__map iframe,
.ic-site-footer__map > div,
.ic-site-footer__map ymaps{
  width:100% !important;
  min-height:400px !important;
  display:block;
}
@media (max-width:740px){
  .ic-site-footer__map, .ic-site-footer__map iframe,
  .ic-site-footer__map > div, .ic-site-footer__map ymaps{
    min-height:320px !important;
  }
}
