/* ============================
   HIDATA GROUP
   v8 – Refresh · Indigo · Premium
   ============================ */

/* ── TOKENS ─────────────────────────────────── */
:root {
  --bg:          #ffffff;
  --bg-alt:      #f8f7fc;
  --bg-hero:     #eef0ff;
  --bg-accent:   #f0eefd;
  --text:        #14121f;
  --text-l:      #55516d;
  --text-ll:     #9691ac;
  --accent:      #4338ca;
  --accent-m:    #4f46e5;
  --accent-b:    #6366f1;
  --accent-soft: #e3e1fb;
  --accent-xsoft:#f1f0fd;
  --gold:        #f59e0b;
  --border:      #e4e2f0;
  --sh-sm:       0 2px 10px rgba(30,27,60,.07);
  --sh-md:       0 10px 28px rgba(30,27,60,.10);
  --sh-lg:       0 22px 52px rgba(30,27,60,.13);
  --sh-xl:       0 34px 84px rgba(30,27,60,.16);
  --r:           22px;
  --r-sm:        15px;
  --ff:          'Inter', sans-serif;
  --ff-display:  'Manrope', sans-serif;
  --ease:        cubic-bezier(.4,0,.2,1);
  --spring:      cubic-bezier(.34,1.56,.64,1);
}

/* ── RESET ───────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }
body { font-family:var(--ff); background:var(--bg); color:var(--text); line-height:1.5; overflow-x:hidden; }
h1,h2,h3,h4 { font-family:var(--ff-display); font-weight:700; letter-spacing:-.025em; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
img { max-width:100%; display:block; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
input,select,textarea { font-family:inherit; }

/* ── LAYOUT ─────────────────────────────────── */
.container { max-width:1280px; margin:0 auto; padding:0 2.5rem; }
.section { padding:5.5rem 0; }
.section--alt { background:var(--bg-alt); }
.section--accent { background:var(--bg-accent); }

/* ── REVEAL ──────────────────────────────────── */
.reveal {
  opacity:0; transform:translateY(28px);
  transition: opacity .65s var(--ease) var(--d,0s),
              transform .65s var(--ease) var(--d,0s);
}
.reveal.in { opacity:1; transform:translateY(0); }

/* ── SECTION HEADERS ─────────────────────────── */
.section-hd { text-align:center; max-width:680px; margin:0 auto 4rem; }
.section-hd h2 { font-size:clamp(2rem,3.8vw,2.8rem); margin-bottom:.8rem; line-height:1.15; }
.section-hd h2 b { color:var(--accent); font-weight:800; }
.section-hd p { color:var(--text-l); font-size:1.05rem; line-height:1.7; }

.section-tag {
  display:inline-block;
  font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent); border:1px solid rgba(67,56,202,.22);
  background:rgba(67,56,202,.06); padding:4px 14px; border-radius:9999px;
  margin-bottom:14px;
}

/* ── BUTTONS ─────────────────────────────────── */
.btn-primary {
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--accent); color:#fff; border:none;
  padding:.9rem 2.2rem; border-radius:9999px;
  font-weight:700; font-size:1rem;
  box-shadow:0 12px 32px -8px rgba(67,56,202,.4);
  transition:background .2s, transform .15s var(--spring), box-shadow .2s;
  position:relative; overflow:hidden;
}
.btn-primary:hover { background:var(--accent-m); transform:translateY(-3px); box-shadow:0 18px 40px -8px rgba(67,56,202,.5); }

