:root {
  --em:      #059669;   /* emerald */
  --em-lt:   #10B981;
  --em-dim:  rgba(5,150,105,.13);
  --em-bdr:  rgba(5,150,105,.28);
  --em-glow: rgba(16,185,129,.3);
  --gold:    #D97706;
  --gold-lt: #F59E0B;
  --gold-dim:rgba(217,119,6,.12);
  --gold-bdr:rgba(245,158,11,.28);
  --blue: var(--accent);
  --blue-dim: var(--accent-dim);
  --blue-bdr: var(--accent-border);
  --red:     #DC2626;
  --red-dim: rgba(220,38,38,.1);
  --ink: var(--bg-primary);
  --ink-2: var(--bg-secondary);
  --ink-3: var(--bg-tertiary);
  --ink-4:   #112535;
  --white: var(--text-main);
  --muted: var(--text-muted);
  --muted-lt: var(--text-soft);
  --bdr: var(--border-color);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Space Grotesk',sans-serif;background:var(--ink);color:var(--white);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:9998;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");opacity:.7}
a{text-decoration:none;color:inherit}
img{display:block;width:100%;height:100%;object-fit:cover}

h1,h2,h3,h4{font-family:'Outfit',sans-serif;letter-spacing:-.02em;line-height:1.08}
h1{font-size:clamp(2.6rem,5vw,4.6rem);font-weight:900}
h2{font-size:clamp(1.9rem,3.2vw,2.9rem);font-weight:800}
h3{font-size:clamp(1rem,1.6vw,1.25rem);font-weight:700}
.perfomia-nav .nav-name,
#hero h1,
#problem h2,
#features h2,
#impact h2,
#forwhom h2,
#pricing h2,
#why h2,
#gallery h2,
#cta-final h2,
.sol-title,
.fm-title,
.ic-num,
.case-name,
.fw-title,
.pc-name,
.ds-header-title,
.dm-title,
.dm-kpi-val,
.fs-name,
.foot-left,
.foot-left a,
.foot-links a{
  color:var(--white) !important;
}
.lead{font-size:1.05rem;font-weight:300;color:var(--muted-lt);line-height:1.8}

.btn{display:inline-flex;align-items:center;gap:.55rem;font-family:'Space Grotesk',sans-serif;font-size:.9rem;font-weight:600;padding:.875rem 1.875rem;border-radius:10px;border:none;cursor:pointer;transition:all .22s;text-decoration:none}
.btn-em{background:var(--em);color:#fff;box-shadow:0 0 36px var(--em-glow)}
.btn-em:hover{background:var(--em-lt);transform:translateY(-2px);box-shadow:0 0 56px rgba(16,185,129,.45)}
.btn-ghost{background:rgba(255,255,255,.06);color:var(--white);border:1px solid var(--bdr)}
.btn-ghost:hover{background:var(--surface-bg);border-color:rgba(255,255,255,.18);transform:translateY(-2px)}
.btn-gold{background:var(--gold);color:#fff;box-shadow:0 0 28px rgba(217,119,6,.3)}
.btn-gold:hover{background:var(--gold-lt);transform:translateY(-2px)}
.btn-outline-em{background:transparent;color:var(--em-lt);border:1px solid var(--em-bdr)}
.btn-outline-em:hover{background:var(--em-dim);transform:translateY(-2px)}

.tag{display:inline-flex;align-items:center;gap:.4rem;font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .9rem;border-radius:6px;background:var(--em-dim);border:1px solid var(--em-bdr);color:var(--em-lt);margin-bottom:1.4rem}
.tag-gold{display:inline-flex;align-items:center;gap:.4rem;font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .9rem;border-radius:6px;background:var(--gold-dim);border:1px solid var(--gold-bdr);color:var(--gold-lt);margin-bottom:1.4rem}
.tag-blue{display:inline-flex;align-items:center;gap:.4rem;font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .9rem;border-radius:6px;background:var(--blue-dim);border:1px solid var(--blue-bdr);color:#60A5FA;margin-bottom:1.4rem}
.tag i,.tag-gold i,.tag-blue i{
  font-size:.8rem;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.rv.vis{opacity:1;transform:translateY(0)}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}
.rv.d4{transition-delay:.4s}.rv.d5{transition-delay:.5s}.rv.d6{transition-delay:.6s}

/* Image placeholder */
.img-ph{
  background:linear-gradient(135deg,var(--ink-4) 0%,var(--ink-3) 100%);
  border:2px dashed rgba(5,150,105,.3);border-radius:inherit;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.65rem;text-align:center;padding:1.25rem;position:relative;overflow:hidden;
}
.img-ph::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(5,150,105,.06) 0%,transparent 70%)}
.img-ph-ico{font-size:2rem;opacity:.5;z-index:1}
.img-ph-label{font-family:'Outfit',sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--em-lt);opacity:.75;z-index:1;line-height:1.4}
.img-ph-hint{font-size:.6rem;color:var(--muted);z-index:1;line-height:1.35}

/* ══════════════════════════════
   NAV
══════════════════════════════ */
#mainNav.perfomia-nav{
  position:sticky;
  top:0;
  z-index:500;
  min-height:72px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:1.5rem;
  padding:0 5%;
  background:rgba(4,13,18,.7);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--bdr);
  transition:background .3s,border-color .3s;
}
#mainNav.perfomia-nav.sc{background:rgba(4,13,18,.97);border-bottom-color:rgba(255,255,255,.1)}
#mainNav.perfomia-nav .nav-brand{display:flex;align-items:center;gap:.75rem;flex-shrink:0}
#mainNav.perfomia-nav .nav-logo-mark{
  width:36px;height:36px;border-radius:8px;
  background:linear-gradient(135deg,var(--em),#047857);
  display:flex;align-items:center;justify-content:center;
  font-family:'Outfit',sans-serif;font-size:.9rem;font-weight:900;color:#fff;
  letter-spacing:-.03em;flex-shrink:0
}
#mainNav.perfomia-nav .nav-name{font-family:'Outfit',sans-serif;font-size:1.1rem;font-weight:900;letter-spacing:-.02em}
#mainNav.perfomia-nav .nav-name span{color:var(--em-lt)}
#mainNav.perfomia-nav .nav-links{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:1.65rem;
  list-style:none;
  margin:0;
  padding:0;
  white-space:nowrap;
  min-width:0;
  overflow:hidden;
}
#mainNav.perfomia-nav .nav-links li{list-style:none;flex-shrink:0}
#mainNav.perfomia-nav .nav-links a{
  display:inline-flex;
  align-items:center;
  line-height:1;
  font-size:.83rem;
  color:var(--muted-lt);
  transition:color .2s;
}
#mainNav.perfomia-nav .nav-links a:hover{color:var(--white)}
#mainNav.perfomia-nav .nav-right{display:flex;align-items:center;justify-self:end;gap:.75rem;flex-shrink:0;white-space:nowrap}
#mainNav.perfomia-nav .nav-back{font-size:.75rem;color:var(--muted);transition:color .2s;display:flex;align-items:center;gap:.3rem}
#mainNav.perfomia-nav .nav-back:hover{color:var(--white)}
#mainNav.perfomia-nav .nav-back i{font-size:.95rem;line-height:1}
#mainNav.perfomia-nav .nav-cta{
  padding:.55rem 1.25rem;
  border-radius:8px;
  font-size:.82rem;
  white-space:nowrap;
}
@media(max-width:1100px){
  #mainNav.perfomia-nav .nav-links{gap:1.1rem}
}
@media(max-width:900px){
  #mainNav.perfomia-nav{
    grid-template-columns:auto 1fr auto;
    gap:1rem;
  }
  #mainNav.perfomia-nav .nav-links{display:none}
  #mainNav.perfomia-nav .nav-back{display:none}
}

