﻿:root{
  --sky:        #84ACCE;
  --sky-l:      #A8C6DE;
  --sky-ll:     #C8DDE9;
  --sky-lll:    #E0EEF5;
  --sky-pale:   #EFF6FA;
  --teal:       #466365;
  --teal2:      #355052;
  --teal3:      #274040;
  --teal-l:     rgba(70,99,101,0.10);
  --teal-line:  rgba(70,99,101,0.20);
  --orange:     #FF9248;
  --orange2:    #F07830;
  --orange3:    #D96018;
  --orange-l:   rgba(255,146,72,0.15);
  --orange-line: rgba(255,146,72,0.30);
  --cream:      #F4F7BE;
  --cream2:     #E8EBA8;
  --cream3:     #D8DC88;
  --cream-l:    rgba(244,247,190,0.15);
  --cream-line: rgba(244,247,190,0.28);
  --white:      #FFFFFF;
  --card:       rgba(255,255,255,0.80);
  --card-h:     rgba(255,255,255,0.96);
  --border:     rgba(70,99,101,0.16);
  --border-l:   rgba(255,255,255,0.30);
  --sh-s: 0 2px 14px rgba(70,99,101,0.12);
  --sh-m: 0 8px 36px rgba(70,99,101,0.16);
  --sh-l: 0 20px 60px rgba(70,99,101,0.20);
  --font: "Plus Jakarta Sans", sans-serif;
  --ease: cubic-bezier(0.4,0,0.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--sky);color:var(--teal);line-height:1.65;overflow-x:hidden}
a{text-decoration:none;color:inherit}
button{font-family:var(--font);cursor:pointer;border:none;background:none}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--sky-l)}
::-webkit-scrollbar-thumb{background:var(--orange);border-radius:2px}
::selection{background:var(--orange-l);color:var(--teal)}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}
.theme-icon{
  width:1.25em;height:1.25em;display:inline-block;vertical-align:-.2em;
  fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
  flex-shrink:0;
}

/* =====================================================
   ANIMATED GEOMETRIC BACKGROUND
   ===================================================== */
.geo-bg{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
}
/* Each shape */
.g{position:absolute;will-change:transform}

/* KEYFRAMES */
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-28px)}}
@keyframes floatY2{0%,100%{transform:translateY(0)}50%{transform:translateY(22px)}}
@keyframes spinSlow{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes spinSlowR{from{transform:rotate(0deg)}to{transform:rotate(-360deg)}}
@keyframes pulse{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.15);opacity:1}}
@keyframes driftX{0%,100%{transform:translateX(0) rotate(12deg)}50%{transform:translateX(22px) rotate(12deg)}}
@keyframes driftX2{0%,100%{transform:translateX(0) rotate(-20deg)}50%{transform:translateX(-18px) rotate(-20deg)}}
@keyframes floatDiag{0%,100%{transform:translate(0,0) rotate(45deg)}50%{transform:translate(14px,-18px) rotate(45deg)}}
@keyframes floatDiag2{0%,100%{transform:translate(0,0) rotate(20deg)}50%{transform:translate(-12px,16px) rotate(20deg)}}
@keyframes morph{0%,100%{border-radius:60% 40% 30% 70%/60% 30% 70% 40%}50%{border-radius:30% 60% 70% 40%/50% 60% 30% 60%}}
@keyframes orbit{0%{transform:rotate(0deg) translateX(60px) rotate(0deg)}100%{transform:rotate(360deg) translateX(60px) rotate(-360deg)}}

/* SHAPE DEFINITIONS */
/* ---- large spinning outline circles ---- */
.g-circle-xl{
  width:380px;height:380px;border-radius:50%;
  border:1.5px solid rgba(244,247,190,0.14);
  animation:spinSlow 40s linear infinite;
}
.g-circle-xl::before{
  content:"";position:absolute;inset:30px;border-radius:50%;
  border:1px dashed rgba(255,146,72,0.12);
  animation:spinSlowR 28s linear infinite;
}

.g-circle-lg{
  width:260px;height:260px;border-radius:50%;
  border:1px solid rgba(244,247,190,0.16);
  animation:spinSlowR 32s linear infinite;
}

.g-circle-md{
  width:140px;height:140px;border-radius:50%;
  border:1.5px solid rgba(255,146,72,0.18);
  animation:spinSlow 22s linear infinite;
}
.g-circle-md::after{
  content:"";position:absolute;inset:18px;border-radius:50%;
  border:1px solid rgba(244,247,190,0.15);
}

/* ---- triangles ---- */
.g-tri{
  width:0;height:0;
  border-left:36px solid transparent;
  border-right:36px solid transparent;
  border-bottom:62px solid rgba(244,247,190,0.12);
  animation:floatY 7s ease-in-out infinite;
}
.g-tri-sm{
  width:0;height:0;
  border-left:20px solid transparent;
  border-right:20px solid transparent;
  border-bottom:34px solid rgba(255,146,72,0.14);
  animation:floatY2 5.5s ease-in-out infinite;
}
.g-tri-out{
  width:0;height:0;
  border-left:44px solid transparent;
  border-right:44px solid transparent;
  border-bottom:76px solid transparent;
  filter:drop-shadow(0 0 0 1px rgba(244,247,190,0.14));
  position:relative;
}
.g-tri-out::before{
  content:"";position:absolute;
  border-left:36px solid transparent;
  border-right:36px solid transparent;
  border-bottom:62px solid rgba(244,247,190,0.10);
  top:14px;left:-36px;
}

