:root{
  color-scheme: light;

  /* ---- grayscale spine ---- */
  --carbon: #181925;
  --paper: #ffffff;
  --linen: #fafafa;
  --mist: #f5f5f5;
  --fog: #e8e8e8;
  --ash: #999999;
  --graphite: #666666;

  /* ---- single brand accent: orange ---- */
  --brand: #ff7a33;
  --brand-dark: #e35f1a;
  --brand-wash: #fff1e8;

  /* ---- one typeface, weight carries hierarchy ---- */
  --font: 'WF Visual Sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: 'WF Visual Sans', var(--font);

  --radius-md: 2px;
  --radius-lg: 4px;
  --radius-xl: 6px;
  --radius-full: 3px;
  --max-w: 1320px;

  --shadow-1: rgba(24,25,37,0.06) 0px 1px 1px 0px, rgba(24,25,37,0.05) 0px 0px 0px 1px;
  --shadow-2: rgba(24,25,37,0.07) 0px 1px 3px 0px, rgba(24,25,37,0.08) 0px 8px 20px -6px;
  --vortex-opacity: 0;
}

@font-face{
  font-family:'WF Visual Sans';
  src:url('fonts/WFVisualSansVF.woff2') format('woff2');
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (min-width:901px){ html{zoom:0.82;} }
body{
  margin:0;
  background:
    radial-gradient(ellipse 420px 190px at -8% 0%, rgba(255,122,51,0.22), transparent 72%),
    radial-gradient(ellipse 520px 220px at 108% -8%, rgba(255,122,51,0.2), transparent 74%),
    linear-gradient(180deg, #f8fbfd 0, var(--paper) 210px);
  color:var(--carbon);
  font-family:var(--font);
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;left:0;right:0;top:0;height:180px;z-index:85;pointer-events:none;
  opacity:var(--vortex-opacity);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  background:linear-gradient(180deg, rgba(255,255,255,0.34), rgba(255,255,255,0));
  mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,0.86) 28%, rgba(0,0,0,0.42) 62%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,0.86) 28%, rgba(0,0,0,0.42) 62%, transparent 100%);
}
body::after{
  content:"";position:fixed;left:0;right:0;top:0;height:110px;z-index:86;pointer-events:none;
  opacity:var(--vortex-opacity);
  background:linear-gradient(180deg, rgba(255,255,255,0.52), rgba(255,255,255,0));
  mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,0.52) 55%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,0.52) 55%, transparent 100%);
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--brand);color:#fff;}
.wrap{max-width:var(--max-w);margin:0 auto;padding:0 32px;position:relative;}
@media (max-width:720px){ .wrap{padding:0 20px;} }
h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-0.045em;}
.ico{flex-shrink:0;}
[data-icon],svg.ico{
  width:1em;
  height:1em;
  display:block;
  stroke-width:2.15;
}

/* ================= REVEAL (subtle, no theatrics) ================= */
.reveal, .reveal-stagger{opacity:0;transform:translateY(14px);transition:opacity .6s ease, transform .6s ease;}
.reveal.in, .reveal-stagger.in{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-stagger{opacity:1;transform:none;transition:none;}
}

/* ================= LOGO ================= */
.logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:19px;letter-spacing:-0.02em;color:var(--carbon);}
.logo-img{height:38px;width:auto;display:block;}
.logo-mark{position:relative;display:inline-flex;}
.logo-mark .u-wrap{position:relative;display:inline-block;}
.logo-mark .udots{position:absolute;top:-8px;left:50%;transform:translateX(-50%);display:flex;gap:3px;}
.logo-mark .udots i{width:4.5px;height:4.5px;border-radius:50%;background:var(--brand);display:block;font-style:normal;}
.logo small{display:block;font-size:9px;letter-spacing:0.12em;color:var(--ash);font-weight:600;margin-top:1px;}