.btn-ghost {
  display:inline-flex; align-items:center; gap:.5rem;
  background:transparent; color:var(--accent);
  border:1.5px solid rgba(67,56,202,.3);
  padding:.9rem 2rem; border-radius:9999px;
  font-weight:600; font-size:1rem;
  transition:background .2s, color .2s, border-color .2s, transform .15s var(--spring);
}
.btn-ghost:hover { background:var(--accent); color:#fff; border-color:var(--accent); transform:translateY(-2px); }

/* ── RIPPLE ──────────────────────────────────── */
.ripple { position:relative; overflow:hidden; }
.ripple-wave {
  position:absolute; border-radius:50%;
  background:rgba(255,255,255,.25);
  transform:scale(0); animation:rippleAnim .55s linear;
  pointer-events:none;
}
@keyframes rippleAnim { to { transform:scale(4); opacity:0; } }

/* ── SPOTLIGHT ───────────────────────────────── */
.spotlight-card { position:relative; }
.spotlight-card::before {
  content:''; position:absolute; inset:0; border-radius:inherit;
  background:radial-gradient(480px circle at var(--mouse-x,50%) var(--mouse-y,50%),
    rgba(99,102,241,.07), transparent 65%);
  opacity:0; transition:opacity .3s; pointer-events:none; z-index:0;
}
.spotlight-card:hover::before { opacity:1; }
.spotlight-card > * { position:relative; z-index:1; }

/* ── NAV ─────────────────────────────────────── */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(255,255,255,.0);
  transition:background .4s, backdrop-filter .4s, box-shadow .4s, border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.scrolled {
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-bottom-color:var(--border);
  box-shadow:var(--sh-sm);
}
.nav-inner {
  max-width:1280px; margin:0 auto; padding:0 2.5rem;
  height:72px; display:flex; align-items:center;
  justify-content:space-between; gap:2rem;
}
.logo {
  font-family:var(--ff-display);
  font-weight:800; font-size:1.1rem; letter-spacing:-.03em;
  display:flex; align-items:baseline; gap:.25rem; flex-shrink:0;
  color:var(--accent); transition:color .3s;
}
.logo em { font-style:normal; font-weight:300; color:var(--text-l); transition:color .3s; }
.logo span { font-size:.62rem; font-weight:400; color:var(--text-ll); margin-left:.1rem; letter-spacing:.02em; }

.nav-links { display:flex; gap:2rem; list-style:none; }
.nav-links a {
  font-size:.87rem; font-weight:500; color:var(--text-l);
  transition:color .2s; position:relative; padding-bottom:2px;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-2px; left:0; right:0;
  height:1.5px; background:var(--accent);
  transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease);
}
.nav-links a:hover { color:var(--accent); }
.nav-links a:hover::after { transform:scaleX(1); }

.btn-nav {
  border:1.5px solid var(--border); background:#fff;
  padding:.5rem 1.3rem; border-radius:9999px;
  font-weight:600; font-size:.87rem; color:var(--text);
  transition:all .2s; flex-shrink:0;
  box-shadow:var(--sh-sm);
}
.btn-nav:hover { border-color:var(--accent); color:var(--accent); box-shadow:var(--sh-md); }

.burger { display:none; flex-direction:column; gap:5px; padding:6px; }
.burger span { display:block; width:21px; height:1.5px; background:var(--text); border-radius:2px; transition:all .25s; }
.nav-mobile {
  display:none; flex-direction:column;
  background:#fff; border-top:1px solid var(--border); padding:12px 2rem 24px;
}
.nav-mobile.open { display:flex; }
.nav-mobile a { padding:13px 0; border-bottom:1px solid var(--border); font-size:.95rem; font-weight:500; color:var(--text-l); transition:color .2s; }
.nav-mobile a:hover { color:var(--accent); }
.mob-cta { margin-top:14px !important; padding:13px 24px !important; background:var(--accent) !important; color:#fff !important; border-radius:9999px !important; text-align:center; font-weight:700 !important; border-bottom:none !important; }

/* ── HERO ────────────────────────────────────── */
.hero {
  min-height:100vh;
  background:linear-gradient(150deg, #eef0ff 0%, #f6f5ff 35%, #ffffff 70%, #fbfaff 100%);
  display:flex; align-items:center;
  position:relative; overflow:hidden;
  padding:8rem 0 5rem;
}
.hero-bg { position:absolute; inset:0; pointer-events:none; }
.hero-glow {
  position:absolute; border-radius:50%;
  filter:blur(90px); opacity:.7;
}
.hero-glow--1 {
  width:800px; height:800px;
  background:radial-gradient(circle, rgba(99,102,241,.18), transparent 65%);
  top:-250px; right:-200px;
  animation:glowDrift1 14s ease-in-out infinite;
}
.hero-glow--2 {
  width:600px; height:600px;
  background:radial-gradient(circle, rgba(67,56,202,.1), transparent 65%);
  bottom:-150px; left:-100px;
  animation:glowDrift2 11s ease-in-out infinite;
}
.hero-grid-lines {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(67,56,202,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(67,56,202,.04) 1px, transparent 1px);
  background-size:64px 64px;
}
@keyframes glowDrift1 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-30px,30px)} }
@keyframes glowDrift2 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(20px,-20px)} }