/* ══════════════════════════════
   HERO
══════════════════════════════ */
#hero{min-height:100vh;display:flex;align-items:center;padding:100px 5% 80px;position:relative;overflow:hidden}
.hero-ambient{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 55% 65% at 75% 45%,rgba(5,150,105,.14) 0%,transparent 65%),
    radial-gradient(ellipse 35% 40% at 10% 25%,rgba(37,99,235,.07) 0%,transparent 55%),
    radial-gradient(ellipse 40% 40% at 50% 100%,rgba(217,119,6,.06) 0%,transparent 60%)}
.hero-lines{position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(5,150,105,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(5,150,105,.04) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 90% 80% at 50% 50%,black 10%,transparent 80%)}
.hero-inner{max-width:1280px;margin:0 auto;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}

.hero-kicker{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}
.hk-badge{display:flex;align-items:center;gap:.4rem;background:var(--em-dim);border:1px solid var(--em-bdr);border-radius:6px;padding:.3rem .85rem;font-size:.68rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--em-lt)}
.hk-dot{width:6px;height:6px;border-radius:50%;background:var(--em-lt);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.hk-cat{font-size:.65rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-lt)}

#hero h1{margin-bottom:1.5rem}
#hero h1 .hi{color:var(--em-lt)}
#hero h1 .ha{background:linear-gradient(135deg,var(--gold-lt),#FDE68A);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
#hero .lead{max-width:500px;margin-bottom:2.5rem}
.hero-ctas{display:flex;gap:.85rem;flex-wrap:wrap;margin-bottom:2.5rem}

