@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;1,400&family=DM+Mono:wght@400;500&display=swap');

/* ═══════════════════════════ TOKENS ═══════════════════════════ */
:root {
  --bg:         #070D0A;
  --bg-2:       #0A1410;
  --bg-3:       #0F1E16;
  --g-deep:     #0A2E1F;
  --g-core:     #1D7A4D;
  --g-vivid:    #27A868;
  --g-bright:   #2ECC8A;
  --g-light:    #7DE8BB;
  --g-tint:     #EAF9F2;
  --lime:       #B8F000;
  --lime-d:     #8AB800;
  --white:      #FFFFFF;
  --off:        #F0F3EF;
  --ink:        #DAE0D8;
  --ink-60:     #788472;
  --ink-30:     #3A4038;
  --amber:      #F0A500;
  --red:        #E63946;
  --fd:         'Outfit', sans-serif;
  --fb:         'DM Sans', sans-serif;
  --fm:         'DM Mono', monospace;
  --r:          6px;
  --tr:         0.25s ease;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; scroll-padding-top:80px; }
body {
  font-family: var(--fb);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.65;
  overflow-x: hidden;
}

/* ═══ SCROLLBAR ═══ */
::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--g-core); border-radius:2px; }

/* ═══ SELECTION ═══ */
::selection { background: var(--lime); color: var(--bg); }

/* ═══ TYPOGRAPHY ═══ */
h1,h2,h3,h4,h5 { font-family: var(--fd); font-weight:700; line-height:1.1; letter-spacing:-0.01em; color: var(--white); }
h1 { font-size: clamp(2.4rem,6vw,5.5rem); font-weight:800; letter-spacing:-.02em; }
h2 { font-size: clamp(1.8rem,4vw,3.2rem); }
h3 { font-size: clamp(1.2rem,2.5vw,1.6rem); }
p  { color: var(--ink-60); font-size:1rem; line-height:1.75; }
a  { text-decoration:none; color:inherit; }
strong { color: var(--white); font-weight:600; }
em { font-style:italic; color: var(--g-bright); }
code { font-family: var(--fm); font-size:.85rem; background: var(--bg-3); color: var(--g-bright); padding:2px 7px; border-radius:3px; }

/* ═══ LAYOUT UTILS ═══ */
.wrap   { max-width:1240px; margin:0 auto; padding:0 5vw; }
.section { padding:100px 0; }
.section-sm { padding:64px 0; }
.flex  { display:flex; }
.grid  { display:grid; }
.items-center { align-items:center; }
.justify-between { justify-content:space-between; }
.gap-4 { gap:1rem; }
.gap-8 { gap:2rem; }
.text-center { text-align:center; }

/* ═══ EYEBROW ═══ */
.eyebrow {
  font-family: var(--fm); font-size:.72rem;
  letter-spacing:.22em; text-transform:uppercase;
  color: var(--g-bright); display:inline-flex; align-items:center; gap:10px;
  margin-bottom:18px;
}
.eyebrow::before { content:''; display:block; width:28px; height:1px; background:var(--g-bright); }