/* ---- squares / diamonds ---- */
.g-sq{
  width:70px;height:70px;
  border:1.5px solid rgba(244,247,190,0.15);
  animation:driftX 8s ease-in-out infinite;
}
.g-sq-solid{
  width:44px;height:44px;
  background:rgba(255,146,72,0.10);
  animation:driftX2 6s ease-in-out infinite;
}
.g-diamond{
  width:56px;height:56px;
  border:1.5px solid rgba(244,247,190,0.18);
  transform:rotate(45deg);
  animation:floatDiag 9s ease-in-out infinite;
}
.g-diamond-sm{
  width:32px;height:32px;
  background:rgba(244,247,190,0.10);
  transform:rotate(45deg);
  animation:floatDiag2 6.5s ease-in-out infinite;
}
.g-diamond-orange{
  width:42px;height:42px;
  border:1.5px solid rgba(255,146,72,0.18);
  transform:rotate(45deg);
  animation:floatDiag 11s ease-in-out infinite;
}

/* ---- hexagon (CSS clip-path) ---- */
.g-hex{
  width:72px;height:80px;
  background:rgba(244,247,190,0.10);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  animation:floatY 10s ease-in-out infinite;
}
.g-hex-outline{
  width:90px;height:100px;
  background:rgba(255,146,72,0.08);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  animation:floatY2 8s ease-in-out infinite;
}

/* ---- cross / plus ---- */
.g-cross{
  position:relative;width:40px;height:40px;
  animation:spinSlow 18s linear infinite;
}
.g-cross::before,.g-cross::after{
  content:"";position:absolute;background:rgba(244,247,190,0.14);border-radius:2px;
}
.g-cross::before{width:100%;height:25%;top:37.5%;left:0}
.g-cross::after{width:25%;height:100%;top:0;left:37.5%}

.g-cross-orange{
  position:relative;width:30px;height:30px;
  animation:spinSlowR 14s linear infinite;
}
.g-cross-orange::before,.g-cross-orange::after{
  content:"";position:absolute;background:rgba(255,146,72,0.16);border-radius:2px;
}
.g-cross-orange::before{width:100%;height:26%;top:37%;left:0}
.g-cross-orange::after{width:26%;height:100%;top:0;left:37%}

/* ---- dots ---- */
.g-dot{
  border-radius:50%;
  background:rgba(244,247,190,0.22);
  animation:pulse 4s ease-in-out infinite;
}
.g-dot-orange{
  border-radius:50%;
  background:rgba(255,146,72,0.20);
  animation:pulse 3s ease-in-out infinite;
}

/* ---- blob / morph ---- */
.g-blob{
  width:120px;height:120px;
  background:rgba(244,247,190,0.07);
  animation:morph 12s ease-in-out infinite, floatY 8s ease-in-out infinite;
}
.g-blob-orange{
  width:90px;height:90px;
  background:rgba(255,146,72,0.07);
  animation:morph 9s ease-in-out infinite reverse, floatY2 6s ease-in-out infinite;
}

/* ---- arc / partial ring ---- */
.g-arc{
  width:100px;height:100px;border-radius:50%;
  border:2px solid transparent;
  border-top-color:rgba(244,247,190,0.18);
  border-right-color:rgba(244,247,190,0.10);
  animation:spinSlow 12s linear infinite;
}
.g-arc-orange{
  width:70px;height:70px;border-radius:50%;
  border:1.5px solid transparent;
  border-top-color:rgba(255,146,72,0.22);
  border-left-color:rgba(255,146,72,0.12);
  animation:spinSlowR 9s linear infinite;
}

/* ---- orbiting dot ---- */
.g-orbit-host{
  position:absolute;
  animation:spinSlow 20s linear infinite;
}
.g-orbit-dot{
  width:10px;height:10px;border-radius:50%;
  background:rgba(255,146,72,0.30);
  position:absolute;top:-5px;left:calc(50% - 5px);
}

/* POSITION & DELAY OVERRIDES */
/* Top-right cluster */
.p-tr1{top:-60px;right:-60px;animation-delay:0s}
.p-tr2{top:80px;right:60px;animation-delay:-3s}
.p-tr3{top:180px;right:-20px;animation-delay:-6s}
.p-tr4{top:280px;right:100px;animation-delay:-2s}
.p-tr5{top:40px;right:240px;animation-delay:-8s}
/* Bottom-left cluster */
.p-bl1{bottom:-40px;left:-40px;animation-delay:-5s}
.p-bl2{bottom:100px;left:60px;animation-delay:-2s}
.p-bl3{bottom:220px;left:-10px;animation-delay:-9s}
.p-bl4{bottom:60px;left:200px;animation-delay:-4s}
/* Top-left */
.p-tl1{top:100px;left:60px;animation-delay:-7s}
.p-tl2{top:280px;left:120px;animation-delay:-1s}
.p-tl3{top:180px;left:-20px;animation-delay:-11s}
/* Bottom-right */
.p-br1{bottom:200px;right:80px;animation-delay:-6s}
.p-br2{bottom:80px;right:200px;animation-delay:-3s}
/* Center scatter */
.p-c1{top:35%;left:12%;animation-delay:-4s}
.p-c2{top:55%;right:15%;animation-delay:-8s}
.p-c3{top:20%;left:40%;animation-delay:-5s}
.p-c4{top:70%;left:55%;animation-delay:-2s}
.p-c5{top:45%;right:38%;animation-delay:-10s}
.p-c6{top:60%;left:25%;animation-delay:-6s}