/* trust strip */
.trust-strip{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:var(--muted-lt)}
.trust-ico{font-size:.95rem;color:var(--em-lt)}
.trust-div{width:1px;height:16px;background:var(--bdr)}

/* ─ dashboard mockup ─ */
.dash-mock{
  background:var(--ink-2);border:1px solid var(--bdr);border-radius:18px;
  overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.03);
  position:relative;
}
.dash-mock::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--em),var(--gold-lt),var(--blue))}
.dm-topbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem;border-bottom:1px solid var(--bdr);background:rgba(255,255,255,.02)}
.dm-dots{display:flex;gap:.4rem}
.dm-dot{width:10px;height:10px;border-radius:50%}
.dm-title{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dm-status{display:flex;align-items:center;gap:.35rem;font-size:.65rem;color:var(--em-lt);font-weight:600}
.dm-status-dot{width:6px;height:6px;border-radius:50%;background:var(--em-lt);animation:pulse 2s ease-in-out infinite}

.dm-body{padding:1rem}
/* KPI row */
.dm-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.65rem;margin-bottom:.85rem}
.dm-kpi{background:var(--ink-3);border:1px solid var(--bdr);border-radius:10px;padding:.75rem;position:relative;overflow:hidden}
.dm-kpi::before{content:'';position:absolute;top:0;left:0;right:0;height:2px}
.dm-kpi:nth-child(1)::before{background:var(--em)}
.dm-kpi:nth-child(2)::before{background:var(--gold-lt)}
.dm-kpi:nth-child(3)::before{background:#3B82F6}
.dm-kpi:nth-child(4)::before{background:#8B5CF6}
.dm-kpi-val{font-family:'Outfit',sans-serif;font-size:1.15rem;font-weight:800;line-height:1;margin-bottom:.25rem}
.dm-kpi-lbl{font-size:.55rem;color:var(--muted-lt);text-transform:uppercase;letter-spacing:.07em}
.dm-kpi-delta{font-size:.58rem;margin-top:.3rem;font-weight:600}
.dm-kpi-delta.up{color:var(--em-lt)}
.dm-kpi-delta.dn{color:#F87171}
.dm-kpi-delta i{font-size:.65rem;line-height:1;margin-right:.2rem}

/* Chart area */
.dm-chart-row{display:grid;grid-template-columns:1.4fr 1fr;gap:.65rem;margin-bottom:.85rem}
.dm-chart{background:var(--ink-3);border:1px solid var(--bdr);border-radius:10px;padding:.85rem}
.dm-chart-title{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.65rem}

/* bar chart */
.bar-chart{display:flex;align-items:flex-end;gap:.3rem;height:56px}
.bar{border-radius:3px 3px 0 0;flex:1;min-width:0;transition:opacity .2s}
.bar:hover{opacity:.8}

/* donut placeholder */
.donut-wrap{height:80px;display:flex;align-items:center;justify-content:center;gap:1rem}
.donut-ring{width:72px;height:72px;border-radius:50%;background:conic-gradient(var(--em) 0% 48%,var(--gold-lt) 48% 72%,#3B82F6 72% 88%,rgba(255,255,255,.08) 88% 100%);display:flex;align-items:center;justify-content:center;position:relative}
.donut-inner{width:46px;height:46px;border-radius:50%;background:var(--ink-3);display:flex;align-items:center;justify-content:center;font-family:'Outfit',sans-serif;font-size:.7rem;font-weight:800}
.donut-legend{display:flex;flex-direction:column;gap:.3rem}
.dl-row{display:flex;align-items:center;gap:.4rem;font-size:.58rem;color:var(--muted-lt)}
.dl-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}

/* agent list */
.dm-agents{background:var(--ink-3);border:1px solid var(--bdr);border-radius:10px;padding:.85rem}
.dm-agents-title{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.65rem}
.agent-row{display:flex;align-items:center;gap:.65rem;margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.04)}
.agent-row:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}
.agent-av{width:24px;height:24px;border-radius:50%;background:var(--em-dim);border:1px solid var(--em-bdr);display:flex;align-items:center;justify-content:center;font-size:.6rem;flex-shrink:0}
.agent-name{font-size:.65rem;font-weight:600;flex:1}
.agent-score-bar{height:4px;background:rgba(255,255,255,.06);border-radius:2px;width:60px;overflow:hidden;flex-shrink:0}
.agent-score-fill{height:100%;border-radius:2px;background:var(--em);transition:width 1s ease}
.agent-pct{font-size:.6rem;color:var(--em-lt);font-weight:600;min-width:28px;text-align:right}

/* floating alerts */
.dash-float{position:absolute;background:rgba(4,13,18,.92);backdrop-filter:blur(16px);border:1px solid rgba(5,150,105,.25);border-radius:10px;padding:.65rem .9rem;pointer-events:none}
.df1{top:-16px;right:-16px;animation:floatY 3s ease-in-out infinite}
.df2{bottom:-12px;left:-16px;animation:floatY 3.5s ease-in-out infinite .6s}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.df-label{font-size:.55rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--muted-lt)}
.df-val{font-family:'Outfit',sans-serif;font-size:.82rem;font-weight:700;margin-top:.1rem}

/* ══════════════════════════════
   PROBLEM
══════════════════════════════ */
#problem{padding:100px 5%;background:linear-gradient(180deg,var(--ink) 0%,var(--ink-2) 100%)}
.prob-inner{max-width:1280px;margin:0 auto}
.prob-layout{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.prob-pains{display:flex;flex-direction:column;gap:.75rem;margin-top:2rem}
.pain-item{display:flex;align-items:flex-start;gap:1rem;padding:1rem 1.25rem;background:var(--red-dim);border:1px solid rgba(220,38,38,.2);border-radius:12px;transition:all .2s}
.pain-item:hover{background:rgba(220,38,38,.15);border-color:rgba(220,38,38,.35)}
.pain-ico{width:28px;height:28px;border-radius:8px;background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.22);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.05rem;color:#FCA5A5}
.pain-ico i{font-size:1rem;line-height:1}
.pain-title{font-size:.88rem;font-weight:600;margin-bottom:.18rem}
.pain-desc{font-size:.775rem;color:var(--muted-lt);line-height:1.5}

/* consequence box */
.consequence{background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.22);border-radius:14px;padding:1.5rem;margin-top:1.5rem}
.con-title{font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#F87171;margin-bottom:.85rem}
.con-items{display:flex;gap:1rem;flex-wrap:wrap}
.con-item{display:flex;align-items:center;gap:.45rem;font-size:.8rem;color:#FCA5A5}
.con-ico{font-size:.9rem;line-height:1;flex-shrink:0}

/* solution panel */
.sol-panel{background:var(--ink-3);border:1px solid var(--em-bdr);border-radius:20px;padding:2.5rem;position:relative;overflow:hidden}
.sol-panel::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--em),var(--gold-lt))}
.sol-title{font-family:'Outfit',sans-serif;font-size:1.3rem;font-weight:800;margin-bottom:.5rem}
.sol-sub{font-size:.875rem;color:var(--muted-lt);line-height:1.7;margin-bottom:1.75rem}
.sol-items{display:flex;flex-direction:column;gap:.65rem}
.sol-item{display:flex;align-items:center;gap:.85rem;padding:.8rem 1rem;background:var(--em-dim);border:1px solid var(--em-bdr);border-radius:10px;transition:all .2s}
.sol-item:hover{background:rgba(5,150,105,.2);transform:translateX(4px)}
.sol-check{width:24px;height:24px;border-radius:50%;background:var(--em);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
.sol-check i{font-size:.7rem;line-height:1}
.sol-text{font-size:.875rem;color:var(--white);font-weight:500}

/* ══════════════════════════════
   FEATURES
══════════════════════════════ */
#features{padding:100px 5%;background:var(--ink-2);border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr)}
.feat-inner{max-width:1280px;margin:0 auto}
.section-header{text-align:center;margin-bottom:5rem}
.section-header h2{margin-bottom:.85rem}
.section-header .lead{max-width:520px;margin:0 auto}

.feat-modules{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.feat-module{
  background:var(--ink-3);border:1px solid var(--bdr);border-radius:20px;
  padding:2.25rem;transition:all .28s;cursor:default;position:relative;overflow:hidden;
}
.feat-module::after{content:'';position:absolute;inset:0;opacity:0;transition:opacity .3s;pointer-events:none;border-radius:20px}
.feat-module:hover{transform:translateY(-5px);box-shadow:0 24px 64px rgba(0,0,0,.4)}
.feat-module:hover::after{opacity:1}

.fm-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1.5rem;border:1px solid;flex-shrink:0}
.fm-icon i{font-size:1.3rem;line-height:1}
.fm-title{font-family:'Outfit',sans-serif;font-size:1.1rem;font-weight:800;margin-bottom:.65rem}
.fm-desc{font-size:.875rem;color:var(--muted-lt);line-height:1.7;margin-bottom:1.5rem}
.fm-items{display:flex;flex-direction:column;gap:.5rem}
.fm-item{display:flex;align-items:center;gap:.65rem;font-size:.825rem;color:var(--muted-lt);padding:.5rem .75rem;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.04);border-radius:7px;transition:all .15s}
.fm-item:hover{color:var(--white);background:var(--surface-bg)}
.fm-bullet{width:5px;height:5px;border-radius:50%;flex-shrink:0}