.hero-inner { max-width:900px; margin:0 auto; text-align:center; position:relative; z-index:1; }
@keyframes blink { 0%,100%{opacity:1}50%{opacity:.3} }

.hero-title {
  font-size:clamp(3.2rem,7vw,6rem); line-height:1.04;
  font-weight:900; letter-spacing:-.04em;
  margin-bottom:1.8rem;
  display:flex; flex-direction:column; gap:.1em;
}
.ht-line { display:block; color:var(--text); }
.ht-em {
  background:linear-gradient(135deg, var(--accent) 0%, var(--accent-b) 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero-sub {
  font-size:1.15rem; color:var(--text-l);
  max-width:620px; margin:0 auto 2.5rem; line-height:1.75;
}
.hero-actions { display:flex; gap:1.2rem; align-items:center; justify-content:center; flex-wrap:wrap; }

/* Hero metrics strip */
.hero-metrics-strip {
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:0; margin-top:4rem;
  border:1.5px solid var(--border);
  border-radius:16px; background:rgba(255,255,255,.85);
  backdrop-filter:blur(12px); padding:.5rem 0;
  position:relative; z-index:1;
  box-shadow:var(--sh-md);
}
.hms-item {
  display:flex; flex-direction:column; align-items:center; gap:4px;
  padding:1.2rem 2.5rem;
  flex:1; min-width:120px;
}
.hms-num {
  font-size:2rem; font-weight:900; color:var(--accent);
  letter-spacing:-.04em; line-height:1;
}
.hms-num .count { font-size:inherit; font-weight:inherit; }
.hms-lbl { font-size:.7rem; font-weight:600; color:var(--text-ll); letter-spacing:.06em; text-transform:uppercase; }
.hms-div { width:1px; height:48px; background:var(--border); align-self:center; }

/* ── CLIENTS MARQUEE ─────────────────────────── */
.clients-section {
  padding:3rem 0;
  background:var(--bg);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden;
}
.clients-eyebrow {
  text-align:center;
  font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-ll); margin-bottom:2rem;
}
.marquee-wrap { position:relative; overflow:hidden; }
.marquee-wrap::before,
.marquee-wrap::after {
  content:''; position:absolute; top:0; bottom:0; width:160px; z-index:2;
}
.marquee-wrap::before { left:0; background:linear-gradient(to right, var(--bg), transparent); }
.marquee-wrap::after  { right:0; background:linear-gradient(to left, var(--bg), transparent); }

.marquee-track {
  display:flex; gap:1rem; width:max-content;
  animation:marqueeScroll 42s linear infinite;
}
.marquee-track:hover { animation-play-state:paused; }
@keyframes marqueeScroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }

.client-badge {
  display:inline-flex; align-items:center; gap:12px;
  padding:10px 18px 10px 10px;
  border:1.5px solid var(--border); border-radius:12px;
  background:#fff; white-space:nowrap; box-shadow:var(--sh-sm);
  transition:border-color .22s, box-shadow .22s, transform .22s var(--spring);
  cursor:default;
}
.client-badge:hover { border-color:rgba(67,56,202,.3); box-shadow:var(--sh-md); transform:translateY(-3px); }

/* logo monogram */
.cb-logo {
  width:36px; height:36px; border-radius:8px;
  background:var(--cc, var(--accent)); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:.7rem; font-weight:800; letter-spacing:.02em;
  flex-shrink:0;
}
.cb-info { display:flex; flex-direction:column; gap:1px; }
.cb-name { font-size:.82rem; font-weight:700; color:var(--text); line-height:1.2; }
.cb-sector { font-size:.66rem; color:var(--text-ll); font-weight:500; }

/* ── BENTO GRID SERVICES ─────────────────────── */
.bento-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.2rem;
}

.bento-card {
  background:#fff; border:1.5px solid var(--border);
  border-radius:var(--r); overflow:hidden;
  box-shadow:var(--sh-sm);
  transition:transform .3s var(--spring), box-shadow .3s, border-color .3s;
  display:flex; flex-direction:column;
}
.bento-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); border-color:rgba(99,102,241,.35); }

/* Large card */
.bento-card--lg { grid-column:span 2; flex-direction:row; }
.bento-card--lg .bc-img-wrap { width:45%; flex-shrink:0; }
.bento-card--lg .bc-body { flex:1; padding:2rem; }

/* Wide card */
.bento-card--wide { grid-column:span 2; flex-direction:row; }
.bento-card--wide .bc-img-wrap--side { width:42%; flex-shrink:0; }
.bento-card--wide .bc-body { flex:1; padding:2rem; }