/* =====================================================
   LAYOUT
   ===================================================== */
.wrap{max-width:1240px;margin:0 auto;padding:0 48px;position:relative;z-index:1}
section{padding:96px 0;position:relative;z-index:1}

/* =====================================================
   TYPOGRAPHY
   ===================================================== */
.eyebrow{
  display:inline-flex;align-items:center;gap:11px;
  font-size:.69rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:var(--orange);margin-bottom:16px;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--orange);border-radius:1px;flex-shrink:0}
h1,h2,h3,h4{font-weight:800;letter-spacing:-.03em;line-height:1.08;color:var(--teal)}
h1{font-size:clamp(2.8rem,6vw,5rem)}
h2{font-size:clamp(1.9rem,4vw,2.9rem)}
h3{font-size:1.05rem;line-height:1.3}
.orange-span{color:var(--orange)}
.cream-span{color:var(--cream2)}
.stroke-span{-webkit-text-stroke:1.5px var(--teal);color:transparent}
.lead{font-size:.98rem;color:var(--teal2);line-height:1.82;font-weight:300;max-width:520px}

/* =====================================================
   BUTTONS
   ===================================================== */
.btn-orange{
  display:inline-flex;align-items:center;gap:8px;
  background:linear-gradient(135deg,var(--orange) 0%,var(--orange2) 100%);
  color:var(--white);padding:13px 28px;border-radius:8px;
  font-size:.81rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  box-shadow:0 4px 18px rgba(255,146,72,0.35);transition:all .25s var(--ease);
}
.btn-orange:hover{background:linear-gradient(135deg,var(--orange2),var(--orange3));transform:translateY(-2px);box-shadow:0 8px 28px rgba(255,146,72,0.48)}
.btn-outline-teal{
  display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:var(--teal);padding:12px 28px;border-radius:8px;
  font-size:.81rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  border:1.5px solid var(--border);transition:all .25s var(--ease);
}
.btn-outline-teal:hover{background:var(--teal);color:var(--cream);transform:translateY(-2px)}
.btn-cream{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--cream);color:var(--teal);padding:12px 28px;border-radius:8px;
  font-size:.81rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  transition:all .25s var(--ease);box-shadow:0 4px 14px rgba(244,247,190,0.28);
}
.btn-cream:hover{background:var(--cream2);transform:translateY(-2px)}
.btn-outline-cream{
  display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:var(--cream);padding:12px 28px;border-radius:8px;
  font-size:.81rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  border:1.5px solid var(--cream-line);transition:all .25s var(--ease);
}
.btn-outline-cream:hover{background:var(--cream-l);border-color:var(--cream);transform:translateY(-2px)}

/* =====================================================
   NAV
   ===================================================== */
nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  background:var(--teal);
  border-bottom:1px solid rgba(244,247,190,0.12);
  box-shadow:0 4px 24px rgba(70,99,101,0.30);
}
.nav-inner{
  max-width:1240px;margin:0 auto;padding:0 48px;
  height:68px;display:flex;align-items:center;justify-content:space-between;
}
.logo{display:flex;align-items:center;gap:12px}
.logo-mark{
  width:40px;height:40px;border-radius:8px;flex-shrink:0;
  background:linear-gradient(135deg,var(--orange) 0%,var(--orange2) 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:.82rem;font-weight:800;color:var(--white);
  box-shadow:0 4px 12px rgba(255,146,72,0.38);
}
.logo-text strong{display:block;font-size:.87rem;font-weight:700;color:var(--cream);letter-spacing:-.01em}
.logo-text span{font-size:.6rem;color:rgba(244,247,190,0.5);font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.nav-list{display:flex;align-items:center;list-style:none}
.nav-list>li{position:relative}
.nav-list>li>a{
  display:flex;align-items:center;gap:4px;padding:7px 12px;border-radius:7px;
  font-size:.77rem;font-weight:500;color:rgba(244,247,190,0.58);
  letter-spacing:.03em;text-transform:uppercase;transition:all .2s;
}
.nav-list>li>a:hover{color:var(--cream);background:rgba(244,247,190,0.10)}
.nav-ch{width:13px;height:13px;transition:transform .2s;opacity:.55}
.nav-list>li:hover .nav-ch{transform:rotate(180deg)}
.nav-drop{
  position:absolute;top:calc(100% + 6px);left:-8px;min-width:210px;
  background:var(--teal2);border:1px solid rgba(244,247,190,0.14);border-radius:12px;
  padding:7px;box-shadow:0 12px 40px rgba(70,99,101,0.38);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:all .2s var(--ease);z-index:100;
}
.nav-list>li:hover .nav-drop{opacity:1;visibility:visible;transform:translateY(0)}
.nav-drop a{
  display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:8px;
  font-size:.78rem;font-weight:500;color:rgba(244,247,190,0.58);transition:all .18s;
}
.nav-icon{width:16px;height:16px;color:var(--orange)}
.nav-drop a:hover{background:var(--orange-l);color:var(--orange)}
.hbg{display:none;flex-direction:column;gap:5px;padding:7px;background:none;border:none}
.hbg span{display:block;width:20px;height:1.5px;background:var(--cream);border-radius:1px;transition:all .3s}

/* =====================================================
   HERO
   ===================================================== */
#hero{
  min-height:100vh;padding-top:68px;display:flex;align-items:center;
  background:transparent;position:relative;
}
.hero-inner{
  max-width:1240px;margin:0 auto;padding:72px 48px;
  display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;
  position:relative;z-index:2;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--orange-l);border:1px solid var(--orange-line);
  padding:6px 14px;border-radius:100px;margin-bottom:22px;
  font-size:.71rem;font-weight:700;color:var(--orange);letter-spacing:.07em;text-transform:uppercase;
}
.hero-badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange);flex-shrink:0;box-shadow:0 0 0 3px rgba(255,146,72,0.22)}
.h1-line2{display:block;-webkit-text-stroke:1.5px var(--teal);color:transparent}
.hero-p{font-size:.98rem;color:var(--teal2);line-height:1.82;font-weight:300;margin-bottom:34px;max-width:450px}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:44px}
.hero-stats{
  display:grid;grid-template-columns:repeat(4,1fr);
  border:1.5px solid var(--border-l);border-radius:14px;
  background:var(--card);backdrop-filter:blur(14px);overflow:hidden;
  box-shadow:var(--sh-s);
}
.hstat{padding:16px 10px;text-align:center;border-right:1px solid var(--border-l)}
.hstat:last-child{border-right:none}
.hstat-n{font-size:1.5rem;font-weight:800;color:var(--teal);letter-spacing:-.04em;line-height:1;display:block}
.hstat-n em{font-style:normal;color:var(--orange)}
.hstat-l{font-size:.63rem;color:var(--teal2);margin-top:4px;font-weight:500;opacity:.7}
.hero-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.htile{
  background:var(--card);backdrop-filter:blur(14px);
  border:1.5px solid var(--border-l);border-radius:18px;
  padding:22px 20px;cursor:pointer;transition:all .28s var(--ease);
  box-shadow:var(--sh-s);
}
.htile:hover{background:var(--teal);border-color:var(--teal);transform:translateY(-5px) rotate(-1deg);box-shadow:var(--sh-l)}
.htile:hover h3,.htile:hover p{color:var(--cream)}
.htile:hover .htile-ico{color:var(--orange)}
.htile.feat{background:var(--teal);border-color:transparent;box-shadow:var(--sh-m)}
.htile.feat h3{color:var(--cream)}.htile.feat p{color:rgba(244,247,190,0.5)}
.htile.feat:hover{background:var(--teal2);transform:translateY(-5px) rotate(-1deg)}
.htile-ico{width:34px;height:34px;margin-bottom:10px;display:block;color:var(--orange);stroke-width:1.7}
.htile h3{font-size:.88rem;font-weight:700;color:var(--teal);margin-bottom:3px;transition:color .28s}
.htile p{font-size:.73rem;color:var(--teal2);line-height:1.4;transition:color .28s}

/* =====================================================
   SERVICES
   ===================================================== */