/* color variants */
.fm-green .fm-icon{background:var(--em-dim);border-color:var(--em-bdr)}
.fm-green:hover::after{background:linear-gradient(135deg,rgba(5,150,105,.05),transparent)}
.fm-green .fm-bullet{background:var(--em-lt)}
.fm-gold .fm-icon{background:var(--gold-dim);border-color:var(--gold-bdr)}
.fm-gold:hover::after{background:linear-gradient(135deg,rgba(217,119,6,.05),transparent)}
.fm-gold .fm-bullet{background:var(--gold-lt)}
.fm-blue .fm-icon{background:var(--blue-dim);border-color:var(--blue-bdr)}
.fm-blue:hover::after{background:linear-gradient(135deg,rgba(37,99,235,.05),transparent)}
.fm-blue .fm-bullet{background:#60A5FA}
.fm-purple .fm-icon{background:rgba(139,92,246,.12);border-color:rgba(139,92,246,.28)}
.fm-purple:hover::after{background:linear-gradient(135deg,rgba(139,92,246,.05),transparent)}
.fm-purple .fm-bullet{background:#A78BFA}

/* ── Dashboard screenshot ── */
.dashboard-section{margin-top:4rem;background:var(--ink-4);border:1px solid var(--bdr);border-radius:20px;overflow:hidden}
.ds-header{padding:1.25rem 1.75rem;border-bottom:1px solid var(--bdr);display:flex;align-items:center;justify-content:space-between}
.ds-header-title{font-family:'Outfit',sans-serif;font-size:.85rem;font-weight:700;letter-spacing:.04em}
.ds-header-sub{font-size:.72rem;color:var(--muted-lt)}
.ds-content{height:340px}
.ds-content .img-ph{border-radius:0;border:none;height:100%}

/* ══════════════════════════════
   IMPACT / RESULTS
══════════════════════════════ */
#impact{padding:100px 5%}
.impact-inner{max-width:1280px;margin:0 auto}
.impact-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin:4rem 0}
.impact-card{
  background:var(--ink-2);border:1px solid var(--bdr);border-radius:16px;
  padding:1.75rem;text-align:center;position:relative;overflow:hidden;
  transition:all .25s;cursor:default;
}
.impact-card:hover{transform:translateY(-4px);border-color:var(--em-bdr);box-shadow:0 16px 48px rgba(0,0,0,.3)}
.impact-card::before{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--em);transform:scaleX(0);transform-origin:left;transition:transform .4s ease}
.impact-card:hover::before{transform:scaleX(1)}
.ic-ico{font-size:1.8rem;margin-bottom:.85rem;display:block;color:var(--em-lt)}
.ic-ico i{font-size:1.8rem;line-height:1}
.ic-num{font-family:'Outfit',sans-serif;font-size:1.8rem;font-weight:900;line-height:1;margin-bottom:.35rem;background:linear-gradient(135deg,var(--em-lt),var(--gold-lt));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.ic-label{font-size:.78rem;color:var(--muted-lt);line-height:1.45}

.impact-case{background:var(--ink-2);border:1px solid var(--em-bdr);border-radius:20px;padding:2.5rem;position:relative;overflow:hidden}
.impact-case::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--em),var(--gold-lt))}
.case-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--bdr)}
.case-logo{width:52px;height:52px;border-radius:12px;background:var(--em-dim);border:1px solid var(--em-bdr);display:flex;align-items:center;justify-content:center;font-family:'Outfit',sans-serif;font-size:.75rem;font-weight:900;color:var(--em-lt);letter-spacing:-.02em;flex-shrink:0}
.case-name{font-family:'Outfit',sans-serif;font-size:1.05rem;font-weight:800}
.case-sub{font-size:.75rem;color:var(--muted-lt)}
.case-badge{margin-left:auto;font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.25rem .75rem;border-radius:100px;background:var(--em-dim);border:1px solid var(--em-bdr);color:var(--em-lt)}
.case-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}
.cs-stat{text-align:center;padding:1rem;background:var(--ink-3);border:1px solid var(--bdr);border-radius:10px}
.cs-stat-num{font-family:'Outfit',sans-serif;font-size:1.4rem;font-weight:900;color:var(--em-lt)}
.cs-stat-lbl{font-size:.68rem;color:var(--muted-lt);margin-top:.25rem;line-height:1.4}
.case-quote{font-size:.875rem;color:var(--muted-lt);line-height:1.75;font-style:italic;padding:1rem 1.25rem;border-left:2px solid var(--em-bdr);background:rgba(255,255,255,.02);border-radius:0 8px 8px 0}

