/* =========================================================
   PAGE.CSS  (default.php)
   Load this AFTER base.css (and header.css/footer.css if those
   are also on the page). Contains everything between header and
   footer: hero, stat band, features, about, industries, products,
   pricing teaser, testimonials, CTA band, and their animations.
========================================================= */

/* =========================================================
   HERO
========================================================= */
.hero{
  position:relative;
  max-width:1320px;margin:0 auto;padding:76px 32px 90px;
  display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;
  overflow:hidden;
}
.hero .hero-spotlight{
  position:absolute !important;
  top:0;left:0;right:0;bottom:0;
  z-index:0;pointer-events:none;
  background:radial-gradient(480px circle at var(--mx,50%) var(--my,30%), rgba(43,79,224,.10), transparent 65%);
  transition:background .1s ease;
}
.hero::before,.hero::after{
  content:'';position:absolute;border-radius:50%;filter:blur(90px);z-index:0;pointer-events:none;
}
.hero::before{
  width:420px;height:420px;background:radial-gradient(circle,rgba(22,86,232,.16),transparent 70%);
  top:-120px;left:-80px;
}
.hero::after{
  width:380px;height:380px;background:radial-gradient(circle,rgba(15,163,107,.12),transparent 70%);
  bottom:-140px;right:-60px;
}
.hero > *{position:relative;z-index:1;}

.eyebrow{
  display:inline-flex;align-items:center;gap:7px;
  font-size:12.5px;font-weight:600;color:var(--accent-dark);
  background:linear-gradient(180deg,#F4F8FF,var(--accent-soft));
  border:1px solid var(--accent-soft-line);
  padding:6px 13px;border-radius:99px;margin-bottom:20px;
  box-shadow:0 1px 2px rgba(22,86,232,.06), inset 0 1px 0 rgba(255,255,255,.6);
}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(22,86,232,.15);}