/* ═══ NAVBAR ═══ */
.nav {
  position:sticky; top:0; left:0; right:0; z-index:200;
  height:68px;
  background: rgba(7,13,10,.85);
  backdrop-filter: blur(20px) saturate(1.4);
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
  border-bottom:1px solid rgba(46,204,138,.08);
  transition: background .3s ease, border-color .3s ease, box-shadow .3s ease;
  will-change: background, box-shadow;
}
.nav.scrolled {
  background: rgba(7,13,10,.97);
  border-bottom-color: rgba(46,204,138,.18);
  box-shadow: 0 1px 0 rgba(46,204,138,.06), 0 8px 32px rgba(0,0,0,.4);
}
.nav.scrolled .nav-logo { color:var(--white); }
.nav-inner {
  max-width:1240px; margin:0 auto; padding:0 5vw;
  height:100%; display:flex; align-items:center; justify-content:space-between;
}
.nav-logo {
  display:flex; align-items:center; gap:8px;
  font-family: var(--fd); font-size:1.05rem; font-weight:700;
  color: var(--white); letter-spacing:-.01em; text-decoration:none;
  white-space:nowrap;
}
.nav-logo .logo-text-wrap { display:inline-block; line-height:1; }
.nav-logo .lw { color:var(--white); }
.nav-logo .lg { color:var(--g-bright); }
.nav-logo svg { flex-shrink:0; transition:transform .25s ease; }
.nav-logo:hover svg { transform:scale(1.08); }
.nav-links { display:flex; align-items:center; gap:28px; list-style:none; }
.nav-links a {
  font-size:.78rem; color: rgba(255,255,255,.5);
  letter-spacing:.07em; text-transform:uppercase; font-weight:500;
  transition: color var(--tr); position:relative; text-decoration:none;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0; height:1px;
  background: var(--g-bright); transform:scaleX(0); transform-origin:left;
  transition: transform .2s ease;
}
.nav-links a:hover, .nav-links a.active { color: var(--g-bright); }
.nav-links a:hover::after, .nav-links a.active::after { transform:scaleX(1); }
.nav-cta {
  background: var(--g-vivid)!important; color: var(--white)!important;
  padding:8px 20px!important; border-radius:var(--r)!important;
  font-weight:600!important; letter-spacing:0!important;
  text-transform:none!important; transition:background .2s, transform .2s !important;
}
.nav-cta::after { display:none!important; }
.nav-cta:hover { background: var(--g-bright)!important; color: var(--bg)!important; transform:translateY(-1px); }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
.hamburger span { display:block; width:22px; height:1.5px; background: var(--white); border-radius:2px; transition: transform .25s ease, opacity .25s ease; transform-origin:center; }
.mobile-menu {
  display:none; position:fixed; top:68px; left:0; right:0; bottom:0;
  background: rgba(7,13,10,.98); backdrop-filter:blur(20px);
  flex-direction:column; align-items:center; justify-content:center; gap:28px;
  z-index:199;
}
.mobile-menu.open { display:flex; }
.mobile-menu a { font-family:var(--fd); font-size:1.5rem; color: var(--white); font-weight:700; text-decoration:none; letter-spacing:-.01em; }
.mobile-menu a:hover { color: var(--g-bright); }

/* ═══ HERO BASE ═══ */
.hero {
  min-height:100vh;
  display:flex; align-items:center;
  position:relative; overflow:hidden;
  padding-top:68px;
}
.hero-bg {
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 70% 60% at 65% 40%, rgba(29,122,77,.14) 0%, transparent 60%),
    radial-gradient(ellipse 40% 40% at 10% 80%, rgba(184,240,0,.04) 0%, transparent 50%);
}
.hero-grid {
  position:absolute; inset:0; z-index:0; opacity:.04;
  background-image:
    linear-gradient(rgba(46,204,138,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(46,204,138,.5) 1px, transparent 1px);
  background-size:56px 56px;
}
.hero-content { position:relative; z-index:1; }

/* ═══ BUTTONS ═══ */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--fb); font-weight:600; cursor:pointer;
  border:none; border-radius:var(--r); font-size:.88rem;
  letter-spacing:.03em; transition: all var(--tr); white-space:nowrap;
}
.btn-primary { background:var(--g-vivid); color:var(--white); padding:13px 28px; }
.btn-primary:hover { background:var(--g-bright); color:var(--bg); transform:translateY(-1px); }
.btn-outline { background:transparent; color:var(--g-bright); border:1.5px solid var(--g-core); padding:12px 26px; }
.btn-outline:hover { background:rgba(46,204,138,.08); border-color:var(--g-bright); }
.btn-lime { background:var(--lime); color:var(--bg); padding:13px 28px; }
.btn-lime:hover { background:#C8F700; transform:translateY(-1px); }
.btn-ghost { background:transparent; color:var(--ink); border:1px solid var(--ink-30); padding:11px 24px; }
.btn-ghost:hover { border-color:var(--ink-60); color:var(--white); }
.btn-sm { padding:9px 18px; font-size:.82rem; }
.btn-lg { padding:16px 36px; font-size:.96rem; }

/* ═══ CARDS ═══ */
.card {
  background: var(--bg-2);
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px; padding:32px;
  transition: border-color var(--tr), transform var(--tr), box-shadow var(--tr);
  position:relative; overflow:hidden;
}
.card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background: linear-gradient(90deg, var(--g-vivid), var(--lime));
  transform:scaleX(0); transform-origin:left; transition: transform var(--tr);
}
.card:hover { border-color: rgba(46,204,138,.25); transform:translateY(-4px); box-shadow:0 24px 60px rgba(0,0,0,.35); }
.card:hover::before { transform:scaleX(1); }
.card-icon { width:52px; height:52px; border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; background:rgba(46,204,138,.1); }
.card-icon svg { color: var(--g-bright); }

