/* =============================================
   LOGA Express — CSS Responsive Producción
   ============================================= */
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --blue:       #1D72F5;
  --blue-2:     #5A9BFF;
  --dark:       #060810;
  --dark-2:     #0C1120;
  --card:       #0F1628;
  --border:     rgba(255,255,255,0.07);
  --text:       #EDF0F8;
  --muted:      #7A8AA8;
  --dim:        #3D4F6A;
  --nav-h:      58px;
  --px:         60px;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Figtree',system-ui,sans-serif; background:var(--dark); color:var(--text); overflow-x:hidden; -webkit-font-smoothing:antialiased; }
img  { max-width:100%; height:auto; display:block; }
ul   { list-style:none; }
a    { color:inherit; }

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:300;
  height:var(--nav-h); padding:0 var(--px);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  background:rgba(6,8,16,0.87); backdrop-filter:blur(24px);
  border-bottom:1px solid rgba(255,255,255,0.05);
  transition:background .3s;
}
.nav-logo { display:flex; align-items:center; gap:.6rem; text-decoration:none; flex-shrink:0; }
.nav-logo img { height:30px; width:auto; }
.nav-brand { font-size:.95rem; font-weight:700; color:#fff; letter-spacing:-.3px; white-space:nowrap; }
.nav-brand span { color:var(--blue-2); }
.nav-links { display:flex; gap:2rem; margin:0 auto; }
.nav-links a { text-decoration:none; color:var(--muted); font-size:.875rem; font-weight:500; transition:color .2s; white-space:nowrap; }
.nav-links a:hover { color:#fff; }
.nav-cta { background:var(--blue); color:#fff!important; font-size:.8rem; font-weight:600; padding:.5rem 1.25rem; border-radius:22px; text-decoration:none; transition:all .25s; white-space:nowrap; flex-shrink:0; }
.nav-cta:hover { background:var(--blue-2); transform:scale(1.04); }

/* Hamburger */
.nav-toggle { display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:36px; height:36px; background:none; border:none; cursor:pointer; padding:4px; }
.nav-toggle span { display:block; width:22px; height:2px; background:var(--text); border-radius:2px; transition:all .3s; }
.nav-toggle.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.nav-toggle.open span:nth-child(2) { opacity:0; }
.nav-toggle.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* Mobile drawer */
.nav-drawer { display:none; position:fixed; top:var(--nav-h); left:0; right:0; z-index:299; background:rgba(6,8,16,0.98); backdrop-filter:blur(20px); border-bottom:1px solid rgba(255,255,255,0.07); padding:1.5rem 1.5rem 2rem; flex-direction:column; }
.nav-drawer.open { display:flex; }
.nav-drawer li { border-bottom:1px solid var(--border); }
.nav-drawer li:last-child { border:none; }
.nav-drawer a { display:block; padding:1rem 0; font-size:1.1rem; font-weight:600; color:var(--text); text-decoration:none; transition:color .2s; }
.nav-drawer a:hover { color:var(--blue-2); }
.drawer-cta { margin-top:1.5rem!important; display:block!important; text-align:center; background:var(--blue)!important; color:#fff!important; font-size:1rem!important; font-weight:700!important; padding:.875rem!important; border-radius:12px!important; text-decoration:none!important; }
.drawer-cta:hover { background:var(--blue-2)!important; }

/* ── WHATSAPP FLOAT ── */
.wa-float { position:fixed; bottom:1.75rem; right:1.75rem; z-index:500; width:56px; height:56px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(37,211,102,0.4); text-decoration:none; animation:waPop .6s 1.2s cubic-bezier(.34,1.56,.64,1) both; transition:transform .25s,box-shadow .25s; }
.wa-float:hover { transform:scale(1.12); box-shadow:0 6px 32px rgba(37,211,102,0.6); }
.wa-float svg { width:28px; height:28px; fill:#fff; }
.wa-tip { position:absolute; right:68px; top:50%; transform:translateY(-50%); background:rgba(6,8,16,.95); backdrop-filter:blur(12px); color:#fff; font-size:.8rem; font-weight:600; padding:.5rem .875rem; border-radius:10px; white-space:nowrap; border:1px solid rgba(255,255,255,.1); opacity:0; pointer-events:none; transition:opacity .2s; }
.wa-float:hover .wa-tip { opacity:1; }

/* ── HERO ── */
.hero { min-height:100vh; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:0; background:radial-gradient(ellipse 60% 90% at 5% 50%,rgba(29,114,245,.11) 0%,transparent 55%),radial-gradient(ellipse 50% 60% at 50% 100%,rgba(29,114,245,.05) 0%,transparent 50%),linear-gradient(160deg,#08122A 0%,#060810 45%,#060810 100%); }
.hero-grid { position:absolute; inset:0; z-index:0; background-image:linear-gradient(rgba(29,114,245,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(29,114,245,.03) 1px,transparent 1px); background-size:64px 64px; mask-image:radial-gradient(ellipse 80% 80% at 30% 50%,black 0%,transparent 75%); }
.particles { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
.particle { position:absolute; border-radius:50%; background:var(--blue); opacity:0; animation:floatP var(--dur,9s) var(--del,0s) ease-in-out infinite; }

.hero-inner { position:relative; z-index:2; flex:1; display:flex; align-items:center; padding:calc(var(--nav-h) + 2rem) var(--px) 6rem; gap:2rem; max-width:1260px; margin:0 auto; width:100%; }
.hero-left { flex:0 0 460px; min-width:0; }

.hero-chip { display:inline-flex; align-items:center; gap:.45rem; background:rgba(29,114,245,.12); border:1px solid rgba(29,114,245,.28); color:var(--blue-2); font-size:.68rem; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; padding:.375rem .875rem; border-radius:20px; margin-bottom:1.5rem; opacity:0; animation:fadeUp .7s .3s ease forwards; }
.chip-dot { width:6px; height:6px; background:var(--blue-2); border-radius:50%; flex-shrink:0; animation:blink 2s infinite; }
.hero h1 { font-size:clamp(2.2rem,4.5vw,4.5rem); font-weight:900; line-height:1.0; letter-spacing:-.04em; color:#fff; margin-bottom:1.25rem; opacity:0; animation:fadeUp .8s .45s ease forwards; }
.hero h1 em { font-style:normal; color:var(--blue-2); }
.hero-p { font-size:clamp(.95rem,1.5vw,1.05rem); color:var(--muted); line-height:1.75; max-width:420px; margin-bottom:2rem; opacity:0; animation:fadeUp .8s .6s ease forwards; }
.hero-btns { display:flex; gap:.75rem; flex-wrap:wrap; opacity:0; animation:fadeUp .8s .75s ease forwards; }

.hero-right { flex:1; min-width:0; display:flex; align-items:center; justify-content:flex-end; opacity:0; animation:fadeLeft 1s .8s ease forwards; }

/* Valla */
.valla-scene { position:relative; cursor:pointer; width:100%; max-width:680px; transition:transform .6s cubic-bezier(.25,.46,.45,.94); }
.valla-scene:hover { transform:scale(1.02) translateY(-6px); }
.valla-img { width:100%; display:block; position:relative; z-index:2; filter:brightness(.7) contrast(1.05) drop-shadow(0 20px 50px rgba(0,0,0,.6)); transition:filter .7s ease; }
.valla-scene:hover .valla-img { filter:brightness(1.15) drop-shadow(0 20px 50px rgba(0,0,0,.5)); }
.valla-light-overlay { position:absolute; top:8%; left:8%; right:5%; height:70%; z-index:3; pointer-events:none; opacity:0; transition:opacity .7s ease; border-radius:4px; background:radial-gradient(ellipse 90% 55% at 52% 0%,rgba(255,245,220,.22) 0%,rgba(255,235,180,.12) 30%,rgba(255,220,140,.05) 60%,transparent 85%); mix-blend-mode:screen; }
.valla-scene:hover .valla-light-overlay { opacity:1; }
.lamp-glow { position:absolute; top:5%; width:80px; height:50px; pointer-events:none; z-index:3; opacity:0; transition:opacity .6s ease; background:radial-gradient(ellipse 60% 100% at 50% 0%,rgba(255,250,220,.55) 0%,rgba(255,230,160,.2) 50%,transparent 100%); border-radius:50%; }
.lamp-glow.l1 { left:18%; } .lamp-glow.l2 { left:48%; transform:translateX(-50%); } .lamp-glow.l3 { right:12%; }
.valla-scene:hover .lamp-glow { opacity:1; }
.valla-scene:hover .lamp-glow.l2 { transition-delay:.08s; }
.valla-scene:hover .lamp-glow.l3 { transition-delay:.15s; }
.valla-base-glow { position:absolute; bottom:22%; left:10%; right:5%; height:8%; z-index:3; pointer-events:none; opacity:0; transition:opacity .7s ease .1s; background:linear-gradient(to bottom,rgba(255,220,120,.06),transparent); mix-blend-mode:screen; }
.valla-scene:hover .valla-base-glow { opacity:1; }
.valla-hint { text-align:center; margin-top:.875rem; font-size:.7rem; color:var(--dim); letter-spacing:.5px; display:flex; align-items:center; justify-content:center; gap:.4rem; transition:color .3s; opacity:0; animation:fadeUp .7s 1.6s ease forwards; }
.valla-scene:hover .valla-hint { color:var(--blue-2); }
.hdot { width:5px; height:5px; border-radius:50%; background:var(--dim); transition:background .3s,box-shadow .3s; flex-shrink:0; }
.valla-scene:hover .hdot { background:var(--blue-2); box-shadow:0 0 8px var(--blue-2); }

/* Trust bar */
.hero-trust { position:absolute; bottom:0; left:0; right:0; z-index:10; display:flex; align-items:center; flex-wrap:wrap; background:rgba(6,8,16,.7); backdrop-filter:blur(20px); border-top:1px solid rgba(255,255,255,.05); padding:.875rem var(--px); opacity:0; animation:fadeUp .7s 1s ease forwards; }
.trust-i { flex:1; min-width:160px; display:flex; align-items:center; gap:.5rem; font-size:.8rem; color:var(--muted); padding:.25rem 0; }
.trust-check { width:18px; height:18px; flex-shrink:0; background:rgba(29,114,245,.1); border:1px solid rgba(29,114,245,.25); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.55rem; color:var(--blue-2); font-weight:700; }
.trust-sep { width:1px; height:22px; background:var(--border); margin:0 1rem; flex-shrink:0; }

/* ── BUTTONS ── */
.btn-p { display:inline-flex; align-items:center; gap:.5rem; background:var(--blue); color:#fff; font-size:.95rem; font-weight:700; padding:.8rem 1.6rem; border-radius:22px; text-decoration:none; transition:all .3s; white-space:nowrap; }
.btn-p:hover { background:var(--blue-2); box-shadow:0 0 40px rgba(29,114,245,.4); transform:translateY(-2px); }
.btn-g { display:inline-flex; align-items:center; gap:.5rem; background:rgba(255,255,255,.06); color:#fff; font-size:.95rem; font-weight:600; padding:.8rem 1.6rem; border-radius:22px; border:1px solid rgba(255,255,255,.11); text-decoration:none; transition:all .3s; white-space:nowrap; }
.btn-g:hover { background:rgba(255,255,255,.12); transform:translateY(-2px); }

/* ── STRIP ── */
.strip { display:flex; justify-content:center; flex-wrap:wrap; border-bottom:1px solid var(--border); background:var(--dark-2); padding:2.5rem var(--px); }
.strip-i { flex:1; min-width:120px; max-width:200px; text-align:center; padding:.5rem 1.5rem; border-right:1px solid var(--border); opacity:0; transform:translateY(10px); transition:all .5s; }
.strip-i:last-child { border-right:none; }
.strip-i.vis { opacity:1; transform:translateY(0); }
.strip-n { font-size:clamp(1.8rem,4vw,2.4rem); font-weight:900; color:#fff; letter-spacing:-.06em; line-height:1; margin-bottom:.375rem; }
.strip-l { font-size:.68rem; font-weight:600; color:var(--muted); letter-spacing:.5px; text-transform:uppercase; }

/* ── SECTIONS ── */
.sec { padding:6rem var(--px); max-width:1140px; margin:0 auto; }
.tag  { font-size:.68rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--blue-2); margin-bottom:.875rem; }
.title { font-size:clamp(1.75rem,4vw,3.1rem); font-weight:900; letter-spacing:-.05em; line-height:1.05; color:#fff; margin-bottom:1rem; }
.title .a { color:var(--blue-2); }
.sub { font-size:clamp(.9rem,1.5vw,1rem); color:var(--muted); line-height:1.8; max-width:520px; margin-bottom:3.5rem; }
.divider { height:1px; background:linear-gradient(90deg,transparent,var(--border),transparent); max-width:1140px; margin:0 auto; }

/* ── SERVICES ── */
.srv-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:20px; overflow:hidden; }
.srv { background:var(--card); padding:2rem 1.875rem; position:relative; overflow:hidden; transition:background .25s; opacity:0; transform:translateY(16px); }
.srv.vis { opacity:1; transform:translateY(0); transition:opacity .5s,transform .5s,background .25s; }
.srv::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,var(--blue),var(--blue-2)); transform:scaleX(0); transform-origin:left; transition:transform .3s; }
.srv:hover { background:#131C30; }
.srv:hover::before { transform:scaleX(1); }
.srv:hover .srv-arrow { transform:translateX(5px); }
.srv-n { font-size:.68rem; font-weight:700; color:var(--dim); margin-bottom:1rem; letter-spacing:1px; }
.srv-pill { display:inline-block; font-size:.56rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:.2rem .625rem; border-radius:20px; margin-bottom:.875rem; background:rgba(29,114,245,.1); border:1px solid rgba(29,114,245,.2); color:var(--blue-2); }
.srv-name { font-size:clamp(1rem,1.5vw,1.125rem); font-weight:800; color:#fff; letter-spacing:-.03em; margin-bottom:.625rem; line-height:1.25; }
.srv-desc { font-size:.875rem; color:var(--muted); line-height:1.7; margin-bottom:1.375rem; }
.srv-link { font-size:.8rem; font-weight:600; color:var(--blue-2); text-decoration:none; display:inline-flex; align-items:center; gap:.25rem; }
.srv-arrow { transition:transform .2s; display:inline-block; }

/* ── PORTFOLIO ── */
.port-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr; grid-template-rows:250px 250px; gap:8px; border-radius:20px; overflow:hidden; }
.port-cell { position:relative; overflow:hidden; background:var(--card); opacity:0; transform:translateY(12px); }
.port-cell.vis { opacity:1; transform:translateY(0); transition:opacity .6s,transform .6s; }
.port-cell.tall { grid-row:span 2; }
.port-cell img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.25,.46,.45,.94); }
.port-cell:hover img { transform:scale(1.07); }
.port-info { position:absolute; bottom:0; left:0; right:0; padding:1rem 1.125rem; background:linear-gradient(to top,rgba(6,8,16,.92) 0%,transparent 100%); opacity:0; transform:translateY(6px); transition:all .3s; }
.port-cell:hover .port-info { opacity:1; transform:translateY(0); }
.port-cat { font-size:.625rem; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:var(--blue-2); margin-bottom:.2rem; }
.port-name { font-size:.8rem; font-weight:700; color:#fff; }
.port-more { text-align:center; margin-top:1.25rem; }

/* ── WHY ── */
.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.875rem; }
.wcard { background:var(--card); border:1px solid var(--border); border-radius:18px; padding:1.875rem 1.625rem; transition:border-color .2s,background .2s,transform .3s; opacity:0; transform:translateY(12px); }
.wcard.vis { opacity:1; transform:translateY(0); transition:opacity .5s,transform .5s,border-color .2s,background .2s; }
.wcard:hover { border-color:rgba(29,114,245,.25); background:#0E1726; transform:translateY(-4px); }
.w-num { font-size:clamp(1.8rem,3vw,2.25rem); font-weight:900; color:#fff; letter-spacing:-.06em; line-height:1; margin-bottom:.5rem; }
.w-title { font-size:.875rem; font-weight:700; color:#fff; margin-bottom:.45rem; }
.w-desc { font-size:.8rem; color:var(--muted); line-height:1.7; }

/* ── TESTIMONIALS ── */
.t-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.875rem; }
.tcard { background:var(--card); border:1px solid var(--border); border-radius:18px; padding:1.625rem; opacity:0; transform:translateY(12px); transition:border-color .2s,transform .3s; }
.tcard.vis { opacity:1; transform:translateY(0); transition:opacity .5s,transform .5s,border-color .2s; }
.tcard:hover { border-color:rgba(29,114,245,.2); transform:translateY(-3px); }
.tstars { font-size:.75rem; letter-spacing:3px; color:var(--blue-2); margin-bottom:.875rem; }
.ttext { font-size:.875rem; color:var(--muted); line-height:1.75; margin-bottom:1.125rem; font-style:italic; }
.tauthor { display:flex; align-items:center; gap:.625rem; }
.tavatar { width:36px; height:36px; flex-shrink:0; border-radius:50%; background:rgba(29,114,245,.1); border:1px solid rgba(29,114,245,.18); display:flex; align-items:center; justify-content:center; font-size:.68rem; font-weight:800; color:var(--blue-2); }
.taname { font-size:.8rem; font-weight:700; color:#fff; }
.tarole { font-size:.7rem; color:var(--dim); margin-top:.125rem; }

/* ── CTA ── */
.cta-wrap { margin:0 var(--px) 5rem; }
.cta-box { background:var(--dark-2); border:1px solid var(--border); border-radius:24px; padding:5rem 3.75rem; text-align:center; position:relative; overflow:hidden; }
.cta-glow { position:absolute; inset:0; background:radial-gradient(ellipse 65% 75% at 50% 0%,rgba(29,114,245,.09) 0%,transparent 70%); pointer-events:none; }
.cta-box h2 { font-size:clamp(1.75rem,4vw,3.375rem); font-weight:900; letter-spacing:-.06em; line-height:1.05; color:#fff; margin-bottom:1rem; position:relative; }
.cta-box p { font-size:clamp(.95rem,1.5vw,1.05rem); color:var(--muted); margin-bottom:2.375rem; position:relative; }
.cta-btns { display:flex; gap:.75rem; justify-content:center; flex-wrap:wrap; position:relative; }
.cta-tags { display:flex; gap:1.25rem; justify-content:center; flex-wrap:wrap; margin-top:1.625rem; position:relative; }
.ctag { font-size:.75rem; color:var(--dim); display:flex; align-items:center; gap:.3rem; }
.ctag::before { content:'✓'; color:var(--blue-2); font-weight:700; }

/* ── FOOTER ── */
footer { border-top:1px solid var(--border); padding:2.5rem var(--px); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.25rem; }
.foot-logo { display:flex; align-items:center; gap:.625rem; }
.foot-logo img { height:26px; width:auto; }
.foot-name { font-size:.875rem; font-weight:700; color:#fff; }
.foot-sub { font-size:.7rem; color:var(--dim); margin-top:.125rem; }
.foot-links { display:flex; gap:1.375rem; flex-wrap:wrap; }
.foot-links a { font-size:.8rem; color:var(--dim); text-decoration:none; transition:color .2s; }
.foot-links a:hover { color:#fff; }
.foot-phone { font-size:.8rem; font-weight:700; color:var(--blue-2); }

/* ── KEYFRAMES ── */
@keyframes fadeUp   { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeLeft { from{opacity:0;transform:translateX(60px)}  to{opacity:1;transform:translateX(0)} }
@keyframes blink    { 0%,100%{opacity:1} 50%{opacity:.3} }
@keyframes waPop    { from{opacity:0;transform:scale(.2)} to{opacity:1;transform:scale(1)} }
@keyframes floatP   { 0%{opacity:0;transform:translateY(0) scale(.5)} 20%{opacity:var(--op,.1)} 80%{opacity:var(--op,.1)} 100%{opacity:0;transform:translateY(-140px) scale(1.2)} }

/* =============================================
   TABLET  768px – 1024px
   ============================================= */
@media (max-width:1024px) {
  :root { --px:36px; }
  .nav-links { gap:1.25rem; }
  .hero-inner { padding:calc(var(--nav-h) + 1.5rem) var(--px) 6rem; gap:1.5rem; }
  .hero-left  { flex:0 0 360px; }
  .valla-scene { max-width:500px; }
  .srv-grid  { grid-template-columns:repeat(2,1fr); }
  .port-grid { grid-template-columns:1fr 1fr; grid-template-rows:200px 200px 200px; }
  .port-cell.tall { grid-row:span 2; }
  .why-grid  { grid-template-columns:repeat(2,1fr); }
  .t-grid    { grid-template-columns:repeat(2,1fr); }
  .cta-box   { padding:3.5rem 2rem; }
  .cta-wrap  { margin:0 var(--px) 4rem; }
}

/* =============================================
   MOBILE  ≤ 768px
   ============================================= */
@media (max-width:768px) {
  :root { --px:1.25rem; --nav-h:56px; }

  /* Nav */
  nav { padding:0 1.25rem; }
  .nav-links, .nav-cta { display:none; }
  .nav-toggle { display:flex; }

  /* Hero */
  .hero-inner { flex-direction:column; align-items:flex-start; padding:calc(var(--nav-h) + 1.5rem) var(--px) 7rem; gap:2.5rem; }
  .hero-left  { flex:none; width:100%; }
  .hero-p     { max-width:100%; }
  .hero-btns  { flex-direction:column; width:100%; }
  .hero-btns .btn-p,
  .hero-btns .btn-g { width:100%; justify-content:center; padding:1rem; font-size:1rem; border-radius:14px; }
  .hero-right { width:100%; justify-content:center; }
  .valla-scene { width:100%; max-width:100%; margin-right:0; }
  .valla-hint { display:none; }

  /* Trust bar */
  .hero-trust { padding:.75rem 1.25rem; }
  .trust-sep { display:none; }
  .trust-i   { min-width:45%; font-size:.72rem; }

  /* Strip */
  .strip { padding:1.5rem 1.25rem; }
  .strip-i { flex:0 0 50%; max-width:50%; padding:.875rem .5rem; border-right:none; border-bottom:1px solid var(--border); }
  .strip-i:nth-child(odd)  { border-right:1px solid var(--border); }
  .strip-i:nth-child(3),
  .strip-i:nth-child(4)    { border-bottom:none; }

  /* Sections */
  .sec { padding:3.5rem var(--px); }

  /* Services 1 col */
  .srv-grid { grid-template-columns:1fr; border-radius:16px; }
  .srv { padding:1.5rem; }

  /* Portfolio 1 col */
  .port-grid { grid-template-columns:1fr; grid-template-rows:auto; gap:6px; }
  .port-cell      { height:220px; }
  .port-cell.tall { grid-row:span 1; height:260px; }
  .port-info { opacity:1; transform:translateY(0); } /* always visible on touch */

  /* Why 1 col */
  .why-grid { grid-template-columns:1fr; gap:.75rem; }
  .wcard { padding:1.375rem 1.25rem; }

  /* Testimonials 1 col */
  .t-grid { grid-template-columns:1fr; gap:.875rem; }

  /* CTA */
  .cta-wrap { margin:0 var(--px) 3rem; }
  .cta-box  { padding:2.5rem 1.375rem; border-radius:16px; }
  .cta-btns { flex-direction:column; align-items:stretch; }
  .cta-btns .btn-p,
  .cta-btns .btn-g { width:100%; justify-content:center; padding:1rem; font-size:1rem; border-radius:14px; }
  .cta-tags { gap:.75rem; }

  /* Footer */
  footer { flex-direction:column; align-items:flex-start; gap:1.5rem; padding:2rem var(--px); }
  .foot-links { gap:1rem; }

  /* WA */
  .wa-float { bottom:1.25rem; right:1.25rem; width:50px; height:50px; }
  .wa-float svg { width:24px; height:24px; }
  .wa-tip { display:none; }
}

/* =============================================
   SMALL PHONES  ≤ 380px
   ============================================= */
@media (max-width:380px) {
  .hero h1 { font-size:2rem; }
  .title    { font-size:1.6rem; }
}