.hero h1{
  font-family:var(--font-display);
  font-size:45px;line-height:1.14;letter-spacing:-.02em;font-weight:700;
  margin:0 0 20px;color:var(--ink);
}
.hero h1 span{
  background:linear-gradient(90deg,var(--accent) 0%,#3B7BFF 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  position:relative;
}
.hero p.lead{font-size:16.5px;line-height:1.65;color:var(--ink-soft);max-width:460px;margin:0 0 30px;}
.hero-ctas{display:flex;align-items:center;gap:14px;margin-bottom:36px;flex-wrap:wrap;}

.trust-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.trust-row .avatars{display:flex;}
.trust-row .avatars span{
  width:27px;height:27px;border-radius:50%;background:var(--accent-soft);border:2px solid var(--white);
  margin-left:-8px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--accent-dark);
  box-shadow:0 1px 3px rgba(8,16,40,.1);
}
.trust-row .avatars span:first-child{margin-left:0;}
.trust-row .t-div{width:1px;height:22px;background:var(--line);}
.trust-row .t-stars{display:flex;align-items:center;gap:4px;}
.trust-row .t-stars svg{width:13px;height:13px;color:#F5A524;}
.trust-row .t-copy{font-size:12.5px;color:var(--ink-soft);}
.trust-row .t-copy b{color:var(--ink);font-weight:600;}

/* premium video demo card */
.demo-wrap{position:relative;}
.demo-card{
  position:relative;border-radius:18px;overflow:hidden;background:#000;
  aspect-ratio:16/10.5;padding:3px;
  background:linear-gradient(155deg,rgba(22,86,232,.55),rgba(15,163,107,.35) 45%,rgba(22,86,232,.5));
  box-shadow:0 30px 70px -24px rgba(8,16,40,.45), 0 0 0 1px rgba(255,255,255,.4) inset;
}
.demo-card-inner{position:relative;width:100%;height:100%;border-radius:15px;overflow:hidden;background:#000;}
.demo-thumb{width:100%;height:100%;object-fit:cover;display:block;}
.demo-iframe-wrap{position:absolute;inset:0;display:none;}
.demo-iframe-wrap.active{display:block;}
.demo-iframe-wrap iframe{width:100%;height:100%;border:0;display:block;}

.play-btn{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:70px;height:70px;border-radius:50%;background:var(--white);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;z-index:3;
  box-shadow:0 10px 28px -6px rgba(0,0,0,.5), 0 0 0 5px rgba(255,255,255,.14);
  transition:transform .18s ease, box-shadow .18s ease;
}
.play-btn:hover{transform:translate(-50%,-50%) scale(1.06);box-shadow:0 14px 34px -6px rgba(0,0,0,.55), 0 0 0 7px rgba(255,255,255,.18);}
.play-btn svg{width:21px;height:21px;color:var(--accent);margin-left:3px;}
.play-ring{
  position:absolute;top:50%;left:50%;width:70px;height:70px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.55);
  transform:translate(-50%,-50%) scale(1);
  animation:ring 2.4s ease-out infinite;z-index:2;
}
.play-ring.d2{animation-delay:.8s;}
@keyframes ring{
  0%{transform:translate(-50%,-50%) scale(1);opacity:.6;}
  100%{transform:translate(-50%,-50%) scale(2.1);opacity:0;}
}
.demo-card.is-playing .play-btn,
.demo-card.is-playing .play-ring{display:none;}

.demo-caption{display:flex;align-items:center;justify-content:space-between;margin-top:18px;}
.demo-caption .dc-left{display:flex;align-items:center;gap:9px;}
.demo-caption .dc-left svg{width:15px;height:15px;color:var(--accent);}
.demo-caption .dc-left span{font-size:13px;color:var(--ink-soft);font-weight:500;}
.demo-caption .dc-len{
  font-family:var(--font-display);
  font-size:11.5px;font-weight:600;color:var(--accent-dark);
  background:var(--accent-soft);padding:4px 10px;border-radius:99px;
}

/* =========================================================
   STAT BAND
========================================================= */
.stat-band{
  position:relative;overflow:hidden;
  background:linear-gradient(155deg,var(--navy) 0%,#0C1E4A 55%,#0F2E6B 100%);
}
.stat-band::before{
  content:'';position:absolute;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(91,140,255,.18),transparent 70%);
  top:-220px;left:8%;pointer-events:none;
}
.stat-band::after{
  content:'';position:absolute;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(15,163,107,.13),transparent 70%);
  bottom:-190px;right:6%;pointer-events:none;
}
.stat-inner{
  position:relative;z-index:1;
  max-width:1320px;margin:0 auto;padding:64px 32px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
}
.stat-item{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 24px;text-align:center;}
.stat-item:not(:last-child)::after{
  content:'';position:absolute;top:6px;right:0;width:1px;height:calc(100% - 12px);
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.14),transparent);
}
.stat-ico{
  width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15);
}
.stat-ico svg{width:21px;height:21px;color:#7FA3FF;}
.stat-item .num{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  font-size:36px;font-weight:700;color:#fff;line-height:1;
}
.stat-item .lbl{font-size:13px;color:#9BAAD1;margin-top:9px;letter-spacing:.01em;}

/* =========================================================
   GENERIC SECTION HEAD + FEATURES GRID
========================================================= */
.section{max-width:1320px;margin:0 auto;padding:88px 32px;}
.sec-head{max-width:600px;margin:0 auto 46px;text-align:center;}
.sec-head .eyebrow{margin-bottom:16px;}
.sec-head h2{
  font-family:var(--font-display);
  font-weight:700;letter-spacing:-.015em;
  margin:0 0 14px;color:var(--ink);
  font-size:clamp(28px, 4vw, 40px);
}
.sec-head p{font-size:15.5px;color:var(--ink-soft);line-height:1.6;margin:0;}

.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.feat-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:24px;transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.feat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}
.feat-ico{width:38px;height:38px;border-radius:10px;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.feat-ico svg{width:19px;height:19px;color:var(--accent);}
.feat-card h3{font-size:15.5px;font-weight:600;margin:0 0 8px;color:var(--ink);}
.feat-card p{font-size:13.5px;line-height:1.55;color:var(--ink-soft);margin:0;}
.feat-card a.feat-link{
  display:inline-flex;align-items:center;gap:5px;margin-top:14px;
  font-size:12.5px;font-weight:600;color:var(--accent-dark);text-decoration:none;
}
.feat-card a.feat-link svg{width:11px;height:11px;transition:transform .15s ease;}
.feat-card:hover a.feat-link svg{transform:translateX(3px);}

/* mint/gold variant — reseller-specific services (Migration, Support) */
.feat-card.is-service .feat-ico{background:var(--mint-soft);}
.feat-card.is-service .feat-ico svg{color:var(--mint);}
.feat-card.is-service{border-color:var(--mint-soft);}
.feat-card.is-service a.feat-link{color:var(--mint);}

/* =========================================================
   ABOUT / CORE INFOTECH
========================================================= */
.about-section{
  position:relative;max-width:100%;margin:0 auto;padding:100px 32px;
  background:var(--line-soft);overflow:hidden;
}
.about-section::before{
  content:'';position:absolute;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle,rgba(22,86,232,.08),transparent 70%);
  top:-200px;right:-140px;filter:blur(50px);pointer-events:none;
}
.about-section::after{
  content:'';position:absolute;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(circle,rgba(183,134,46,.07),transparent 70%);
  bottom:-160px;left:-100px;filter:blur(50px);pointer-events:none;
}
.about-section .about-grid{position:relative;z-index:1;max-width:1320px;margin:0 auto;}
.about-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:64px;align-items:center;}