/* ================= NAV ================= */
header{
  position:sticky;top:0;z-index:100;
  padding:12px 0 8px;
  background:transparent;
  border-bottom:0;
  transition:box-shadow .25s ease;
}
header.scrolled{box-shadow:none;}
header.on-dark .nav{
  background:rgba(7,17,27,0.76);
  border-color:rgba(255,255,255,0.1);
  box-shadow:0 20px 46px rgba(0,0,0,0.22);
}
header.on-dark .navlinks a{color:rgba(255,255,255,0.72);}
header.on-dark .navlinks a:hover{color:#fff;background:rgba(255,255,255,0.08);}
header.on-dark .navlinks a.active{color:#fff;background:rgba(255,122,51,0.18);}
header.on-dark .nav-search{color:rgba(255,255,255,0.72);}
header.on-dark .nav-search:hover{color:#fff;background:rgba(255,255,255,0.08);}
header.on-dark .nav-divider{background:rgba(255,255,255,0.16);}
header.on-dark .logo-img{filter:brightness(0) invert(1);}
.nav{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:82px;
  background:rgba(255,255,255,0.82);border:1px solid rgba(232,232,232,0.85);
  border-radius:18px;box-shadow:0 18px 38px rgba(24,25,37,0.08);
  backdrop-filter:blur(18px);padding:0 28px;
}
.navlinks{display:flex;gap:10px;align-items:center;justify-self:start;}
.navlinks a{
  font-size:14px;font-weight:500;color:var(--graphite);padding:8px 14px;border-radius:var(--radius-full);
  transition:color .2s ease, background .2s ease;
}
.navlinks a:hover{color:var(--carbon);background:rgba(245,245,245,0.9);}
.navlinks a.active{color:var(--carbon);background:#f4efeb;}
.nav .logo{justify-self:center;}
.nav-actions{display:flex;align-items:center;gap:18px;justify-self:end;}
.nav-search{
  width:34px;height:34px;border:0;background:transparent;color:#5b6d7e;display:flex;align-items:center;
  justify-content:center;padding:0;cursor:pointer;border-radius:50%;transition:background .2s ease,color .2s ease;
}
.nav-search svg{width:18px;height:18px;}
.nav-search:hover{background:var(--mist);color:var(--carbon);}
.nav-divider{width:1px;height:30px;background:var(--fog);display:block;}
.nav-cta{
  font-size:14px;font-weight:500;color:#fff;background:var(--brand);
  padding:13px 25px;border-radius:var(--radius-full);display:inline-flex;align-items:center;gap:8px;
  box-shadow:0 10px 20px rgba(255,122,51,0.22);transition:background .2s ease, transform .2s ease;
}
.nav-cta:hover{background:var(--brand-dark);transform:translateY(-1px);}
@media (max-width:900px){
  header{padding:10px 0 6px;}
  .nav{grid-template-columns:auto 1fr auto;height:70px;padding:0 16px;border-radius:16px;}
  .navlinks{display:none;}
  .nav .logo{justify-self:start;}
  .logo-img{height:34px;}
  .nav-actions{gap:10px;}
  .nav-search,.nav-divider{display:none;}
  .nav-cta{padding:11px 18px;font-size:13px;}
}

/* ================= BUTTONS ================= */
.btn-primary{
  display:inline-block;background:var(--brand);color:#fff;font-weight:500;font-size:15px;
  padding:13px 26px;border-radius:var(--radius-full);box-shadow:var(--shadow-1);
  transition:background .2s ease, transform .15s ease;
}
.btn-primary:hover{background:var(--brand-dark);}
.btn-ghost{
  display:inline-block;background:transparent;color:var(--graphite);font-weight:500;font-size:15px;
  padding:13px 24px;border-radius:var(--radius-full);border:1px solid var(--fog);
  transition:border-color .2s ease, color .2s ease;
}
.btn-ghost:hover{border-color:var(--ash);color:var(--carbon);}

/* ================= HERO ================= */
.hero{padding:90px 0 84px;text-align:center;}
.hero.hero--service{padding:76px 0 64px;}
.hero-inner{max-width:760px;margin:0 auto;}
.chip{
  display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:var(--graphite);
  border:1px solid var(--fog);padding:6px 14px;border-radius:var(--radius-full);margin-bottom:26px;background:#fff;
}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--brand);}
.chip.tag{color:var(--brand-dark);background:var(--brand-wash);border-color:transparent;font-weight:600;}

.hero h1{
  font-size:clamp(34px, 4.6vw, 56px);line-height:1.08;font-weight:600;letter-spacing:-0.03em;
  margin:0 0 20px;color:var(--carbon);
}
.hero h1 em{font-style:normal;color:var(--brand);}
.hero p.lead{font-size:18px;line-height:1.6;color:var(--graphite);max-width:560px;margin:0 auto 34px;font-weight:400;}
.hero-actions{display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap;margin-bottom:0;}
.hero-actions.left{justify-content:flex-start;}

.hero .desc{color:var(--graphite);font-size:17px;line-height:1.65;max-width:620px;margin:0 auto 22px;}
.hero .desc .highlight{color:var(--carbon);font-weight:600;}
.chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px;justify-content:center;}
.chip-row .chip{margin-bottom:0;}

.service-hero{
  padding:82px 0 74px;text-align:left;overflow:hidden;
  background:
    radial-gradient(circle at 12% 8%, rgba(255,122,51,0.12), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(24,25,37,0.08), transparent 28%),
    linear-gradient(180deg, rgba(255,250,247,0.82), rgba(255,255,255,0));
}
.service-hero .hero-inner{max-width:var(--max-w);display:grid;grid-template-columns:minmax(0,0.95fr) minmax(390px,1.05fr);gap:56px;align-items:center;}
.service-hero .chip-row{justify-content:flex-start;}
.service-hero .hero-actions{justify-content:flex-start;}
.service-hero h1{font-size:clamp(42px,5.2vw,70px);font-weight:760;line-height:0.98;max-width:660px;margin-bottom:22px;}
.service-hero .desc{margin-left:0;margin-right:0;max-width:580px;}
.service-hero-art{min-height:420px;position:relative;}
.service-hero-art::before{
  content:"";position:absolute;inset:22px 20px;border-radius:42% 58% 55% 45%;
  background:linear-gradient(145deg, rgba(255,122,51,0.12), rgba(24,25,37,0.05));
  transform:rotate(-12deg);
}
.service-orb{position:absolute;right:92px;top:28px;width:170px;height:170px;border-radius:40px;background:linear-gradient(135deg,#ff8b33,#ff6f2d);transform:rotate(13deg);box-shadow:0 28px 55px rgba(255,122,51,0.22);}
.service-chat-card,.service-metric-card,.service-pipeline,.service-browser,.service-score-card,.service-wire-card,.service-social-phone,.service-social-card,.service-social-icons{
  position:absolute;z-index:1;box-shadow:0 28px 60px rgba(24,25,37,0.14);
}
.service-chat-card{left:42px;top:82px;width:300px;border-radius:24px;background:#121d2b;color:#fff;padding:30px;transform:rotate(-7deg);}
.service-chat-card span{font-size:13px;color:rgba(255,255,255,0.62);}
.service-chat-card strong{display:block;font-size:28px;line-height:1.05;margin:12px 0;}
.service-chat-card p{font-size:14px;line-height:1.5;color:rgba(255,255,255,0.72);margin:0;}
.service-metric-card{right:54px;bottom:72px;width:150px;height:138px;border-radius:22px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(8deg);}
.service-metric-card strong{font-size:42px;color:var(--brand);line-height:1;}
.service-metric-card span{font-size:13px;color:var(--graphite);margin-top:8px;}
.service-pipeline{left:78px;bottom:38px;width:260px;height:74px;border-radius:20px;background:rgba(255,255,255,0.86);display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:18px;}
.service-pipeline i{border-radius:12px;background:linear-gradient(180deg,#fff1e8,#e9edf2);}
.service-hero-flow{
  margin-top:-102px;
  padding-top:184px;
  color:#fff;
  background:
    radial-gradient(circle at 70% 18%, rgba(255,122,51,0.22), transparent 28%),
    radial-gradient(circle at 92% 72%, rgba(255,122,51,0.16), transparent 30%),
    linear-gradient(135deg, #07111b 0%, #0b1724 44%, #08111c 100%);
}
.service-hero-flow .hero-inner{grid-template-columns:minmax(0,0.95fr) minmax(520px,1.05fr);}
.service-hero-flow h1{max-width:670px;color:#fff;font-weight:680;letter-spacing:-0.055em;}
.service-hero-flow h1 em{color:var(--brand);font-style:normal;font-weight:760;}
.service-hero-flow .desc{color:rgba(255,255,255,0.76);font-size:clamp(18px,1.65vw,23px);line-height:1.35;max-width:690px;}
.flow-kicker{
  display:inline-flex;background:rgba(255,122,51,0.13);color:var(--brand);border:1px solid rgba(255,122,51,0.2);
  padding:9px 18px;margin-bottom:20px;font-weight:700;font-size:15px;
}
.flow-channel-row{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 30px;max-width:620px;}
.flow-channel-row span{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.08);color:rgba(255,255,255,0.86);font-size:15px;font-weight:560;
  box-shadow:0 12px 28px rgba(0,0,0,0.12);
}
.flow-channel-row svg{width:18px;height:18px;color:var(--brand);}
.service-hero-flow .btn-ghost{color:#fff;border-color:rgba(255,122,51,0.42);background:rgba(255,255,255,0.03);}
.service-hero-flow .btn-ghost:hover{border-color:var(--brand);color:#fff;}
.flow-play{display:inline-flex;align-items:center;gap:10px;}
.flow-play svg{width:20px;height:20px;color:#fff;}
.flow-automation-art{min-height:560px;isolation:isolate;}
.flow-automation-art::before{display:none;}
.flow-automation-art::after{
  display:none;
}
.flow-beams{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible;}
.flow-beams path{fill:none;stroke:rgba(255,122,51,0.42);stroke-width:1.5;stroke-dasharray:5 7;animation:beamFlow 1s linear infinite;}
.flow-beams .beam-dot{fill:var(--brand);filter:drop-shadow(0 0 5px rgba(255,122,51,0.95));}
@keyframes beamFlow{ to{ stroke-dashoffset:-24; } }
.automation-phone{
  position:absolute;left:172px;top:6px;width:262px;min-height:420px;padding:18px 18px 16px;
  background:linear-gradient(180deg,#101c2b,#08111b);border:8px solid rgba(255,255,255,0.12);
  box-shadow:0 38px 80px rgba(0,0,0,0.35), 0 0 0 1px rgba(255,255,255,0.08) inset;
  transform:rotate(6deg);z-index:3;
}
.phone-status{display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:12px;font-weight:700;margin-bottom:18px;}
.phone-status svg{width:15px;height:15px;}
.automation-profile{display:flex;align-items:center;gap:12px;color:#fff;margin-bottom:18px;}
.automation-profile img{width:44px;height:44px;background:#fff;padding:8px;object-fit:contain;}
.automation-profile strong{display:block;font-size:22px;letter-spacing:-0.02em;}
.automation-profile span{display:block;color:rgba(255,255,255,0.62);font-size:12px;line-height:1.15;}
.auto-bubble{font-size:13px;line-height:1.28;padding:11px 13px;margin-bottom:9px;box-shadow:0 10px 24px rgba(0,0,0,0.14);}
.auto-bubble.incoming{max-width:174px;background:rgba(255,255,255,0.09);color:rgba(255,255,255,0.9);}
.auto-bubble.outgoing{max-width:190px;margin-left:auto;background:#0f8d66;color:#fff;}
.typing-dots{display:inline-flex;align-items:center;gap:4px;padding:12px 14px;background:rgba(255,255,255,0.09);width:fit-content;margin-bottom:9px;}
.typing-dots span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,0.65);animation:typingBounce 1.1s ease-in-out infinite;}
.typing-dots span:nth-child(2){animation-delay:.15s;}
.typing-dots span:nth-child(3){animation-delay:.3s;}
@keyframes typingBounce{0%,60%,100%{transform:translateY(0);opacity:.5;}30%{transform:translateY(-4px);opacity:1;}}
.quick-actions{display:grid;gap:8px;margin-top:18px;}
.quick-actions span{display:flex;align-items:center;gap:9px;padding:10px 12px;background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.88);font-size:13px;}
.quick-actions svg{width:16px;height:16px;color:#fff;}
.phone-input{display:flex;align-items:center;justify-content:space-between;margin-top:18px;color:rgba(255,255,255,0.72);}
.phone-input span{font-size:28px;font-weight:240;line-height:1;}
.phone-input svg{width:18px;height:18px;}
.flow-app{
  position:absolute;width:64px;height:64px;display:flex;align-items:center;justify-content:center;z-index:4;
  color:#fff;box-shadow:0 24px 46px rgba(0,0,0,0.28);will-change:transform;animation:iconFloat 4.6s ease-in-out infinite;
}
.flow-app::before{
  content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid rgba(255,255,255,0.55);
  animation:pulseRing 2.6s ease-out infinite;
}
@keyframes pulseRing{0%{transform:scale(1);opacity:.6;}100%{transform:scale(1.6);opacity:0;}}
@keyframes iconFloat{0%,100%{translate:0 0;}50%{translate:0 -9px;}}
.flow-app svg{width:30px;height:30px;position:relative;z-index:1;}
.app-whatsapp{left:6px;top:30px;background:#10c764;transform:rotate(7deg);}
.app-instagram{left:0px;top:212px;background:linear-gradient(135deg,#7b2cff,#ff7a33 58%,#ffd747);transform:rotate(-5deg);animation-delay:-1.1s;}
.app-instagram::before{animation-delay:-0.8s;}
.app-messenger{left:26px;top:392px;background:linear-gradient(135deg,#0a78ff,#ff3ad4);transform:rotate(4deg);animation-delay:-2.2s;}
.app-messenger::before{animation-delay:-1.6s;}
.flow-orbit{position:absolute;z-index:1;border:1.5px solid rgba(255,122,51,0.38);border-left-color:transparent;border-bottom-color:transparent;will-change:transform;}
.orbit-one{left:150px;top:150px;width:94px;height:118px;animation:orbitSpin 20s linear infinite;}
.orbit-two{right:130px;top:270px;width:94px;height:136px;animation:orbitSpin 26s linear infinite reverse;}
@keyframes orbitSpin{to{transform:rotate(360deg);}}
.automation-events{position:absolute;right:0;top:26px;display:grid;gap:10px;width:246px;z-index:5;}
.automation-events div{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:38px 1fr;column-gap:12px;align-items:center;
  padding:14px 16px;background:rgba(18,22,31,0.82);border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 22px 48px rgba(0,0,0,0.22);backdrop-filter:blur(16px);
  transition:border-color .3s ease, box-shadow .3s ease, background .3s ease;
}
.automation-events div::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand);
  transform:scaleY(0);transform-origin:top;transition:transform .35s ease;
}
.automation-events div.is-active{
  border-color:rgba(255,122,51,0.5);background:rgba(255,122,51,0.1);
  box-shadow:0 0 0 1px rgba(255,122,51,0.35), 0 22px 48px rgba(255,122,51,0.16);
}
.automation-events div.is-active::before{transform:scaleY(1);}
.automation-events svg{grid-row:1 / 3;width:28px;height:28px;color:var(--brand);}
.automation-events strong{font-size:15px;color:#fff;}
.automation-events span{font-size:12.5px;color:rgba(255,255,255,0.58);margin-top:2px;}
.live-badge{
  position:absolute;left:0;bottom:14px;z-index:2;display:inline-flex;align-items:center;gap:9px;
  padding:10px 15px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);
  color:rgba(255,255,255,0.85);font-size:12.5px;font-weight:700;backdrop-filter:blur(10px);
}
.live-badge .dot{width:7px;height:7px;border-radius:50%;background:#33d17a;animation:liveDotPulse 1.8s ease-out infinite;}
@keyframes liveDotPulse{0%{box-shadow:0 0 0 0 rgba(51,209,122,0.6);}70%{box-shadow:0 0 0 9px rgba(51,209,122,0);}100%{box-shadow:0 0 0 0 rgba(51,209,122,0);}}
@media (prefers-reduced-motion: reduce){
  .flow-app,.flow-app::before,.flow-orbit,.live-badge .dot,.typing-dots span,.flow-beams path{animation:none;}
}
@media (max-width:1100px){
  .service-hero-flow .hero-inner{grid-template-columns:1fr;gap:28px;}
  .service-hero-art.flow-automation-art{min-height:520px;max-width:640px;width:100%;margin:0 auto;}
  .automation-phone{left:50%;transform:translateX(-50%) rotate(5deg);}
  .flow-app.app-whatsapp{left:6px;}
  .flow-app.app-instagram{left:0;}
  .flow-app.app-messenger{left:26px;}
  .automation-events{right:0;}
  .flow-beams{display:none;}
}
@media (max-width:720px){
  .service-hero-flow{padding-top:54px;}
  .flow-channel-row span{font-size:13px;padding:9px 11px;}
  .service-hero-art.flow-automation-art{min-height:640px;transform:none;margin-top:8px;}
  .automation-phone{top:0;width:245px;min-height:410px;padding:16px 15px;}
  .flow-app{width:56px;height:56px;}
  .flow-app svg{width:29px;height:29px;}
  .app-whatsapp{left:8px;top:70px;}
  .app-instagram{left:4px;top:220px;}
  .app-messenger{left:14px;top:370px;}
  .automation-events{left:0;right:0;top:454px;width:auto;grid-template-columns:1fr 1fr;gap:8px;}
  .automation-events div{padding:12px;grid-template-columns:28px 1fr;}
  .automation-events svg{width:22px;height:22px;}
  .automation-events strong{font-size:12.5px;}
  .automation-events span{font-size:11px;}
  .live-badge{display:none;}
  .flow-orbit{display:none;}
}
.service-browser{left:26px;top:58px;width:380px;border-radius:24px;background:#111821;padding:32px 12px 12px;transform:rotate(-5deg);overflow:hidden;}
.service-browser span{position:absolute;top:14px;width:8px;height:8px;border-radius:50%;background:#ff8b33;}
.service-browser span:nth-child(1){left:18px}.service-browser span:nth-child(2){left:32px;opacity:.55}.service-browser span:nth-child(3){left:46px;opacity:.32}
.service-browser img{height:230px;width:100%;object-fit:cover;border-radius:16px;}
.service-score-card{right:60px;top:94px;width:140px;height:140px;border-radius:24px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(11deg);}
.service-score-card strong{font-size:48px;color:var(--brand);line-height:1;}
.service-score-card span{font-size:13px;color:var(--graphite);}
.service-wire-card{right:98px;bottom:38px;width:220px;height:150px;border-radius:24px;background:repeating-linear-gradient(180deg,#fff 0 18px,#f3f5f7 18px 20px);border:1px solid var(--fog);transform:rotate(4deg);}
.service-social-phone{right:72px;top:34px;width:190px;height:330px;border-radius:34px;background:#111821;padding:9px;transform:rotate(10deg);overflow:hidden;}
.service-social-phone img{width:100%;height:100%;object-fit:cover;border-radius:25px;}
.service-social-card{left:58px;top:120px;width:210px;border-radius:26px;background:#121d2b;color:#fff;padding:30px;font-size:31px;line-height:1.05;transform:rotate(-9deg);}
.service-social-icons{right:34px;bottom:42px;width:170px;height:88px;border-radius:24px;background:#fff;display:flex;align-items:center;justify-content:center;gap:14px;transform:rotate(-4deg);}
.service-social-icons span{width:36px;height:36px;border-radius:11px;background:#fff1e8;color:var(--brand);display:flex;align-items:center;justify-content:center;font-weight:800;}

@media (max-width:900px){
  .service-hero .hero-inner{grid-template-columns:1fr;gap:34px;}
  .service-hero-art{min-height:360px;}
}
@media (max-width:640px){
  .service-hero{padding:56px 0 58px;}
  .service-hero-art{min-height:300px;transform:scale(.86);transform-origin:top center;margin-bottom:-42px;}
}

.hero-home{padding:68px 0 76px;text-align:left;overflow:hidden;}
.hero-home-inner{display:grid;grid-template-columns:minmax(0,0.92fr) minmax(430px,1.08fr);gap:42px;align-items:center;}
.hero-copy{position:relative;z-index:2;}
.hero-kicker{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:0.08em;color:var(--graphite);margin-bottom:16px;}
.hero-kicker span{width:24px;height:2px;background:var(--brand);display:block;}
.hero-home h1{font-size:clamp(40px,5vw,66px);line-height:0.96;font-weight:700;letter-spacing:-0.04em;margin:0 0 20px;color:var(--carbon);max-width:620px;}
.hero-title-soft{display:inline-block;font-size:0.72em;font-weight:300;}
.hero-title-tag{
  position:relative;display:inline-block;color:#fff;border-radius:14px;padding:0.01em 0.18em 0.08em;
  transform:rotate(-1deg);text-shadow:0 2px 0 rgba(0,0,0,0.08);isolation:isolate;
}
.hero-title-tag::before{
  content:"";position:absolute;inset:-0.02em -0.04em -0.04em;border-radius:16px;z-index:-2;
  background:
    linear-gradient(135deg,#ff8c3f,#ff6f2d 58%,#e95b1a);
  box-shadow:0 12px 24px rgba(255,122,51,0.28), inset 0 -5px 12px rgba(157,55,12,0.18), inset 0 4px 10px rgba(255,255,255,0.2);
}
.hero-title-tag::after{
  content:"";position:absolute;inset:0;border-radius:14px;z-index:-1;opacity:.34;
  background:
    repeating-linear-gradient(100deg, rgba(255,255,255,0.18) 0 1px, transparent 1px 7px),
    radial-gradient(ellipse at 20% 100%, rgba(0,0,0,0.16), transparent 42%);
  mix-blend-mode:soft-light;
}
.hero-home h1 em{font-style:normal;color:var(--brand);}
.hero-home p.lead{font-size:17px;line-height:1.62;color:var(--graphite);max-width:470px;margin:0 0 30px;font-weight:400;}
.hero-home .hero-actions{justify-content:flex-start;margin-bottom:48px;}
.hero-home .btn-primary{display:inline-flex;align-items:center;gap:8px;}
.hero-stats{display:flex;align-items:stretch;gap:0;}
.hero-stats div{padding:0 34px;border-left:1px solid var(--fog);}
.hero-stats div:first-child{border-left:0;padding-left:0;}
.hero-stats strong{display:block;font-size:24px;line-height:1;font-weight:800;color:var(--carbon);margin-bottom:6px;}
.hero-stats span{display:block;font-size:12px;color:var(--graphite);}
.hero-collage{position:relative;min-height:520px;perspective:1000px;transform:translateY(-300px);}
.collage-orbit{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform;}
.collage-card{position:absolute;border-radius:18px;box-shadow:0 24px 54px rgba(24,25,37,0.18);will-change:transform;overflow:hidden;}
.collage-card img{width:100%;height:100%;object-fit:cover;}
.collage-laptop{width:250px;height:170px;left:96px;top:10px;transform:rotate(-10deg);background:#12151b;padding:8px;z-index:2;}
.collage-social{width:138px;height:218px;right:150px;top:128px;transform:rotate(8deg);border:5px solid #fff;z-index:4;}
.collage-card-type{width:185px;height:165px;left:124px;top:190px;transform:rotate(-11deg);background:#142232;color:#fff;padding:30px 26px;display:flex;flex-direction:column;justify-content:center;font-size:24px;line-height:1.04;font-weight:500;z-index:5;}
.collage-card-brand{width:142px;height:142px;right:52px;top:58px;transform:rotate(12deg);background:linear-gradient(135deg,#ff8b33,#ff6f2d);display:flex;align-items:center;justify-content:center;color:#fff;font-size:58px;z-index:3;}
.collage-card-phone{width:154px;height:282px;right:42px;bottom:44px;transform:rotate(12deg);background:#10131a;border:8px solid #10131a;border-radius:26px;z-index:6;}
.phone-ui{position:relative;width:100%;height:100%;background:#fff;border-radius:18px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.phone-ui img{position:relative;z-index:2;width:84px;height:auto;}
.phone-glow{position:absolute;right:-18px;bottom:-18px;width:130px;height:130px;background:radial-gradient(circle,#ff7a33 0%,rgba(255,122,51,0.55) 34%,transparent 68%);filter:blur(2px);}
.collage-card-mini{width:104px;height:124px;left:278px;bottom:46px;transform:rotate(5deg);background:#fff;border:1px solid var(--fog);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;color:var(--carbon);z-index:7;}
.collage-card-mini span{font-size:13px;color:var(--graphite);}
.collage-card-mini strong{font-size:30px;color:var(--brand);}

.croods-scene{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform;}
.croods-scene::before{
  content:"";position:absolute;left:70px;right:16px;top:36px;bottom:32px;border-radius:42% 58% 50% 50%;
  background:linear-gradient(145deg, rgba(255,122,51,0.12), rgba(24,25,37,0.045));
  transform:rotate(-12deg);filter:blur(.2px);
}
.croods-blob{position:absolute;border-radius:32px;box-shadow:0 26px 60px rgba(24,25,37,0.08);will-change:transform;}
.blob-a{width:146px;height:146px;right:54px;top:42px;background:linear-gradient(135deg,#ff9347,#ff6f2d);transform:rotate(14deg);}
.blob-b{width:98px;height:98px;left:92px;bottom:64px;background:#181925;opacity:.95;transform:rotate(-12deg);}
.croods-character{position:absolute;right:80px;top:48px;width:360px;height:360px;z-index:4;filter:drop-shadow(0 34px 36px rgba(24,25,37,0.16));will-change:transform;}
.croods-panel{position:absolute;z-index:3;background:rgba(255,255,255,0.9);border:1px solid rgba(232,232,232,0.9);box-shadow:0 22px 48px rgba(24,25,37,0.11);backdrop-filter:blur(14px);will-change:transform;}
.panel-web{left:36px;top:78px;width:185px;height:138px;border-radius:24px;padding:22px;transform:rotate(-7deg);}
.panel-web span{display:inline-block;width:7px;height:7px;border-radius:50%;background:#ff7a33;margin-right:5px;opacity:.75;}
.panel-web strong{display:block;margin-top:20px;font-size:20px;line-height:1.08;color:var(--carbon);}
.panel-web i{display:block;margin-top:15px;width:80px;height:8px;border-radius:999px;background:#ffd8c6;}
.panel-flow{right:22px;bottom:78px;width:160px;height:128px;border-radius:26px;display:flex;flex-direction:column;justify-content:center;align-items:center;transform:rotate(8deg);}
.panel-flow strong{font-size:46px;line-height:1;color:var(--brand);}
.panel-flow span{font-size:13px;color:var(--graphite);margin-top:8px;}
.croods-chip{position:absolute;z-index:5;border-radius:999px;background:#fff;color:var(--carbon);border:1px solid var(--fog);box-shadow:0 16px 34px rgba(24,25,37,0.1);font-size:14px;font-weight:700;padding:12px 18px;will-change:transform;}
.chip-social{left:90px;top:250px;transform:rotate(-5deg);}
.chip-ads{right:84px;top:226px;background:#181925;color:#fff;transform:rotate(5deg);}

.doodle-scene{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform;}
.doodle-scene::before{
  content:"";position:absolute;left:70px;right:24px;top:22px;bottom:42px;border-radius:42% 58% 54% 46%;
  background:linear-gradient(145deg, rgba(255,122,51,0.15), rgba(24,25,37,0.05));
  transform:rotate(-10deg);
}
.open-doodle{
  position:absolute;right:54px;top:10px;width:390px;max-width:78%;z-index:4;
  filter:drop-shadow(0 34px 28px rgba(24,25,37,0.12));will-change:transform;
}
.doodle-blob{position:absolute;border-radius:34px;will-change:transform;box-shadow:0 24px 58px rgba(24,25,37,0.1);}
.doodle-blob-a{right:44px;top:42px;width:138px;height:138px;background:linear-gradient(135deg,#ff9448,#ff6f2d);transform:rotate(15deg);}
.doodle-blob-b{left:88px;bottom:66px;width:104px;height:104px;background:#181925;transform:rotate(-13deg);}
.doodle-card{
  position:absolute;z-index:5;display:flex;flex-direction:column;gap:4px;border-radius:22px;
  background:rgba(255,255,255,0.9);border:1px solid rgba(232,232,232,0.9);box-shadow:0 22px 48px rgba(24,25,37,0.11);
  backdrop-filter:blur(14px);padding:18px 20px;will-change:transform;animation:doodleFloat 4.5s ease-in-out infinite;
}
.doodle-card strong{font-size:19px;color:var(--carbon);}
.doodle-card span{font-size:13px;color:var(--graphite);white-space:nowrap;}
.doodle-card-web{left:38px;top:86px;transform:rotate(-6deg);}
.doodle-card-flow{right:36px;bottom:88px;transform:rotate(6deg);animation-delay:-1.4s;}
.doodle-card-social{left:112px;bottom:58px;background:#181925;color:#fff;transform:rotate(4deg);animation-delay:-2.6s;}
.doodle-card-social strong,.doodle-card-social span{color:#fff;}
@keyframes doodleFloat{
  0%,100%{translate:0 0;}
  50%{translate:0 -10px;}
}
.undraw-scene{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform;}
.undraw-scene::before{
  content:"";position:absolute;inset:36px 12px 54px 64px;border-radius:42% 58% 48% 52%;
  background:
    radial-gradient(circle at 72% 22%, rgba(255,122,51,0.18), transparent 30%),
    linear-gradient(145deg, rgba(255,122,51,0.08), rgba(24,25,37,0.04));
  transform:rotate(-10deg);
}
.undraw-hero{
  position:absolute;right:8px;top:8px;width:560px;max-width:96%;z-index:2;
  filter:drop-shadow(0 34px 36px rgba(24,25,37,0.12));will-change:transform;
}
.hero-photo-scene{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transform:translateY(-34px);}
.hero-photo{width:640px;max-width:112%;height:auto;display:block;}

/* ---- floating hero glow + chips ---- */
.hero-glow-blob{
  position:absolute;left:50%;top:38%;width:520px;height:420px;z-index:0;pointer-events:none;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse at center, rgba(255,122,51,0.24), rgba(255,122,51,0.06) 55%, transparent 72%);
  filter:blur(6px);
  animation:glowDrift 9s ease-in-out infinite;
}
@keyframes glowDrift{
  0%,100%{translate:0 0;scale:1;}
  50%{translate:0 -16px;scale:1.04;}
}
.hero-float-chip{
  position:absolute;z-index:6;display:flex;align-items:center;gap:10px;max-width:190px;
  padding:12px 15px;border-radius:16px;background:rgba(255,255,255,0.94);
  border:1px solid rgba(232,232,232,0.9);box-shadow:0 20px 40px rgba(24,25,37,0.16);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  font-size:12.5px;font-weight:700;color:var(--carbon);line-height:1.28;
  will-change:transform;animation:chipFloat 5s ease-in-out infinite;
}
.hero-float-chip svg{width:19px;height:19px;flex-shrink:0;}
.hero-float-chip .stat{font-size:17px;font-weight:800;line-height:1;margin-bottom:2px;}
.hero-float-chip .label{font-size:11.5px;color:var(--graphite);font-weight:600;}
@keyframes chipFloat{
  0%,100%{translate:0 0;}
  50%{translate:0 -12px;}
}
.chip-problem{color:#c23b1f;}
.chip-problem svg{color:#c23b1f;}
.chip-problem .stat{color:#c23b1f;}
.chip-drop{right:-10px;top:26px;animation-delay:-3s;}
.chip-wait{left:-16px;bottom:78px;animation-delay:-1.4s;}
.chip-solution{
  left:50%;bottom:-14px;margin-left:-97px;
  background:linear-gradient(135deg,#ff8b33,#ff6f2d);color:#fff;border-color:transparent;
  box-shadow:0 22px 46px rgba(255,122,51,0.34);animation-delay:-2.2s;
}
.chip-solution svg{color:#fff;}
.chip-solution .label{color:rgba(255,255,255,0.92);}
@media (prefers-reduced-motion: reduce){
  .hero-glow-blob,.hero-float-chip{animation:none;}
}
@media (max-width:980px){
  .chip-drop{right:2px;top:8px;}
  .chip-wait{left:0;bottom:56px;}
}
@media (max-width:640px){
  .hero-float-chip{max-width:150px;padding:10px 12px;font-size:11.5px;}
  .hero-float-chip .stat{font-size:15px;}
  .chip-wait{display:none;}
  .chip-solution{margin-left:-84px;}
}

@media (max-width:980px){
  .hero-home{padding:56px 0 64px;}
  .hero-home-inner{grid-template-columns:1fr;gap:34px;}
  .hero-collage{min-height:430px;max-width:620px;width:100%;margin:0 auto;transform:none;}
}
@media (max-width:640px){
  .hero-home h1{font-size:42px;line-height:1.02;}
  .hero-home p.lead{font-size:16px;}
  .hero-home .hero-actions{margin-bottom:34px;}
  .hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;}
  .hero-stats div{padding:0 12px;text-align:center;}
  .hero-stats strong{font-size:20px;}
  .hero-collage{min-height:360px;}
  .open-doodle{right:8px;top:16px;width:300px;}
  .undraw-hero{right:-20px;top:18px;width:380px;}
  .undraw-scene::before{inset:34px 0 62px 18px;}
  .hero-photo{width:390px;max-width:118%;}
  .doodle-blob-a{right:14px;top:28px;width:110px;height:110px;}
  .doodle-blob-b{left:38px;bottom:64px;width:78px;height:78px;}
  .doodle-card{padding:14px 16px;border-radius:18px;}
  .doodle-card strong{font-size:16px;}
  .doodle-card span{font-size:12px;}
  .doodle-card-web{left:8px;top:72px;}
  .doodle-card-flow{right:4px;bottom:56px;}
  .doodle-card-social{left:46px;bottom:44px;}
  .croods-character{right:16px;top:34px;width:300px;height:300px;}
  .panel-web{left:8px;top:60px;width:150px;height:118px;padding:18px;}
  .panel-flow{right:4px;bottom:44px;width:126px;height:104px;}
  .panel-flow strong{font-size:34px;}
  .blob-a{right:14px;top:24px;width:110px;height:110px;}
  .blob-b{left:38px;bottom:60px;width:76px;height:76px;}
  .croods-chip{font-size:12px;padding:10px 14px;}
  .chip-social{left:34px;top:224px;}
  .chip-ads{right:52px;top:194px;}
  .collage-laptop{width:190px;height:132px;left:26px;top:8px;}
  .collage-social{width:105px;height:168px;right:92px;top:112px;}
  .collage-card-type{width:150px;height:132px;left:54px;top:154px;font-size:20px;padding:22px;}
  .collage-card-brand{width:100px;height:100px;right:10px;top:42px;font-size:42px;}
  .collage-card-phone{width:112px;height:210px;right:20px;bottom:20px;border-width:6px;border-radius:22px;}
  .collage-card-mini{width:82px;height:96px;left:190px;bottom:28px;}
  .collage-card-mini strong{font-size:24px;}
}


/* ================= SECTION SHELL ================= */
section{position:relative;z-index:1;}
.section-pad{padding:88px 0;}
@media (max-width:720px){ .section-pad{padding:60px 0;} }
.section-pad.linen{background:var(--linen);}
.section-head{text-align:center;max-width:600px;margin:0 auto 56px;}
.section-head h2{font-size:clamp(26px,3.4vw,38px);font-weight:600;letter-spacing:-0.03em;line-height:1.15;margin:0 0 12px;color:var(--carbon);}
.section-head p{color:var(--graphite);font-size:16px;line-height:1.6;margin:0;}
@media (max-width:800px){ .section-head{margin-bottom:40px;} }

/* ================= INTEGRATIONS STRIP ================= */
.strip{border-top:0;border-bottom:0;padding:56px 0;background:transparent;}
.strip .cap{display:block;text-align:center;font-size:13px;font-weight:600;color:var(--ash);letter-spacing:0.03em;margin-bottom:24px;}
.integration-grid{
  overflow:hidden;position:relative;
  mask-image:linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
}
.integration-track{display:flex;gap:30px;width:max-content;align-items:center;animation:brand-marquee 28s linear infinite;}
.integration-grid:hover .integration-track{animation-play-state:paused;}
.integration-logo{
  display:inline-flex;align-items:center;justify-content:center;height:42px;min-width:92px;padding:4px 8px;
  filter:grayscale(1);opacity:.48;transition:filter .25s ease, opacity .25s ease, transform .25s ease;
}
.integration-logo img{max-height:28px;max-width:116px;width:auto;}
.integration-logo:hover{filter:grayscale(0);opacity:1;transform:translateY(-2px);}
@keyframes brand-marquee{from{transform:translateX(0);}to{transform:translateX(calc(-50% - 15px));}}

/* ================= SERVICES CTA SECTION ================= */
.services-band{
  overflow:hidden;
  background:transparent;
  position:relative;
}
.services-band::before{
  content:"";position:absolute;left:0;right:0;top:90px;bottom:0;z-index:-1;
  background:linear-gradient(180deg, rgba(255,250,247,0) 0%, #fffaf7 18%, #ffffff 74%);
}
.services-band::after{
  content:"";position:absolute;inset:120px 0 auto 0;height:360px;z-index:-1;pointer-events:none;
  background:
    radial-gradient(circle at -8% 30%, rgba(255,122,51,0.12), transparent 34%),
    radial-gradient(circle at 108% 36%, rgba(255,122,51,0.1), transparent 34%);
}
.services-cta-head{text-align:center;max-width:940px;margin:0 auto 52px;}
.services-cta-head .chip.tag{margin-bottom:18px;}
.services-cta-head h2{font-size:clamp(34px,4.5vw,56px);font-weight:640;letter-spacing:-0.045em;line-height:1.06;margin:0 0 16px;color:var(--carbon);}
.services-cta-head h2 span{font-weight:520;}
.services-cta-head h2 strong{font-weight:680;}
.services-cta-head h2 .service-title-light{font-weight:420;}
.services-cta-head h2 em{font-style:normal;color:var(--brand);font-weight:720;}
.services-cta-head p{color:var(--graphite);font-size:17px;line-height:1.55;margin:0 auto;max-width:720px;}

/* ================= FEATURE CARDS (services overview) ================= */
.pillars{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;align-items:stretch;}
.pillar{
  text-align:left;min-height:390px;padding:22px;background:rgba(255,255,255,0.9);border:1px solid rgba(24,25,37,0.1);
  box-shadow:0 12px 28px rgba(24,25,37,0.055);
  transition:border-color .24s ease, box-shadow .24s ease, transform .24s ease, background .24s ease;
  backdrop-filter:blur(16px);
  cursor:pointer;display:flex;flex-direction:column;overflow:hidden;position:relative;
}
.pillar::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--brand);
  transform:scaleY(0);transform-origin:top;transition:transform .24s ease;
}
.pillar:hover,
.pillar:focus-visible{
  border-color:rgba(255,122,51,0.44);
  box-shadow:0 26px 56px rgba(24,25,37,0.12);
  transform:translateY(-6px);background:#fff;
}
.pillar:hover::before,.pillar:focus-visible::before{transform:scaleY(1);}
.pillar:focus-visible{outline:3px solid rgba(255,122,51,0.32);outline-offset:4px;}
.service-topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;color:var(--ash);font-size:12px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;}
.service-topline span{color:var(--brand);}
.service-topline i{font-style:normal;color:#a6a6a6;}
.service-visual{height:58px;position:relative;margin-bottom:24px;z-index:1;}
.pillar .icon{
  width:54px;height:54px;display:flex;align-items:center;justify-content:center;
  margin:0;background:#fff0e8;color:var(--brand-dark);font-size:17px;font-weight:700;
  transition:background .24s ease, color .24s ease, transform .24s ease;
}
.pillar:hover .icon,.pillar:focus-visible .icon{background:var(--brand);color:#fff;transform:translateY(-2px);}
.pillar h3{position:relative;z-index:1;font-size:21px;font-weight:680;letter-spacing:-0.035em;margin:0 0 14px;color:var(--carbon);line-height:1.08;}
.pillar p{
  position:relative;z-index:1;color:var(--graphite);font-size:14.5px;line-height:1.5;margin:0 0 22px;
}
.service-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:12px;}
.service-tags span{font-size:11.5px;font-weight:700;color:#6f7784;background:#f3f5f7;border:1px solid #e5e8ed;padding:6px 8px;}
.service-link{margin-top:20px;font-size:13.5px;font-weight:760;color:var(--carbon);display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--fog);padding-top:16px;}
.service-link span{color:var(--brand);transition:transform .2s ease;}
.pillar:hover .service-link span,.pillar:focus-visible .service-link span{transform:translateX(4px);}
.icon-arrow{flex-shrink:0;}
@media (max-width:1100px){
  .pillars{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){ .pillars{grid-template-columns:1fr;gap:18px;} .pillar{min-height:auto;} }

.mini-panel,.browser-card,.social-tile,.mini-dot{
  position:absolute;display:block;box-shadow:0 14px 34px rgba(255,122,51,0.12);
}
.mini-panel{width:78px;height:54px;border-radius:10px;background:rgba(255,255,255,0.82);border:1px solid #fff0e8;}
.mini-panel-a{right:20px;top:5px;}
.mini-panel-b{right:55px;bottom:2px;padding:13px 12px;}
.mini-panel-b i{display:block;height:5px;border-radius:999px;background:#ffe1d3;margin-bottom:7px;}
.mini-panel-b i:nth-child(1){width:42px;}
.mini-panel-b i:nth-child(2){width:28px;}
.mini-panel-b i:nth-child(3){width:36px;margin-bottom:0;}
.mini-dot{right:38px;top:42px;width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;font-size:12px;line-height:25px;text-align:center;}
.browser-card{right:18px;top:7px;width:116px;height:72px;border-radius:10px;background:rgba(255,255,255,0.82);border:1px solid #fff0e8;padding:11px;}
.browser-card i{width:5px;height:5px;border-radius:50%;background:#ffb28e;display:inline-block;margin-right:4px;}
.browser-card b{display:block;margin-top:14px;height:28px;border-radius:6px;background:linear-gradient(135deg,#fff2eb,#f3f5f7);}
.social-tile{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,0.88);border:1px solid #fff0e8;color:var(--brand);display:flex;align-items:center;justify-content:center;font-weight:800;}
.social-tile.insta{right:44px;top:0;}
.social-tile.tiktok{right:12px;top:42px;}
.social-tile.play{right:66px;bottom:4px;}
.service-visual-social::after{content:"";position:absolute;right:8px;top:10px;width:82px;height:82px;border-radius:22px;background:rgba(255,122,51,0.06);transform:rotate(-8deg);}

.price-pill{display:inline-flex;align-items:center;padding:7px 15px;border-radius:var(--radius-full);font-size:13px;font-weight:600;margin-bottom:22px;white-space:nowrap;background:var(--brand-wash);color:var(--brand-dark);}

/* ================= PRICING CARDS ================= */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;position:relative;z-index:1;}
@media (max-width:900px){ .plans{grid-template-columns:1fr;} }
.plan-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.94), rgba(255,255,255,0.78));border:1px solid rgba(232,232,232,0.9);border-radius:22px;
  padding:36px 30px;display:flex;flex-direction:column;transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
  box-shadow:0 18px 40px rgba(24,25,37,0.06);backdrop-filter:blur(14px);
}
.plan-card:hover{box-shadow:0 26px 62px rgba(24,25,37,0.1);border-color:rgba(255,122,51,0.28);}
.plan-card.featured{border-color:rgba(255,122,51,0.55);box-shadow:0 0 0 1px rgba(255,122,51,0.26), 0 30px 70px rgba(255,122,51,0.12);}
.plan-badge{font-size:11.5px;font-weight:700;letter-spacing:0.04em;color:var(--ash);margin-bottom:8px;text-transform:uppercase;}
.plan-name{font-size:21px;font-weight:600;letter-spacing:-0.01em;margin:0 0 18px;color:var(--carbon);}
.plan-price{margin-bottom:4px;}
.plan-price .amt{font-size:32px;font-weight:700;letter-spacing:-0.02em;color:var(--carbon);}
.plan-price .per{font-size:14px;color:var(--ash);}
.plan-sub{font-size:13px;color:var(--ash);margin-bottom:24px;}
.plan-list{list-style:none;margin:0 0 28px;padding:0;flex:1;}
.plan-list li{font-size:14px;color:var(--graphite);padding:10px 0;border-top:1px solid var(--fog);display:flex;gap:10px;align-items:flex-start;line-height:1.4;}
.plan-list li:first-child{border-top:none;}
.plan-list li svg{flex-shrink:0;margin-top:3px;color:var(--brand);}
.plan-list li.all{color:var(--carbon);font-weight:600;}
.plan-cta{text-align:center;padding:13px 20px;border-radius:var(--radius-full);font-size:14px;font-weight:600;border:1px solid var(--fog);color:var(--carbon);transition:all .2s ease;display:block;}
.plan-cta:hover{background:var(--brand);border-color:var(--brand);color:#fff;}
.plan-card.featured .plan-cta{background:var(--brand);border-color:var(--brand);color:#fff;}
.plan-card.featured .plan-cta:hover{background:var(--brand-dark);border-color:var(--brand-dark);}
.plan-foot-note{margin-top:22px;font-size:13px;color:var(--ash);}

/* flow diagram */
.flow-diagram{display:flex;align-items:center;gap:0;overflow-x:auto;padding:8px 0 58px;justify-content:center;}
.flow-node{flex-shrink:0;background:rgba(255,255,255,0.86);border:1px solid var(--fog);border-radius:16px;padding:18px 22px;min-width:150px;transition:border-color .2s ease, transform .2s ease;box-shadow:0 14px 32px rgba(24,25,37,0.06);}
.flow-node:hover{border-color:var(--brand);}
.flow-node .t{font-size:13px;font-weight:600;color:var(--carbon);margin-bottom:4px;}
.flow-node .d{font-size:12.5px;color:var(--ash);}
.flow-arrow{flex-shrink:0;width:32px;display:flex;align-items:center;justify-content:center;color:var(--fog);}

/* process row */
.process-row{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:44px;position:relative;align-items:start;}
.process-path{position:absolute;left:7%;right:7%;top:26px;width:86%;height:82px;z-index:0;overflow:visible;}
.process-path path{fill:none;stroke:rgba(255,255,255,0.55);stroke-width:3;stroke-linecap:round;stroke-dasharray:8 12;}
.process-step{text-align:center;position:relative;z-index:1;}
.process-step:nth-of-type(even){padding-top:10px;}
.process-step .n{
  width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;
  color:#fff;background:rgba(255,255,255,0.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,0.32), 0 14px 28px rgba(24,25,37,0.12);
  backdrop-filter:blur(10px);
}
.process-step .num{font-size:17px;font-weight:800;color:#fff;line-height:1;margin-bottom:10px;}
.process-step .t{font-size:15px;font-weight:700;margin-bottom:8px;color:#fff;}
.process-step .d{font-size:13px;color:rgba(255,255,255,0.78);line-height:1.45;max-width:155px;margin:0 auto;}
.process-orange,.process-blue,.process-green,.process-purple,.process-gold{--step-color:#737b87;--step-bg:#f3f5f7;--step-ring:#dbe0e7;}
.process-orange{margin-top:35px;}
.process-green{margin-top:36px;}
@media (max-width:800px){
  .process-row{grid-template-columns:1fr;gap:28px;}
  .process-path{display:none;}
  .process-step:nth-of-type(even){padding-top:0;}
  .process-orange,.process-green{margin-top:0;}
  .process-step .d{max-width:280px;}
}

/* web photo panel */
.web-mock{
  display:grid;grid-template-columns:1.1fr 1fr;align-items:stretch;
  background:linear-gradient(135deg,#111821,#263143);border:1px solid rgba(255,255,255,0.14);border-radius:28px;
  margin-bottom:64px;overflow:hidden;min-height:340px;box-shadow:0 28px 70px rgba(24,25,37,0.16);
}
@media (max-width:840px){ .web-mock{grid-template-columns:1fr;} }
.web-mock-photo{position:relative;overflow:hidden;background:var(--mist);}
.web-mock-photo img{width:100%;height:100%;object-fit:cover;display:block;min-height:240px;}
.web-mock-caption{padding:46px 42px;display:flex;flex-direction:column;justify-content:center;}
.web-mock-caption .k1{font-size:12.5px;font-weight:700;color:var(--brand-dark);letter-spacing:0.03em;margin-bottom:14px;text-transform:uppercase;}
.web-mock-caption h3{font-size:clamp(24px,2.8vw,34px);font-weight:650;letter-spacing:-0.02em;margin:0 0 12px;line-height:1.12;color:#fff;}
.web-mock-caption p{color:rgba(255,255,255,0.68);font-size:15px;line-height:1.6;margin:0;}

/* social photo phone */
.social-visual{display:grid;grid-template-columns:0.85fr 1.15fr;gap:52px;align-items:center;margin-bottom:64px;padding:34px;border-radius:28px;background:linear-gradient(135deg,#fff7f2,#fff);border:1px solid var(--fog);}
@media (max-width:840px){ .social-visual{grid-template-columns:1fr;} }
.phone{max-width:250px;margin:0 auto;padding:10px;background:var(--paper);border:1px solid var(--fog);border-radius:28px;box-shadow:var(--shadow-1);}
.phone-screen{background:var(--mist);border-radius:20px;aspect-ratio:9/17;position:relative;overflow:hidden;}
.phone-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.phone-overlay{position:absolute;left:0;right:0;bottom:0;padding:14px 12px 16px;display:flex;flex-direction:column;align-items:center;gap:3px;background:linear-gradient(0deg, rgba(24,25,37,0.85) 0%, rgba(24,25,37,0.35) 60%, transparent 100%);}
.phone-handle{width:28px;height:28px;border-radius:50%;background:var(--brand);margin-bottom:2px;}
.phone-name{text-align:center;font-size:12.5px;font-weight:600;color:#fff;}
.phone-sub{text-align:center;font-size:10.5px;color:rgba(255,255,255,0.75);}
.social-copy p{color:var(--carbon);font-size:24px;line-height:1.35;max-width:520px;font-weight:650;letter-spacing:-0.02em;}

/* ================= TESTIMONIALS MARQUEE ================= */
.testimonials-marquee{overflow:hidden;padding-bottom:78px;}
.marquee-wall{
  width:100%;display:flex;flex-direction:column;gap:18px;position:relative;
  mask-image:linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
}
.marquee-row{display:flex;width:100%;overflow:hidden;}
.marquee-track{display:flex;gap:18px;width:max-content;animation:testi-marquee 34s linear infinite;}
.marquee-row.reverse .marquee-track{animation-name:testi-marquee-reverse;animation-duration:38s;}
.marquee-row.slow .marquee-track{animation-duration:44s;}
.marquee-wall.is-paused .marquee-track{animation-play-state:paused;}
.testi-card{
  background:var(--paper);border:1px solid var(--fog);border-radius:var(--radius-lg);
  width:360px;min-height:168px;padding:26px 24px;display:flex;flex-direction:column;gap:18px;transition:box-shadow .25s ease, transform .25s ease;
  flex:0 0 auto;
}
.testi-card:hover{box-shadow:var(--shadow-2);transform:translateY(-4px);}
.testi-quote{font-size:14.5px;line-height:1.62;color:var(--carbon);}
.testi-person{margin-top:auto;padding-top:16px;border-top:1px solid var(--fog);}
.testi-name{font-size:13.5px;font-weight:600;color:var(--carbon);}
.testi-role{font-size:12px;color:var(--ash);margin-top:2px;}
@keyframes testi-marquee{from{transform:translateX(0);}to{transform:translateX(calc(-50% - 9px));}}
@keyframes testi-marquee-reverse{from{transform:translateX(calc(-50% - 9px));}to{transform:translateX(0);}}
@media (max-width:640px){
  .testi-card{width:300px;}
  .marquee-wall{mask-image:linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);-webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);}
}

/* ================= CHAT MOCKUP (Flow page visual) ================= */
.chat-mock{
  max-width:480px;margin:0 auto 58px;background:var(--paper);border:1px solid var(--fog);
  border-radius:28px;box-shadow:0 28px 70px rgba(24,25,37,0.13);overflow:hidden;
}
.chat-mock-bar{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--fog);}
.chat-mock-avatar{width:38px;height:38px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0;}
.chat-mock-name{font-size:14px;font-weight:600;color:var(--carbon);}
.chat-mock-status{font-size:12px;color:var(--ash);display:flex;align-items:center;gap:5px;margin-top:1px;}
.chat-mock-status .dot-online{width:6px;height:6px;border-radius:50%;background:#33c758;}
.chat-mock-body{padding:22px 20px;display:flex;flex-direction:column;gap:10px;background:var(--linen);}
.bubble{max-width:80%;padding:11px 15px;border-radius:16px;font-size:13.5px;line-height:1.5;}
.bubble.in{background:var(--paper);border:1px solid var(--fog);color:var(--carbon);align-self:flex-start;border-bottom-left-radius:4px;}
.bubble.out{background:var(--brand);color:#fff;align-self:flex-end;border-bottom-right-radius:4px;}

/* ================= PROCESS BAND (how we work, homepage) ================= */
.process-band{
  border-top:0;background:
    radial-gradient(circle at 8% 10%, rgba(255,255,255,0.2), transparent 24%),
    radial-gradient(circle at 92% 18%, rgba(24,25,37,0.12), transparent 26%),
    linear-gradient(135deg,#ff8b33,#ff6f2d 68%,#e85f1f);
  color:#fff;overflow:hidden;
}
.process-band .section-head h2{color:#fff;}
.process-band .section-head p{color:rgba(255,255,255,0.76);}
.process-band .process-row{margin-top:0;}
/* ================= CTA BAND ================= */
.cta-band{background:var(--carbon);padding:88px 0;overflow:hidden;}
.cta-inner{text-align:center;max-width:560px;margin:0 auto;}
.cta-inner h2{font-size:clamp(28px,4vw,42px);font-weight:600;letter-spacing:-0.03em;line-height:1.12;margin:0 0 16px;color:#fff;}
.cta-inner p{color:rgba(255,255,255,0.65);font-size:16px;line-height:1.6;margin:0 0 32px;}
.cta-band .btn-primary{background:var(--brand);}
.cta-band .btn-primary:hover{background:var(--brand-dark);}
.cta-band .btn-ghost{border-color:rgba(255,255,255,0.25);color:#fff;}
.cta-band .btn-ghost:hover{border-color:#fff;}

/* ================= FOOTER ================= */
footer{
  position:relative;overflow:hidden;border-top:0;padding:74px 0 34px;
  background:
    radial-gradient(circle at 8% 0%, rgba(255,122,51,0.18), transparent 30%),
    radial-gradient(circle at 92% 18%, rgba(255,255,255,0.08), transparent 28%),
    linear-gradient(135deg,#11131c,#191b27 58%,#0f1017);
  color:#fff;
}
footer::before{
  content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,0.06);border-radius:28px;pointer-events:none;
}
.foot-top{
  display:grid;grid-template-columns:minmax(280px,1.6fr) 1.25fr .85fr 1.05fr;gap:54px;
  margin-bottom:54px;position:relative;z-index:1;
}
.foot-brand .logo{margin-bottom:22px;}
.foot-brand h3{font-size:28px;line-height:1.1;font-weight:700;letter-spacing:-0.02em;margin:0 0 14px;color:#fff;}
.foot-brand p{color:rgba(255,255,255,0.68);font-size:15px;line-height:1.7;max-width:440px;margin:0;}
.foot-col h4{
  font-size:12px;color:rgba(255,255,255,0.44);font-weight:700;margin:0 0 18px;
  text-transform:uppercase;letter-spacing:0.08em;
}
.foot-col a{
  display:block;font-size:14.5px;color:rgba(255,255,255,0.72);margin-bottom:13px;
  transition:color .2s ease, transform .2s ease;
}
.foot-col a:hover{color:#fff;transform:translateX(4px);}
.foot-bottom{
  position:relative;z-index:1;border-top:1px solid rgba(255,255,255,0.1);padding-top:24px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;
}
.foot-bottom .meta{font-size:13px;color:rgba(255,255,255,0.52);}
.foot-social{display:flex;gap:10px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,0.72);}
.foot-social span{
  display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,0.12);border-radius:999px;
  padding:7px 12px;background:rgba(255,255,255,0.04);
}
footer .logo-img{filter:brightness(0) invert(1);height:42px;}
@media (max-width:900px){ .foot-top{grid-template-columns:1fr 1fr;gap:34px;} }
@media (max-width:640px){
  footer{padding:58px 0 30px;}
  footer::before{inset:10px;border-radius:22px;}
  .foot-top{grid-template-columns:1fr;gap:30px;}
  .foot-bottom{align-items:flex-start;}
}

/* ================= AMBIENT FLOATING ORBS ================= */
.ambient-orb{
  position:absolute;z-index:0;border-radius:50%;pointer-events:none;filter:blur(50px);
  will-change:transform;animation:orbDrift 13s ease-in-out infinite;
}
.orb-orange{background:radial-gradient(circle, rgba(255,122,51,0.45), transparent 70%);}
.orb-dark{background:radial-gradient(circle, rgba(24,25,37,0.3), transparent 70%);}
.orb-light{background:radial-gradient(circle, rgba(255,255,255,0.4), transparent 70%);}
.orb-a{width:340px;height:340px;left:-90px;top:10%;animation-duration:14s;}
.orb-b{width:260px;height:260px;right:-70px;bottom:6%;animation-duration:17s;animation-delay:-6s;}
@keyframes orbDrift{
  0%,100%{translate:0 0;}
  50%{translate:26px -34px;}
}
@media (prefers-reduced-motion: reduce){ .ambient-orb{animation:none;} }
@media (max-width:720px){ .ambient-orb{filter:blur(34px);opacity:.7;} .orb-a{width:220px;height:220px;} .orb-b{width:180px;height:180px;} }

/* ================= 3D TILT (service cards) ================= */
.pillar{transform-style:preserve-3d;transition:border-color .24s ease, box-shadow .24s ease, transform .12s ease, background .24s ease;}
.pillar .service-visual,.pillar h3,.pillar p,.pillar .service-tags,.pillar .service-link{transform:translateZ(24px);}
@media (prefers-reduced-motion: reduce), (pointer:coarse){ .pillar{transform:none !important;} }

/* ================= GEOMETRIC IDENTITY OVERRIDES ================= */
.nav,
.navlinks a,
.nav-cta,
.btn-primary,
.btn-ghost,
.chip,
.hero-title-tag,
.hero-title-tag::before,
.hero-title-tag::after,
.pillar,
.pillar::after,
.pillar .icon,
.plan-card,
.plan-cta,
.flow-node,
.web-mock,
.social-visual,
.chat-mock,
.bubble,
.testi-card,
.foot-social span,
.price-pill,
.integration-logo,
.phone,
.phone-screen,
.web-mock-photo img,
.service-chat-card,
.service-metric-card,
.service-pipeline,
.service-pipeline i,
.service-browser,
.service-browser img,
.service-score-card,
.service-wire-card,
.service-social-phone,
.service-social-phone img,
.service-social-card,
.service-social-icons,
.service-social-icons span{
  border-radius:4px !important;
}

footer::before{border-radius:0 !important;}

/* ================================================================
   INTERNAL PAGES — SHARED PREMIUM COMPONENTS
   ================================================================ */

/* ---- typography helpers (mixed-weight headlines) ---- */
.w-thin{font-weight:280;}
.w-black{font-weight:800;}
.text-brand{color:var(--brand);}
.text-dim{opacity:.62;}

/* ---- dark service hero base ---- */
.service-hero-dark{
  position:relative;overflow:hidden;color:#fff;padding:96px 0 88px;
  background:linear-gradient(160deg,#0a0f18 0%,#0d1420 46%,#090d15 100%);
}
.service-hero-dark .hero-inner{position:relative;z-index:2;}
.service-hero-dark .kicker-line{
  display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:0.16em;
  color:rgba(255,255,255,0.56);text-transform:uppercase;margin-bottom:22px;
}
.service-hero-dark .kicker-line::before{content:"";width:22px;height:2px;background:var(--brand);display:block;}
.service-hero-dark h1{color:#fff;font-weight:700;letter-spacing:-0.03em;}
.service-hero-dark .desc{color:rgba(255,255,255,0.68);}
.service-hero-dark .desc .highlight{color:#fff;}

/* ---- glow arcs (ambient light swirls for dark sections) ---- */
.glow-arc{
  position:absolute;z-index:0;pointer-events:none;border-radius:50%;
  filter:blur(2px);opacity:.75;mix-blend-mode:screen;will-change:transform;
}
.glow-arc-left{
  left:-260px;top:-120px;width:520px;height:520px;
  background:conic-gradient(from 200deg at 60% 40%, transparent 0deg, rgba(255,122,51,0.55) 90deg, transparent 190deg);
  filter:blur(38px);
}
.glow-arc-right{
  right:-280px;bottom:-160px;width:560px;height:560px;
  background:conic-gradient(from 20deg at 40% 60%, transparent 0deg, rgba(255,122,51,0.42) 110deg, transparent 220deg);
  filter:blur(42px);
}
.dot-field{
  position:absolute;z-index:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,0.28) 1px, transparent 1.4px);
  background-size:16px 16px;
}
@media (prefers-reduced-motion: reduce){ .glow-arc{animation:none;} }

/* ---- icon feature row (Estrategia / Creación / Gestión / Optimización) ---- */
.icon-feature-row{display:flex;gap:34px;flex-wrap:wrap;margin:30px 0 36px;}
.icon-feature{display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.icon-feature .box{
  width:52px;height:52px;border-radius:4px;display:flex;align-items:center;justify-content:center;
  background:rgba(255,122,51,0.12);color:var(--brand);border:1px solid rgba(255,122,51,0.22);
  transition:transform .35s cubic-bezier(.34,1.56,.64,1), background .25s ease, color .25s ease;
}
.icon-feature:hover .box{transform:translateY(-4px) rotate(-8deg) scale(1.08);background:var(--brand);color:#fff;}
.icon-feature .box svg{width:22px;height:22px;}
.icon-feature span{font-size:13.5px;font-weight:600;color:rgba(255,255,255,0.86);}
.service-hero-light .icon-feature span,
.icon-feature.on-light span{color:var(--carbon);}
.service-hero-light .icon-feature .box,
.icon-feature.on-light .box{background:var(--brand-wash);border-color:transparent;}
@media (max-width:640px){ .icon-feature-row{gap:22px;} }

/* ---- avatar trust group ---- */
.avatar-trust{display:flex;align-items:center;gap:14px;margin-top:8px;}
.avatar-trust .stack{display:flex;}
.avatar-trust .stack span{
  width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;border:2px solid var(--paper);margin-left:-10px;
}
.avatar-trust .stack span:first-child{margin-left:0;}
.avatar-trust .stack span:nth-child(1){background:#ff7a33;}
.avatar-trust .stack span:nth-child(2){background:#2f3542;}
.avatar-trust .stack span:nth-child(3){background:#5b6d7e;}
.avatar-trust p{font-size:13px;color:var(--graphite);margin:0;}
.avatar-trust p strong{color:var(--carbon);font-weight:700;}
.service-hero-dark .avatar-trust span{border-color:#0a0f18;}
.service-hero-dark .avatar-trust p{color:rgba(255,255,255,0.66);}
.service-hero-dark .avatar-trust p strong{color:#fff;}

/* ---- trust wordmark logos row ---- */
.trust-logos{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:36px;margin-top:36px;padding-top:32px;
  border-top:1px solid rgba(255,255,255,0.08);
}
.trust-logos.on-light{border-top-color:var(--fog);}
.trust-logos-cap{width:100%;text-align:center;font-size:11.5px;font-weight:700;letter-spacing:0.1em;color:rgba(255,255,255,0.4);text-transform:uppercase;margin-bottom:2px;}
.trust-logos.on-light .trust-logos-cap{color:var(--ash);}
.trust-wordmark{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:700;font-size:15px;color:rgba(255,255,255,0.5);letter-spacing:-0.01em;opacity:.75;transition:opacity .2s ease;}
.trust-wordmark:hover{opacity:1;}
.trust-wordmark svg{width:16px;height:16px;color:var(--brand);flex-shrink:0;}
.trust-logos.on-light .trust-wordmark{color:var(--graphite);}

/* ---- realistic browser mockup ---- */
.browser-mock{
  background:#12151d;border-radius:4px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,0.35);
  border:1px solid rgba(255,255,255,0.08);
}
.browser-mock-bar{display:flex;align-items:center;gap:16px;padding:12px 16px;background:#181c26;border-bottom:1px solid rgba(255,255,255,0.06);}
.browser-mock-dots{display:flex;gap:6px;}
.browser-mock-dots span{width:9px;height:9px;border-radius:50%;background:#3a3f4d;}
.browser-mock-dots span:nth-child(1){background:#ff5f57;}
.browser-mock-dots span:nth-child(2){background:#febc2e;}
.browser-mock-dots span:nth-child(3){background:#28c840;}
.browser-mock-url{flex:1;background:#0e1118;border-radius:999px;padding:6px 14px;font-size:11.5px;color:rgba(255,255,255,0.4);display:flex;align-items:center;gap:6px;}
.browser-mock-url svg{width:11px;height:11px;color:#4caf50;}
.browser-mock-screen{position:relative;overflow:hidden;background:#fff;}

/* ---- mock content faux sites (built with CSS, not screenshots) ---- */
.mocksite{font-family:var(--font);color:var(--carbon);position:relative;background:#fff;}
.mocksite-nav{display:flex;align-items:center;justify-content:space-between;padding:14px 22px;border-bottom:1px solid var(--fog);}
.mocksite-nav .brand{font-weight:800;font-size:15px;letter-spacing:-0.02em;display:flex;align-items:center;gap:7px;}
.mocksite-nav .brand i{width:16px;height:16px;background:var(--brand);border-radius:4px;display:block;}
.mocksite-nav .links{display:flex;gap:16px;font-size:11.5px;color:var(--graphite);font-weight:600;}
.mocksite-nav .cta{font-size:11px;font-weight:700;background:var(--carbon);color:#fff;padding:7px 13px;border-radius:4px;}
.mocksite-hero{padding:34px 22px;display:grid;grid-template-columns:1.1fr 0.9fr;gap:18px;align-items:center;}
.mocksite-hero h4{font-size:22px;line-height:1.15;font-weight:800;letter-spacing:-0.02em;margin:0 0 10px;}
.mocksite-hero p{font-size:12px;color:var(--graphite);line-height:1.5;margin:0 0 16px;max-width:260px;}
.mocksite-hero .btns{display:flex;gap:8px;}
.mocksite-hero .btns span{font-size:11px;font-weight:700;padding:8px 14px;border-radius:4px;}
.mocksite-hero .btns span:first-child{background:var(--brand);color:#fff;}
.mocksite-hero .btns span:last-child{border:1px solid var(--fog);color:var(--graphite);}
.mocksite-hero .art{border-radius:4px;height:150px;background:linear-gradient(150deg,var(--art-a,#1c2431),var(--art-b,#2c3646));position:relative;overflow:hidden;}
.mocksite-hero .art::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 20%, rgba(255,255,255,0.16), transparent 55%);}
.mocksite-strip{display:flex;justify-content:space-around;padding:16px 22px;border-top:1px solid var(--fog);}
.mocksite-strip span{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--graphite);font-weight:600;}
.mocksite-strip svg{width:13px;height:13px;color:var(--brand);}
.mocksite-shop{padding:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.mocksite-shop .card{background:var(--linen);border-radius:4px;padding:10px;}
.mocksite-shop .thumb{height:64px;border-radius:4px;margin-bottom:8px;background:linear-gradient(150deg,var(--art-a,#eee0d5),var(--art-b,#d9c3ab));}
.mocksite-shop .name{font-size:10.5px;font-weight:700;}
.mocksite-shop .price{font-size:10px;color:var(--brand-dark);font-weight:700;}
.mocksite-booking{padding:22px;display:flex;flex-direction:column;gap:10px;}
.mocksite-booking .field{background:var(--linen);border-radius:4px;padding:10px 12px;font-size:11px;color:var(--graphite);display:flex;justify-content:space-between;}
.mocksite-booking .go{background:var(--carbon);color:#fff;text-align:center;padding:11px;border-radius:4px;font-size:12px;font-weight:700;margin-top:4px;}

/* ---- mini phone alongside a browser mockup (showcase pairs) ---- */
.showcase-mockups{position:relative;transform-style:preserve-3d;}
.showcase-phone{
  position:absolute;right:-14px;bottom:-22px;width:96px;border-radius:16px;background:#10131a;padding:5px;
  box-shadow:0 26px 50px rgba(0,0,0,0.28);z-index:3;
}
.showcase-phone .screen{border-radius:12px;overflow:hidden;background:#fff;aspect-ratio:9/18.5;}

/* ---- mock scroll clipping ---- */
.mock-scroll-viewport{overflow:hidden;height:100%;}
.mock-scroll-content{will-change:transform;}

/* ================= TESTIMONIAL CAROUSEL ================= */
.testi-carousel{position:relative;}
.testi-carousel-viewport{overflow:hidden;}
.testi-carousel-track{display:flex;gap:20px;will-change:transform;}
.testi-slide{flex:0 0 calc(33.333% - 14px);min-width:0;}
@media (max-width:900px){ .testi-slide{flex-basis:100%;} }
.testi-slide-card{
  height:100%;padding:28px 26px;border-radius:4px;display:flex;flex-direction:column;gap:16px;
  position:relative;
}
.testi-carousel.dark .testi-slide-card{
  background:linear-gradient(165deg,#131826,#0c1019);border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 24px 50px rgba(0,0,0,0.3);
}
.testi-carousel.light .testi-slide-card{
  background:var(--paper);border:1px solid var(--fog);box-shadow:0 18px 40px rgba(24,25,37,0.07);
}
.testi-quote-mark{color:var(--brand);opacity:.9;}
.testi-quote-mark svg{width:26px;height:26px;}
.testi-slide-card .testi-quote{font-size:14.5px;line-height:1.6;flex:1;}
.testi-carousel.dark .testi-quote{color:rgba(255,255,255,0.82);}
.testi-carousel.light .testi-quote{color:var(--carbon);}
.testi-slide-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:14px;border-top:1px solid rgba(255,255,255,0.08);}
.testi-carousel.light .testi-slide-foot{border-top-color:var(--fog);}
.testi-slide-person{display:flex;align-items:center;gap:10px;}
.testi-slide-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#fff;flex-shrink:0;}
.testi-slide-name{font-size:13.5px;font-weight:700;}
.testi-carousel.dark .testi-slide-name{color:#fff;}
.testi-carousel.light .testi-slide-name{color:var(--carbon);}
.testi-slide-role{font-size:11.5px;}
.testi-carousel.dark .testi-slide-role{color:rgba(255,255,255,0.48);}
.testi-carousel.light .testi-slide-role{color:var(--ash);}
.testi-slide-stat{
  font-size:11.5px;font-weight:800;padding:6px 10px;border-radius:4px;white-space:nowrap;display:flex;align-items:center;gap:4px;
  background:rgba(255,122,51,0.14);color:var(--brand);
}
.testi-slide-stat svg{width:12px;height:12px;}
.testi-stars{display:flex;gap:2px;color:var(--brand);margin-bottom:-4px;}
.testi-stars svg{width:13px;height:13px;fill:currentColor;}
.testi-carousel-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:30px;}
.testi-carousel-arrow{
  width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,0.16);background:transparent;color:#fff;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s ease, border-color .2s ease, opacity .2s ease;
}
.testi-carousel.light .testi-carousel-arrow{border-color:var(--fog);color:var(--carbon);}
.testi-carousel-arrow:hover{background:var(--brand);border-color:var(--brand);color:#fff;}
.testi-carousel-arrow:disabled{opacity:.32;cursor:default;}
.testi-carousel-arrow:disabled:hover{background:transparent;color:inherit;border-color:rgba(255,255,255,0.16);}
.testi-carousel.light .testi-carousel-arrow:disabled:hover{border-color:var(--fog);}
.testi-carousel-arrow svg{width:17px;height:17px;}
.testi-carousel-dots{display:flex;gap:8px;}
.testi-carousel-dots button{width:7px;height:7px;padding:0;border-radius:50%;border:0;background:rgba(255,255,255,0.24);cursor:pointer;transition:background .2s ease, width .2s ease;}
.testi-carousel.light .testi-carousel-dots button{background:var(--fog);}
.testi-carousel-dots button.is-active{background:var(--brand);width:20px;border-radius:4px;}

/* ================= PRICING CARD v2 ================= */
.plans-dark .plan-card{
  background:linear-gradient(165deg,#131826,#0c1019);border-color:rgba(255,255,255,0.1);
  box-shadow:0 24px 55px rgba(0,0,0,0.32);
}
.plans-dark .plan-badge{color:rgba(255,255,255,0.42);}
.plans-dark .plan-name{color:#fff;}
.plans-dark .plan-price .amt{color:#fff;}
.plans-dark .plan-price .per,.plans-dark .plan-sub{color:rgba(255,255,255,0.5);}
.plans-dark .plan-list li{color:rgba(255,255,255,0.78);border-top-color:rgba(255,255,255,0.08);}
.plans-dark .plan-list li.all{color:#fff;}
.plans-dark .plan-cta{border-color:rgba(255,255,255,0.18);color:#fff;}
.plans-dark .plan-foot-note{color:rgba(255,255,255,0.4);}
.plans-dark .plan-card.featured{border-color:rgba(255,122,51,0.55);box-shadow:0 0 0 1px rgba(255,122,51,0.3), 0 34px 70px rgba(255,122,51,0.14);}

.plans:not(.plans-dark) .plan-card.featured{
  background:linear-gradient(165deg,#181c26,#0b0e15);border-color:rgba(255,122,51,0.4);
}
.plans:not(.plans-dark) .plan-card.featured .plan-badge{color:rgba(255,255,255,0.42);}
.plans:not(.plans-dark) .plan-card.featured .plan-name,
.plans:not(.plans-dark) .plan-card.featured .plan-price .amt{color:#fff;}
.plans:not(.plans-dark) .plan-card.featured .plan-price .per,
.plans:not(.plans-dark) .plan-card.featured .plan-sub{color:rgba(255,255,255,0.5);}
.plans:not(.plans-dark) .plan-card.featured .plan-list li{color:rgba(255,255,255,0.78);border-top-color:rgba(255,255,255,0.09);}
.plans:not(.plans-dark) .plan-card.featured .plan-list li.all{color:#fff;}
.plans:not(.plans-dark) .plan-card.featured .plan-foot-note{color:rgba(255,255,255,0.42);}

.plan-card{position:relative;isolation:isolate;}
.plan-ribbon{
  position:absolute;top:-1px;right:22px;background:var(--brand);color:#fff;font-size:10.5px;font-weight:800;
  letter-spacing:0.04em;padding:7px 14px;border-radius:0 0 4px 4px;box-shadow:0 8px 18px rgba(255,122,51,0.3);
}
.plan-list li{display:flex;gap:10px;}
.check-badge{
  width:18px;height:18px;border-radius:50%;background:rgba(255,122,51,0.16);color:var(--brand);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;margin-top:1px;
}
.check-badge svg{width:11px;height:11px;stroke-width:3;}
.plan-card.featured .check-badge{background:var(--brand);color:#fff;}
.plan-icon-badge{
  width:46px;height:46px;border-radius:4px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;
  background:var(--brand-wash);color:var(--brand-dark);
}
.plan-icon-badge svg{width:20px;height:20px;}
.plans-dark .plan-icon-badge,.plan-card.featured .plan-icon-badge{background:rgba(255,122,51,0.16);color:var(--brand);}

/* ================= FLOW CONNECTOR DIAGRAM ================= */
.flow-connector{
  display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;position:relative;margin:0 auto;max-width:1080px;
}
.flow-connector-col{display:flex;flex-direction:column;gap:14px;}
.flow-connector-col.align-end{align-items:flex-end;}
.flow-connector-label{font-size:11.5px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.4);margin-bottom:2px;}
.flow-connector.on-light .flow-connector-label{color:var(--ash);}
.flow-connector-node{
  display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:4px;max-width:230px;width:100%;
  background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);
}
.flow-connector.on-light .flow-connector-node{background:var(--paper);border-color:var(--fog);box-shadow:0 12px 26px rgba(24,25,37,0.05);}
.flow-connector-col.align-end .flow-connector-node{flex-direction:row-reverse;text-align:right;}
.flow-connector-node .ic{
  width:36px;height:36px;border-radius:4px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
  background:rgba(255,122,51,0.15);color:var(--brand);
}
.flow-connector-node .ic svg{width:17px;height:17px;}
.flow-connector-node strong{display:block;font-size:13px;font-weight:700;color:#fff;}
.flow-connector.on-light .flow-connector-node strong{color:var(--carbon);}
.flow-connector-node span{display:block;font-size:11.5px;color:rgba(255,255,255,0.5);margin-top:1px;}
.flow-connector.on-light .flow-connector-node span{color:var(--ash);}
.flow-connector-center{display:flex;flex-direction:column;align-items:center;gap:16px;}
.flow-connector-line{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;}
.flow-connector-line path{fill:none;stroke:var(--brand);stroke-width:1.5;opacity:.5;}
.flow-connector-line .beam-dot{fill:var(--brand);opacity:0;filter:drop-shadow(0 0 4px rgba(255,122,51,0.85));transition:opacity .5s ease;}
.flow-connector-line.is-live .beam-dot{opacity:1;}
@media (prefers-reduced-motion: reduce){ .flow-connector-line .beam-dot{display:none;} }
@media (max-width:900px){
  .flow-connector{grid-template-columns:1fr;justify-items:center;}
  .flow-connector-col,.flow-connector-col.align-end{align-items:center;}
  .flow-connector-col.align-end .flow-connector-node{flex-direction:row;text-align:left;}
  .flow-connector-line{display:none;}
}

/* ================= SHOWCASE GRID (web categories) ================= */
.showcase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media (max-width:980px){ .showcase-grid{grid-template-columns:1fr;max-width:460px;margin:0 auto;} }
.showcase-card{
  background:var(--paper);border:1px solid var(--fog);border-radius:4px;overflow:hidden;
  box-shadow:0 16px 36px rgba(24,25,37,0.06);transition:transform .25s ease, box-shadow .25s ease;
}
.showcase-card:hover{transform:translateY(-6px);box-shadow:0 30px 60px rgba(24,25,37,0.12);}
.showcase-mockups{padding:26px 26px 0;background:linear-gradient(180deg,var(--linen),var(--paper));}
.showcase-body{padding:22px 26px 26px;}
.showcase-body .ic{width:40px;height:40px;border-radius:4px;background:var(--brand-wash);color:var(--brand-dark);display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.showcase-body .ic svg{width:18px;height:18px;}
.showcase-body h3{font-size:18px;font-weight:700;letter-spacing:-0.02em;margin:0 0 8px;color:var(--carbon);}
.showcase-body p{font-size:13.5px;color:var(--graphite);line-height:1.55;margin:0;}

/* ================= SPLIT FEATURE (laptop + copy) ================= */
.split-feature{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
@media (max-width:900px){ .split-feature{grid-template-columns:1fr;gap:36px;} }
.split-feature-art{position:relative;}
.split-feature-glow{
  position:absolute;left:50%;top:50%;width:340px;height:340px;border-radius:50%;transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(255,122,51,0.28), transparent 68%);filter:blur(6px);z-index:0;
}
.split-feature-art .browser-mock{position:relative;z-index:1;}
.split-feature-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--brand-dark);margin-bottom:16px;}
.split-feature-kicker::before{content:"";width:20px;height:2px;background:var(--brand);display:block;}
.split-feature h2{font-size:clamp(28px,3.2vw,42px);font-weight:700;letter-spacing:-0.03em;line-height:1.12;margin:0 0 16px;color:var(--carbon);}
.split-feature p.lead{color:var(--graphite);font-size:16px;line-height:1.6;margin:0 0 26px;max-width:460px;}
.split-feature-list{display:flex;flex-wrap:wrap;gap:26px;}
.split-feature-list .item{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:600;color:var(--carbon);}
.split-feature-list .item svg{width:20px;height:20px;color:var(--brand);flex-shrink:0;}

/* ================= INLINE CTA BANNER ================= */
.inline-cta-banner{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding:36px 40px;border-radius:4px;background:linear-gradient(135deg,#fff7f1,#fff);border:1px solid var(--fog);
  box-shadow:0 20px 50px rgba(24,25,37,0.06);
}
.inline-cta-banner .left{display:flex;align-items:center;gap:18px;}
.inline-cta-banner .ic{width:56px;height:56px;border-radius:4px;background:var(--brand-wash);color:var(--brand-dark);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.inline-cta-banner .ic svg{width:24px;height:24px;}
.inline-cta-banner h3{font-size:21px;font-weight:700;letter-spacing:-0.02em;margin:0 0 4px;color:var(--carbon);}
.inline-cta-banner p{font-size:14px;color:var(--graphite);margin:0;}
.inline-cta-banner .right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;}
.inline-cta-banner .right small{font-size:12px;color:var(--ash);}
@media (max-width:720px){
  .inline-cta-banner{padding:28px;flex-direction:column;align-items:stretch;text-align:center;}
  .inline-cta-banner .left{flex-direction:column;text-align:center;}
  .inline-cta-banner .right{align-items:center;}
}

/* ================= REELS / CONTENT MOCKUP ================= */
.reels-phone{
  position:relative;width:270px;border-radius:34px;background:#0a0d13;padding:10px;
  box-shadow:0 46px 90px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.06) inset;
}
.reels-screen{position:relative;border-radius:26px;overflow:hidden;aspect-ratio:9/18.2;background:#000;}
.reels-screen img{width:100%;height:100%;object-fit:cover;filter:brightness(.82) saturate(1.05);}
.reels-screen::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.05) 32%, rgba(0,0,0,0.25) 100%);}
.reels-top{position:absolute;top:16px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 16px;z-index:2;color:#fff;font-size:12px;font-weight:700;}
.reels-top svg{width:16px;height:16px;}
.reels-top .rec{display:inline-flex;align-items:center;gap:6px;}
.reels-top .rec .dot{width:7px;height:7px;border-radius:50%;background:#ff3b3b;box-shadow:0 0 6px rgba(255,59,59,0.8);animation:recPulse 1.3s ease-in-out infinite;}
@keyframes recPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.35;transform:scale(0.8);}}
.reels-side{position:absolute;right:12px;bottom:96px;display:flex;flex-direction:column;align-items:center;gap:18px;z-index:2;color:#fff;}
.reels-side .btn{display:flex;flex-direction:column;align-items:center;gap:4px;}
.reels-side svg{width:24px;height:24px;fill:#fff;transition:transform .2s ease;}
.reels-side .btn.like svg{animation:heartBeat 2.8s ease-in-out infinite;}
@keyframes heartBeat{0%,88%,100%{transform:scale(1);}92%{transform:scale(1.3);}96%{transform:scale(1);}}
.reels-side span{font-size:10.5px;font-weight:700;}
.reels-side .btn.like span{transition:color .2s ease;}
@media (prefers-reduced-motion: reduce){
  .reels-top .rec .dot,.reels-side .btn.like svg{animation:none;}
}
.reels-bottom{position:absolute;left:16px;right:70px;bottom:22px;z-index:2;color:#fff;}
.reels-bottom .user{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;margin-bottom:6px;}
.reels-bottom .user span.dot{width:26px;height:26px;border-radius:50%;background:var(--brand);display:flex;align-items:center;justify-content:center;font-size:11px;}
.reels-bottom p{font-size:11.5px;line-height:1.4;color:rgba(255,255,255,0.86);margin:0;}
.reels-notch{position:absolute;left:50%;top:2px;transform:translateX(-50%);width:90px;height:20px;background:#0a0d13;border-radius:0 0 14px 14px;z-index:3;}

.content-float-stat{
  position:absolute;z-index:5;display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:4px;
  background:rgba(18,22,31,0.92);border:1px solid rgba(255,255,255,0.1);backdrop-filter:blur(14px);
  box-shadow:0 26px 50px rgba(0,0,0,0.35);animation:chipFloat 5.5s ease-in-out infinite;
}
.content-float-stat .num{font-size:20px;font-weight:800;color:#33d17a;line-height:1;}
.content-float-stat .lbl{font-size:11px;color:rgba(255,255,255,0.56);font-weight:600;margin-top:2px;}
.content-float-stat .ic{width:34px;height:34px;border-radius:50%;background:rgba(51,209,122,0.15);color:#33d17a;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.content-float-stat .ic svg{width:16px;height:16px;}

.social-dock{
  position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px;z-index:4;
}
.social-dock a{
  width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 14px 28px rgba(0,0,0,0.3);transition:transform .2s ease;
}
.social-dock a:hover{transform:translateY(-3px) scale(1.05);}
.social-dock a svg{width:19px;height:19px;}
.dock-ig{background:linear-gradient(135deg,#f9ce34,#ee2a7b 45%,#6228d7);}
.dock-tt{background:#111;}
.dock-fb{background:#1877f2;}
.dock-yt{background:#ff0033;}
@media (max-width:1100px){ .social-dock{display:none;} }

/* orbit dotted globe (abstract, not literal) */
.orbit-globe{position:absolute;right:-60px;top:-40px;width:420px;height:420px;opacity:.5;pointer-events:none;z-index:0;}
@media (max-width:900px){ .orbit-globe{display:none;} }

/* ---- content hero specific layout ---- */
.content-hero-inner{display:grid;grid-template-columns:1.05fr 0.95fr;gap:50px;align-items:center;position:relative;z-index:2;}
@media (max-width:980px){ .content-hero-inner{grid-template-columns:1fr;} }
.content-hero-art{position:relative;display:flex;justify-content:center;padding-right:40px;}
@media (max-width:1100px){ .content-hero-art{padding-right:0;} }
.content-float-stat.stat-reach{left:-10px;top:8%;}
@media (max-width:640px){
  .reels-phone{width:220px;}
  .content-float-stat{padding:10px 13px;}
  .content-float-stat .num{font-size:16px;}
}

/* ================= SECTION HEAD (mixed weight variant) ================= */
.section-head.left{text-align:left;margin-left:0;}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--brand-dark);margin-bottom:14px;}
.eyebrow::before{content:"";width:20px;height:2px;background:var(--brand);display:block;}
.eyebrow.on-dark{color:rgba(255,255,255,0.6);}

/* ================= IG PREVIEW CARD (content calendar / grid) ================= */
.ig-preview-card{
  background:var(--paper);border:1px solid var(--fog);border-radius:4px;padding:20px;max-width:340px;
  box-shadow:0 30px 60px rgba(24,25,37,0.1);
}
.ig-preview-head{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.ig-preview-head .avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#f9ce34,#ee2a7b 45%,#6228d7);flex-shrink:0;}
.ig-preview-head strong{display:block;font-size:14px;color:var(--carbon);}
.ig-preview-head span{display:block;font-size:11.5px;color:var(--ash);}
.ig-preview-head .follow{margin-left:auto;font-size:11px;font-weight:700;background:var(--carbon);color:#fff;padding:7px 13px;border-radius:4px;}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.ig-grid-tile{aspect-ratio:1;border-radius:4px;position:relative;overflow:hidden;background:linear-gradient(160deg,var(--art-a,#ffd8c2),var(--art-b,#ff9a5c));}
.ig-grid-tile img{width:100%;height:100%;object-fit:cover;display:block;}
.ig-grid-tile .play{position:absolute;top:6px;right:6px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,0.5));}
.ig-grid-tile .play svg{width:13px;height:13px;fill:#fff;}

/* ================= RESPONSIVE: SERVICE HERO GENERIC ================= */
@media (max-width:900px){
  .service-hero .hero-inner{grid-template-columns:1fr;}
  .content-hero-art{margin-top:8px;}
  .avatar-trust{justify-content:center;}
}

/* ================================================================
   V3 — PREMIUM LAYER (devices, light beams, tech frames, type)
   ================================================================ */

/* ---------- hero typography: weight contrast like the homepage ---------- */
.service-hero h1,.service-hero-dark h1{font-weight:780;line-height:1.02;letter-spacing:-0.045em;}
.service-hero h1 .hero-title-soft,.service-hero-dark h1 .hero-title-soft{font-weight:300;letter-spacing:-0.035em;margin-bottom:.06em;}
.service-hero-dark h1 .hero-title-soft{color:rgba(255,255,255,0.86);}
.service-hero h1 .hero-title-tag,.service-hero-dark h1 .hero-title-tag{margin:0 .04em;}
.sw{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .02em .1em;margin:0 -.02em -.1em;}
.sw.sw-tag{overflow:visible;}
.sw-i{display:inline-block;will-change:transform;}

.service-hero-dark.hero{text-align:left;}
.service-hero-dark .hero-actions{justify-content:flex-start;}
.service-hero-dark .desc{margin-left:0;}
@media (max-width:980px){
  .service-hero-dark.hero{text-align:center;}
  .service-hero-dark .hero-actions,.service-hero-dark .icon-feature-row{justify-content:center;}
  .service-hero-dark .desc{margin-left:auto;margin-right:auto;}
  .service-hero-dark .icon-feature{align-items:center;}
  .service-hero-dark .service-hero-art,.service-hero-dark .content-hero-art{text-align:left;}
}
@media (max-width:720px){
  .flow-automation-art .flow-app{width:48px;height:48px;left:-6px !important;}
  .flow-automation-art .flow-app svg{width:24px;height:24px;}
  .flow-automation-art .app-whatsapp{top:70px;}
  .flow-automation-art .app-instagram{top:185px;}
  .flow-automation-art .app-messenger{top:300px;}
}

/* ---------- mixed-weight section headings ---------- */
.h-mix{font-weight:520;}
.h-mix .l{font-weight:300;}
.h-mix strong{font-weight:760;}
.h-mix em{font-style:normal;font-weight:760;color:var(--brand);}
.section-head h2.h-mix,.split-feature h2.h-mix{font-size:clamp(30px,3.8vw,48px);letter-spacing:-0.045em;line-height:1.06;}

/* ---------- animated light running along the border ---------- */
@property --beam-a{syntax:'<angle>';inherits:false;initial-value:0deg;}
.beam-border{isolation:isolate;}
.inline-cta-banner{position:relative;}
.beam-border::after,
.beam-hover::after,
.automation-events div.is-active::after{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:3;
  background:conic-gradient(from var(--beam-a), transparent 0deg 250deg, rgba(255,122,51,0.15) 275deg, #ff7a33 325deg, #ffe0cc 348deg, transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:beamSpin 3.6s linear infinite;
}
.beam-hover{position:relative;}
.beam-hover::after{opacity:0;transition:opacity .35s ease;}
.beam-hover:hover::after{opacity:1;}
@keyframes beamSpin{to{--beam-a:360deg;}}

/* ---------- animated tech corners ---------- */
.tech-frame{position:relative;}
.tech-frame > .tc{
  position:absolute;width:20px;height:20px;border:0 solid var(--brand);pointer-events:none;z-index:6;
  animation:tcBreath 3.4s ease-in-out infinite;
}
.tech-frame > .tc.tl{top:-12px;left:-12px;border-top-width:2px;border-left-width:2px;--tx:-5px;--ty:-5px;}
.tech-frame > .tc.tr{top:-12px;right:-12px;border-top-width:2px;border-right-width:2px;--tx:5px;--ty:-5px;}
.tech-frame > .tc.bl{bottom:-12px;left:-12px;border-bottom-width:2px;border-left-width:2px;--tx:-5px;--ty:5px;}
.tech-frame > .tc.br{bottom:-12px;right:-12px;border-bottom-width:2px;border-right-width:2px;--tx:5px;--ty:5px;}
@keyframes tcBreath{0%,100%{translate:0 0;opacity:1;}50%{translate:var(--tx) var(--ty);opacity:.45;}}
.tech-frame:hover > .tc{animation-duration:1.2s;}

/* ---------- cursor spotlight ---------- */
.spotlight{position:relative;isolation:isolate;--mx:50%;--my:50%;}
.spotlight::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;transition:opacity .35s ease;
  background:radial-gradient(420px circle at var(--mx) var(--my), rgba(255,122,51,0.16), transparent 42%);
}
.spotlight:hover::before{opacity:1;}

/* ---------- tech grid + scanline for dark sections ---------- */
.tech-grid-bg{
  position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background-image:linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 75% 65% at 60% 40%, #000 25%, transparent 78%);
  mask-image:radial-gradient(ellipse 75% 65% at 60% 40%, #000 25%, transparent 78%);
}
.tech-grid-bg::after{
  content:"";position:absolute;left:0;right:0;height:140px;top:-140px;
  background:linear-gradient(180deg,transparent,rgba(255,122,51,0.1) 60%,rgba(255,122,51,0.22) 98%,transparent);
  animation:scanDown 6.5s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes scanDown{to{top:100%;}}
.cta-band{position:relative;}
.cta-band .cta-inner{position:relative;z-index:2;}

/* ---------- REAL PHONE (rounded, island, glass) ---------- */
.automation-phone{
  border-radius:48px;border:10px solid #141a24;padding:48px 16px 16px;overflow:hidden;
  box-shadow:0 0 0 1.5px #3a4252, 0 0 0 4px #0b0e14, 0 46px 90px rgba(0,0,0,0.5), inset 0 0 0 1px rgba(255,255,255,0.05);
}
.automation-phone::before{
  content:"";position:absolute;top:12px;left:50%;transform:translateX(-50%);width:82px;height:24px;border-radius:20px;background:#000;z-index:6;
}
.automation-phone::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:7;
  background:linear-gradient(118deg, rgba(255,255,255,0.09) 0%, rgba(255,255,255,0.02) 28%, transparent 45%);
}
.automation-phone .phone-status{position:absolute;top:15px;left:24px;right:22px;margin:0;font-size:12px;z-index:6;}
.automation-profile img{border-radius:50%;}
.auto-bubble{border-radius:18px;}
.auto-bubble.incoming{border-bottom-left-radius:6px;}
.auto-bubble.outgoing{border-bottom-right-radius:6px;background:linear-gradient(135deg,#12a37a,#0f8d66);}
.typing-dots{border-radius:18px;border-bottom-left-radius:6px;}
.quick-actions span{border-radius:12px;}
.phone-input{background:rgba(255,255,255,0.06);border-radius:22px;padding:8px 14px;}
.phone-input span{font-size:22px;}
.flow-app{border-radius:18px;}
.flow-app::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(160deg, rgba(255,255,255,0.35), transparent 45%);
}

/* reels phone refinement */
.reels-phone{border-radius:50px;padding:11px;background:#0b0e14;box-shadow:0 0 0 1.5px #3a4252, 0 0 0 4px #07090d, 0 50px 100px rgba(0,0,0,0.55);}
.reels-screen{border-radius:39px;}
.reels-notch{top:21px;width:84px;height:24px;border-radius:20px;background:#000;}
.reels-top{top:52px;}
.reels-screen::before{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;
  background:linear-gradient(118deg, rgba(255,255,255,0.12) 0%, transparent 32%);
}
.reels-progress{position:absolute;left:16px;right:16px;bottom:12px;height:2.5px;border-radius:2px;background:rgba(255,255,255,0.25);z-index:3;overflow:hidden;}
.reels-progress i{display:block;height:100%;width:100%;background:#fff;transform-origin:left;animation:reelProgress 7s linear infinite;}
@keyframes reelProgress{from{transform:scaleX(0);}to{transform:scaleX(1);}}
.fheart{position:absolute;right:26px;bottom:150px;z-index:5;width:22px;height:22px;pointer-events:none;animation:heartRise 2.6s ease-out forwards;}
.fheart svg{width:100%;height:100%;filter:drop-shadow(0 2px 6px rgba(0,0,0,0.35));}
@keyframes heartRise{
  0%{transform:translate(0,0) scale(.3);opacity:0;}
  15%{transform:translate(var(--hx1),-30px) scale(1.1);opacity:1;}
  100%{transform:translate(var(--hx2),-230px) scale(.8) rotate(var(--hr));opacity:0;}
}

/* small device phone (showcases, web hero) */
.device-phone{
  position:absolute;z-index:4;width:118px;border-radius:26px;padding:5px;background:#0d1016;
  box-shadow:0 0 0 1px #3a4252, 0 30px 60px rgba(0,0,0,0.35);
}
.device-phone::before{content:"";position:absolute;top:10px;left:50%;transform:translateX(-50%);width:34px;height:10px;border-radius:8px;background:#000;z-index:3;}
.device-phone .screen{position:relative;border-radius:21px;overflow:hidden;aspect-ratio:9/19;background:#fff;}
.device-phone .screen img{width:100%;height:100%;object-fit:cover;display:block;}
.device-phone .screen .ov{position:absolute;left:0;right:0;bottom:0;padding:18px 9px 10px;background:linear-gradient(0deg,rgba(0,0,0,0.78),transparent);color:#fff;}
.device-phone .screen .ov b{display:block;font-size:10px;line-height:1.15;}
.device-phone .screen .ov span{display:inline-block;margin-top:6px;font-size:7.5px;font-weight:700;background:var(--brand);padding:4px 7px;border-radius:10px;}
.device-phone .screen .top{position:absolute;top:0;left:0;right:0;padding:22px 9px 6px;font-size:8.5px;font-weight:800;color:#fff;z-index:2;background:linear-gradient(180deg,rgba(0,0,0,0.5),transparent);}

/* ---------- REAL LAPTOP ---------- */
.device-laptop{position:relative;z-index:1;}
.laptop-lid{
  position:relative;background:linear-gradient(180deg,#1a1f28,#0c0f15);border-radius:20px 20px 6px 6px;padding:16px 14px 20px;
  box-shadow:0 0 0 1.5px #3b4250, 0 50px 100px rgba(10,14,22,0.35);
}
.laptop-lid::before{content:"";position:absolute;top:6px;left:50%;width:5px;height:5px;border-radius:50%;background:#2c333f;transform:translateX(-50%);}
.laptop-screen{position:relative;border-radius:6px;overflow:hidden;aspect-ratio:16/10;background:#fff;}
.laptop-screen::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg, rgba(255,255,255,0.14) 0%, transparent 30%);z-index:5;}
.laptop-base{
  position:relative;height:15px;margin:0 -8%;border-radius:2px 2px 16px 16px;
  background:linear-gradient(180deg,#e3e6ea 0%,#bfc3ca 45%,#8d929a 100%);
  box-shadow:0 26px 40px rgba(10,14,22,0.28);
}
.laptop-base::before{content:"";position:absolute;top:0;left:50%;width:15%;height:6px;transform:translateX(-50%);border-radius:0 0 9px 9px;background:linear-gradient(180deg,#9aa0a8,#b8bcc3);}
.laptop-chrome{position:relative;z-index:4;display:flex;align-items:center;gap:10px;padding:7px 10px;background:#f1f3f5;border-bottom:1px solid #e3e6ea;}
.laptop-chrome .dots{display:flex;gap:5px;}
.laptop-chrome .dots i{width:7px;height:7px;border-radius:50%;background:#ff5f57;}
.laptop-chrome .dots i:nth-child(2){background:#febc2e;}
.laptop-chrome .dots i:nth-child(3){background:#28c840;}
.laptop-chrome .url{flex:1;max-width:60%;margin:0 auto;background:#fff;border-radius:999px;padding:3px 10px;font-size:9.5px;color:#7a818c;text-align:center;border:1px solid #e3e6ea;}
.laptop-viewport{position:absolute;top:30px;left:0;right:0;bottom:0;overflow:hidden;}

/* ---------- MOCK SITES v2 (real imagery) ---------- */
.ms{font-family:var(--font);color:#16181f;background:#fff;}
.ms img{display:block;width:100%;height:100%;object-fit:cover;}
.ms-nav{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;font-size:10px;font-weight:600;color:#5a606b;}
.ms-nav .b{font-weight:800;font-size:14px;color:#16181f;letter-spacing:-0.02em;}
.ms-nav .l{display:flex;gap:14px;}
.ms-nav .c{background:#16181f;color:#fff;padding:6px 11px;border-radius:999px;font-size:9px;}
.ms-hero{position:relative;height:210px;margin:0 12px;border-radius:12px;overflow:hidden;color:#fff;}
.ms-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,8,6,0.82) 0%,rgba(10,8,6,0.35) 55%,transparent 100%);}
.ms-hero .t{position:absolute;left:22px;top:50%;transform:translateY(-50%);z-index:2;max-width:55%;}
.ms-hero .t small{display:block;font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.7;margin-bottom:6px;}
.ms-hero .t h5{margin:0 0 8px;font-size:22px;line-height:1.02;font-weight:300;letter-spacing:-0.02em;font-family:Georgia, 'Times New Roman', serif;}
.ms-hero .t h5 b{font-weight:700;font-style:italic;}
.ms-hero .t p{margin:0 0 12px;font-size:9.5px;opacity:.8;line-height:1.45;}
.ms-hero .t .bt{display:inline-block;font-size:9px;font-weight:700;padding:7px 12px;border-radius:999px;background:#fff;color:#16181f;}
.ms-strip{display:flex;justify-content:space-around;padding:12px 16px;font-size:9px;color:#5a606b;font-weight:600;}
.ms-strip span{display:flex;align-items:center;gap:5px;}
.ms-strip svg{width:11px;height:11px;color:var(--brand);}
.ms-sec{padding:14px 20px 6px;}
.ms-sec h6{margin:0 0 10px;font-size:13px;font-weight:300;letter-spacing:-0.02em;}
.ms-sec h6 b{font-weight:800;}
.ms-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.ms-prod .ph{aspect-ratio:1;border-radius:10px;overflow:hidden;background:#f3efe9;margin-bottom:6px;}
.ms-prod .n{font-size:9.5px;font-weight:700;}
.ms-prod .p{font-size:9px;color:var(--brand-dark);font-weight:700;}
.ms-quote{margin:12px 20px;padding:14px;border-radius:12px;background:#f6f3ef;font-size:9.5px;line-height:1.5;color:#3b3f47;}
.ms-quote b{display:block;margin-top:6px;font-size:9px;}
.ms-foot{margin-top:10px;padding:16px 20px;background:#16181f;color:rgba(255,255,255,0.7);font-size:9px;display:flex;justify-content:space-between;}
.ms-book{position:absolute;right:16px;top:50%;transform:translateY(-50%);z-index:2;width:42%;background:#fff;color:#16181f;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px;box-shadow:0 10px 30px rgba(0,0,0,0.3);}
.ms-book .f{background:#f3f4f6;border-radius:6px;padding:6px 8px;font-size:8.5px;color:#6b7280;display:flex;justify-content:space-between;}
.ms-book .go{background:#16181f;color:#fff;text-align:center;border-radius:6px;padding:7px;font-size:9px;font-weight:700;}
.ms-book .h{font-size:10px;font-weight:800;}

/* showcase: browser window with hover-scroll preview */
.showcase-window{position:relative;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(24,25,37,0.08), 0 24px 50px rgba(24,25,37,0.14);}
.showcase-window .laptop-chrome{padding:6px 9px;}
.showcase-screen{position:relative;height:200px;overflow:hidden;}
.showcase-card .device-phone{right:10px;bottom:-24px;width:92px;}
.showcase-card{position:relative;}
.showcase-card .showcase-mockups{position:relative;}

/* ---------- web hero composition ---------- */
.web-hero-art{position:relative;padding:34px 40px 60px 10px;}
.web-hero-art .device-phone{right:-4px;bottom:22px;width:128px;}
.web-hero-art .content-float-stat{z-index:6;}

/* ---------- content hero: cinematic photo background ---------- */
.content-hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
.content-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:60% 40%;opacity:.42;transform:scale(1.08);}
.content-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0f18 0%,rgba(10,15,24,0.92) 34%,rgba(10,15,24,0.45) 70%,rgba(10,15,24,0.75) 100%),linear-gradient(0deg,#0a0f18 0%,transparent 35%);}
.content-float-card{
  position:absolute;z-index:5;display:flex;align-items:center;gap:10px;padding:12px 15px;border-radius:14px;
  background:rgba(18,22,31,0.82);border:1px solid rgba(255,255,255,0.1);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:#fff;font-size:12px;box-shadow:0 26px 50px rgba(0,0,0,0.4);animation:chipFloat 6s ease-in-out infinite;
}
.content-float-card .ic{width:34px;height:34px;border-radius:10px;background:rgba(255,122,51,0.16);color:var(--brand);display:flex;align-items:center;justify-content:center;}
.content-float-card .ic svg{width:16px;height:16px;}
.content-float-card strong{display:block;font-size:12.5px;}
.content-float-card span{display:block;font-size:10.5px;color:rgba(255,255,255,0.55);}
.content-float-stat{border-radius:14px;}
.content-float-stat .ic{border-radius:10px;}
@media (max-width:640px){ .content-float-card{display:none;} }

/* ---------- lead toast (flow hero) ---------- */
.lead-toast{
  position:absolute;right:0;bottom:44px;z-index:8;display:flex;align-items:center;gap:11px;width:246px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,0.96);color:#16181f;box-shadow:0 26px 50px rgba(0,0,0,0.4);
}
.lead-toast .ic{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;background:#10c764;}
.lead-toast .ic svg{width:17px;height:17px;}
.lead-toast strong{display:block;font-size:12.5px;}
.lead-toast span{display:block;font-size:11px;color:#6b7280;}
.live-badge b{color:#fff;font-variant-numeric:tabular-nums;}
@media (max-width:720px){ .lead-toast{display:none;} }

/* ---------- light floating chips (web hero) ---------- */
.hchip{
  position:absolute;z-index:6;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:14px;
  background:rgba(255,255,255,0.94);border:1px solid rgba(24,25,37,0.07);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 22px 46px rgba(24,25,37,0.16);animation:chipFloat 5.5s ease-in-out infinite;
}
.hchip .ic{width:36px;height:36px;border-radius:10px;background:var(--brand-wash);color:var(--brand-dark);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hchip .ic svg{width:17px;height:17px;}
.hchip strong{display:block;font-size:13.5px;font-weight:780;color:var(--carbon);letter-spacing:-0.01em;}
.hchip span{display:block;font-size:11px;color:var(--graphite);}
.hchip .spark{display:flex;align-items:flex-end;gap:3px;height:26px;margin-left:6px;}
.hchip .spark i{display:block;width:5px;border-radius:2px;background:linear-gradient(180deg,#ff9a5c,#ff6f2d);transform-origin:bottom;animation:sparkBar 1.6s ease-in-out infinite;}
@keyframes sparkBar{0%,100%{transform:scaleY(.45);}50%{transform:scaleY(1);}}
.score-ring{width:38px;height:38px;transform:rotate(-90deg);flex-shrink:0;}
.score-ring circle{fill:none;stroke-width:3.5;}
.score-ring .bg{stroke:#f0e6df;}
.score-ring .fg{stroke:#22c55e;stroke-linecap:round;stroke-dasharray:94.2;stroke-dashoffset:94.2;animation:ringFill 2.2s cubic-bezier(.2,.8,.2,1) .8s forwards;}
@keyframes ringFill{to{stroke-dashoffset:1.9;}}
.cta-inner h2.h-mix{font-size:clamp(32px,4.4vw,54px);font-weight:520;line-height:1.04;letter-spacing:-0.045em;}
@media (max-width:980px){
  .service-hero-art.web-hero-art{padding:28px 18px 50px;max-width:640px;width:100%;margin:0 auto;transform:none;min-height:0;}
  .web-hero-art .hc-2{right:-6px !important;}
  .web-hero-art .hc-1{left:-6px !important;}
}
@media (max-width:640px){
  .service-hero-art.web-hero-art{padding:44px 0 70px;margin-bottom:0;}
  .web-hero-art .device-phone{width:86px;right:-4px;bottom:18px;}
  .web-hero-art .hc-1{top:0 !important;left:-2px !important;}
  .web-hero-art .hc-2{top:auto !important;bottom:0;right:auto !important;left:6px;}
  .ms-hero .t h5{font-size:17px;}
  .laptop-viewport .ms-nav .l,.showcase-screen .ms-nav .l,.laptop-viewport .ms-strip span:nth-child(3){display:none;}
  .hchip{padding:8px 10px 8px 8px;}
  .hchip strong{font-size:12px;}
  .hchip .spark,.web-hero-art .hc-3{display:none;}
  .showcase-card .device-phone{width:78px;}
}

/* ---------- Instagram profile inside a real phone ---------- */
.ig-phone-wrap{position:relative;display:flex;justify-content:center;padding:20px 70px;}
.ig-phone-wrap .split-feature-glow{width:380px;height:380px;}
.ig-phone{width:290px;position:relative;z-index:1;}
.ig-screen{background:#fff;}
.ig-screen::after,.ig-screen::before{display:none;}
.ig-screen img{filter:none;}
.ig-status{position:absolute;top:0;left:0;right:0;height:46px;display:flex;align-items:center;justify-content:space-between;padding:6px 26px 0;font-size:12px;font-weight:700;color:#16181f;z-index:3;background:#fff;}
.ig-status-r{display:flex;gap:3px;}
.ig-status-r i{width:4px;height:9px;border-radius:1px;background:#16181f;display:block;}
.ig-status-r i:nth-child(1){height:5px;margin-top:4px;}
.ig-status-r i:nth-child(2){height:7px;margin-top:2px;}
.ig-viewport{position:absolute;top:46px;left:0;right:0;bottom:0;overflow:hidden;}
.ig-top{display:flex;align-items:center;justify-content:space-between;padding:6px 16px 10px;font-size:15px;color:#16181f;}
.ig-top svg{width:18px;height:18px;}
.ig-profile{display:flex;align-items:center;gap:16px;padding:0 16px 10px;}
.ig-avatar{width:66px;height:66px;border-radius:50%;padding:3px;background:conic-gradient(from 200deg,#f9ce34,#ee2a7b,#6228d7,#f9ce34);flex-shrink:0;}
.ig-avatar img{width:100%;height:100%;border-radius:50%;background:#fff;object-fit:contain;padding:10px;border:3px solid #fff;}
.ig-stats{display:flex;flex:1;justify-content:space-between;text-align:center;color:#16181f;}
.ig-stats b{display:block;font-size:14px;font-weight:800;}
.ig-stats span{font-size:10px;color:#6b7280;}
.ig-bio{padding:0 16px 10px;font-size:11px;line-height:1.4;color:#16181f;}
.ig-bio b{display:block;font-size:11.5px;}
.ig-bio span{color:var(--brand-dark);font-weight:600;}
.ig-btns{display:flex;gap:6px;padding:0 16px 12px;}
.ig-btns span{flex:1;text-align:center;font-size:11px;font-weight:700;padding:7px;border-radius:8px;background:#eff1f4;color:#16181f;}
.ig-highlights{display:flex;gap:12px;padding:0 16px 14px;}
.ig-highlights div{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:9.5px;color:#16181f;}
.ig-highlights i{width:48px;height:48px;border-radius:50%;padding:2px;border:1.5px solid #d6d9de;display:block;overflow:hidden;}
.ig-highlights i img{border-radius:50%;width:100%;height:100%;object-fit:cover;}
.ig-screen .ig-grid{gap:2px;}
.ig-screen .ig-grid-tile{border-radius:0;}
@media (max-width:640px){ .ig-phone-wrap{padding:20px 0;} .ig-phone{width:250px;} .ig-phone-wrap .hchip{display:none;} }

/* ---------- softer premium radius for interactive surfaces ---------- */
.showcase-card,.testi-slide-card,.inline-cta-banner,.ig-preview-card{border-radius:16px !important;}
.plan-card{border-radius:18px !important;}
.plan-ribbon{border-radius:0 0 8px 8px;}
.flow-connector-node{border-radius:12px;}
.automation-events div{border-radius:14px;}

@media (prefers-reduced-motion: reduce){
  .beam-border::after,.beam-hover::after,.automation-events div.is-active::after,.tech-frame > .tc,.tech-grid-bg::after,.reels-progress i{animation:none;}
}

/* ================================================================
   V4 — FIXES: hero rhythm, connector phone, responsive, homepage
   ================================================================ */

/* ---------- dark heroes slide under the header with symmetric spacing ---------- */
:root{--header-h:102px;--hero-pad:92px;}
@media (max-width:900px){ :root{--header-h:86px;--hero-pad:56px;} }
section.hero.service-hero-dark{
  margin-top:calc(-1 * var(--header-h));
  padding-top:calc(var(--header-h) + var(--hero-pad));
  padding-bottom:var(--hero-pad);
}
section.hero.service-hero.service-hero-web{padding-top:var(--hero-pad);padding-bottom:var(--hero-pad);}

/* ---------- connector phone: real proportions + full chat ---------- */
.automation-phone.connector-phone{
  position:relative;left:auto;top:auto;transform:none;width:252px;min-height:0;aspect-ratio:9/19;
  padding:46px 12px 12px;display:flex;flex-direction:column;
}
.connector-phone .automation-profile{margin:0 0 8px;padding:0 4px 10px;border-bottom:1px solid rgba(255,255,255,0.08);gap:10px;}
.connector-phone .automation-profile img{width:36px;height:36px;padding:6px;}
.connector-phone .automation-profile strong{font-size:15px;}
.connector-phone .automation-profile span{display:flex;align-items:center;gap:5px;font-size:10.5px;}
.online-dot{width:6px;height:6px;border-radius:50%;background:#33d17a;display:inline-block;box-shadow:0 0 6px #33d17a;}
.chat-day{align-self:center;font-size:9.5px;color:rgba(255,255,255,0.55);background:rgba(255,255,255,0.07);padding:3px 10px;border-radius:10px;margin:2px 0 8px;}
.cp-chat{background:none !important;padding:0 !important;gap:7px !important;flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;}
.cp-chat .bubble{font-size:11.5px !important;line-height:1.38;padding:8px 11px !important;border-radius:16px !important;max-width:84% !important;}
.cp-chat .bubble.in{background:rgba(255,255,255,0.09) !important;border:0 !important;color:#fff !important;border-bottom-left-radius:5px !important;}
.cp-chat .bubble.out{background:linear-gradient(135deg,#12a37a,#0f8d66) !important;border-bottom-right-radius:5px !important;}
.cp-chat .bubble small{display:block;text-align:right;font-size:8.5px;opacity:.55;margin-top:3px;}
.connector-phone .phone-input{margin-top:10px;gap:8px;}
.connector-phone .phone-input em{flex:1;font-style:normal;font-size:11px;color:rgba(255,255,255,0.4);}

/* ---------- flow hero: rebuilt mobile composition (no overlaps) ---------- */
@media (max-width:720px){
  .service-hero-art.flow-automation-art{
    min-height:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;
    gap:14px 16px;padding:6px 0 0;margin-top:26px;transform:none;
  }
  .flow-automation-art > .flow-app,
  .flow-automation-art > .automation-phone,
  .flow-automation-art > .automation-events,
  .flow-automation-art > .live-badge{position:relative;left:auto !important;right:auto;top:auto !important;bottom:auto;}
  .flow-automation-art > .flow-app{order:-1;width:46px;height:46px;}
  .flow-automation-art > .flow-app svg{width:22px;height:22px;}
  .flow-automation-art > .automation-phone{order:1;width:262px;min-height:0;margin:4px calc((100% - 262px) / 2) 0;transform:none;}
  .flow-automation-art > .automation-events{order:2;width:100%;grid-template-columns:1fr 1fr;gap:8px;}
  .flow-automation-art > .automation-events div{text-align:left;}
  .flow-automation-art > .live-badge{order:3;display:inline-flex;}
  .flow-beams,.flow-orbit,.lead-toast{display:none !important;}
}
@media (min-width:721px) and (max-width:1100px){
  .service-hero-art.flow-automation-art{max-width:600px;}
}
@media (max-width:420px){
  .flow-automation-art > .automation-events{grid-template-columns:1fr;}
}

/* ---------- general responsive hardening ---------- */
@media (max-width:980px){
  .content-hero-inner{gap:36px;}
  .content-hero-art{max-width:520px;width:100%;margin:0 auto;}
  .content-float-card{left:0 !important;}
  .content-float-card[style*="right"]{left:auto !important;right:0 !important;}
  .split-feature-art.tech-frame{margin:0 12px;}
  .showcase-card .device-phone{right:6px;}
}
@media (max-width:640px){
  .service-hero h1,.service-hero-dark h1{font-size:clamp(34px,10vw,44px);}
  .icon-feature-row{gap:14px 18px;}
  .icon-feature .box{width:46px;height:46px;}
  .hero-actions{width:100%;}
  .hero-actions .btn-primary,.hero-actions .btn-ghost{flex:1 1 100%;text-align:center;justify-content:center;}
  .avatar-trust{flex-wrap:nowrap;justify-content:center;text-align:left;}
  .avatar-trust p{max-width:230px;}
  .flow-connector-node{max-width:330px;}
  .content-float-stat.stat-reach{left:0;top:0;}
  .reels-phone{width:236px;}
  .section-head h2.h-mix,.split-feature h2.h-mix{font-size:clamp(28px,8.4vw,36px);}
  .plan-card{padding:30px 22px;}
  .inline-cta-banner .right .btn-primary{width:100%;text-align:center;}
  .flow-connector-center .connector-phone{width:238px;}
  .testi-carousel-arrow{width:38px;height:38px;}
  .trust-logos{gap:18px 26px;}
}

/* ---------- official brand glyphs ---------- */
.brand-glyph{display:block;width:30px;height:30px;filter:brightness(0) invert(1);position:relative;z-index:1;}
.flow-app .brand-glyph{width:30px;height:30px;}
.flow-app.app-whatsapp{background:linear-gradient(160deg,#3ee07a,#1faa55);}
.ic.ic-brand .brand-glyph{width:18px;height:18px;}
.ic.ic-wa{background:linear-gradient(160deg,#3ee07a,#1faa55) !important;}
.ic.ic-ig{background:linear-gradient(135deg,#feda75 0%,#fa7e1e 25%,#d62976 55%,#962fbf 80%,#4f5bd5 100%) !important;}
.ic.ic-ms{background:linear-gradient(135deg,#0a78ff,#a033ff 60%,#ff5c87) !important;}
.lead-toast .ic .brand-glyph{width:18px;height:18px;}
.social-dock .brand-glyph{width:20px;height:20px;}
.dock-ig{background:linear-gradient(135deg,#feda75 0%,#fa7e1e 25%,#d62976 55%,#962fbf 80%,#4f5bd5 100%);}
.dock-tt{background:#000;box-shadow:0 14px 28px rgba(0,0,0,0.3), -2px -2px 0 rgba(37,244,238,0.55) inset, 2px 2px 0 rgba(254,44,85,0.55) inset;}
@media (max-width:720px){ .flow-automation-art > .flow-app .brand-glyph{width:22px;height:22px;} }

/* ---------- mobile top bar breathing room ---------- */
@media (max-width:900px){
  header{padding-left:12px;padding-right:12px;}
  .nav{padding:0 14px 0 18px;}
}

/* ---------- branded scrollbar ---------- */
::-webkit-scrollbar{width:11px;height:11px;}
::-webkit-scrollbar-track{background:#f4f0ec;}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ffa066,#ff7a33 50%,#e35f1a);border-radius:999px;border:3px solid #f4f0ec;}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#ff8a45,#e35f1a);border-width:2px;}
::-webkit-scrollbar-corner{background:#f4f0ec;}
@supports not selector(::-webkit-scrollbar){
  html{scrollbar-color:#ff7a33 #f4f0ec;scrollbar-width:thin;}
}

/* ---------- homepage premium layer ---------- */
.tech-grid-bg.light{
  background-image:linear-gradient(rgba(24,25,37,0.05) 1px, transparent 1px),linear-gradient(90deg, rgba(24,25,37,0.05) 1px, transparent 1px);
  -webkit-mask-image:radial-gradient(ellipse 60% 70% at 72% 45%, #000 15%, transparent 72%);
  mask-image:radial-gradient(ellipse 60% 70% at 72% 45%, #000 15%, transparent 72%);
}
.tech-grid-bg.light::after{background:linear-gradient(180deg,transparent,rgba(255,122,51,0.06) 60%,rgba(255,122,51,0.16) 98%,transparent);}
.hero-home{position:relative;}
.hero-home .hero-home-inner{position:relative;z-index:1;}
.hero-photo-frame{position:relative;width:640px;max-width:112%;}
.hero-photo-frame .hero-photo{width:100%;max-width:100%;}
@media (max-width:640px){ .hero-photo-frame{width:390px;max-width:118%;} }
.pillar .icon{transition:background .24s ease, color .24s ease, transform .4s cubic-bezier(.34,1.56,.64,1);}
.pillar:hover .icon{transform:translateY(-4px) rotate(-8deg) scale(1.08);}
.pillar.beam-hover::after{z-index:4;}
.pillar.beam-hover{isolation:isolate;}
.hero-home .hero-collage.tech-frame > .tc{z-index:8;}
.testi-card{position:relative;}
.process-band .tech-grid-bg{-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 50%, #000 20%, transparent 80%);mask-image:radial-gradient(ellipse 80% 70% at 50% 50%, #000 20%, transparent 80%);}
.process-band .tech-grid-bg{background-image:linear-gradient(rgba(255,255,255,0.08) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px);}
.process-band .tech-grid-bg::after{background:linear-gradient(180deg,transparent,rgba(255,255,255,0.12) 70%,rgba(255,255,255,0.25) 98%,transparent);}
.process-step .n{transition:transform .35s cubic-bezier(.34,1.56,.64,1), background .25s ease;}
.process-step:hover .n{transform:translateY(-6px) scale(1.08);background:rgba(255,255,255,0.3);}
.process-step .n::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid rgba(255,255,255,0.45);animation:pulseRing 2.8s ease-out infinite;}
.process-step .n{position:relative;}
.process-orange .n::after{animation-delay:0s;}
.process-blue .n::after{animation-delay:.5s;}
.process-green .n::after{animation-delay:1s;}
.process-purple .n::after{animation-delay:1.5s;}
.process-gold .n::after{animation-delay:2s;}
.process-path path{animation:beamFlow 1.2s linear infinite;}
.integration-logo{transition:filter .25s ease, opacity .25s ease, transform .3s cubic-bezier(.34,1.56,.64,1);}
.integration-logo:hover{transform:translateY(-4px) scale(1.08);}
@media (prefers-reduced-motion: reduce){ .process-step .n::after,.process-path path{animation:none;} }

/* ================================================================
   V5 — LIVE SIMULATIONS: WhatsApp, connectors, process, reels, KPIs
   ================================================================ */

/* ---------- KPI tiles: one consistent grid, centered content ---------- */
.icon-feature-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:560px;margin:30px 0 34px;}
.icon-feature{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:10px;
  padding:16px 8px 14px;border-radius:14px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.09);
  transition:border-color .25s ease, background .25s ease, transform .3s ease;
}
.icon-feature:hover{border-color:rgba(255,122,51,0.45);background:rgba(255,122,51,0.06);transform:translateY(-3px);}
.icon-feature span{font-size:12.5px;line-height:1.3;}
.icon-feature.on-light{background:#fff;border-color:var(--fog);box-shadow:0 10px 24px rgba(24,25,37,0.05);}
.icon-feature-row[style*="justify-content:center"]{margin-left:auto;margin-right:auto;}
.service-hero-dark .icon-feature{align-items:center;}
@media (max-width:980px){ .service-hero-dark .icon-feature-row{margin-left:auto;margin-right:auto;} }
@media (max-width:640px){
  .icon-feature-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:100%;}
  .icon-feature{flex-direction:row;justify-content:flex-start;text-align:left;padding:12px 14px;gap:12px;min-width:0;}
  .icon-feature .box{width:40px;height:40px;flex:0 0 40px;}
  .icon-feature span{font-size:12px;line-height:1.22;min-width:0;overflow-wrap:anywhere;}
  .icon-feature span br{display:block;}
}

/* ---------- WhatsApp (dark mode, realistic) ---------- */
.automation-phone.has-wa{padding:0;background:#0b141a;height:476px;min-height:0;}
.automation-phone.connector-phone.has-wa{height:auto;}
.automation-phone.has-wa::after{z-index:9;}
.wa{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;background:#0b141a;font-family:var(--font);text-align:left;}
.wa-sb{height:40px;flex-shrink:0;background:#1f2c34;display:flex;align-items:center;justify-content:space-between;padding:6px 24px 0;color:#e9edef;font-size:12px;font-weight:700;}
.wa-sb .r{display:flex;gap:5px;align-items:center;}
.wa-sb svg{width:13px;height:13px;}
.wa-head{display:flex;align-items:center;gap:7px;padding:6px 10px 9px 6px;background:#1f2c34;color:#e9edef;flex-shrink:0;}
.wa-head > svg{width:18px;height:18px;flex-shrink:0;}
.wa-av{width:32px;height:32px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;}
.wa-av img{width:80%;height:auto;}
.wa-who{flex:1;min-width:0;line-height:1.2;}
.wa-who b{display:flex;align-items:center;gap:4px;font-size:13.5px;font-weight:600;white-space:nowrap;}
.wa-who b svg{width:13px;height:13px;color:#25d366;flex-shrink:0;}
.wa-status{display:block;font-size:10.5px;color:#8696a0;white-space:nowrap;}
.wa-status.typing{color:#25d366;}
.wa-acts{display:flex;gap:13px;color:#e9edef;}
.wa-acts svg{width:17px;height:17px;}
.wa-body{
  flex:1;min-height:0;position:relative;overflow:hidden;background-color:#0b141a;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90' viewBox='0 0 90 90'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.045' stroke-width='1.3' stroke-linecap='round'%3E%3Ccircle cx='15' cy='17' r='6'/%3E%3Cpath d='M52 10l8 8-8 8'/%3E%3Crect x='32' y='46' width='13' height='10' rx='2'/%3E%3Cpath d='M68 55c5 0 7 3 7 7s-3 7-7 7'/%3E%3Cpath d='M9 64l7-7 7 7'/%3E%3Cpath d='M74 18h9M78.5 13.5v9'/%3E%3Cpath d='M44 80c3-4 7-4 10 0'/%3E%3C/g%3E%3C/svg%3E");
}
.wa-msgs{position:absolute;left:0;right:0;bottom:0;padding:8px 10px 8px;display:flex;flex-direction:column;gap:3px;}
.wa-day{align-self:center;background:#182229;color:#8696a0;font-size:9.5px;padding:4px 10px;border-radius:7px;margin:2px 0 4px;}
.wa-enc{align-self:center;max-width:92%;background:#182229;color:#ffd279;font-size:9px;line-height:1.35;text-align:center;padding:5px 9px;border-radius:7px;margin-bottom:6px;}
.wa-b{position:relative;max-width:82%;padding:5px 8px 5px 9px;border-radius:8px;font-size:11.8px;line-height:1.36;color:#e9edef;box-shadow:0 1px 0.5px rgba(0,0,0,0.25);transform-origin:bottom left;}
.wa-b.in{align-self:flex-start;background:#202c33;border-top-left-radius:0;margin-left:6px;}
.wa-b.out{align-self:flex-end;background:#005c4b;border-top-right-radius:0;margin-right:6px;transform-origin:bottom right;}
.wa-b::before{content:"";position:absolute;top:0;width:8px;height:10px;background:inherit;}
.wa-b.in::before{left:-7px;clip-path:polygon(100% 0,0 0,100% 100%);}
.wa-b.out::before{right:-7px;clip-path:polygon(0 0,100% 0,0 100%);}
.wa-meta{float:right;display:inline-flex;align-items:center;gap:3px;margin:5px 0 -4px 10px;font-size:9px;color:rgba(233,237,239,0.6);}
.wa-tick{display:inline-flex;color:#8696a0;transition:color .25s ease;}
.wa-tick svg{width:15px;height:10px;}
.wa-tick .t2{opacity:0;transition:opacity .2s ease;}
.wa-tick.dlv .t2,.wa-tick.read .t2{opacity:1;}
.wa-tick.read{color:#53bdeb;}
.wa-b.typing{padding:9px 12px;display:flex;gap:4px;}
.wa-b.typing i{width:6px;height:6px;border-radius:50%;background:#8696a0;display:block;animation:typingBounce 1.1s ease-in-out infinite;}
.wa-b.typing i:nth-child(2){animation-delay:.15s;}
.wa-b.typing i:nth-child(3){animation-delay:.3s;}
.wa-qr{align-self:flex-start;width:78%;margin-left:6px;display:flex;flex-direction:column;gap:3px;}
.wa-qr span{background:#202c33;border-radius:8px;text-align:center;color:#53bdeb;font-size:11.5px;font-weight:600;padding:8px;display:flex;align-items:center;justify-content:center;gap:6px;transition:background .2s ease, scale .15s ease;}
.wa-qr span svg{width:13px;height:13px;}
.wa-qr span.tap{background:#2e3d46;scale:.97;}
.wa-foot{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:6px 6px 12px;background:#0b141a;}
.wa-input{flex:1;min-width:0;display:flex;align-items:center;gap:7px;background:#1f2c34;border-radius:20px;padding:0 10px;height:36px;color:#8696a0;}
.wa-input > svg{width:17px;height:17px;flex-shrink:0;}
.wa-text{flex:1;min-width:0;font-size:12px;color:#e9edef;white-space:nowrap;overflow:hidden;display:flex;justify-content:flex-start;}
.wa-text:empty::before{content:"Mensaje";color:#8696a0;}
.wa-text.long{justify-content:flex-end;}
.wa-caret{display:inline-block;width:1.5px;height:14px;background:#00a884;margin-left:1px;animation:caretBlink 1s steps(1) infinite;flex-shrink:0;align-self:center;}
@keyframes caretBlink{50%{opacity:0;}}
.wa-send{width:36px;height:36px;border-radius:50%;background:#00a884;color:#0b141a;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .15s ease;}
.wa-send svg{width:17px;height:17px;}
.wa-send .ic-send{display:none;}
.wa-send.has-text .ic-send{display:block;}
.wa-send.has-text .ic-mic{display:none;}
.wa-send.press{transform:scale(.82);}
.connector-phone .wa-b{font-size:11.2px;}

/* ---------- connector diagram: live paths ---------- */
.flow-connector-line{overflow:visible;}
.flow-connector-line path{fill:none;stroke:rgba(255,122,51,0.45);stroke-width:1.6;}
.flow-connector-line.is-live path{stroke-dasharray:4 7;animation:beamFlow 1.3s linear infinite;}
.flow-connector-line .pulse{fill:#ff7a33;filter:drop-shadow(0 0 6px rgba(255,122,51,0.95));}
.flow-connector-line .pulse-ring{fill:none;stroke:#ff7a33;stroke-width:1.5;}
.flow-connector-node{transition:border-color .3s ease, box-shadow .3s ease, transform .3s ease;}
.flow-connector-node.hit{border-color:rgba(255,122,51,0.6) !important;box-shadow:0 0 0 5px rgba(255,122,51,0.12), 0 20px 40px rgba(255,122,51,0.18) !important;transform:translateY(-3px) scale(1.02);}
.flow-connector-node.hit .ic{animation:icPop .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes icPop{40%{transform:scale(1.25) rotate(-8deg);}}
.flow-connector-center .connector-phone{transition:box-shadow .3s ease;}
.flow-connector-center.hit .connector-phone{box-shadow:0 0 0 1.5px #3a4252, 0 0 0 4px #0b0e14, 0 0 0 10px rgba(255,122,51,0.18), 0 46px 90px rgba(0,0,0,0.5);}

/* ---------- process band: live progression ---------- */
.process-path .pp-fill{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:none;animation:none;}
.pp-dot{position:absolute;z-index:2;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:#fff;box-shadow:0 0 0 6px rgba(255,255,255,0.25), 0 0 24px 6px rgba(255,255,255,0.6);pointer-events:none;opacity:0;}
.process-step .n,.process-step .t,.process-step .num,.process-step .d{transition:all .45s cubic-bezier(.2,.8,.2,1);}
.process-step.is-active .n{background:#fff;color:var(--brand-dark);transform:translateY(-10px) scale(1.14);box-shadow:0 0 0 7px rgba(255,255,255,0.2), 0 22px 40px rgba(120,40,0,0.3);}
.process-step.is-active .t{transform:translateY(-4px);}
.process-step.is-active .d{color:#fff;}
.process-step.is-done .n{background:rgba(255,255,255,0.32);}
.process-row.is-live .process-step:not(.is-active):not(.is-done) .n{opacity:.7;}

/* ---------- reels: auto-swiping feed ---------- */
.reel-track{position:absolute;inset:0;display:flex;flex-direction:column;will-change:transform;z-index:1;}
.reel{position:relative;flex:0 0 100%;height:100%;overflow:hidden;background:#000;}
.reel > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.84) saturate(1.05);}
.reel::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.05) 34%, rgba(0,0,0,0.3) 100%);z-index:1;}
.reel .reels-side,.reel .reels-bottom{z-index:3;}
.reels-bottom .music{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:10.5px;color:rgba(255,255,255,0.85);overflow:hidden;white-space:nowrap;}
.reels-bottom .music svg{width:11px;height:11px;flex-shrink:0;}
.reels-bottom .music span{display:inline-block;animation:marqueeText 7s linear infinite;}
@keyframes marqueeText{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.reels-bottom .follow{margin-left:6px;border:1px solid rgba(255,255,255,0.7);border-radius:6px;padding:1px 7px;font-size:10px;}
.reels-side .btn.like.liked svg{fill:#ff3040;stroke:#ff3040;animation:likePop .45s cubic-bezier(.34,1.56,.64,1);}
@keyframes likePop{40%{transform:scale(1.4);}}
.reel-burst{position:absolute;left:50%;top:44%;width:96px;height:96px;margin:-48px 0 0 -48px;z-index:6;pointer-events:none;opacity:0;}
.reel-burst svg{width:100%;height:100%;fill:#fff;filter:drop-shadow(0 6px 18px rgba(0,0,0,0.35));}
.reels-top{z-index:4;}
.reels-screen .reels-progress{z-index:5;}
.reel-dots{position:absolute;right:6px;top:50%;transform:translateY(-50%);z-index:5;display:none;}

/* ---------- Instagram profile: extras ---------- */
.ig-tabs{display:flex;justify-content:space-around;border-top:1px solid #eef0f3;padding:9px 0 7px;color:#16181f;}
.ig-tabs svg{width:17px;height:17px;opacity:.45;}
.ig-tabs span:first-child svg{opacity:1;}
.ig-tabs span:first-child{box-shadow:0 1.5px 0 #16181f;padding-bottom:6px;}
.ig-highlights i{position:relative;}
.ig-highlights div:first-child i{border:2px solid transparent;background:conic-gradient(#f9ce34,#ee2a7b,#6228d7,#f9ce34) border-box;}
.ig-toast{
  position:absolute;left:10px;right:10px;top:52px;z-index:6;display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:14px;
  background:rgba(22,24,31,0.92);color:#fff;font-size:10.5px;line-height:1.3;backdrop-filter:blur(10px);box-shadow:0 12px 30px rgba(0,0,0,0.3);opacity:0;
}
.ig-toast .av{width:28px;height:28px;border-radius:50%;overflow:hidden;flex-shrink:0;}
.ig-toast .av img{width:100%;height:100%;object-fit:cover;}
.ig-toast b{font-weight:700;}
.ig-toast .th{width:30px;height:30px;border-radius:6px;overflow:hidden;margin-left:auto;flex-shrink:0;}
.ig-toast .th img{width:100%;height:100%;object-fit:cover;}
.ig-grid-tile .views{position:absolute;left:5px;bottom:4px;color:#fff;font-size:9px;font-weight:700;display:flex;align-items:center;gap:2px;text-shadow:0 1px 3px rgba(0,0,0,0.6);}
.ig-grid-tile .views svg{width:9px;height:9px;fill:#fff;}

/* ================================================================
   V6 — icon system polish, mobile menu, multi-channel chat
   ================================================================ */

/* ---------- icons living inside text ---------- */
.btn-ico{display:inline-flex;align-items:center;vertical-align:-0.16em;margin-left:6px;}
.btn-ico svg{width:1.05em;height:1.05em;transition:transform .25s ease;}
a:hover .btn-ico svg,.service-link .btn-ico svg{transition:transform .25s ease;}
a:hover .btn-ico svg{transform:translateX(3px);}
.service-link .btn-ico{margin-left:0;color:var(--brand);}
.pillar:hover .service-link .btn-ico svg{transform:translateX(4px);}
.rating-stars{display:inline-flex;gap:2px;vertical-align:-0.12em;color:#f5a524;}
.rating-stars svg{width:1em;height:1em;}
.reels-side .btn.like .h-f{display:none;}
.reels-side .btn.like.liked .h-o{display:none;}
.reels-side .btn.like.liked .h-f{display:block;fill:#ff3040;color:#ff3040;animation:likePop .45s cubic-bezier(.34,1.56,.64,1);}
.wa-enc svg{display:inline-block;width:10px;height:10px;vertical-align:-1px;margin-right:4px;}

/* ---------- WhatsApp header: no overlaps ---------- */
.wa-who{overflow:hidden;}
.wa-who b{min-width:0;}
.wa-who b .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.wa-acts{flex-shrink:0;gap:12px;}
.wa-acts svg{width:16px;height:16px;}
.connector-phone .wa-acts{gap:9px;}
.connector-phone .wa-acts svg{width:15px;height:15px;}
.connector-phone .wa-head{gap:6px;padding-right:9px;}

/* ---------- mobile menu (hamburger) ---------- */
.nav-burger{display:none;position:relative;width:46px;height:46px;border:0;border-radius:14px;background:var(--carbon);cursor:pointer;padding:0;flex-shrink:0;box-shadow:0 10px 22px rgba(24,25,37,0.18);transition:background .3s ease, transform .2s ease;}
.nav-burger:active{transform:scale(.94);}
.nav-burger span{position:absolute;left:13px;right:13px;height:2px;border-radius:2px;background:#fff;transition:transform .45s cubic-bezier(.7,0,.2,1), opacity .25s ease, top .45s cubic-bezier(.7,0,.2,1), left .3s ease, right .3s ease;}
.nav-burger span:nth-child(1){top:16px;}
.nav-burger span:nth-child(2){top:22px;right:19px;}
.nav-burger span:nth-child(3){top:28px;}
.nav-burger:hover span:nth-child(2){right:13px;}
header.menu-open .nav-burger{background:var(--brand);}
header.menu-open .nav-burger span:nth-child(1){top:22px;transform:rotate(45deg);}
header.menu-open .nav-burger span:nth-child(2){opacity:0;transform:translateX(12px);}
header.menu-open .nav-burger span:nth-child(3){top:22px;transform:rotate(-45deg);}
@media (max-width:900px){
  .nav-burger{display:block;}
  .nav-actions{gap:10px;}
}
header.menu-open{z-index:230;}
header.menu-open .nav{background:rgba(10,15,24,0.6);border-color:rgba(255,255,255,0.08);box-shadow:none;}
header.menu-open .logo-img{filter:brightness(0) invert(1);}
header.menu-open .nav-cta{opacity:0;pointer-events:none;}
.mmenu{
  position:fixed;inset:0;z-index:220;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;
  padding:120px 24px 30px;color:#fff;visibility:hidden;
  background:
    radial-gradient(circle at 85% 12%, rgba(255,122,51,0.35), transparent 38%),
    radial-gradient(circle at 10% 95%, rgba(255,122,51,0.18), transparent 40%),
    linear-gradient(160deg,#0a0f18,#0d1420 55%,#090d15);
  clip-path:circle(0px at calc(100% - 44px) 46px);
  transition:clip-path .75s cubic-bezier(.7,0,.2,1), visibility 0s linear .75s;
}
.mmenu.open{visibility:visible;clip-path:circle(150% at calc(100% - 44px) 46px);transition:clip-path .8s cubic-bezier(.7,0,.2,1), visibility 0s;}
.mmenu .tech-grid-bg{opacity:.7;}
.mm-kicker{position:relative;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,0.45);margin-bottom:14px;display:flex;align-items:center;gap:10px;}
.mm-kicker::before{content:"";width:22px;height:2px;background:var(--brand);}
.mm-links{position:relative;display:flex;flex-direction:column;}
.mm-links a{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,0.08);}
.mm-links a small{font-size:12px;font-weight:700;color:var(--brand);letter-spacing:.06em;}
.mm-links a span{font-size:clamp(32px,9vw,46px);line-height:1;letter-spacing:-0.04em;font-weight:300;}
.mm-links a span b{font-weight:780;}
.mm-links a svg{width:22px;height:22px;color:rgba(255,255,255,0.4);transition:transform .3s ease, color .3s ease;}
.mm-links a:active svg,.mm-links a:hover svg{transform:translateX(4px) rotate(-45deg);color:var(--brand);}
.mm-links a.active span{color:var(--brand);}
.mm-links a.active small::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--brand);margin-left:6px;vertical-align:1px;box-shadow:0 0 10px var(--brand);}
.mm-foot{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:26px;}
.mm-foot .btn-primary{flex:1;text-align:center;padding:15px 18px;}
.mm-social{display:flex;gap:10px;}
.mm-social a{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);}
.mm-social .brand-glyph{width:20px;height:20px;}
.mm-note{position:relative;margin-top:18px;font-size:12px;color:rgba(255,255,255,0.4);}
body.menu-lock{overflow:hidden;}

/* ---------- multi-channel chat skins (connector phone) ---------- */
.connector-phone .skin{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;visibility:hidden;text-align:left;font-family:var(--font);}
.connector-phone .skin.on{visibility:visible;}
.c-sb{height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:6px 24px 0;font-size:12px;font-weight:700;}
.c-sb .r{display:flex;gap:5px;align-items:center;}
.c-sb svg{width:13px;height:13px;}
.c-head{display:flex;align-items:center;gap:8px;padding:6px 10px 10px 8px;flex-shrink:0;}
.c-head > svg{width:18px;height:18px;flex-shrink:0;}
.c-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;}
.c-av svg{width:70%;height:70%;}
.c-who{flex:1;min-width:0;line-height:1.2;overflow:hidden;}
.c-who b{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:700;}
.c-who b .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.c-who b svg{width:12px;height:12px;flex-shrink:0;}
.c-status{display:block;font-size:10.5px;white-space:nowrap;}
.c-acts{display:flex;gap:11px;flex-shrink:0;}
.c-acts svg{width:17px;height:17px;}
.c-body{flex:1;min-height:0;position:relative;overflow:hidden;}
.c-msgs{position:absolute;left:0;right:0;bottom:0;padding:8px 10px 8px;display:flex;flex-direction:column;gap:3px;}
.c-foot{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:6px 8px 12px;}
.c-b{position:relative;max-width:78%;padding:7px 11px;font-size:11.5px;line-height:1.36;transform-origin:bottom left;}
.c-b.out{align-self:flex-end;transform-origin:bottom right;}
.c-b.in{align-self:flex-start;}
.c-b.typing{display:flex;gap:4px;padding:10px 12px;}
.c-b.typing i{width:6px;height:6px;border-radius:50%;display:block;animation:typingBounce 1.1s ease-in-out infinite;}
.c-b.typing i:nth-child(2){animation-delay:.15s;}
.c-b.typing i:nth-child(3){animation-delay:.3s;}
.c-seen{align-self:flex-end;font-size:9.5px;margin:1px 4px 2px 0;}
.c-card{align-self:flex-start;width:74%;border-radius:16px;overflow:hidden;font-size:11px;}
.c-card .ph{height:92px;}
.c-card .ph img{width:100%;height:100%;object-fit:cover;display:block;}
.c-card .bd{padding:8px 10px 4px;}
.c-card b{display:block;font-size:12px;}
.c-card small{display:block;font-size:10.5px;opacity:.65;margin-top:2px;}
.c-card .cta{display:block;text-align:center;padding:8px;font-weight:700;font-size:11px;}
.c-ad{align-self:flex-end;width:70%;border-radius:14px;overflow:hidden;margin-bottom:2px;}
.c-ad .lb{display:flex;align-items:center;gap:5px;font-size:9.5px;padding:6px 9px;opacity:.75;}
.c-ad .lb svg{width:10px;height:10px;}
.c-ad .ph{height:84px;}
.c-ad .ph img{width:100%;height:100%;object-fit:cover;display:block;}
.c-ad b{display:block;font-size:11px;padding:6px 9px 8px;}
.c-carousel{align-self:stretch;overflow:hidden;margin:2px 0 2px;}
.c-carousel .track{display:flex;gap:8px;padding-left:0;will-change:transform;}
.c-carousel .c-card{flex:0 0 150px;width:150px;}
.c-quick{align-self:flex-end;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px;max-width:92%;margin:2px 0;}
.c-quick span{border-radius:999px;padding:6px 11px;font-size:10.5px;font-weight:700;transition:scale .15s ease, background .2s ease;}
.c-quick span.tap{scale:.94;}
.c-react{position:absolute;right:-4px;bottom:-9px;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.c-react svg{width:10px;height:10px;}
.c-input{flex:1;min-width:0;display:flex;align-items:center;gap:7px;border-radius:22px;padding:0 10px;height:36px;}
.c-input > svg{width:17px;height:17px;flex-shrink:0;}
.c-text{flex:1;min-width:0;font-size:12px;white-space:nowrap;overflow:hidden;display:flex;justify-content:flex-start;}
.c-text.long{justify-content:flex-end;}
.c-text .wa-caret{background:currentColor;}
.c-send{flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:transform .15s ease;}
.c-send.press{transform:scale(.82);}
.c-send .ic-send{display:none;}
.c-send.has-text .ic-send{display:block;}
.c-send.has-text .ic-idle{display:none;}
.skin-splash{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;opacity:0;pointer-events:none;color:#fff;font-weight:800;font-size:15px;letter-spacing:-0.01em;}
.skin-splash .lg{width:66px;height:66px;border-radius:20px;display:flex;align-items:center;justify-content:center;box-shadow:0 18px 40px rgba(0,0,0,0.35);}
.skin-splash .lg .brand-glyph{width:34px;height:34px;}
.skin-splash small{font-size:11px;font-weight:600;opacity:.75;}
.flow-connector-node.is-current{border-color:rgba(255,122,51,0.55) !important;background:#fff8f3 !important;}
.flow-connector-node.is-current::after{content:"";position:absolute;right:12px;top:12px;width:8px;height:8px;border-radius:50%;background:#33d17a;box-shadow:0 0 0 4px rgba(51,209,122,0.18);animation:liveDotPulse 1.8s ease-out infinite;}
.flow-connector-col.align-end .flow-connector-node.is-current::after{right:auto;left:12px;}

/* Instagram DM skin (dark) */
.igc{background:#000;color:#f5f5f5;}
.igc .c-sb{color:#fff;}
.igc .c-head{border-bottom:1px solid #1c1c1c;}
.igc .c-av{background:#fff;padding:2px;box-shadow:0 0 0 2px #000, 0 0 0 3.5px #d62976;}
.igc .c-who b svg{color:#3897f0;}
.igc .c-status{color:#a8a8a8;}
.igc .c-profile{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 0 12px;margin-bottom:6px;}
.igc .c-profile .c-av{width:54px;height:54px;}
.igc .c-profile b{font-size:13px;margin-top:4px;}
.igc .c-profile small{font-size:10.5px;color:#a8a8a8;}
.igc .c-profile span{margin-top:6px;background:#262626;border-radius:8px;padding:5px 12px;font-size:10.5px;font-weight:700;}
.igc .c-b{border-radius:20px;}
.igc .c-b.in{background:#262626;}
.igc .c-b.out{background:linear-gradient(135deg,#3797f0 0%,#6a4bff 60%,#a033ff 100%);color:#fff;}
.igc .c-b.typing{background:#262626;}
.igc .c-b.typing i{background:#8e8e8e;}
.igc .c-seen{color:#a8a8a8;}
.igc .c-card{background:#1a1a1a;border:1px solid #262626;}
.igc .c-card .cta{color:#3897f0;border-top:1px solid #262626;}
.igc .c-ad{background:#121212;border:1px solid #2a2a2a;}
.igc .c-react{background:#262626;color:#ff3040;box-shadow:0 0 0 2px #000;}
.igc .c-quick span{background:#262626;color:#fff;border:1px solid #363636;}
.igc .c-input{background:#262626;color:#f5f5f5;}
.igc .c-input .cam{width:28px;height:28px;border-radius:50%;background:#3797f0;display:flex;align-items:center;justify-content:center;margin-left:-6px;flex-shrink:0;}
.igc .c-input .cam svg{width:15px;height:15px;color:#fff;}
.igc .c-text:empty::before{content:"Enviar mensaje…";color:#a8a8a8;}
.igc .c-send{color:#fff;gap:9px;}
.igc .c-send .ic-idle{display:flex;gap:9px;}
.igc .c-send svg{width:17px;height:17px;}
.igc .c-send .ic-send{color:#3897f0;font-size:12px;font-weight:700;}
.igc .c-send.has-text .ic-send{display:block;}

/* Messenger skin (light) */
.msg{background:#fff;color:#050505;}
.msg .c-sb{color:#050505;}
.msg .c-head{box-shadow:0 1px 0 #efefef;}
.msg .c-head > svg,.msg .c-acts{color:#a033ff;}
.msg .c-av{background:#10261c;}
.msg .c-av::after{content:"";position:absolute;right:0;bottom:0;width:9px;height:9px;border-radius:50%;background:#31a24c;box-shadow:0 0 0 2px #fff;}
.msg .c-status{color:#65676b;}
.msg .c-b{border-radius:18px;}
.msg .c-b.in{background:#f0f0f0;color:#050505;}
.msg .c-b.out{background:linear-gradient(180deg,#0a7cff,#a033ff);color:#fff;}
.msg .c-b.typing{background:#f0f0f0;}
.msg .c-b.typing i{background:#a0a3a8;}
.msg .c-seen{width:13px;height:13px;border-radius:50%;background:#10261c;display:flex;align-items:center;justify-content:center;}
.msg .c-seen svg{width:70%;height:70%;}
.msg .c-card{background:#fff;border:1px solid #e4e6eb;box-shadow:0 2px 8px rgba(0,0,0,0.06);}
.msg .c-card .cta{color:#0a7cff;border-top:1px solid #e4e6eb;}
.msg .c-quick span{background:#fff;color:#0a7cff;border:1.5px solid #0a7cff;}
.msg .c-quick span.tap{background:#e7f3ff;}
.msg .c-input{background:#f0f2f5;color:#050505;}
.msg .c-text:empty::before{content:"Aa";color:#65676b;}
.msg .c-foot > svg{width:19px;height:19px;color:#a033ff;flex-shrink:0;}
.msg .c-send{color:#a033ff;width:28px;height:28px;}
.msg .c-send svg{width:20px;height:20px;}
.igc .c-send.has-text .ic-idle{display:none;}
.msg .c-send .ic-idle,.msg .c-send .ic-send{align-items:center;}
.msg .c-send.has-text .ic-send{display:flex;}
.msg .c-seen{margin-top:2px;}
.mmenu{justify-content:flex-start;overflow-y:auto;padding-top:112px;}
.mm-kicker{margin-top:auto;}
.connector-phone .wa-av,.connector-phone .c-av{width:28px;height:28px;}
.connector-phone .c-profile .c-av{width:54px;height:54px;}
.connector-phone .wa-who b,.connector-phone .c-who b{font-size:12.5px;}
.connector-phone .wa-acts,.connector-phone .c-acts{gap:8px;}
.connector-phone .wa-acts svg,.connector-phone .c-acts svg{width:14px;height:14px;}
.connector-phone .wa-head > svg,.connector-phone .c-head > svg{width:16px;height:16px;}
.connector-phone .wa-head,.connector-phone .c-head{gap:5px;padding-left:5px;padding-right:8px;}
.icon-feature-row.kpi-strip{margin:56px auto 0;padding-top:40px;border-top:1px solid var(--fog);max-width:640px;}
.process-step .n svg{width:30px;height:30px;}
@media (max-width:640px){ .icon-feature-row.kpi-strip{margin-top:40px;padding-top:28px;} }

/* ---------- showcase: hovered site expands to screen centre (real re-render, crisp) ---------- */
.sc-shade{position:fixed;inset:0;z-index:180;background:rgba(14,15,24,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .45s ease, visibility 0s linear .45s;}
html.sc-active .sc-shade{opacity:1;visibility:visible;transition:opacity .45s ease;}
.showcase-window.sc-open{position:fixed;z-index:190;margin:0;border-radius:16px;box-shadow:0 0 0 1px rgba(255,255,255,.08), 0 50px 120px rgba(0,0,0,.45);will-change:transform;}
.sc-ph{border-radius:12px;background:rgba(24,25,37,.05);}
.showcase-card .device-phone{transition:opacity .35s ease, translate .45s cubic-bezier(.2,.8,.2,1);}
.showcase-card.sc-src .device-phone{opacity:0;translate:0 14px;}

/* chat rhythm: more air when the sender changes / after quick-reply blocks (never touching) */
.wa-b.in + .wa-b.out,.wa-b.out + .wa-b.in,.wa-qr + .wa-b,.wa-b + .wa-qr{margin-top:4px;}

/* ---------- real people photos in every avatar ---------- */
.testi-slide-avatar,.avatar-trust .stack span,.reels-bottom .user span.dot,.testi-photo{overflow:hidden;background:#d9d4cc;}
.testi-slide-avatar img,.avatar-trust .stack span img,.reels-bottom .user span.dot img,.testi-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.testi-slide-avatar{box-shadow:0 0 0 2px #fff, 0 6px 14px rgba(24,25,37,.14);}
.reels-bottom .user span.dot{border:1.5px solid #fff;flex-shrink:0;}
.reels-bottom .user span.dot img.brand{object-fit:contain;padding:4px;background:#fff;}
.testi-person{display:flex;align-items:center;gap:12px;}
.testi-photo{width:42px;height:42px;border-radius:50%;flex-shrink:0;box-shadow:0 0 0 2px var(--paper), 0 6px 14px rgba(24,25,37,.14);}

/* ---------- SEO FAQ blocks ---------- */
.seo-faq{
  background:
    linear-gradient(180deg, rgba(255,255,255,0), rgba(255,122,51,0.035)),
    var(--paper);
}
.faq-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.faq-card{background:rgba(255,255,255,0.92);border:1px solid rgba(24,25,37,0.09);padding:24px;box-shadow:0 16px 38px rgba(24,25,37,0.06);position:relative;overflow:hidden;}
.faq-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand);transform:scaleY(0.35);transform-origin:top;transition:transform .28s ease;}
.faq-card:hover::before{transform:scaleY(1);}
.faq-card h3{font-size:17px;line-height:1.15;letter-spacing:-0.025em;margin:0 0 12px;font-weight:680;}
.faq-card p{margin:0;color:var(--graphite);font-size:14px;line-height:1.55;}
@media (max-width:980px){.faq-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:640px){.faq-grid{grid-template-columns:1fr;}.faq-card{padding:20px;}}
/* ---------- floating WhatsApp chat ---------- */
.wa-fab{position:fixed;right:22px;bottom:22px;z-index:170;display:flex;flex-direction:column;align-items:flex-end;gap:12px;font-family:inherit;}
body.menu-lock .wa-fab{opacity:0;visibility:hidden;}
.wa-fab-btn{position:relative;width:60px;height:60px;border-radius:50%;border:0;cursor:pointer;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 30px rgba(37,211,102,.38),0 4px 10px rgba(0,0,0,.18);transition:transform .35s cubic-bezier(.34,1.56,.64,1),background .25s ease;}
.wa-fab-btn::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25d366;animation:waFabPulse 2.6s ease-out infinite;}
.wa-fab-btn:hover{transform:scale(1.07);}
.wa-fab-btn img{width:30px;height:30px;filter:brightness(0) invert(1);transition:transform .35s ease,opacity .2s ease;}
.wa-fab-btn .badge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:#ff3b30;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid #fff;transition:transform .3s ease;}
.wa-fab.seen .wa-fab-btn .badge{transform:scale(0);}
.wa-fab.open .wa-fab-btn{background:#128c7e;}
.wa-fab.open .wa-fab-btn::before{animation:none;opacity:0;}
@keyframes waFabPulse{0%{transform:scale(1);opacity:.7;}80%,100%{transform:scale(1.55);opacity:0;}}
.wa-fab-tip{position:absolute;right:72px;bottom:12px;white-space:nowrap;background:#fff;color:#181925;font-size:13.5px;padding:9px 14px;border-radius:14px 14px 4px 14px;box-shadow:0 12px 30px rgba(24,25,37,.18);opacity:0;transform:translateX(10px) scale(.96);pointer-events:none;transition:opacity .35s ease,transform .35s cubic-bezier(.34,1.56,.64,1);}
.wa-fab-tip b{color:#128c7e;}
.wa-fab.tip .wa-fab-tip{opacity:1;transform:none;}
.wa-pop{width:340px;max-width:calc(100vw - 32px);border-radius:22px;overflow:hidden;background:#efeae2;box-shadow:0 30px 70px rgba(10,12,20,.32),0 0 0 1px rgba(0,0,0,.06);transform-origin:100% 100%;opacity:0;visibility:hidden;transform:translateY(14px) scale(.92);transition:opacity .3s ease,transform .45s cubic-bezier(.2,.9,.25,1.15),visibility 0s linear .45s;}
.wa-fab.open .wa-pop{opacity:1;visibility:visible;transform:none;transition:opacity .3s ease,transform .45s cubic-bezier(.2,.9,.25,1.15);}
.wa-pop-head{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;background:#075e54;color:#fff;}
.wa-pop-head .av{position:relative;width:42px;height:42px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.wa-pop-head .av img{width:30px;height:30px;object-fit:contain;}
.wa-pop-head .av i{position:absolute;right:0;bottom:1px;width:11px;height:11px;border-radius:50%;background:#25d366;border:2px solid #075e54;}
.wa-pop-head .who{flex:1;min-width:0;}
.wa-pop-head b{display:block;font-size:16px;letter-spacing:.02em;}
.wa-pop-head small{font-size:12px;color:#c8efe6;}
.wa-pop-head .x{width:32px;height:32px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s ease;}
.wa-pop-head .x:hover{background:rgba(255,255,255,.24);}
.wa-pop-head .x svg{width:16px;height:16px;}
.wa-pop-body{padding:14px 14px 10px;display:flex;flex-direction:column;gap:10px;min-height:190px;background-color:#efeae2;background-image:radial-gradient(rgba(7,94,84,.06) 1px,transparent 1.4px);background-size:16px 16px;}
.wa-pop-body .day{align-self:center;background:#fff;color:#54656f;font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:7px;box-shadow:0 1px 1px rgba(0,0,0,.06);}
.wa-pop-body .typing{align-self:flex-start;display:none;gap:4px;background:#fff;padding:11px 13px;border-radius:0 12px 12px 12px;box-shadow:0 1px 1px rgba(0,0,0,.08);}
.wa-pop-body .typing i{width:7px;height:7px;border-radius:50%;background:#8696a0;animation:typingBounce 1.1s ease-in-out infinite;}
.wa-pop-body .typing i:nth-child(2){animation-delay:.15s;}
.wa-pop-body .typing i:nth-child(3){animation-delay:.3s;}
.wa-fab.seen:not(.greeted) .wa-pop-body .typing{display:flex;}
.wa-pop-body .bub{position:relative;align-self:flex-start;max-width:88%;background:#fff;color:#111b21;font-size:14px;line-height:1.45;padding:9px 12px 8px;border-radius:0 12px 12px 12px;box-shadow:0 1px 1px rgba(0,0,0,.08);display:none;}
.wa-pop-body .bub small{display:block;text-align:right;font-size:10.5px;color:#8696a0;margin-top:2px;}
.wa-pop-body .chips{display:none;flex-wrap:wrap;gap:6px;}
.wa-fab.greeted .wa-pop-body .bub{display:block;animation:waPopIn .4s cubic-bezier(.2,.9,.25,1.2) both;}
.wa-fab.greeted .wa-pop-body .chips{display:flex;animation:waPopIn .4s .15s cubic-bezier(.2,.9,.25,1.2) both;}
@keyframes waPopIn{from{opacity:0;transform:translateY(8px) scale(.96);}to{opacity:1;transform:none;}}
.wa-pop-body .chips button{border:1px solid rgba(7,94,84,.25);background:#fff;color:#075e54;font:inherit;font-size:12.5px;font-weight:700;padding:7px 11px;border-radius:999px;cursor:pointer;transition:background .2s ease,color .2s ease;}
.wa-pop-body .chips button:hover{background:#075e54;color:#fff;}
.wa-pop-form{display:flex;align-items:flex-end;gap:8px;padding:10px;background:#f0f2f5;}
.wa-pop-form textarea{flex:1;resize:none;border:0;outline:0;border-radius:20px;padding:10px 14px;font:inherit;font-size:14px;line-height:1.35;color:#111b21;background:#fff;max-height:96px;min-height:40px;}
.wa-pop-form button{width:42px;height:42px;border-radius:50%;border:0;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:transform .2s ease,background .2s ease;}
.wa-pop-form button:hover{background:#1ebe5b;transform:scale(1.06);}
.wa-pop-form button svg{width:19px;height:19px;}
.wa-pop-foot{display:flex;align-items:center;justify-content:center;gap:6px;padding:0 10px 10px;background:#f0f2f5;font-size:11px;color:#667781;}
.wa-pop-foot img{width:13px;height:13px;filter:brightness(0) saturate(100%) invert(56%) sepia(76%) saturate(512%) hue-rotate(95deg) brightness(92%) contrast(88%);}
@media (max-width:640px){
  .wa-fab{right:16px;bottom:16px;}
  .wa-fab-btn{width:54px;height:54px;}
  .wa-fab-btn img{width:27px;height:27px;}
  .wa-fab-tip{display:none;}
}
@media (prefers-reduced-motion:reduce){ .wa-fab-btn::before{animation:none;} }