#services{background:rgba(255,255,255,0.55);backdrop-filter:blur(10px);padding:0}
.snav{
  position:sticky;top:68px;z-index:50;
  background:var(--teal);border-bottom:1px solid rgba(244,247,190,0.12);
}
.snav-inner{max-width:1240px;margin:0 auto;padding:0 48px;display:flex;overflow-x:auto;scrollbar-width:none}
.snav-inner::-webkit-scrollbar{display:none}
.stab{
  flex-shrink:0;padding:17px 24px;
  font-size:.74rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:rgba(244,247,190,0.4);background:none;border:none;
  border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .22s;
}
.stab.on{color:var(--orange);border-bottom-color:var(--orange)}
.stab:hover:not(.on){color:var(--cream)}
.spanel{display:none}.spanel.on{display:block}
.svc-strip{display:grid;grid-template-columns:1fr 1fr;min-height:440px;border-bottom:1px solid var(--border)}
.svc-l{padding:56px 52px;display:flex;flex-direction:column;justify-content:space-between;background:var(--white)}
.svc-r{
  background:var(--sky);border-left:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
  padding:38px;
}
.svc-r::before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;border:1px solid rgba(255,146,72,0.18);top:50%;left:50%;transform:translate(-50%,-50%);animation:spinSlow 20s linear infinite}
.svc-r::after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;border:1px solid rgba(70,99,101,0.15);top:50%;left:50%;transform:translate(-50%,-50%);animation:spinSlowR 14s linear infinite}
.svc-big-ico{width:190px;height:190px;line-height:1;opacity:.16;user-select:none;animation:floatY 6s ease-in-out infinite;color:var(--teal)}
.svc-big-ico .theme-icon{width:100%;height:100%;stroke-width:1.1}
.svc-visual-img{
  position:relative;z-index:2;width:min(100%,520px);aspect-ratio:4/3;
  object-fit:cover;border-radius:16px;border:1.5px solid rgba(244,247,190,0.28);
  box-shadow:0 22px 55px rgba(39,64,64,0.24);
  animation:floatY 7s ease-in-out infinite;
}
.svc-visual-badge{
  position:absolute;z-index:3;right:34px;bottom:34px;width:72px;height:72px;border-radius:18px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--orange),var(--orange2));color:var(--white);
  box-shadow:0 16px 34px rgba(255,146,72,0.34);
}
.svc-visual-badge .theme-icon{width:34px;height:34px;stroke-width:1.7}
.svc-tag{display:inline-flex;align-items:center;gap:7px;width:fit-content;margin-bottom:14px;background:var(--orange-l);border:1px solid var(--orange-line);padding:5px 12px;border-radius:4px;font-size:.66rem;font-weight:700;color:var(--orange2);letter-spacing:.1em;text-transform:uppercase}
.svc-h{font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:800;letter-spacing:-.035em;line-height:1.05;color:var(--teal);margin-bottom:14px}
.svc-h span{color:var(--orange)}
.svc-p{font-size:.88rem;color:var(--teal2);line-height:1.8;font-weight:300;margin-bottom:24px;max-width:380px}
.svc-pills{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:28px}
.spill{padding:5px 11px;border-radius:4px;font-size:.68rem;font-weight:600;background:var(--teal-l);border:1px solid var(--teal-line);color:var(--teal);letter-spacing:.02em}
.scards{display:grid;grid-template-columns:repeat(4,1fr)}
.scard{
  padding:34px 30px;border-right:1px solid var(--border);border-top:1px solid var(--border);
  background:var(--white);transition:all .28s;position:relative;overflow:hidden;
}
.scard:last-child{border-right:none}
.scard:hover{background:var(--teal);transform:translateY(-3px)}
.scard:hover h3{color:var(--cream)}.scard:hover p{color:rgba(244,247,190,0.60)}
.scard:hover .feat-list li{color:rgba(244,247,190,0.60)}.scard:hover .feat-list li::before{background:var(--orange)}
.scard:hover .sc-num{color:rgba(244,247,190,0.06)}
.scard::after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange),var(--orange2));transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.scard:hover::after{transform:scaleX(1)}
.sc-ico{width:32px;height:32px;margin-bottom:14px;display:block;color:var(--orange);stroke-width:1.65}
.scard:hover .sc-ico{color:var(--orange)}
.sc-num{position:absolute;bottom:12px;right:16px;font-size:4rem;font-weight:800;letter-spacing:-.06em;line-height:1;color:rgba(70,99,101,0.05);transition:color .28s}
.scard h3{font-size:.93rem;color:var(--teal);margin-bottom:7px;transition:color .28s}
.scard p{font-size:.78rem;color:var(--teal2);line-height:1.68;margin-bottom:13px;font-weight:300;transition:color .28s}
.feat-list{list-style:none;display:flex;flex-direction:column;gap:5px}
.feat-list li{font-size:.75rem;color:var(--teal2);padding-left:15px;position:relative;line-height:1.5;transition:color .28s}
.feat-list li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:1.5px;background:var(--orange);border-radius:1px}
.rsa-block{background:var(--teal);display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:56px;padding:64px 52px}
.rsa-block .eyebrow{color:rgba(244,247,190,0.45)}.rsa-block .eyebrow::before{background:rgba(244,247,190,0.3)}
.rsa-h{font-size:clamp(1.9rem,3.5vw,2.7rem);font-weight:800;letter-spacing:-.035em;line-height:1.05;color:var(--cream);margin-bottom:12px}
.rsa-p{font-size:.88rem;color:rgba(244,247,190,0.52);line-height:1.8;margin-bottom:26px;font-weight:300}
.rsa-feats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.rfeat{background:rgba(244,247,190,0.07);border:1px solid rgba(244,247,190,0.14);border-radius:10px;padding:16px 10px;text-align:center;transition:all .22s}
.rfeat:hover{background:var(--orange-l);border-color:var(--orange-line);transform:translateY(-3px)}
.rfeat-i{margin:0 auto 8px;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,146,72,0.10);color:var(--orange)}
.rfeat-i .theme-icon{width:18px;height:18px;stroke-width:1.8}
.rfeat-l{font-size:.68rem;color:rgba(244,247,190,0.52);line-height:1.3}

/* HOW IT WORKS */
#how{background:transparent}
.how-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:52px}
.hstep{
  background:var(--card);backdrop-filter:blur(14px);
  border:1.5px solid var(--border-l);border-radius:18px;
  padding:34px 26px;position:relative;overflow:hidden;transition:all .28s;
  box-shadow:var(--sh-s);
}
.hstep:hover{background:var(--teal);border-color:var(--teal);transform:translateY(-5px) rotate(1deg);box-shadow:var(--sh-l)}
.hstep:hover h3{color:var(--cream)}.hstep:hover p{color:rgba(244,247,190,0.60)}.hstep:hover .hstep-big{color:rgba(244,247,190,0.05)}
.hstep-num{
  width:38px;height:38px;border-radius:9px;margin-bottom:18px;
  background:linear-gradient(135deg,var(--orange),var(--orange2));
  display:flex;align-items:center;justify-content:center;
  font-size:.8rem;font-weight:800;color:var(--white);
  box-shadow:0 4px 12px rgba(255,146,72,0.32);
}
.hstep h3{font-size:.95rem;color:var(--teal);margin-bottom:8px;transition:color .28s}
.hstep p{font-size:.78rem;color:var(--teal2);line-height:1.7;font-weight:300;transition:color .28s}
.hstep-big{position:absolute;bottom:10px;right:14px;font-size:4rem;font-weight:800;color:rgba(70,99,101,0.06);letter-spacing:-.06em;line-height:1;transition:color .28s}