/* image side */
.about-img-wrap{position:relative;padding:14px 26px 26px 0;}
.about-img-wrap::before{
  content:'';position:absolute;top:0;right:0;bottom:26px;left:26px;
  border:1.5px solid var(--accent-soft-line);border-radius:var(--radius-lg);z-index:0;
}
.about-img-card{
  position:relative;z-index:1;border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow-lg);border:1px solid var(--line);aspect-ratio:4/4.6;
}
.about-img-card img{width:100%;height:100%;object-fit:cover;display:block;}
.about-img-card::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(8,16,40,.32) 100%);
  pointer-events:none;
}

.about-badge{
  position:absolute;z-index:2;bottom:0;left:0;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:16px 20px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow-lg);
}
.about-badge .ab-ico{
  width:40px;height:40px;border-radius:11px;
  background:linear-gradient(155deg,var(--accent-soft) 0%,var(--accent-soft-line) 100%);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.about-badge .ab-ico svg{width:19px;height:19px;color:var(--accent-dark);}
.about-badge .ab-num{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  font-size:19px;font-weight:700;color:var(--ink);line-height:1.2;
}
.about-badge .ab-lbl{font-size:12px;color:var(--ink-soft);}

.about-badge-top{
  position:absolute;z-index:2;top:0;right:0;
  background:var(--navy);border-radius:var(--radius-md);padding:14px 18px;
  display:flex;align-items:center;gap:10px;
  box-shadow:0 16px 32px -12px rgba(8,16,40,.4);
}
.about-badge-top .abt-ico{
  width:32px;height:32px;border-radius:9px;background:rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.about-badge-top .abt-ico svg{width:16px;height:16px;color:#7FA3FF;}
.about-badge-top .abt-num{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  font-size:15px;font-weight:700;color:#fff;line-height:1.15;
}
.about-badge-top .abt-lbl{font-size:10.5px;color:#9BAAD1;}

/* content side */
.about-content .eyebrow{margin-bottom:16px;}
.about-content h2{
  font-family:var(--font-display);
  font-weight:700;letter-spacing:-.015em;
  margin:0 0 16px;color:var(--ink);
  font-size:clamp(28px, 3.8vw, 40px);
}
.about-content h2 span{color:var(--accent);}
.about-content > p{font-size:15px;line-height:1.7;color:var(--ink-soft);margin:0 0 30px;}

.about-points{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:32px;}
.about-point{
  display:flex;align-items:flex-start;gap:12px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:14px 16px;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.about-point:hover{border-color:var(--accent-soft-line);box-shadow:var(--shadow-sm);transform:translateY(-1px);}
.about-point .ap-ico{
  width:28px;height:28px;border-radius:8px;background:var(--mint-soft);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;
}
.about-point .ap-ico svg{width:14px;height:14px;color:var(--mint);}
.about-point .ap-text{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.4;}

.about-ctas{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}

/* =========================================================
   LOGO STRIP / TRUST BADGES
========================================================= */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--white);}
.strip-inner{max-width:1320px;margin:0 auto;padding:26px 32px;display:flex;align-items:center;gap:28px;flex-wrap:wrap;justify-content:space-between;}
.strip-inner .s-label{font-size:12.5px;font-weight:600;color:var(--ink-faint);white-space:nowrap;}
.strip-badges{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.strip-badge{
  display:flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:99px;
  background:var(--line-soft);border:1px solid var(--line);
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}
.strip-badge:hover{background:var(--accent-soft);border-color:var(--accent-soft-line);transform:translateY(-1px);}
.strip-badge .sb-ico{width:20px;height:20px;border-radius:6px;background:var(--white);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--shadow-sm);}
.strip-badge .sb-ico svg{width:12px;height:12px;color:var(--accent);}
.strip-badge span.sb-text{font-family:var(--font-display);font-weight:600;font-size:13px;color:var(--ink);letter-spacing:-.005em;white-space:nowrap;}

/* =========================================================
   INDUSTRIES
========================================================= */
.ind-section{max-width:1320px;margin:0 auto;padding:88px 32px;}
.ind-head{max-width:700px;margin:0 auto 40px;}
.ind-head h2{
  font-family:var(--font-display);
  font-weight:700;letter-spacing:-.015em;
  margin:0 0 12px;color:var(--ink);
  font-size:clamp(26px, 3.6vw, 38px);
}
.ind-head p{font-size:15px;line-height:1.6;color:var(--ink-soft);margin:0;}

.ind-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
.ind-card{
  background:var(--white);border:1.5px solid var(--line);border-radius:var(--radius-lg);
  padding:28px 16px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;text-align:center;
  cursor:pointer;text-decoration:none;color:inherit;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.ind-card:hover{border-color:var(--accent-soft-line);box-shadow:var(--shadow-md);transform:translateY(-2px);}
.ind-card.is-active{border-color:var(--accent);box-shadow:var(--shadow-md);}
.ind-ico{width:34px;height:34px;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);transition:color .18s ease;}
.ind-ico svg{width:26px;height:26px;stroke-width:1.6;}
.ind-card:hover .ind-ico,
.ind-card.is-active .ind-ico{color:var(--accent);}
.ind-name{font-size:14.5px;font-weight:600;color:var(--ink);}

/* =========================================================
   PRODUCT LISTING
========================================================= */
.prodlist-section{
  background:linear-gradient(180deg, var(--accent-soft) 0%, #F6F9FF 100%);
  padding:88px 0;
}
.prodlist-inner{max-width:1320px;margin:0 auto;padding:0 32px;}
.prodlist-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.prodlist-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  overflow:hidden;display:flex;flex-direction:column;
  transition:box-shadow .2s ease, transform .2s ease;
}
@media (prefers-reduced-motion: no-preference){
  .prodlist-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px);}
}

.prodlist-img{width:100%;aspect-ratio:16/10;background:var(--line-soft);overflow:hidden;position:relative;}
.prodlist-img img{width:100%;height:100%;object-fit:cover;display:block;}

/* torn-ticket seam between photo and details */
.prodlist-img::after{
  content:"";
  position:absolute;left:0;right:0;bottom:-1px;height:14px;
  background:
    linear-gradient(135deg, var(--white) 25%, transparent 25%) 0 50%,
    linear-gradient(225deg, var(--white) 25%, transparent 25%) 0 50%,
    linear-gradient(315deg, var(--white) 25%, transparent 25%) 0 50%,
    linear-gradient(45deg,  var(--white) 25%, transparent 25%) 0 50%;
  background-size:14px 14px;
  background-repeat:repeat-x;
}

/* rubber-stamp badge */
.prodlist-badge{
  position:absolute;top:14px;left:14px;
  background:rgba(255,255,255,.85);
  border:1.5px dashed var(--accent-dark);
  color:var(--accent-dark);
  font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  padding:5px 11px;border-radius:4px;
  transform:rotate(-7deg);
  transition:transform .2s ease;
}
.prodlist-card:hover .prodlist-badge{transform:rotate(-3deg);}

.prodlist-body{padding:26px 22px 22px;display:flex;flex-direction:column;flex-grow:1;}
.prodlist-body h3{font-size:17px;font-weight:600;color:var(--ink);margin:0 0 8px;}
.prodlist-body p{font-size:13.5px;line-height:1.6;color:var(--ink-soft);margin:0 0 18px;flex-grow:1;}

.prodlist-foot{position:relative;display:flex;align-items:center;justify-content:space-between;padding-top:16px;}
.prodlist-foot::before{
  content:"";position:absolute;top:0;left:0;right:0;
  border-top:1.5px dashed var(--line);
}
.prodlist-price .pp-lbl{font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint);}
.prodlist-price .pp-val{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  font-size:18px;font-weight:700;color:var(--ink);
}
.prodlist-price .pp-val span{font-size:11.5px;font-weight:500;color:var(--ink-soft);}