/* ═══ TAGS / BADGES ═══ */
.tag {
  display:inline-flex; align-items:center; gap:5px;
  font-size:.7rem; font-weight:600; letter-spacing:.08em;
  padding:4px 11px; border-radius:100px; text-transform:uppercase;
}
.tag-green  { background:rgba(46,204,138,.12); color:var(--g-bright); border:1px solid rgba(46,204,138,.2); }
.tag-lime   { background:rgba(184,240,0,.15); color:var(--lime-d); border:1px solid rgba(184,240,0,.2); }
.tag-amber  { background:rgba(240,165,0,.12); color:var(--amber); }
.tag-ghost  { background:var(--bg-3); color:var(--ink-60); border:1px solid var(--ink-30); }

/* ═══ DIVIDERS ═══ */
.rule { border:none; border-top:1px solid var(--ink-30); margin:60px 0; }
.rule-sm { border:none; border-top:1px solid var(--ink-30); margin:32px 0; }

/* ═══ SECTION HEADER ═══ */
.sh { margin-bottom:56px; }
.sh p { max-width:560px; margin-top:14px; font-size:1.05rem; }
.sh.center { text-align:center; }
.sh.center p { margin:14px auto 0; }

/* ═══ STATS ROW ═══ */
.stats-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:2px; }
.stat-cell {
  background:var(--bg-2); padding:28px 24px;
  border:1px solid rgba(255,255,255,.05);
}
.stat-cell .num { font-family:var(--fd); font-size:2.4rem; font-weight:600; color:var(--g-bright); line-height:1; margin-bottom:4px; }
.stat-cell .lbl { font-size:.78rem; color:var(--ink-60); letter-spacing:.06em; text-transform:uppercase; }

/* ═══ SERVICE GRID ═══ */
.service-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2px; }
.service-item {
  padding:40px 36px; background:var(--bg-2);
  border:1px solid rgba(255,255,255,.04);
  transition: background var(--tr), border-color var(--tr);
  position:relative;
}
.service-item:hover { background:var(--bg-3); border-color:rgba(46,204,138,.15); }
.service-item .s-num { font-family:var(--fm); font-size:.72rem; color:var(--g-core); margin-bottom:18px; }
.service-item h3 { margin-bottom:12px; font-size:1.25rem; }
.service-item p { font-size:.9rem; }
.service-item .s-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:20px; }

/* ═══ PROCESS ═══ */
.process-list { display:flex; flex-direction:column; gap:0; }
.process-step {
  display:grid; grid-template-columns:64px 1fr; gap:28px;
  padding:32px 0; border-bottom:1px solid var(--ink-30);
  align-items:start;
}
.process-step:last-child { border-bottom:none; }
.step-badge {
  width:48px; height:48px; border-radius:50%;
  border:1.5px solid var(--g-core); display:flex; align-items:center; justify-content:center;
  font-family:var(--fm); font-size:1rem; color:var(--g-bright); font-weight:600;
  flex-shrink:0;
}
.step-content h4 { font-size:1.1rem; margin-bottom:8px; }