.bc-img-wrap { position:relative; overflow:hidden; }
.bc-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); min-height:200px; }
.bento-card:hover .bc-img-wrap img { transform:scale(1.05); }
.bc-img-overlay {
  position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(67,56,202,.1) 0%, transparent 60%);
}

.bc-icon-wrap { padding:2rem 2rem 0; color:var(--accent); }
.bc-icon-wrap svg { width:52px; height:52px; }

/* Image at top for single-column bento cards */
.bc-img-top {
  height:168px; overflow:hidden; position:relative; flex-shrink:0;
}
.bc-img-top img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s var(--ease);
}
.bento-card:hover .bc-img-top img { transform:scale(1.06); }

.bc-body { padding:1.6rem 2rem 2rem; }
.bc-idx {
  font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent); display:block; margin-bottom:.5rem;
}
.bento-card h3 { font-size:1.2rem; font-weight:700; color:var(--text); margin-bottom:.6rem; line-height:1.3; }
.bento-card p { font-size:.875rem; color:var(--text-l); line-height:1.7; margin-bottom:1rem; }
.bc-chips { display:flex; flex-wrap:wrap; gap:6px; }
.bc-chips span {
  font-size:.68rem; font-weight:600; padding:3px 10px; border-radius:9999px;
  background:var(--accent-soft); color:var(--accent);
  transition:background .2s, color .2s;
}
.bento-card:hover .bc-chips span { background:var(--accent); color:#fff; }

/* ── SECTORS (light accent) ─────────────────── */
.sectors-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem;
}
.sector-card {
  padding:2rem 2.2rem; border-radius:var(--r);
  border:1.5px solid var(--border); background:#fff;
  box-shadow:var(--sh-sm); overflow:hidden; position:relative;
  transition:transform .28s var(--spring), box-shadow .28s, border-color .28s;
}
.sector-card:hover { transform:translateY(-5px); box-shadow:var(--sh-lg); border-color:rgba(67,56,202,.25); }
.sector-card:hover .sector-bg { opacity:1; }

/* Background image reveal on hover */
.sector-bg {
  position:absolute; inset:0; opacity:0;
  transition:opacity .4s var(--ease); z-index:0;
}
.sector-bg img { width:100%; height:100%; object-fit:cover; }
.sector-bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(160deg, rgba(238,244,255,.96) 0%, rgba(255,255,255,.92) 100%);
}
.sector-card > *:not(.sector-bg) { position:relative; z-index:1; }

.sector-icon {
  width:52px; height:52px; border-radius:14px;
  background:var(--accent-soft); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.2rem;
  transition:background .2s, color .2s, transform .2s var(--spring);
}
.sector-icon svg { width:26px; height:26px; }
.sector-card:hover .sector-icon { background:var(--accent); color:#fff; transform:scale(1.08); }
.sector-card h4 { font-size:1.05rem; font-weight:700; color:var(--text); margin-bottom:.5rem; }
.sector-card p { font-size:.855rem; color:var(--text-l); line-height:1.65; margin-bottom:.9rem; }

/* Sector tag */
.sector-tag {
  display:inline-block; font-size:.65rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--accent); background:var(--accent-soft);
  border:1px solid rgba(67,56,202,.15);
  padding:3px 10px; border-radius:9999px;
  transition:background .2s, color .2s;
}
.sector-card:hover .sector-tag { background:var(--accent); color:#fff; }

/* ── METHODOLOGY ─────────────────────────────── */
.method-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:5rem; align-items:center;
}
.method-steps { display:flex; flex-direction:column; }
.method-item {
  display:grid; grid-template-columns:88px 1fr;
  gap:1.2rem; padding:1.4rem 1rem;
  border-bottom:1px solid var(--border);
  transition:background .2s, padding-left .2s; border-radius:var(--r-sm);
}
.method-item:last-child { border-bottom:none; }
.method-item:hover { background:var(--accent-xsoft); padding-left:1.4rem; }
.method-phase { font-weight:800; color:var(--accent); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; padding-top:3px; }
.method-item h3 { font-size:1.05rem; margin-bottom:.3rem; color:var(--text); }
.method-item p { font-size:.875rem; color:var(--text-l); line-height:1.65; }