.prodlist-link{display:flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:var(--accent-dark);text-decoration:none;}
.prodlist-link svg{width:13px;height:13px;transition:transform .15s ease;}
.prodlist-card:hover .prodlist-link svg{transform:translateX(3px);}
.prodlist-link:focus-visible{outline:2px solid var(--accent-dark);outline-offset:3px;border-radius:3px;}

/* =========================================================
   PRICING TEASER (compact)
========================================================= */
.price-teaser{max-width:1390px;margin:0 auto;padding:0 32px 0px;}
.price-teaser-card{
  position:relative;overflow:hidden;
  background:var(--navy);border-radius:var(--radius-lg);
  padding:48px 52px;
  display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;
}
.price-teaser-card::before{
  content:'';position:absolute;width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle,rgba(22,86,232,.35),transparent 70%);
  top:-140px;right:-80px;filter:blur(40px);pointer-events:none;
}
.pt-left{position:relative;z-index:1;display:flex;align-items:center;gap:18px;}
.pt-ico{
  width:52px;height:52px;border-radius:12px;background:rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.pt-ico svg{width:24px;height:24px;color:#5B8CFF;}
.pt-text h3{font-family:var(--font-display);font-size:20px;font-weight:600;color:#fff;margin:0 0 5px;letter-spacing:-.015em;}
.pt-text p{font-size:13.5px;color:#9BAAD1;margin:0;}
.pt-right{position:relative;z-index:1;display:flex;align-items:center;gap:14px;flex-shrink:0;}
.pt-from{text-align:right;}
.pt-from .pf-lbl{font-size:11.5px;color:#8FA0C9;}
.pt-from .pf-val{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  font-size:20px;font-weight:700;color:#fff;
}
.pt-from .pf-val span{font-size:12px;font-weight:500;color:#9BAAD1;}

/* =========================================================
   HOW IT WORKS (currently unused / commented in HTML)
========================================================= */
.steps-wrap{position:relative;}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;position:relative;}
.steps-grid::before{
  content:'';position:absolute;top:27px;left:calc(16.66% + 4px);right:calc(16.66% + 4px);
  height:1.5px;background:repeating-linear-gradient(90deg,var(--line) 0 8px,transparent 8px 14px);
  z-index:0;
}
.step-item{position:relative;z-index:1;padding:0 28px;text-align:left;}
.step-num{
  width:54px;height:54px;border-radius:50%;
  background:var(--white);border:1.5px solid var(--accent-soft-line);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  font-size:19px;font-weight:600;color:var(--accent);
  margin-bottom:22px;
  box-shadow:0 4px 14px -4px rgba(22,86,232,.18);
}
.step-item h3{font-size:16.5px;font-weight:600;margin:0 0 9px;color:var(--ink);}
.step-item p{font-size:13.5px;line-height:1.6;color:var(--ink-soft);margin:0;}

/* =========================================================
   TESTIMONIALS SLIDER
========================================================= */
.testi-section{max-width:1320px;margin:0 auto;padding:88px 32px;overflow:hidden;}
.testi-viewport{position:relative;overflow:hidden;margin:0 -10px;}
.testi-track{display:flex;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform;}
.testi-slide{flex:0 0 33.333%;padding:0 10px;box-sizing:border-box;}
.testi-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:28px;height:100%;
  display:flex;flex-direction:column;
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.testi-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--accent-soft-line);}
.testi-stars{display:flex;gap:3px;margin-bottom:16px;}
.testi-stars svg{width:14px;height:14px;color:#F5A524;}
.testi-quote{font-size:14px;line-height:1.7;color:var(--ink);margin:0 0 22px;flex-grow:1;}
.testi-quote::before{content:'"';}
.testi-quote::after{content:'"';}
.testi-person{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--line-soft);}
.testi-avatar{
  width:42px;height:42px;border-radius:50%;background:var(--accent-soft);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  font-size:14px;font-weight:700;color:var(--accent-dark);
  flex-shrink:0;
}
.testi-info .ti-name{font-size:13.5px;font-weight:600;color:var(--ink);}
.testi-info .ti-role{font-size:12px;color:var(--ink-soft);margin-top:2px;}

.testi-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:36px;}
.testi-arrow{
  width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--white);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--ink-soft);
  transition:background .15s ease,color .15s ease,border-color .15s ease;
  flex-shrink:0;
}
.testi-arrow:hover{background:var(--accent-soft);color:var(--accent-dark);border-color:var(--accent-soft-line);}
.testi-arrow svg{width:16px;height:16px;}
.testi-dots{display:flex;align-items:center;gap:8px;}
.testi-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--line);border:none;cursor:pointer;padding:0;
  transition:background .2s ease, width .2s ease;
}
.testi-dot.is-active{background:var(--accent);width:22px;border-radius:5px;}