/* ═══ FORM ═══ */
.form-group { display:flex; flex-direction:column; gap:7px; }
.form-group label { font-size:.78rem; font-weight:500; color:var(--ink-60); letter-spacing:.06em; text-transform:uppercase; }
.form-group input,
.form-group select,
.form-group textarea {
  background:var(--bg-3); border:1.5px solid var(--ink-30);
  color:var(--white); font-family:var(--fb); font-size:.95rem;
  padding:12px 16px; border-radius:var(--r); outline:none;
  transition: border-color var(--tr);
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color:var(--g-vivid); }
.form-group input::placeholder,
.form-group textarea::placeholder { color:var(--ink-30); }
.form-group select option { background:var(--bg-3); }
.form-group textarea { resize:vertical; min-height:130px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-error { font-size:.8rem; color:var(--red); margin-top:3px; }
.form-success {
  background:rgba(46,204,138,.1); border:1px solid rgba(46,204,138,.3);
  border-radius:var(--r); padding:20px; color:var(--g-bright); font-weight:600;
  text-align:center; display:none;
}

/* ═══ FOOTER ═══ */
.footer {
  background: #040A07;
  border-top:1px solid rgba(255,255,255,.05);
  padding:80px 0 32px;
}
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; margin-bottom:64px; }
.footer-brand .logo-text { font-family:var(--fd); font-size:1.3rem; font-weight:700; color:var(--g-bright); margin-bottom:6px; }
.footer-brand p { font-size:.88rem; max-width:280px; margin-top:12px; color:rgba(255,255,255,.3); line-height:1.7; }
.footer-col h4 { font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--g-core); font-weight:600; margin-bottom:18px; font-family:var(--fm); }
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.footer-col ul a { font-size:.88rem; color:rgba(255,255,255,.35); transition:color var(--tr); }
.footer-col ul a:hover { color:var(--g-bright); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.05); padding-top:28px; display:flex; align-items:center; justify-content:space-between; }
.footer-bottom p { font-size:.8rem; color:rgba(255,255,255,.2); }
.footer-bottom a { font-size:.8rem; color:rgba(255,255,255,.25); }
.footer-bottom a:hover { color:var(--g-bright); }
.footer-legal { display:flex; gap:20px; }

/* ═══ NOISE OVERLAY ═══ */
body::after {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:999;
  opacity:.025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");
}