/* TESTIMONIALS */
#testimonials{background:var(--teal)}
#testimonials .eyebrow{color:var(--cream2)}#testimonials .eyebrow::before{background:var(--cream2)}
.tslider-wrap{overflow:hidden;margin-top:48px}
.tslider{
  --visible-cards:4;--slide-gap:18px;
  display:flex;gap:var(--slide-gap);transition:transform .42s var(--ease);will-change:transform;
}
.tcard{
  flex:0 0 calc((100% - (var(--slide-gap) * (var(--visible-cards) - 1))) / var(--visible-cards));
  min-width:0;min-height:100%;display:flex;flex-direction:column;
  background:rgba(244,247,190,0.08);backdrop-filter:blur(8px);
  border:1px solid rgba(244,247,190,0.18);border-radius:18px;
  padding:24px;transition:all .28s;
}
.tcard:hover{background:rgba(244,247,190,0.14);border-color:var(--orange);transform:translateY(-5px) rotate(-0.5deg)}
.tq{font-size:2.6rem;color:var(--orange);line-height:.85;margin-bottom:9px;font-family:Georgia,serif;opacity:.8}
.tstars{color:var(--orange);font-size:.8rem;letter-spacing:3px;margin-bottom:14px}
.ttext{font-size:.78rem;color:rgba(244,247,190,0.70);line-height:1.72;margin-bottom:20px;font-style:italic;font-weight:300}
.tauthor{display:flex;align-items:center;gap:11px;padding-top:16px;border-top:1px solid rgba(244,247,190,0.14)}
.tcard .tauthor{margin-top:auto}
.tav{width:40px;height:40px;border-radius:50%;flex-shrink:0;background:var(--orange);color:var(--white);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem}
.tname{font-weight:700;font-size:.85rem;color:var(--cream)}.trole{font-size:.7rem;color:rgba(244,247,190,0.45)}
.tctrl{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:30px}
.tarr{width:40px;height:40px;border-radius:50%;background:rgba(244,247,190,0.08);border:1.5px solid rgba(244,247,190,0.20);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--cream);transition:all .2s}
.tarr .theme-icon{width:18px;height:18px}
.tarr:hover{background:var(--orange);color:var(--white);border-color:var(--orange);transform:scale(1.1)}
.tdots{display:flex;gap:7px}
.tdot{width:7px;height:7px;border-radius:4px;background:rgba(244,247,190,0.20);cursor:pointer;transition:all .3s}
.tdot.on{width:22px;background:var(--orange)}