.method-visual {
  border-radius:var(--r); overflow:hidden;
  box-shadow:var(--sh-xl); position:relative;
}
.method-visual img { width:100%; height:540px; object-fit:cover; transition:transform .6s var(--ease); }
.method-visual:hover img { transform:scale(1.03); }
.method-badge {
  position:absolute; bottom:20px; right:20px;
  background:rgba(255,255,255,.97); backdrop-filter:blur(10px);
  border:1px solid var(--border); border-radius:14px;
  padding:14px 22px; box-shadow:var(--sh-md);
}
.method-badge strong { display:block; font-size:.78rem; color:var(--text-l); margin-bottom:2px; }
.method-badge span { font-size:1.3rem; font-weight:800; color:var(--accent); }

/* ── WHY US ──────────────────────────────────── */
.why-grid { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.why-copy .section-tag { display:inline-block; }
.why-copy h2 { font-size:clamp(1.8rem,3vw,2.6rem); margin:12px 0 18px; }
.why-copy h2 b { color:var(--accent); }
.why-sub { font-size:1rem; color:var(--text-l); line-height:1.75; margin-bottom:2.5rem; }
.why-list { display:flex; flex-direction:column; gap:1rem; }
.why-item {
  display:flex; gap:1.2rem; align-items:flex-start;
  padding:1.2rem 1.4rem; border-radius:var(--r-sm);
  border:1.5px solid var(--border); background:#fff; box-shadow:var(--sh-sm);
  transition:border-color .22s, box-shadow .22s, transform .22s var(--spring);
}
.why-item:hover { border-color:var(--accent-b); box-shadow:var(--sh-md); transform:translateX(5px); }
.wi-num {
  min-width:36px; height:36px; border-radius:9999px;
  background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:.78rem; font-weight:800; flex-shrink:0;
  transition:background .2s, transform .2s var(--spring);
}
.why-item:hover .wi-num { background:var(--accent-b); transform:scale(1.12); }
.why-item strong { display:block; font-size:.9rem; font-weight:700; color:var(--text); margin-bottom:4px; }
.why-item p { font-size:.83rem; color:var(--text-l); line-height:1.6; }

.why-mosaic { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.wm-card {
  background:#fff; border:1.5px solid var(--border);
  border-radius:20px; padding:1.6rem;
  box-shadow:var(--sh-sm);
  transition:transform .28s var(--spring), box-shadow .28s;
}
.wm-card:hover { transform:translateY(-5px); box-shadow:var(--sh-lg); }
.wm-card--blue {
  background:linear-gradient(135deg, var(--accent), var(--accent-m));
  border-color:transparent; grid-column:span 2;
  display:flex; align-items:center; justify-content:space-between; color:#fff;
}
.wm-card--dark { background:var(--text); color:#fff; border-color:transparent; }
.wm-num { font-size:2.2rem; font-weight:900; line-height:1; margin-bottom:4px; letter-spacing:-.03em; }
.wm-card--blue .wm-num { font-size:2.8rem; }
.wm-lbl { font-size:.74rem; opacity:.8; letter-spacing:.04em; }
.wm-sub { font-size:.7rem; color:var(--text-ll); margin-top:4px; }
.wm-stars { color:#F59E0B; margin-top:6px; letter-spacing:2px; }
.wm-icon { width:44px; height:44px; opacity:.55; }

/* ── PLANS ───────────────────────────────────── */
.plans-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; align-items:start; }
.plan-card {
  background:#fff; border:1.5px solid var(--border);
  border-radius:var(--r); padding:2.2rem;
  position:relative; box-shadow:var(--sh-sm);
  transition:transform .28s var(--spring), box-shadow .28s;
}
.plan-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); }
.plan-card--feat {
  border-color:var(--accent); box-shadow:0 16px 48px -12px rgba(67,56,202,.2);
  background:linear-gradient(160deg, #ffffff 55%, var(--accent-xsoft) 100%);
}
.plan-badge { display:inline-block; font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:3px 12px; border-radius:9999px; margin-bottom:1rem; }
.plan-badge--soft { background:var(--accent-soft); color:var(--accent); }
.plan-badge--blue { background:var(--accent); color:#fff; }
.plan-card h3 { font-size:1.4rem; margin-bottom:.5rem; color:var(--text); }
.plan-desc { font-size:.875rem; color:var(--text-l); margin-bottom:1.2rem; line-height:1.65; }
.plan-div { height:1px; background:var(--border); margin-bottom:1.2rem; }
.plan-feats { display:flex; flex-direction:column; gap:10px; margin-bottom:1.8rem; }
.plan-feats li { display:flex; gap:8px; align-items:center; font-size:.875rem; color:var(--text-l); }
.plan-feats li span { color:var(--accent); font-weight:700; flex-shrink:0; }
.plan-link { display:inline-flex; align-items:center; font-weight:700; color:var(--accent); font-size:.9rem; gap:.4rem; transition:gap .2s; }
.plan-link:hover { gap:.7rem; }
.plan-link--solid {
  display:block; width:100%; text-align:center;
  background:var(--accent); color:#fff; padding:.85rem 1.5rem; border-radius:9999px;
  box-shadow:0 8px 24px -6px rgba(67,56,202,.35); font-size:.9rem;
  transition:background .2s, transform .15s var(--spring);
}
.plan-link--solid:hover { background:var(--accent-m); transform:translateY(-2px); }
.plans-note { text-align:center; margin-top:2rem; font-size:.85rem; color:var(--text-ll); }
.plan-price { display:none; }
.plan-quote { display:inline-flex; align-items:center; gap:7px; font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); background:var(--accent-soft); border:1px solid rgba(67,56,202,.15); padding:6px 16px; border-radius:9999px; margin-bottom:1.4rem; }
.plan-quote svg { width:14px; height:14px; }
.plan-quote--white { color:var(--accent); background:var(--accent-soft); border-color:rgba(67,56,202,.15); }

/* ── TESTIMONIALS ────────────────────────────── */
.testi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.testi-card {
  background:#fff; border:1.5px solid var(--border);
  border-radius:var(--r); padding:2.2rem;
  box-shadow:var(--sh-sm);
  transition:transform .28s var(--spring), box-shadow .28s;
  position:relative;
}
.testi-card::before {
  content:'"'; position:absolute; top:8px; right:20px;
  font-size:5rem; font-family:Georgia,serif; color:var(--accent-soft);
  line-height:1; pointer-events:none; font-weight:700;
}
.testi-card:hover { transform:translateY(-5px); box-shadow:var(--sh-lg); }
.testi-stars { color:#F59E0B; letter-spacing:3px; margin-bottom:.9rem; font-size:.9rem; }
.testi-card p { font-size:.9rem; color:var(--text-l); line-height:1.75; margin-bottom:1.5rem; font-style:italic; position:relative; z-index:1; }
.testi-author { display:flex; gap:12px; align-items:center; }
.testi-author img { width:44px; height:44px; border-radius:50%; object-fit:cover; border:2px solid var(--accent-soft); flex-shrink:0; }
.testi-author strong { display:block; font-size:.875rem; font-weight:700; color:var(--text); }
.testi-author span { font-size:.75rem; color:var(--text-ll); }

/* ── PARTNERS ────────────────────────────────── */
.partners-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem;
  max-width:960px; margin:0 auto;
}
.partner-card {
  display:flex; flex-direction:column; align-items:center; gap:.7rem;
  padding:1.8rem 1.4rem;
  background:#fff; border:1.5px solid var(--border);
  border-radius:var(--r); box-shadow:var(--sh-sm); text-align:center;
  transition:transform .28s var(--spring), box-shadow .28s, border-color .28s;
  cursor:default;
}
.partner-card:hover { transform:translateY(-5px); box-shadow:var(--sh-md); border-color:var(--accent-b); }

.partner-logo-box {
  width:80px; height:48px;
  display:flex; align-items:center; justify-content:center;
  border-radius:10px; background:var(--bg-alt);
  padding:8px; transition:background .2s;
}
.partner-card:hover .partner-logo-box { background:color-mix(in srgb, var(--pc) 10%, transparent); }
.partner-logo-box img {
  max-width:100%; max-height:100%; object-fit:contain;
  filter:grayscale(1) opacity(.6);
  transition:filter .3s;
}
.partner-card:hover .partner-logo-box img { filter:grayscale(0) opacity(1); }
.partner-fallback {
  font-size:.85rem; font-weight:800; letter-spacing:-.01em;
  display:flex; align-items:center; justify-content:center;
}
.partner-name { font-size:.82rem; font-weight:700; color:var(--text); }
.partner-cat { font-size:.7rem; color:var(--text-ll); font-weight:500; }

/* ── CONTACT SECTION ─────────────────────────── */
.contact-section { background:var(--bg-alt); padding:5rem 0; }

.contact-card {
  display:grid; grid-template-columns:1fr 1.6fr;
  border-radius:24px; overflow:hidden;
  box-shadow:var(--sh-xl); border:1px solid var(--border);
  max-width:1080px; margin:0 auto;
}
.contact-panel {
  background:linear-gradient(155deg, var(--accent) 0%, #3730a3 60%, var(--accent-m) 100%);
  color:#fff;
  padding:3rem; display:flex; flex-direction:column; gap:2rem;
}
.cp-top h3 { font-size:1.7rem; font-weight:800; line-height:1.15; color:#fff; margin-bottom:.8rem; }
.cp-top p { font-size:.9rem; color:rgba(255,255,255,.65); line-height:1.7; }
.cp-items { display:flex; flex-direction:column; gap:.7rem; }
.cp-item {
  display:flex; gap:12px; align-items:center;
  padding:.85rem 1rem; border-radius:12px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.15);
  transition:background .2s; color:inherit;
}
.cp-item:hover { background:rgba(255,255,255,.18); }
.cp-item-icon {
  width:34px; height:34px; min-width:34px; border-radius:9999px;
  background:rgba(255,255,255,.15);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.9);
}
.cp-item-icon svg { width:16px; height:16px; }
.cp-item-lbl { font-size:.65rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.45); display:block; }
.cp-item-val { font-size:.875rem; font-weight:600; color:rgba(255,255,255,.9); }
.cp-quote {
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
  border-radius:14px; padding:1.2rem; flex-grow:1;
}
.cpq-stars { color:#F59E0B; letter-spacing:2px; margin-bottom:.6rem; font-size:.85rem; }
.cp-quote p { font-size:.855rem; line-height:1.65; color:rgba(255,255,255,.75); font-style:italic; margin-bottom:.7rem; }
.cp-quote span { font-size:.7rem; color:rgba(255,255,255,.45); font-weight:600; }
.cp-badge {
  display:inline-flex; align-items:center; gap:8px;
  font-size:.77rem; font-weight:600; color:rgba(255,255,255,.85);
  background:rgba(34,197,94,.12); border:1px solid rgba(34,197,94,.3);
  border-radius:9999px; padding:7px 14px;
}
.cp-badge-dot { width:7px; height:7px; border-radius:50%; background:#22c55e; animation:blink 2s infinite; flex-shrink:0; }

.contact-form {
  background:#fff; padding:3rem;
  display:flex; flex-direction:column;
}
.cf-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.cf-field { display:flex; flex-direction:column; gap:.45rem; margin-bottom:1.1rem; }
.cf-field label { font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-l); }
.cf-input {
  width:100%; padding:.85rem 1rem;
  border:1.5px solid var(--border); border-radius:10px;
  font-size:.9rem; color:var(--text); outline:none; background:#fff;
  transition:border-color .2s, box-shadow .2s, transform .15s;
  -webkit-appearance:none; appearance:none;
}
.cf-input::placeholder { color:var(--text-ll); }
.cf-input:focus { border-color:var(--accent-b); box-shadow:0 0 0 3px rgba(99,102,241,.12); transform:translateY(-1px); }
.cf-select { cursor:pointer; }
.cf-textarea { border-radius:12px !important; resize:vertical; min-height:108px; }
.cf-submit {
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; padding:1rem 2rem; border-radius:10px;
  background:var(--accent); color:#fff; border:none;
  font-weight:700; font-size:1rem;
  box-shadow:0 10px 28px -6px rgba(67,56,202,.35);
  transition:background .2s, transform .15s var(--spring), box-shadow .2s;
  cursor:pointer; position:relative; overflow:hidden; margin-top:.4rem;
}
.cf-submit svg { width:18px; height:18px; transition:transform .2s; }
.cf-submit:hover { background:var(--accent-m); transform:translateY(-2px); box-shadow:0 16px 36px -6px rgba(67,56,202,.42); }
.cf-submit:hover svg { transform:translateX(5px); }
.cf-submit.sending { opacity:.75; pointer-events:none; }
#formFeedback { min-height:1.5rem; text-align:center; margin-top:.8rem; font-size:.85rem; color:#16a34a; font-weight:600; }
.cf-note { text-align:center; font-size:.78rem; color:var(--text-ll); margin-top:.75rem; line-height:1.5; }
.cf-note strong { color:var(--text-l); }

/* ── FOOTER ──────────────────────────────────── */
.footer { background:var(--bg-alt); border-top:1px solid var(--border); padding:2.5rem 0; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.5rem; }
.footer .logo { color:var(--accent); }
.footer .logo em { color:var(--text-l); }
.footer .logo span { color:var(--text-ll); }
.footer-links { display:flex; gap:2rem; }
.footer-links a { font-size:.875rem; color:var(--text-l); transition:color .2s; }
.footer-links a:hover { color:var(--accent); }
.footer p { font-size:.82rem; color:var(--text-ll); }
.footer p em { font-style:italic; }

/* ── WHATSAPP FLOTANTE ───────────────────────── */
.wa-float {
  position:fixed; bottom:28px; right:28px; z-index:999;
  width:56px; height:56px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  box-shadow:0 6px 22px -4px rgba(37,211,102,.5);
  transition:transform .25s var(--spring), box-shadow .25s;
}
.wa-float:hover { transform:translateY(-3px) scale(1.06); box-shadow:0 10px 28px -4px rgba(37,211,102,.6); }
.wa-float svg { width:56px; height:56px; }
.wa-tooltip {
  position:absolute; right:66px; top:50%; transform:translateY(-50%);
  background:var(--text); color:#fff;
  font-size:.78rem; font-weight:600;
  padding:7px 14px; border-radius:9999px;
  white-space:nowrap; box-shadow:var(--sh-md);
  opacity:0; pointer-events:none;
  transition:opacity .2s, transform .2s;
}
.wa-float:hover .wa-tooltip { opacity:1; transform:translateY(-50%) translateX(-4px); }

/* ── RESPONSIVE ──────────────────────────────── */
@media (max-width:1100px) {
  .bento-card--lg, .bento-card--wide { flex-direction:column; }
  .bento-card--lg .bc-img-wrap,
  .bento-card--wide .bc-img-wrap--side { width:100%; height:200px; }
}
@media (max-width:1024px) {
  .method-grid { grid-template-columns:1fr; gap:3rem; }
  .method-visual { height:320px; }
  .method-visual img { height:320px; }
  .why-grid { grid-template-columns:1fr; gap:3rem; }
  .plans-grid { grid-template-columns:1fr; max-width:460px; margin:0 auto; }
  .sectors-grid { grid-template-columns:repeat(2,1fr); }
  .contact-card { grid-template-columns:1fr; }
  .partners-grid { grid-template-columns:repeat(4,1fr); }
  .bento-grid { grid-template-columns:repeat(2,1fr); }
  .bento-card--lg, .bento-card--wide { grid-column:span 2; }
  .hms-item { padding:1rem 1.5rem; }
}
@media (max-width:768px) {
  .nav-links { display:none; }
  .btn-nav { display:none; }
  .burger { display:flex; }
  .container { padding:0 1.2rem; }
  .section { padding:3.5rem 0; }
  .hero { padding:7rem 0 4rem; min-height:auto; }
  .hero-title { font-size:clamp(2.6rem,8vw,3.8rem); }
  .hero-metrics-strip { flex-direction:column; gap:0; padding:0; }
  .hms-div { width:100%; height:1px; }
  .hms-item { width:100%; flex-direction:row; justify-content:space-between; padding:1rem 1.5rem; }
  .hms-num { font-size:1.5rem; }
  .bento-grid { grid-template-columns:1fr; }
  .bento-card--lg, .bento-card--wide { grid-column:span 1; }
  .sectors-grid { grid-template-columns:1fr; }
  .testi-grid { grid-template-columns:1fr; }
  .why-mosaic { grid-template-columns:1fr; }
  .wm-card--blue { grid-column:span 1; flex-direction:column; }
  .contact-card { border-radius:16px; }
  .contact-form { padding:2rem 1.5rem; }
  .cf-row { grid-template-columns:1fr; }
  .footer-inner { flex-direction:column; text-align:center; }
  .footer-links { flex-wrap:wrap; justify-content:center; }
  .partners-grid { grid-template-columns:repeat(2,1fr); }
  .method-item { grid-template-columns:72px 1fr; }
  .wa-float { width:48px; height:48px; bottom:18px; right:18px; }
  .wa-float svg { width:48px; height:48px; }
  .wa-tooltip { display:none; }
}
@media (max-width:480px) {
  .hero-title { font-size:2.6rem; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .btn-primary, .btn-ghost { text-align:center; justify-content:center; }
  .section-hd h2 { font-size:1.7rem; }
}