/* ══════════════════════════════
   FOR WHO
══════════════════════════════ */
#forwhom{padding:100px 5%;background:var(--ink-2);border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr)}
.fw-inner{max-width:1280px;margin:0 auto}
.fw-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem;margin-top:4rem}

.fw-card{
  background:var(--ink-3);border:1px solid var(--bdr);border-radius:18px;padding:2rem;
  display:flex;gap:1.25rem;align-items:flex-start;transition:all .22s;
}
.fw-card:hover{border-color:var(--em-bdr);transform:translateX(4px);background:var(--em-dim)}
.fw-ico{width:52px;height:52px;border-radius:13px;background:var(--em-dim);border:1px solid var(--em-bdr);display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;color:var(--em-lt)}
.fw-ico i{font-size:1.25rem;line-height:1}
.fw-title{font-family:'Outfit',sans-serif;font-size:1rem;font-weight:800;margin-bottom:.4rem}
.fw-desc{font-size:.845rem;color:var(--muted-lt);line-height:1.65}

/* ══════════════════════════════
   PRICING
══════════════════════════════ */
#pricing{padding:100px 5%}
.price-inner{max-width:1280px;margin:0 auto}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:4rem}

.price-card{
  background:var(--ink-2);border:1px solid var(--bdr);border-radius:22px;
  overflow:hidden;transition:all .3s;position:relative;
}
.price-card:hover{transform:translateY(-6px);box-shadow:0 24px 64px rgba(0,0,0,.4)}
.price-card.featured{border-color:var(--em-bdr);transform:scale(1.03)}
.price-card.featured:hover{transform:scale(1.03) translateY(-6px)}