/* =========================================================
   CTA BAND
========================================================= */
.cta-band{max-width:1320px;margin:0 auto;padding:0 32px 96px;}
.cta-card{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#2463F5 0%,var(--accent) 45%,var(--accent-dark) 100%);
  border-radius:var(--radius-lg);
  padding:56px 48px;
  display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;
  box-shadow:0 30px 60px -20px rgba(22,86,232,.5), inset 0 1px 0 rgba(255,255,255,.15);
}
.cta-card::before{
  content:'';position:absolute;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.14),transparent 70%);
  top:-160px;right:-60px;pointer-events:none;
}
.cta-card::after{
  content:'';position:absolute;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.08),transparent 70%);
  bottom:-140px;left:-40px;pointer-events:none;
}
.cta-left{position:relative;z-index:1;display:flex;align-items:center;gap:18px;}
.cta-ico{
  width:52px;height:52px;border-radius:14px;background:rgba(255,255,255,.15);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
}
.cta-ico svg{width:24px;height:24px;color:#fff;}
.cta-card h2{font-family:var(--font-display);color:#fff;font-size:26px;font-weight:600;margin:0 0 8px;letter-spacing:-.015em;}
.cta-card p{color:#D9E4FF;font-size:14.5px;line-height:1.6;margin:0;max-width:420px;}
.cta-right{position:relative;z-index:1;display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.cta-phone{display:flex;align-items:center;gap:9px;}
.cta-phone svg{width:16px;height:16px;color:#fff;}
.cta-phone span{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:600;color:#fff;}
.cta-card .cta{background:#fff;color:var(--accent-dark);}
.cta-card .cta:hover{background:#EFF3FF;box-shadow:0 8px 18px -6px rgba(0,0,0,.25);}

/* =========================================================
   AMBIENT MOTION (blob float animations)
========================================================= */
@media (prefers-reduced-motion: no-preference){
  @keyframes blobFloatA{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(35px,-45px) scale(1.08);}
  }
  @keyframes blobFloatB{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(-30px,40px) scale(1.06);}
  }
  .hero::before{animation:blobFloatA 16s ease-in-out infinite;}
  .hero::after{animation:blobFloatB 20s ease-in-out infinite;}
  .stat-band::before{animation:blobFloatA 22s ease-in-out infinite;}
  .stat-band::after{animation:blobFloatB 18s ease-in-out infinite;}
  .about-section::before{animation:blobFloatA 24s ease-in-out infinite;}
  .about-section::after{animation:blobFloatB 20s ease-in-out infinite;}
  .cta-card::before{animation:blobFloatA 15s ease-in-out infinite;}
  .cta-card::after{animation:blobFloatB 19s ease-in-out infinite;}
}

/* =========================================================
   RESPONSIVE — TABLET (≤1080px)
========================================================= */
@media (max-width: 1080px){
  .hero{grid-template-columns:1fr;padding:48px 24px 60px;gap:36px;}
  .hero h1{font-size:32px;}
  .demo-wrap{order:-1;max-width:520px;margin:0 auto;}

  .feat-grid{grid-template-columns:repeat(2,1fr);}
  .stat-inner{grid-template-columns:repeat(2,1fr);}

  .about-grid{grid-template-columns:1fr;gap:56px;}
  .about-img-wrap{max-width:420px;margin:0 auto;}

  .ind-grid{grid-template-columns:repeat(3,1fr);}

  .prodlist-grid{grid-template-columns:1fr 1fr;}

  .steps-grid{grid-template-columns:1fr;gap:36px;}
  .steps-grid::before{display:none;}
  .step-item{padding:0;}

  .testi-slide{flex:0 0 50%;}
}

/* =========================================================
   RESPONSIVE — MOBILE (≤720px)
========================================================= */
@media (max-width: 720px){
  .hero{padding:40px 20px 48px;}
  .hero h1{font-size:27px;}
  .play-btn,.play-ring{width:56px;height:56px;}
  .trust-row{gap:8px;}

  .section{padding:56px 20px;}
  .sec-head h2{font-size:26px;}
  .feat-grid{grid-template-columns:1fr;}

  .stat-inner{grid-template-columns:1fr 1fr;gap:36px 0;padding:48px 20px;}
  .stat-item:nth-child(2)::after{display:none;}
  .stat-item:not(:last-child)::after{display:none;}
  .stat-item .num{font-size:26px;}

  .about-section{padding:64px 20px;}
  .about-content h2{font-size:26px;}
  .about-points{grid-template-columns:1fr;}
  .about-img-wrap{padding:10px 18px 18px 0;}
  .about-badge{padding:12px 16px;}
  .about-badge-top{padding:10px 14px;}

  .strip-inner{justify-content:center;text-align:center;}
  .strip-badges{justify-content:center;}

  .ind-section{padding:56px 20px;}
  .ind-head h2{font-size:24px;}
  .ind-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .ind-card{padding:22px 12px;}

  .prodlist-section{padding:56px 0;}
  .prodlist-inner{padding:0 20px;}
  .prodlist-grid{grid-template-columns:1fr;gap:18px;}

  .price-teaser{padding:0 20px 64px;}
  .price-teaser-card{padding:32px 24px;flex-direction:column;text-align:center;}
  .pt-left{flex-direction:column;text-align:center;}
  .pt-right{width:100%;flex-direction:column;}
  .pt-from{text-align:center;}
  .pt-right .cta{width:100%;justify-content:center;}

  .testi-section{padding:56px 20px;}
  .testi-slide{flex:0 0 100%;}
  .testi-controls{gap:14px;margin-top:28px;}

  .cta-band{padding:0 20px 64px;}
  .cta-card{padding:36px 24px;flex-direction:column;text-align:center;}
  .cta-left{flex-direction:column;text-align:center;}
  .cta-card p{max-width:none;}
  .cta-right{flex-direction:column;width:100%;}
  .cta-right .cta{width:100%;justify-content:center;}
}