/* ═══ ANIMATIONS ═══ */
.reveal { opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in { opacity:1; transform:none; }
.reveal-left  { opacity:0; transform:translateX(-28px); transition:opacity .6s ease, transform .6s ease; }
.reveal-left.in  { opacity:1; transform:none; }
.reveal-right { opacity:0; transform:translateX(28px); transition:opacity .6s ease, transform .6s ease; }
.reveal-right.in { opacity:1; transform:none; }

/* ═══ HERO TERMINAL ═══ */
.terminal {
  background:var(--bg-2); border:1px solid rgba(255,255,255,.08);
  border-radius:12px; padding:24px 28px; font-family:var(--fm);
}
.terminal-bar { display:flex; gap:7px; margin-bottom:18px; }
.dot { width:10px; height:10px; border-radius:50%; }
.dot-r { background:#E63946; } .dot-y { background:#F0A500; } .dot-g { background:var(--g-vivid); }
.terminal-line { font-size:.8rem; color:var(--g-bright); margin-bottom:6px; line-height:1.5; }
.terminal-line .p { color:var(--ink-60); }
.terminal-line .v { color:var(--white); }
.terminal-line .c { color:var(--lime); }
.cursor { display:inline-block; width:8px; height:14px; background:var(--g-bright); animation:blink 1s step-end infinite; vertical-align:text-bottom; }
@keyframes blink { 50% { opacity:0; } }

/* ═══ PAGE HERO (inner pages) ═══ */
.page-hero {
  padding:120px 0 72px;
  background: var(--bg);
  position:relative; overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.page-hero::before {
  content:''; position:absolute; inset:0;
  background: radial-gradient(ellipse 80% 80% at 50% 0%, rgba(29,122,77,.12) 0%, transparent 70%);
}
.page-hero .wrap { position:relative; z-index:1; }
.page-hero h1 { margin-bottom:16px; }
.page-hero p  { max-width:560px; font-size:1.1rem; }

/* ═══ HIGHLIGHT BOX ═══ */
.hl-box {
  background:rgba(46,204,138,.06); border:1px solid rgba(46,204,138,.2);
  border-radius:12px; padding:32px;
}
.hl-box-lime { background:rgba(184,240,0,.06); border:1px solid rgba(184,240,0,.15); }

/* ═══ TABLE ═══ */
.data-table { width:100%; border-collapse:collapse; }
.data-table th { font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:var(--g-core); font-weight:600; padding:12px 16px; border-bottom:1px solid var(--ink-30); text-align:left; font-family:var(--fm); }
.data-table td { padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.04); font-size:.9rem; color:var(--ink); }
.data-table tr:hover td { background:rgba(255,255,255,.02); }

/* ═══ ACCORDION ═══ */
.accordion-item { border-bottom:1px solid var(--ink-30); }
.accordion-btn { width:100%; display:flex; align-items:center; justify-content:space-between; padding:20px 0; background:transparent; border:none; cursor:pointer; color:var(--white); font-family:var(--fd); font-size:1rem; font-weight:600; text-align:left; }
.accordion-btn .icon { width:20px; height:20px; border:1px solid var(--g-core); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--g-bright); font-size:.8rem; transition:transform var(--tr), background var(--tr); flex-shrink:0; }
.accordion-btn.open .icon { transform:rotate(45deg); background:var(--g-core); }
.accordion-body { display:none; padding:0 0 20px; }
.accordion-body.open { display:block; }
.accordion-body p { font-size:.9rem; }

/* ═══════════════════════════════════════
   RESPONSIVE — COMPLETO
   Breakpoints: 1024 · 768 · 480
═══════════════════════════════════════ */

/* ─── ≤1024px  (tablet) ─── */
@media(max-width:1024px) {
  .nav-links            { display:none; }
  .hamburger            { display:flex; }

  .section              { padding:72px 5vw; }
  .section-sm           { padding:48px 5vw; }
  .wrap                 { padding:0 5vw; }

  /* hero */
  .hero-layout          { grid-template-columns:1fr !important;
                          padding-top:48px !important; padding-bottom:56px !important; }
  .hero-right           { display:none !important; }

  /* layout grids */
  .home-services-grid   { grid-template-columns:1fr 1fr !important; }
  .service-grid         { grid-template-columns:1fr 1fr !important; }
  .testimonials-grid    { grid-template-columns:1fr 1fr !important; }
  .perche-grid          { grid-template-columns:1fr !important; gap:36px !important; }
  .about-grid           { grid-template-columns:1fr !important; gap:40px !important; }
  .contact-layout       { grid-template-columns:1fr !important; gap:40px !important; }
  .contact-layout > *:first-child { order:2; }
  .contact-layout > *:last-child  { order:1; }
  .process-steps        { grid-template-columns:1fr 1fr !important; }
  .process-steps::before{ display:none; }
  .services-full        { grid-template-columns:1fr !important; }
  .pricing-grid         { grid-template-columns:1fr !important;
                          max-width:400px; margin-left:auto; margin-right:auto; }
  .faq-grid             { grid-template-columns:1fr !important; }
  .faq-item:nth-child(even) { padding-left:0; border-left:none; }
  .related-grid         { grid-template-columns:1fr 1fr !important; }
  .data-grid            { grid-template-columns:1fr 1fr !important; }
  .footer-grid          { grid-template-columns:1fr 1fr !important; gap:32px; }

  /* inline-style grids */
  [style*="grid-template-columns:1fr 1fr;gap:64"],
  [style*="grid-template-columns:1fr 1fr; gap:64"]
                        { grid-template-columns:1fr !important; gap:40px !important; }
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns: repeat(4"]
                        { grid-template-columns:1fr 1fr !important; gap:16px !important; }
  [style*="grid-template-columns:2fr 1fr 1fr 1fr"]
                        { grid-template-columns:1fr 1fr !important; gap:24px !important; }
}

/* ─── ≤768px  (mobile) ─── */
@media(max-width:768px) {
  h1                    { font-size:clamp(1.9rem,7vw,2.8rem) !important;
                          line-height:1.15; letter-spacing:-.01em; }
  h2                    { font-size:clamp(1.5rem,5.5vw,2rem) !important; }
  h3                    { font-size:clamp(1rem,4vw,1.25rem) !important; }

  .section              { padding:52px 5vw !important; }
  .section-sm           { padding:36px 5vw !important; }
  .sh                   { margin-bottom:32px; }

  /* nav */
  .nav                  { height:60px; }
  .nav-inner            { padding:0 4vw; }
  .nav-logo             { font-size:.9rem; gap:8px; }
  .nav-logo svg         { width:26px; height:26px; }
  .mobile-menu          { top:60px; }
  .mobile-menu a        { font-size:1.35rem; }

  /* page hero */
  .page-hero            { padding:100px 5vw 48px !important; }
  .page-hero h1         { font-size:clamp(1.7rem,6vw,2.2rem) !important; }
  .page-hero p          { font-size:.9rem; }

  /* hero home */
  .hero-badge           { font-size:.68rem; margin-bottom:16px; }
  .hero-actions         { flex-direction:column !important; gap:10px; }
  .hero-actions .btn    { width:100%; justify-content:center; text-align:center; }
  .hero-clients         { flex-wrap:wrap; }

  /* all grids → 1 col */
  .home-services-grid,
  .service-grid,
  .testimonials-grid,
  .process-steps        { grid-template-columns:1fr !important; }
  .stats-row            { grid-template-columns:1fr 1fr !important; }
  .pricing-grid         { max-width:100% !important; }

  /* cards */
  .card                 { padding:22px 18px; }
  .hs-card              { padding:26px 20px; }
  .sf-card              { padding:26px 20px; }
  .form-card            { padding:26px 20px !important; }

  /* form */
  .form-row             { grid-template-columns:1fr !important; gap:14px; }

  /* process */
  .process-step         { grid-template-columns:44px 1fr; gap:14px; padding:20px 0; }
  .step-badge           { width:38px; height:38px; font-size:.82rem; }

  /* stats */
  .stat-cell            { padding:18px 12px; }
  .stat-cell .num       { font-size:1.7rem; }
  .stat-cell .lbl       { font-size:.66rem; }

  /* contact info */
  .contact-info-block   { gap:18px; }
  .ci-icon              { width:36px; height:36px; }

  /* footer */
  .footer               { padding:52px 5vw 20px; }
  .footer-grid          { grid-template-columns:1fr 1fr !important; gap:24px; }
  .footer-brand p       { font-size:.82rem; max-width:none; }

  /* cta strip */
  .cta-strip            { padding:44px 5vw !important; }
  .cta-strip .btn       { width:100%; justify-content:center; }

  /* blog articles */
  .article-header       { padding:110px 5vw 40px !important; }
  .data-box             { padding:16px 18px; }
  .data-grid            { grid-template-columns:1fr 1fr !important; gap:10px; }
  .data-item .d-num     { font-size:1.4rem; }
  .related-grid         { grid-template-columns:1fr !important; }
  .author-box           { flex-direction:column; padding:20px; gap:14px; }
  .callout              { padding:14px 16px; }
  .article-cta          { padding:26px 20px; }

  /* perché */
  .perche-list          { gap:14px; }
  .perche-item          { gap:12px; }
  .perche-icon          { width:34px; height:34px; }

  /* inline-style overrides for all remaining grids */
  [style*="grid-template-columns:repeat(3,1fr)"]
                        { grid-template-columns:1fr !important; }
  [style*="grid-template-columns:repeat(2,1fr)"]
                        { grid-template-columns:1fr !important; }
  [style*="grid-template-columns:1fr 1fr"]
                        { grid-template-columns:1fr !important; }
  [style*="grid-template-columns:repeat(4,1fr)"]
                        { grid-template-columns:1fr 1fr !important; }
  [style*="grid-template-columns:2fr 1fr 1fr 1fr"]
                        { grid-template-columns:1fr 1fr !important; }
  /* about / chi-siamo inner */
  [style*="grid-template-columns:1fr 1fr;gap:64px"],
  [style*="grid-template-columns:1fr 1fr; gap:64px"]
                        { grid-template-columns:1fr !important; }
  /* projects 2-col */
  [style*="grid-template-columns:repeat(2,1fr);gap:2px"]
                        { grid-template-columns:1fr !important; }
  /* faq */
  .faq-grid             { grid-template-columns:1fr !important; }
  .faq-item:nth-child(even) { padding-left:0; border-left:none; }
  /* pricing detail */
  .price-card           { padding:26px 20px; }
  /* table horizontal scroll */
  .data-table-wrap      { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .data-table           { font-size:.8rem; min-width:480px; }
  .data-table th,
  .data-table td        { padding:9px 10px; }
}

/* ─── ≤480px  (small phone) ─── */
@media(max-width:480px) {
  h1                    { font-size:1.8rem !important; }
  .eyebrow              { font-size:.64rem; }

  .section              { padding:40px 4vw !important; }
  .wrap                 { padding:0 4vw; }

  /* nav */
  .nav                  { height:56px; }
  .mobile-menu          { top:56px; }

  /* hero */
  .hero-clients         { display:none; }
  .hero-actions .btn    { padding:12px 18px; font-size:.82rem; }

  /* strip */
  .services-strip       { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .strip-inner          { gap:24px; animation:none; }
  .trust-strip          { overflow-x:auto; justify-content:flex-start; gap:18px; padding:12px 4vw; }
  .trust-sep            { display:none; }

  /* buttons */
  .btn-lg               { padding:12px 20px; font-size:.82rem; }
  .btn                  { font-size:.82rem; }

  /* tags */
  .tag                  { font-size:.63rem; padding:3px 8px; }
  .badge-feat           { font-size:.6rem; padding:3px 10px; }

  /* footer → 1 col */
  .footer-grid          { grid-template-columns:1fr !important; gap:22px; }
  .footer-bottom        { flex-direction:column; gap:8px; text-align:center; }
  .footer-legal         { flex-direction:column; align-items:center; gap:6px; }

  /* process */
  .process-steps        { gap:0 !important; }
  .process-step         { padding:18px 0; }

  /* pricing */
  .pricing-grid         { max-width:100% !important; }
  .price-card           { padding:22px 16px; }

  /* chi-siamo team: always 1 col on small */
  .team-grid,
  [style*="grid-template-columns:repeat(4,1fr)"]
                        { grid-template-columns:1fr 1fr !important; }

  /* card arrow hidden */
  .hs-card::after       { display:none; }

  /* blog */
  .data-grid            { grid-template-columns:1fr 1fr !important; }
  .article-header       { padding:90px 4vw 36px !important; }
}

/* ─── Touch device: no hover micro-animations ─── */
@media(hover:none) {
  .card:hover, .hs-card:hover
                        { transform:none; box-shadow:none; }
  .btn-primary:hover, .btn-lime:hover
                        { transform:none; }
  .card::before         { display:none; }
}