.pc-band{height:4px}
.pc-band.standard{background:linear-gradient(90deg,#3B82F6,#6366F1)}
.pc-band.pro{background:linear-gradient(90deg,var(--em),var(--gold-lt))}
.pc-band.premium{background:linear-gradient(90deg,var(--gold),#F59E0B)}

.pc-body{padding:2rem}
.pc-badge{display:inline-block;font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.22rem .7rem;border-radius:100px;border:1px solid;margin-bottom:1rem}
.standard .pc-badge{background:var(--blue-dim);border-color:var(--blue-bdr);color:#60A5FA}
.pro .pc-badge{background:var(--em-dim);border-color:var(--em-bdr);color:var(--em-lt)}
.premium .pc-badge{background:var(--gold-dim);border-color:var(--gold-bdr);color:var(--gold-lt)}
.featured .pc-badge{background:var(--em);border-color:var(--em-lt);color:#fff}

.pc-name{font-family:'Outfit',sans-serif;font-size:1.2rem;font-weight:800;margin-bottom:.35rem}
.pc-price-row{display:flex;align-items:baseline;gap:.35rem;margin-bottom:.25rem}
.pc-amount{font-family:'Outfit',sans-serif;font-size:2rem;font-weight:900;line-height:1}
.pc-currency{font-size:.75rem;color:var(--muted-lt);align-self:flex-end;padding-bottom:.2rem}
.pc-period{font-size:.75rem;color:var(--muted-lt)}
.pc-desc{font-size:.815rem;color:var(--muted-lt);margin-bottom:1.5rem;line-height:1.55}

.pc-features{display:flex;flex-direction:column;gap:.5rem;margin-bottom:2rem}
.pc-feat{display:flex;align-items:center;gap:.7rem;font-size:.83rem;padding:.4rem 0}
.pc-feat-ico{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.6rem;flex-shrink:0}
.pc-feat-ico i{font-size:.6rem;line-height:1}
.pc-feat.ok .pc-feat-ico{background:var(--em-dim);color:var(--em-lt)}
.pc-feat.na .pc-feat-ico{background:var(--surface-bg);color:var(--muted)}
.pc-feat.ok{color:var(--white)}
.pc-feat.na{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(255,255,255,.1)}

.pc-cta{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem}

/* integration card */
.integration-card{
  margin-top:2rem;background:var(--ink-2);border:1px solid var(--gold-bdr);border-radius:22px;padding:2.5rem;
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;
}
.integ-left h3{font-family:'Outfit',sans-serif;font-size:1.3rem;font-weight:800;margin-bottom:.65rem}
.integ-left .lead{max-width:380px;font-size:.9rem;margin-bottom:1.5rem}
.integ-price{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.35rem}
.integ-amount{font-family:'Outfit',sans-serif;font-size:2.4rem;font-weight:900;color:var(--gold-lt)}
.integ-label{font-size:.82rem;color:var(--muted-lt)}
.integ-note{font-size:.77rem;color:var(--muted);margin-bottom:1.5rem}
.integ-items{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.integ-item{display:flex;align-items:center;gap:.6rem;font-size:.8rem;color:var(--muted-lt);padding:.5rem;background:var(--ink-3);border:1px solid var(--bdr);border-radius:8px}
.integ-ico{font-size:.9rem;flex-shrink:0;color:var(--gold-lt)}
.integ-ico i{font-size:.95rem;line-height:1}

/* ══════════════════════════════
   WHY PERFOMIA
══════════════════════════════ */
#why{padding:100px 5%;background:var(--ink-2);border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr)}
.why-inner{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.why-points{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}
.why-point{display:flex;gap:1.1rem;padding:1.1rem 1.25rem;background:var(--ink-3);border:1px solid var(--bdr);border-radius:13px;transition:all .2s}
.why-point:hover{border-color:var(--em-bdr);transform:translateX(5px);background:var(--em-dim)}
.wp-ico{width:44px;height:44px;border-radius:11px;background:var(--em-dim);border:1px solid var(--em-bdr);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;color:var(--em-lt)}
.wp-ico i{font-size:1.05rem;line-height:1}
.wp-title{font-size:.92rem;font-weight:700;margin-bottom:.25rem}
.wp-desc{font-size:.8rem;color:var(--muted-lt);line-height:1.55}

/* screen mockup right */
.why-visual{position:relative}
.wv-laptop{
  background:var(--ink-3);border:1px solid var(--bdr);border-radius:14px;overflow:hidden;
  box-shadow:0 24px 72px rgba(0,0,0,.5);
}
.wv-laptop-bar{height:34px;background:var(--ink-4);display:flex;align-items:center;gap:.45rem;padding:0 1rem;border-bottom:1px solid var(--bdr)}
.wvlb-dot{width:9px;height:9px;border-radius:50%}
.wv-laptop-screen{height:300px}
.wv-laptop-screen .img-ph{border-radius:0;border:none;height:100%}
.wv-chip{position:absolute;background:rgba(4,13,18,.92);backdrop-filter:blur(12px);border:1px solid var(--em-bdr);border-radius:10px;padding:.6rem .9rem;pointer-events:none}
.wvc1{top:-14px;right:-14px;animation:floatY 3.2s ease-in-out infinite}
.wvc2{bottom:-14px;left:-14px;animation:floatY 2.8s ease-in-out infinite .8s}
.wv-chip-label{font-size:.52rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--muted-lt);display:flex;align-items:center;gap:.35rem}
.wv-chip-label i{font-size:.7rem;line-height:1}
.wv-chip-val{font-family:'Outfit',sans-serif;font-size:.82rem;font-weight:700;margin-top:.1rem}
.wv-chip-val.green{color:var(--em-lt)}
.wv-chip-val.gold{color:var(--gold-lt)}
.wv-chip-val i{font-size:.8rem;line-height:1;margin-right:.2rem}

/* ══════════════════════════════
   SCREENSHOTS GALLERY
══════════════════════════════ */
#gallery{padding:100px 5%}
.gal-inner{max-width:1280px;margin:0 auto}
.gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:4rem}
.gal-item{border-radius:16px;overflow:hidden;border:1px solid var(--bdr);transition:all .28s;cursor:pointer}
.gal-item:hover{transform:translateY(-5px);border-color:var(--em-bdr);box-shadow:0 20px 56px rgba(0,0,0,.4)}
.gal-item.wide{grid-column:span 2}
.gal-frame{height:260px}
.gal-item.wide .gal-frame{height:260px}
.gal-frame .img-ph{height:100%;border-radius:0;border:none}
.gal-cap{padding:.85rem 1rem;background:var(--ink-2);border-top:1px solid var(--bdr)}
.gal-cap-title{font-size:.8rem;font-weight:600;margin-bottom:.15rem}
.gal-cap-sub{font-size:.67rem;color:var(--muted-lt)}

/* ══════════════════════════════
   FINAL CTA
══════════════════════════════ */
#cta-final{padding:100px 5%;position:relative;overflow:hidden;text-align:center}
.cta-ambient{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 70% at 50% 50%,rgba(5,150,105,.12) 0%,transparent 65%),
             radial-gradient(ellipse 40% 40% at 90% 10%,rgba(217,119,6,.07) 0%,transparent 55%)}
.cta-grid-lines{position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(5,150,105,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(5,150,105,.05) 1px,transparent 1px);
  background-size:56px 56px;mask-image:radial-gradient(ellipse 80% 70% at 50% 50%,black 20%,transparent 80%)}
.cta-inner{max-width:820px;margin:0 auto;position:relative;z-index:1}
.cta-inner h2{font-size:clamp(2.2rem,4vw,3.2rem);margin-bottom:1.1rem}
.cta-inner .lead{max-width:560px;margin:0 auto 3rem}
.cta-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-bottom:2.5rem}
.cta-guarantee{display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap}
.cta-g-item{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--muted-lt)}

/* ══════════════════════════════
   FOOTER STRIP
══════════════════════════════ */
#footer-strip{padding:50px 5%;background:var(--ink-2);border-top:1px solid var(--bdr)}
.fs-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.fs-brand{display:flex;align-items:center;gap:.85rem}
.fs-logo{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--em),#047857);display:flex;align-items:center;justify-content:center;font-family:'Outfit',sans-serif;font-size:.9rem;font-weight:900;color:#fff}
.fs-name{font-family:'Outfit',sans-serif;font-size:1.1rem;font-weight:900}
.fs-name span{color:var(--em-lt)}
.fs-tag{font-size:.72rem;color:var(--muted)}
.fs-contacts{display:flex;gap:1.5rem;flex-wrap:wrap}
.fs-c{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--muted-lt);transition:color .2s}
.fs-c:hover{color:var(--white)}
.fs-c-ico{width:28px;height:28px;background:var(--em-dim);border:1px solid var(--em-bdr);border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:.65rem;flex-shrink:0;color:var(--em-lt)}
.fs-c-ico i{font-size:.7rem;line-height:1}

.nav-ghost-link{
  padding:.6rem 1.25rem;
  border-radius:8px;
  font-size:.82rem;
  color:var(--white);
}
.nav-ghost-link i{font-size:.9rem;line-height:1}

footer .foot-bot,
#footer-strip,
.fs-tag,
.foot-left,
.foot-left a,
.foot-links a{
  color:var(--white);
}

.foot-left,
.foot-left a,
.foot-links a{
  opacity:.92;
}

.foot-left a:hover,
.foot-links a:hover,
.nav-back:hover{
  opacity:1;
}

footer{background:var(--ink-2);border-top:1px solid var(--bdr);padding:1.75rem 5%}
.foot-bot{max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.foot-left{font-size:.77rem;color:var(--muted)}
.foot-left a{color:var(--muted);transition:color .2s}.foot-left a:hover{color:var(--white)}
.foot-links{display:flex;gap:1.5rem}
.foot-links a{font-size:.77rem;color:var(--muted);transition:color .2s}.foot-links a:hover{color:var(--white)}

/* ── RESPONSIVE ── */
@media(max-width:1100px){
  .hero-inner,.prob-layout,.why-inner{grid-template-columns:1fr;gap:3rem}
  .impact-grid{grid-template-columns:repeat(3,1fr)}
  .fw-grid,.price-grid{grid-template-columns:1fr}
  .price-card.featured{transform:none}
  .integration-card{grid-template-columns:1fr}
  .case-stats{grid-template-columns:1fr 1fr 1fr}
  .gal-item.wide{grid-column:span 1}
  .feat-modules{grid-template-columns:1fr}
}
@media(max-width:640px){
  .dm-kpi-row,.dm-chart-row{grid-template-columns:1fr 1fr}
  .impact-grid{grid-template-columns:1fr 1fr}
  .gal-grid{grid-template-columns:1fr}
  .integ-items{grid-template-columns:1fr}
  .fs-inner,.fs-contacts{flex-direction:column;text-align:center}
  .cta-guarantee{flex-direction:column;gap:.75rem}
}