/* ABOUT */
#about{background:rgba(255,255,255,0.50);backdrop-filter:blur(10px)}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start;margin-top:52px}
.vals{display:flex;flex-direction:column}
.val{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--border)}
.val:last-child{border-bottom:none}
.val-n{font-size:1.5rem;font-weight:800;color:rgba(255,146,72,0.28);letter-spacing:-.04em;line-height:1;flex-shrink:0;min-width:34px}
.val h4{font-size:.87rem;font-weight:700;color:var(--teal);margin-bottom:3px}
.val p{font-size:.78rem;color:var(--teal2);line-height:1.65;font-weight:300}
.aboxes{display:flex;flex-direction:column;gap:14px}
.abox{background:var(--card);backdrop-filter:blur(12px);border:1.5px solid var(--border-l);border-radius:18px;padding:26px;box-shadow:var(--sh-s)}
.abox.accent{border-color:var(--orange-line);background:rgba(255,146,72,0.08)}
.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.astat{padding:16px;background:rgba(132,172,206,0.15);border:1px solid var(--border-l);border-radius:10px;text-align:center}
.astat-n{font-size:1.7rem;font-weight:800;letter-spacing:-.04em;color:var(--teal);line-height:1}
.astat-n em{font-style:normal;color:var(--orange)}
.astat-l{font-size:.64rem;color:var(--teal2);margin-top:4px;letter-spacing:.06em;text-transform:uppercase;opacity:.7}
.cred-list{list-style:none;display:flex;flex-direction:column;gap:0;margin-top:12px}
.cred-list li{display:flex;align-items:center;gap:10px;font-size:.79rem;color:var(--teal2);padding:8px 0;border-bottom:1px solid var(--border)}
.cred-list li:last-child{border-bottom:none}
.cred-list li::before{content:"";width:18px;height:18px;border-radius:50%;flex-shrink:0;background:var(--orange-l);border:1px solid var(--orange-line);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='%23F07830' d='M11 3L5.5 9.5 3 7 2 8l3.5 3.5 6.5-7z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:11px}

/* FAQ */
#faq{background:transparent}
.faq-layout{display:grid;grid-template-columns:1fr 2fr;gap:64px;margin-top:52px;align-items:start}
.faq-sticky{position:sticky;top:100px}
.faq-sticky p{font-size:.86rem;color:var(--teal2);line-height:1.8;margin-top:12px;margin-bottom:24px;font-weight:300}
.faq-list{display:flex;flex-direction:column;gap:8px}
.fi{background:var(--card);backdrop-filter:blur(12px);border:1.5px solid var(--border-l);border-radius:14px;overflow:hidden;transition:all .24s;box-shadow:var(--sh-s)}
.fi.open{border-color:var(--orange);box-shadow:0 4px 20px rgba(255,146,72,0.16)}
.fq{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;cursor:pointer;gap:12px;font-weight:600;font-size:.86rem;color:var(--teal);user-select:none;transition:all .2s}
.fi.open .fq{color:var(--orange2)}
.fq-ico{width:23px;height:23px;border-radius:50%;border:1.5px solid var(--border);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.66rem;color:var(--teal2);transition:all .3s}
.fi.open .fq-ico{background:var(--orange);border-color:var(--orange);color:var(--white);transform:rotate(45deg)}
.fa{max-height:0;overflow:hidden;transition:max-height .34s var(--ease)}
.fa-body{padding:0 20px 16px;font-size:.8rem;color:var(--teal2);line-height:1.8;font-weight:300}

/* CONTACT */
#contact{padding:0}
.contact-top{background:var(--teal);padding:64px 48px;text-align:center;position:relative;overflow:hidden}
.contact-top .eyebrow{color:rgba(244,247,190,0.45)}.contact-top .eyebrow::before{background:rgba(244,247,190,0.3)}
.contact-top h2{color:var(--cream);margin-bottom:10px}
.contact-top p{color:rgba(244,247,190,0.52);font-size:.9rem;line-height:1.8;max-width:440px;margin:0 auto;font-weight:300}
.contact-body{display:grid;grid-template-columns:1fr 1.7fr;max-width:1240px;margin:0 auto;border:1.5px solid var(--border);border-top:none}
.contact-l{padding:48px 40px;border-right:1.5px solid var(--border);background:var(--teal)}
.contact-l h3{font-size:1rem;font-weight:700;color:var(--cream);margin-bottom:6px}
.contact-l>p{font-size:.8rem;color:rgba(244,247,190,0.50);line-height:1.7;margin-bottom:28px;font-weight:300}
.ci-list{display:flex;flex-direction:column;gap:18px}
.ci-row{display:flex;align-items:flex-start;gap:12px}
.ci-ico{width:36px;height:36px;border-radius:8px;flex-shrink:0;background:rgba(244,247,190,0.10);border:1px solid rgba(244,247,190,0.18);display:flex;align-items:center;justify-content:center;color:var(--orange)}
.ci-ico .theme-icon{width:18px;height:18px}
.ci-row h4{font-size:.67rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--orange);margin-bottom:3px}
.ci-row p{font-size:.77rem;color:rgba(244,247,190,0.50);line-height:1.55}
.contact-r{padding:48px 40px;background:var(--sky-pale)}
.contact-r h3{font-size:.98rem;font-weight:700;color:var(--teal);margin-bottom:22px}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ff{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:5px}
.field label{font-size:.66rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--teal2)}
.field input,.field select,.field textarea{padding:10px 12px;background:var(--card);border:1.5px solid var(--border-l);border-radius:8px;font-family:var(--font);font-size:.83rem;color:var(--teal);transition:all .2s;outline:none;box-shadow:var(--sh-s)}
.field input::placeholder,.field textarea::placeholder{color:rgba(70,99,101,0.35)}
.field select{color:var(--teal2)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--orange);background:var(--white);box-shadow:0 0 0 3px rgba(255,146,72,0.12)}
.field textarea{resize:vertical;min-height:86px}
.dynf{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fsub{margin-top:6px;width:100%;padding:13px;background:linear-gradient(135deg,var(--orange),var(--orange2));color:var(--white);border:none;border-radius:8px;font-family:var(--font);font-size:.79rem;font-weight:700;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;transition:all .25s;box-shadow:0 4px 16px rgba(255,146,72,0.30)}
.fsub:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(255,146,72,0.42)}
.fok{display:none;text-align:center;padding:44px 20px}
.fok .fo-ico{width:54px;height:54px;margin:0 auto 12px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--orange-l);color:var(--orange)}
.fok .fo-ico .theme-icon{width:30px;height:30px;stroke-width:1.7}
.fok h3{font-size:1.2rem;font-weight:800;color:var(--teal);margin-bottom:7px}
.fok p{font-size:.84rem;color:var(--teal2)}

/* CHATBOT */
.cb-btn{position:fixed;bottom:28px;right:28px;z-index:999;width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--orange),var(--orange2));color:var(--white);border:none;cursor:pointer;box-shadow:0 6px 22px rgba(255,146,72,0.42);display:flex;align-items:center;justify-content:center;transition:all .3s}
.cb-btn .theme-icon{width:23px;height:23px;stroke-width:1.9}
.cb-btn:hover{transform:scale(1.1) rotate(10deg)}
.cb-win{position:fixed;bottom:90px;right:28px;z-index:998;width:335px;background:var(--sky-pale);border:1.5px solid var(--border-l);border-radius:18px;box-shadow:var(--sh-l);display:none;flex-direction:column;overflow:hidden;max-height:460px}
.cb-win.open{display:flex;animation:slideUp .22s ease}
.cb-hd{background:var(--teal);padding:14px 17px;display:flex;align-items:center;gap:11px}
.cb-av{width:32px;height:32px;border-radius:50%;background:rgba(244,247,190,0.12);display:flex;align-items:center;justify-content:center;color:var(--orange)}
.cb-av .theme-icon{width:18px;height:18px}
.cb-hd-t p:first-child{font-weight:700;font-size:.83rem;color:var(--cream)}
.cb-hd-t p:last-child{font-size:.66rem;color:rgba(244,247,190,0.44)}
.cb-online{margin-left:auto;display:flex;align-items:center;gap:5px;font-size:.66rem;color:rgba(244,247,190,0.44)}
.cdot{width:6px;height:6px;background:#4ADE80;border-radius:50%;animation:pulseDot 2s infinite}
@keyframes pulseDot{0%,100%{opacity:1}50%{opacity:.3}}
.cb-msgs{flex:1;overflow-y:auto;padding:13px;display:flex;flex-direction:column;gap:9px;background:var(--sky-ll)}
.cm{max-width:87%;padding:9px 13px;border-radius:13px;font-size:.78rem;line-height:1.55}
.cm.bot{background:var(--white);color:var(--teal);border:1px solid var(--border);border-radius:4px 13px 13px 13px;align-self:flex-start}
.cm.usr{background:var(--teal);color:var(--cream);font-weight:600;border-radius:13px 13px 4px 13px;align-self:flex-end}
.copts{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.copt{background:var(--white);color:var(--teal);border:1.5px solid var(--border);padding:5px 11px;border-radius:15px;font-size:.72rem;font-weight:600;cursor:pointer;transition:all .18s;font-family:var(--font)}
.copt:hover{background:var(--orange);color:var(--white);border-color:var(--orange);transform:scale(1.05)}
.cb-inp{padding:10px 12px;border-top:1px solid var(--border);display:flex;gap:8px;background:var(--white)}
.cb-input{flex:1;padding:8px 12px;background:var(--sky-pale);border:1.5px solid var(--border);border-radius:20px;font-family:var(--font);font-size:.78rem;color:var(--teal);outline:none;transition:all .2s}
.cb-input::placeholder{color:rgba(70,99,101,0.38)}
.cb-input:focus{border-color:var(--orange)}
.cb-send{width:34px;height:34px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,var(--orange),var(--orange2));color:var(--white);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.cb-send .theme-icon{width:16px;height:16px}
.cb-send:hover{transform:scale(1.1)}

/* FOOTER */
footer{background:var(--teal2);padding:60px 48px 26px}
.footer-inner{max-width:1240px;margin:0 auto}
.footer-top{display:grid;grid-template-columns:2.5fr 1fr 1fr 1fr;gap:48px;padding-bottom:40px;border-bottom:1px solid rgba(244,247,190,0.10);margin-bottom:24px}
.fbrand p{font-size:.79rem;color:rgba(244,247,190,0.35);line-height:1.75;margin-top:14px;max-width:270px;font-weight:300}
.fcol h4{font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,247,190,0.25);margin-bottom:13px}
.fcol ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.fcol ul a{font-size:.79rem;color:rgba(244,247,190,0.38);transition:color .2s;font-weight:300}
.fcol ul a:hover{color:var(--orange)}
.footer-btm{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.footer-btm p{font-size:.71rem;color:rgba(244,247,190,0.22)}
.fbadges{display:flex;gap:7px;flex-wrap:wrap}
.fbadge{padding:4px 10px;border-radius:3px;font-size:.61rem;font-weight:600;border:1px solid rgba(255,146,72,0.25);color:rgba(255,146,72,0.55);letter-spacing:.07em;text-transform:uppercase}

@keyframes slideUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* RESPONSIVE */
@media(max-width:1100px){
  .wrap,.nav-inner,.snav-inner,.hero-inner,.footer-inner{padding-left:28px;padding-right:28px}
  section{padding:72px 0}
  .hero-inner{grid-template-columns:1fr;gap:40px;padding:56px 28px}
  .hero-tiles{max-width:420px}
  .svc-strip{grid-template-columns:1fr}.svc-r{min-height:280px;padding:28px}.svc-l{padding:40px 28px}
  .svc-visual-img{max-height:300px}.svc-visual-badge{right:24px;bottom:24px;width:58px;height:58px;border-radius:14px}.svc-visual-badge .theme-icon{width:28px;height:28px}
  .scards{grid-template-columns:1fr 1fr}
  .how-grid{grid-template-columns:1fr 1fr}
  .about-grid{grid-template-columns:1fr;gap:40px}
  .tslider{--visible-cards:2}
  .faq-layout{grid-template-columns:1fr;gap:28px}.faq-sticky{position:static}
  .contact-body{grid-template-columns:1fr}.contact-l{border-right:none;border-bottom:1.5px solid rgba(244,247,190,0.12)}
  .footer-top{grid-template-columns:1fr 1fr;gap:28px}
  .rsa-block{grid-template-columns:1fr;gap:32px;padding:44px 28px}
  .contact-top{padding:52px 28px}
}
@media(max-width:768px){
  .nav-inner{padding:0 20px}
  .nav-list{display:none;flex-direction:column;position:absolute;top:68px;left:0;right:0;background:var(--teal);border-bottom:1px solid rgba(244,247,190,0.12);padding:12px 16px;gap:2px;box-shadow:var(--sh-l);z-index:900}
  .nav-list.open{display:flex}.hbg{display:flex}
  .nav-drop{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;background:rgba(244,247,190,0.05);display:none;margin-top:2px}
  .nav-list>li.open .nav-drop{display:block}
  .how-grid,.scards{grid-template-columns:1fr}
  .fg,.dynf{grid-template-columns:1fr}
  .tslider{--visible-cards:1}
  .cb-win{width:calc(100vw - 32px);right:16px}
  .footer-top{grid-template-columns:1fr}
  footer{padding:44px 24px 22px}
  .contact-l,.contact-r{padding:32px 22px}
  .rsa-feats{grid-template-columns:1fr 1fr}
}

