/* Photolife.360 — v5.4 (restored colors + anchor fix) */
:root{--violeta:#6a00ff;--violeta-2:#9b4dff;--negro:#0b0b10;--gris:#cfd3db;--blanco:#ffffff;--neon:0 0 14px rgba(155,77,255,.35),0 0 26px rgba(106,0,255,.25);--anchor-offset:110px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial}
body{background:linear-gradient(180deg,#0b0b10 0%, #101019 100%);color:var(--gris);line-height:1.6}
.container{max-width:1100px;margin:0 auto;padding:0 18px}

/* Header */
.site-header{
  width:100%;
  display:flex;
  justify-content:center;
  position:sticky;
  top:0;
  background:rgba(11,11,16,.9);
  backdrop-filter:blur(10px);
  z-index:25;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.brand-row{display:flex;align-items:center;gap:10px}
.brand-logo{width:90px;height:90px;object-fit:contain;}
.brand .logo{font-weight:800;font-size:22px;color:#fff;letter-spacing:.4px}
.brand .logo span{color:#8a4dff;text-shadow:var(--neon)}
.brand .tag{font-size:12px;color:#9aa0aa;margin-top:2px}
.nav a{color:#d7d9e0;text-decoration:none;margin-left:14px;font-weight:700;opacity:.9}
.nav .btn{margin-left:14px}

/* HERO centrado */
.hero{padding:56px 0 54px}
.hero-inner-centered{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.hero h1{color:#fff;font-size:56px;line-height:1.08;margin:4px 0 6px;text-shadow:0 0 10px rgba(155,77,255,.25);max-width:18ch}
.hero h1 span{color:#7b3dff}
.hero p{margin:0 0 18px;color:#cfd3db;font-size:18px;max-width:60ch}

.btn{display:inline-block;border-radius:14px;padding:12px 16px;font-weight:800;text-decoration:none;border:1px solid rgba(255,255,255,.18);transition:.2s ease;cursor:pointer;color:#fff}
.btn.xl{padding:16px 22px;border-radius:18px;font-size:18px}
.btn-solid{background:linear-gradient(90deg,#6a00ff,#9b4dff);color:#fff;border-color:transparent;box-shadow:var(--neon)}
.btn-ghost{background:rgba(255,255,255,.02);color:#fff}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.28)}
.btn:hover{transform:translateY(-1px)}
.cta-row.center{display:flex;gap:12px;justify-content:center}

/* Sections */
.section{padding:54px 0; scroll-margin-top: var(--anchor-offset);}
.section-alt{background:rgba(255,255,255,.02);border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.section-title{color:#fff;font-size:26px;letter-spacing:.4px;margin:0 0 22px}
.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px}
.card h3{margin:0 0 10px;color:#fff}
.card ul{margin:0 0 16px 18px}
.card li{margin:6px 0}
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid rgba(255,255,255,.08);padding:12px;text-align:left}
.table th{color:#e8e8ef}
.note{font-size:12px;color:#9aa0aa;margin-top:10px}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.gallery-item{display:block;text-align:center;padding:10px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);color:#fff;text-decoration:none;font-weight:600}

/* Opiniones */
.opiniones{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}
.review{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:14px}
.review p{margin:0 0 8px;color:#e6e6f0}
.review span{font-size:12px;color:#a8aebc}

/* Contacto & Footer */
.section-contact{background:linear-gradient(180deg, rgba(155,77,255,.08), rgba(106,0,255,.08))}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-form{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px}
.contact-form label{display:block;font-weight:600;margin-bottom:8px;color:#e5e6eb}
.contact-form input,.contact-form textarea{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:rgba(15,15,24,.8);color:#fff;margin-top:6px}
.contact-form button{margin-top:10px}
.site-footer{padding:26px 0;border-top:1px solid rgba(255,255,255,.06);color:#a9afbb}
.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;align-items:center}
.logo.small{font-size:18px;font-weight:800;color:#fff}
.logo.small span{color:#6a00ff;text-shadow:var(--neon)}
.footer-links a{color:#cfd3db;margin-right:12px;text-decoration:none}

/* WhatsApp float */
.whatsapp-float{position:fixed;right:18px;bottom:18px;display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:transparent;border:none;z-index:40;box-shadow:none}
.whatsapp-float img{width:100%;height:100%;display:block}

/* Responsive */
@media (max-width: 920px){
  :root{--anchor-offset:84px}
  .hero h1{font-size:38px;max-width:18ch}
  .card-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .opiniones{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .nav{display:none}
}

.gallery-item img{width:100%;height:auto;object-fit:contain;display:block;border-radius:10px;margin-bottom:8px}
.gallery-item span{display:block;font-size:14px;margin-top:2px}

.header-inner{width:100%;display:flex;justify-content:space-between;align-items:center;}

.reviews-cta{margin-top:12px}

.reviews-summary{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.reviews-summary .stars{display:flex;gap:4px;color:#f5d24b}
.reviews-summary .count{font-weight:700;color:#eaeaf2}
.review-card{padding:14px}
.review-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.review .avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.15)}
.review .avatar.placeholder{display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06)}
.review .meta{display:flex;flex-direction:column}
.stars-row{display:flex;align-items:center;gap:6px;color:#f5d24b;font-size:14px}
.stars-row .when{color:#9aa0aa;font-size:12px;margin-left:6px}
.review-text{color:#e6e6f0;margin:0}

/* v1a: to-top button above WhatsApp */
.to-top{
  position:fixed;
  right:18px;
  bottom:92px; /* sits above WhatsApp button */
  width:48px;height:48px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background: radial-gradient(120% 120% at 30% 30%, #8a2cff 0%, #5a00ff 60%, rgba(90,0,255,0.2) 100%);
  color:#fff;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 0 18px rgba(138,44,255,.35);
  cursor:pointer;
  z-index:45;
  transition: transform .15s ease, opacity .15s ease;
  opacity:.95;
}
.to-top:hover{ transform: translateY(-2px) scale(1.02); opacity:1; }

/* v1c: FAB (3 dots) with expandable menu */
.fab-wrap{position:fixed;right:18px;bottom:18px;z-index:50;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.fab-toggle{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background: radial-gradient(120% 120% at 30% 30%, #8a2cff 0%, #5a00ff 60%, rgba(90,0,255,0.2) 100%);
  color:#fff;border:1px solid rgba(255,255,255,.18);box-shadow:0 0 18px rgba(138,44,255,.35);cursor:pointer}
.fab-toggle:hover{transform:translateY(-1px);}
.fab-menu{display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.fab-item{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background: rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);color:#fff;text-decoration:none;backdrop-filter: blur(8px);}
.fab-wa{background:linear-gradient(120deg,#00b37a,#00e676);color:#0b0b10}
.fab-ig{background:linear-gradient(120deg,#fc466b,#3f5efb)}
/* simple appear animation */
.fab-item{opacity:0;transform:translateY(6px);transition:.18s ease}
.fab-menu.show .fab-item{opacity:1;transform:none}


/* v1d: Fixes
   - Unify diameters to 48px
   - To-top button stays below, FAB above it (no overlap)
   - FAB menu opens upwards
*/
.to-top{
  right:18px;
  bottom:18px;        /* arrow lowest */
  width:48px;height:48px;
}

.fab-wrap{
  position:fixed;
  right:18px;
  bottom:76px;        /* 48 (arrow) + 10 gap + 18 safe space */
  z-index:50;
  display:flex;
  flex-direction:column-reverse; /* toggle at bottom, menu opens upwards */
  align-items:flex-end;
  gap:10px;
}
.fab-toggle{
  width:48px;height:48px; /* same as arrow */
  border-radius:50%;
}
.fab-menu{display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.fab-item{width:48px;height:48px;border-radius:50%;}

/* v1e: Neon line icons for WhatsApp & Instagram */
.fab-item{
  width:48px;height:48px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:transparent;
  border:2px solid currentColor;
  transition:all .25s ease;
}
.fab-wa{
  color:#39ff14; /* green neon */
  box-shadow:0 0 6px #39ff14,0 0 12px #39ff14 inset;
}
.fab-wa:hover{ box-shadow:0 0 10px #39ff14,0 0 20px #39ff14; }
.fab-ig{
  color:#b14dff; /* violet neon */
  box-shadow:0 0 6px #b14dff,0 0 12px #b14dff inset;
}
.fab-ig:hover{ box-shadow:0 0 10px #b14dff,0 0 20px #b14dff; }


/* === HERO Animated Violet Background v1 === */
.hero{ position:relative; overflow:hidden; }
.hero::before{
  content:"";
  position:absolute; inset:-20% -20%;
  background:
    radial-gradient(60% 60% at 20% 30%, rgba(155,77,255,.25) 0%, rgba(155,77,255,0) 60%),
    radial-gradient(60% 60% at 80% 70%, rgba(106,0,255,.24) 0%, rgba(106,0,255,0) 65%),
    conic-gradient(from 0deg at 50% 50%, rgba(155,77,255,.12), rgba(90,0,255,.08), rgba(155,77,255,.12));
  filter: blur(26px);
  transform: translate3d(0,0,0) rotate(0deg) scale(1.05);
  animation: nebula 38s linear infinite;
  z-index:0; pointer-events:none;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(80% 60% at 50% 110%, rgba(0,0,0,.55), transparent 60%);
  z-index:0; pointer-events:none;
}
.hero > *{ position:relative; z-index:1; }
@keyframes nebula {
  0%   { transform: translate3d(-2%, -1%, 0) rotate(0deg) scale(1.05); }
  50%  { transform: translate3d(2%,  1%, 0) rotate(180deg) scale(1.07); }
  100% { transform: translate3d(-2%,  0%, 0) rotate(360deg) scale(1.05); }
}
@media (prefers-reduced-motion: reduce){
  .hero::before{ animation: none; }
}

/* === HERO Animated Violet Background v2 (Power Neon) === */
.hero::before{
  background:
    radial-gradient(50% 50% at 25% 30%, rgba(187,77,255,.45) 0%, rgba(155,77,255,0) 70%),
    radial-gradient(60% 60% at 75% 70%, rgba(106,0,255,.42) 0%, rgba(106,0,255,0) 70%),
    conic-gradient(from 0deg at 50% 50%, rgba(200,120,255,.22), rgba(90,0,255,.18), rgba(200,120,255,.22));
  filter: blur(20px) brightness(1.3);
  animation: nebulaPower 20s linear infinite;
}
@keyframes nebulaPower {
  0%   { transform: translate3d(-3%, -2%,0) rotate(0deg)   scale(1.08); }
  50%  { transform: translate3d( 3%,  2%,0) rotate(180deg) scale(1.12); }
  100% { transform: translate3d(-3%, -2%,0) rotate(360deg) scale(1.08); }
}

/* v10: center card buttons uniformly */
.card{ display:flex; flex-direction:column; justify-content:space-between; }
.card .btn-card{ align-self:center; margin-top:auto; }


/* v11: dual actions in cards */
.card-actions{ display:flex; gap:10px; justify-content:center; align-items:center; margin-top:auto; }
.card-actions .btn-card{ margin-top:0; }
@media (max-width:920px){
  .card-actions{ flex-direction:column; }
  .card-actions .btn-card{ width:100%; text-align:center; }
}


/* v12: detail grid */
.service-detail-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
.service-media img{width:100%;height:auto;border-radius:16px;border:1px solid rgba(255,255,255,.08);box-shadow:0 0 18px rgba(138,44,255,.25)}
@media(max-width:920px){.service-detail-grid{grid-template-columns:1fr}}


/* v13: Breadcrumbs */
.breadcrumbs{margin:8px 0;font-size:14px;color:#ccc}
.breadcrumbs a{color:#9b4dff;text-decoration:none}
.breadcrumbs span{color:#fff}

/* v13: Slider */
.slider{position:relative;overflow:hidden;border-radius:16px}
.slides{display:flex;transition:transform .5s ease}
.slide{min-width:100%}
.slide img { width: 100%; height: auto; object-fit: cover; border-radius: 12px; }
.slider button{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.4);color:#fff;border:none;padding:8px;cursor:pointer;border-radius:50%}
.slider .prev{left:10px}
.slider .next{right:10px}

/* v16.7 to-top priority */
.to-top{ z-index: 10001; pointer-events:auto }
#fabWrap{ z-index: 10000 } /* keep 3-dots below the arrow */

/* v16.8 modal z-index */
.modal{ z-index: 10020 !important; }

/* v16.9 modal essentials */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:10020}
.modal.show{display:flex}
.modal .backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(2px)}
.promo-card{position:relative;z-index:1;width:min(92vw,560px);aspect-ratio:4/5;border-radius:18px;overflow:hidden;color:#fff;box-shadow:0 0 26px rgba(138,44,255,.45);border:1px solid rgba(255,255,255,.14);background:#0b0b10}
.promo-art{position:absolute;inset:0;background:radial-gradient(60% 40% at 20% 20%, rgba(187,77,255,.35), rgba(187,77,255,0) 60%),radial-gradient(60% 50% at 80% 70%, rgba(80,0,255,.35), rgba(80,0,255,0) 60%),linear-gradient(180deg, rgba(30,20,45,.8), rgba(20,15,30,.8)),#0b0b10}
.promo-panel{position:absolute;top:8%;left:8%;transform:rotate(-6deg);padding:14px 18px;border-radius:18px;background:radial-gradient(100% 100% at 0% 0%, rgba(255,255,255,.08), rgba(255,255,255,0) 30%),repeating-linear-gradient(60deg, rgba(255,255,255,.05) 0 6px, rgba(255,255,255,.02) 6px 12px),#121220;border:2px solid #a45cff;box-shadow:0 0 22px rgba(164,92,255,.6), inset 0 0 12px rgba(164,92,255,.3)}
.promo-panel .title-top{margin:0;font-weight:900;letter-spacing:.5px;text-transform:uppercase;font-size: clamp(16px, 3.4vw, 28px)}
.promo-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;padding:16px}
.promo-center .line1,.promo-center .line2{font-weight:900;text-transform:uppercase;font-size: clamp(32px, 7.2vw, 60px);text-shadow:0 0 18px rgba(164,92,255,.35)}
.promo-center .plus{font-weight:900;font-size: clamp(20px, 5vw, 40px)}
.price-sticker{position:absolute;left:8%;bottom:16%;transform:rotate(-6deg);padding:8px 14px;border-radius:12px;background:linear-gradient(120deg, rgba(255,255,255,.12), rgba(255,255,255,.02));border:2px solid rgba(255,255,255,.18);box-shadow:0 0 12px rgba(255,255,255,.15), inset 0 0 10px rgba(155,77,255,.25);font-weight:900;letter-spacing:.5px;font-size: clamp(22px, 6vw, 42px)}
.logo-badge{position:absolute; right:6%; top:6%; width:min(20%, 120px); aspect-ratio:1/1; display:grid; place-items:center; background:transparent; border:none; box-shadow:none}
.logo-badge img{ width:100%; height:100%; object-fit:contain; filter:none }
.promo-disclaimer{position:absolute;left:0;right:0;bottom:6%;text-align:center;font-size: clamp(10px, 2.8vw, 14px); color:#e6dff9;text-shadow: 0 0 8px rgba(164,92,255,.25)}
.modal .close{position:absolute; right:10px; top:10px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;cursor:pointer;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.close-bottom2{margin-top:12px;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background: radial-gradient(120% 120% at 30% 30%, #8a2cff 0%, #5a00ff 60%);color:#fff;border:1px solid rgba(255,255,255,.18);box-shadow:0 0 18px rgba(138,44,255,.35);cursor:pointer}

/* BE1.1 compact popup */
.promo-card {
  width: min(85vw, 480px);
  aspect-ratio: 4 / 5;
}
.promo-center {
  gap: 4px;
}
.price-sticker {
  bottom: 12%;
  font-size: clamp(20px, 5.5vw, 36px);
}

/* BE1.2 tighter lines + cross price */
.promo-center{ gap:2px !important; }
.promo-center .line1{ margin-bottom: -6px !important; }
.promo-center .plus{ margin: -15px 0 !important; }
.promo-center .line2{ margin-top: 5px !important; }

/* price over 'FOTOCABINA' */
.price-sticker{
  left: 30% !important;
  bottom: 20% !important;
  transform: translateX(-50%) rotate(-6deg) !important;
  z-index: 2 !important;
  padding: 10px 18px !important;
}


/* === Reviews (Photolife style) === */
.card-soft{background:rgba(124,58,237,0.08); border:1px solid rgba(124,58,237,.18); border-radius:16px; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:6px;}
.reviews-header .reviews-badge{display:flex; align-items:center; gap:10px; font-weight:600}
.reviews-header .glogo{display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:999px; background:conic-gradient(#4285F4 0 25%, #34A853 0 50%, #FBBC05 0 75%, #EA4335 0); color:#fff; font-weight:800}
.reviews-header .stars{letter-spacing:2px; filter:drop-shadow(0 0 6px rgba(255,255,255,.2))}
.reviews-header .score{opacity:.9}
.reviews-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:16px}
@media (max-width: 1000px){ .reviews-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width: 640px){ .reviews-grid{grid-template-columns:1fr;} }
.review-card{background:#13131b; border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:14px; box-shadow:0 4px 18px rgba(0,0,0,.35);}
.review-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:8px}
.review-id{display:flex; align-items:center; gap:10px}
.review-avatar{width:40px; height:40px; border-radius:999px; background:linear-gradient(135deg,#7c3aed 0%, #6d28d9 100%); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800}
.review-name{font-weight:800; letter-spacing:.3px}
.review-time{font-size:12px; opacity:.7}
.review-stars{font-size:16px; letter-spacing:2px; margin:2px 0 6px; color:#ffd166; text-shadow:0 0 8px rgba(255,209,102,.35)}
.review-text{font-size:14px; line-height:1.5; opacity:.95}
.review-g{font-weight:900; color:#fff; background:linear-gradient(135deg,#34A853,#4285F4); -webkit-background-clip:text; background-clip:text; color:transparent}

/* === Neon styles for floating FAB menu items === */
:root{
  --violet-neon:#9d4bff;
  --green-neon:#00ff88;
}

.fab .menu-item{ 
  border-radius:14px; 
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.02);
  transition:.15s ease-out;
  color:#cfd2ff;
}
.fab .menu-item svg{ stroke: currentColor; }

/* Instagram (violet neon) */
.fab .menu-item--ig{
  border-color: rgba(157,75,255,.55);
  color: var(--violet-neon);
  box-shadow: 0 0 0 0 rgba(157,75,255,.0);
}
.fab .menu-item--ig:hover{
  box-shadow: 0 0 18px 2px rgba(157,75,255,.35);
  transform: translateY(-1px);
}

/* WhatsApp (green neon) */
.fab .menu-item--wa{
  border-color: rgba(0,255,136,.6);
  color: var(--green-neon);
  box-shadow: 0 0 0 0 rgba(0,255,136,.0);
}
.fab .menu-item--wa:hover{
  box-shadow: 0 0 18px 2px rgba(0,255,136,.35);
  transform: translateY(-1px);
}


/* === FAB pill style with neon outline === */
.fab-item.pill{
  border-radius:16px;
  padding:10px 14px;
  width:auto; height:auto; min-height:48px;
  display:flex; align-items:center; gap:10px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.12);
  color:#cfd2ff;
  text-decoration:none;
  backdrop-filter: blur(8px);
}
.fab-item.pill .fab-label{font-weight:700; letter-spacing:.2px}

/* IG violet outline */
.fab-item.pill.fab-ig{
  color:#9d4bff;
  border-color: rgba(157,75,255,.55);
  box-shadow: 0 0 0 0 rgba(157,75,255,.0);
}
.fab-item.pill.fab-ig:hover{ box-shadow:0 0 18px 2px rgba(157,75,255,.35); transform:translateY(-1px); }

/* WA green outline */
.fab-item.pill.fab-wa{
  color:#00ff88;
  border-color: rgba(0,255,136,.6);
  box-shadow: 0 0 0 0 rgba(0,255,136,.0);
}
.fab-item.pill.fab-wa:hover{ box-shadow:0 0 18px 2px rgba(0,255,136,.35); transform:translateY(-1px); }


/* === Neon ring effect for 3-dots toggle and to-top arrow === */
.fab-toggle,
.to-top{
  position:relative;
  background:#1a1430; /* keep dark core */
  border:1px solid transparent;
  background: linear-gradient(#0000,#0000) padding-box,
              radial-gradient(120% 120% at 50% 50%, rgba(157,75,255,.9), rgba(157,75,255,.25)) border-box;
  /* subtle glow */
  box-shadow: 0 0 22px rgba(157,75,255,.25), inset 0 0 6px rgba(157,75,255,.15);
  color:#b98cff;
}
.fab-toggle:hover,
.to-top:hover{
  box-shadow: 0 0 28px rgba(157,75,255,.35), inset 0 0 8px rgba(157,75,255,.22);
  transform: translateY(-1px);
}
.fab-toggle svg, .to-top svg{ stroke: currentColor; fill: none; }
.fab-toggle .dot, .fab-toggle .dots, .to-top .chev{ color: currentColor; }

/* keep sizes as defined elsewhere: only visual effect changed */


/* === Exact ring style (thin line) for 3-dots & arrow === */
.fab-toggle, .to-top{
  background:#1a1430;
  border:1px solid rgba(138,44,255,.7);   /* thin purple ring */
  box-shadow: 0 0 14px rgba(138,44,255,.25);
  color:#b68aff;
}
.fab-toggle svg circle, .fab-toggle svg path,
.to-top svg path{ fill: currentColor; stroke: none; }  /* solid dots/arrow */


/* === Layering & positions: arrow below the FAB === */
.to-top{
  position:fixed;
  right:18px;
  bottom:18px;            /* arrow sits at bottom */
  width:48px;height:48px;
  display:grid;place-items:center;
  border-radius:50%;
  z-index:40;
}
.fab-wrap{
  position:fixed;
  right:18px;
  bottom:76px;            /* 48 + gap -> FAB above arrow */
  z-index:50;
}
.to-top[hidden]{display:none !important;}


/* === Exact thin-ring neon style === */
.fab-toggle, .to-top{
  background:#1a1430;
  border:1px solid rgba(138,44,255,.7);
  box-shadow:0 0 14px rgba(138,44,255,.25);
  color:#b68aff;
}
.fab-toggle svg circle, .fab-toggle svg path,
.to-top svg path{ fill: currentColor; stroke: none; }


/* === Neon pill style for specific buttons (scoped) === */

/* 1) PEDIR => botones de la tabla de precios (index.html) */
.btn.btn-table{
  background:#0f0d1a;
  color:#9d4bff;
  border:1px solid rgba(157,75,255,.7);
  box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 24px rgba(157,75,255,.20);
  font-weight:800;
  border-radius:18px;
}
.btn.btn-table:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 30px rgba(157,75,255,.30);
}

/* 2) VER SERVICIOS (solo el de arriba en el héroe de index) */
body#top .hero .btn.btn-ghost.xl{
  background:#0f0d1a;
  color:#9d4bff;
  border:1px solid rgba(157,75,255,.7);
  box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 24px rgba(157,75,255,.20);
  font-weight:800;
  border-radius:18px;
}
body#top .hero .btn.btn-ghost.xl:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 30px rgba(157,75,255,.30);
}

/* 3) ESCRIBÍ/ESCRIBIR UNA RESEÑA (opiniones) */
#btn-write-review{
  background:#0f0d1a !important;
  color:#9d4bff !important;
  border:1px solid rgba(157,75,255,.7) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 24px rgba(157,75,255,.20) !important;
  font-weight:800 !important;
  border-radius:18px !important;
}
#btn-write-review:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 30px rgba(157,75,255,.30) !important;
}


/* Override for hero "Ver servicios" (ghost) -> neon pill */
.hero .cta-row .btn.btn-ghost.xl,
.hero-centered .cta-row .btn.btn-ghost.xl{
  background:#0f0d1a !important;
  color:#9d4bff !important;
  border:1px solid rgba(157,75,255,.7) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 24px rgba(157,75,255,.20) !important;
  font-weight:800 !important;
  border-radius:18px !important;
}
.hero .cta-row .btn.btn-ghost.xl:hover,
.hero-centered .cta-row .btn.btn-ghost.xl:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 30px rgba(157,75,255,.30) !important;
}


/* === Translucent (glass) variant for selected neon buttons === */
/* PEDIR (tabla/precios) */
.btn.btn-table{
  background: rgba(255,255,255,.04) !important;     /* translúcido */
  backdrop-filter: blur(8px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(120%) !important;
  color:#9d4bff !important;
  border:1px solid rgba(157,75,255,.75) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 24px rgba(157,75,255,.25) !important;
  border-radius:18px !important;
}
.btn.btn-table:hover{
  transform: translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 30px rgba(157,75,255,.35) !important;
}

/* VER SERVICIOS (solo el del héroe) */
.hero .cta-row .btn.btn-ghost.xl,
.hero-centered .cta-row .btn.btn-ghost.xl{
  background: rgba(255,255,255,.04) !important;
  backdrop-filter: blur(8px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(120%) !important;
  color:#9d4bff !important;
  border:1px solid rgba(157,75,255,.75) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 24px rgba(157,75,255,.25) !important;
  border-radius:18px !important;
}
.hero .cta-row .btn.btn-ghost.xl:hover,
.hero-centered .cta-row .btn.btn-ghost.xl:hover{
  transform: translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 30px rgba(157,75,255,.35) !important;
}

/* ESCRIBÍ / ESCRIBIR UNA RESEÑA */
#btn-write-review{
  background: rgba(255,255,255,.04) !important;
  backdrop-filter: blur(8px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(120%) !important;
  color:#9d4bff !important;
  border:1px solid rgba(157,75,255,.75) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 24px rgba(157,75,255,.25) !important;
  border-radius:18px !important;
}
#btn-write-review:hover{
  transform: translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 30px rgba(157,75,255,.35) !important;
}

/* badge: Próximamente */
.soon{display:inline-block;padding:6px 10px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  color:#e5e6eb;font-weight:800;font-size:13px;letter-spacing:.2px}

/* Custom: golden stars for reviews */
.reviews-badge .stars,
.stars-row span {
  color: #FFD700 !important;
}


/* === Reseñas manuales estilo Google === */
.g-reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:16px 0}
@media(max-width:920px){.g-reviews{grid-template-columns:1fr}}
.g-card{background:#1a1824;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px}
.g-head{display:flex;align-items:center;gap:12px}
.g-avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#3a3a4d;color:#fff;font-weight:800}
.g-meta{display:flex;flex-direction:column}
.g-name{font-weight:800;color:#fff}
.g-sub{font-size:.92rem;color:#cfd3db;display:flex;align-items:center;gap:8px}
.g-stars{color:#f5d24b;letter-spacing:2px}
.g-new{background:#3a3a4d;color:#fff;font-size:.72rem;padding:2px 6px;border-radius:6px}
.g-dot{opacity:.6}
.g-logo{margin-left:auto;font-weight:900;color:#4285F4;filter:drop-shadow(0 0 6px rgba(66,133,244,.35))}
.g-text{color:#e6e6f0;margin:12px 0 0 0;white-space:pre-wrap}


/* === Ajuste reseñas manuales integradas v2 === */
.g-reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:18px 0}
.g-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:14px;font-size:.95rem}
.g-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.g-avatar{width:32px;height:32px;font-size:14px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#3a3a4d;color:#fff;font-weight:800}
.g-meta{display:flex;flex-direction:column}
.g-name{font-weight:700;color:#fff;font-size:.95rem}
.g-sub{font-size:.8rem;color:#cfd3db;display:flex;align-items:center;gap:6px}
.g-stars{color:#f5d24b;letter-spacing:1px}
.g-new{background:#3a3a4d;color:#fff;font-size:.72rem;padding:2px 6px;border-radius:6px}
.g-dot{opacity:.6}
.g-logo{margin-left:auto;font-weight:900;color:#4285F4;filter:drop-shadow(0 0 6px rgba(66,133,244,.35))}
.g-text{color:#e6e6f0;margin-top:6px;font-size:.9rem;line-height:1.4}


/* === Ajustes G y Avatares === */
.g-logo{width:20px;height:20px;object-fit:contain}
.g-avatar{overflow:hidden}
.g-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}


/* === Avatares con imagen (fallback a inicial) === */
.g-card.with-img .g-avatar{
  background: var(--avatar, #3a3a4d) center/cover no-repeat;
  color: transparent; /* oculta la inicial si hay imagen */
  border: 1px solid rgba(255,255,255,.12);
}

/* Tamaño de logo Google como imagen */
.g-logo{ width:22px; height:22px; display:block; }
.g-head .g-logo{ margin-left:auto; filter: drop-shadow(0 0 6px rgba(0,0,0,.25)); }
.g-card .g-logo{ flex:0 0 auto; }


/* === Avatares con IMG === */
.g-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}


/* === Fix avatars: force no background when using IMG === */
.g-avatar{ width:32px; height:32px; background:none !important; }
.g-avatar img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }


/* Close button for modal - bottom center */
.modal-close {
  background: transparent;
  border: none;
  font-size: 22px;
  font-weight: bold;
  color: #fff;
  cursor: pointer;
  display: block;
  margin: 10px auto 0 auto; /* center horizontally */
}


/* Close "X" for promo modal – bottom center */
.promo-card .close {
  position: absolute;
  bottom: -45px;  /* move outside below the card */
  left: 50%;
  transform: translateX(-50%);
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10030;
}
.promo-card .close:hover { background: rgba(255,255,255,.18); }
.promo-card .close svg { pointer-events: none; }

/* Botón de cierre abajo centrado */
.promo-card > .close {
  position: absolute !important;
  bottom: -45px !important;   /* debajo del cartel */
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  transform: translateX(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10030;
}

.promo-card > .close:hover {
  background: rgba(255,255,255,.18);
}


/* Permitir que el botón de cierre se vea fuera del cartel */
.modal .promo-card { overflow: visible !important; }


.badge.soon{padding:.25rem .5rem;border-radius:999px;background:#242037;color:#b39dff;font-weight:600;font-size:.85rem;border:1px solid rgba(179,157,255,.35)}

.price-item.card.soon{border:1px dashed rgba(179,157,255,.45);opacity:.95}







.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  


.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 640px) {
  


.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (min-width: 900px) {
  



.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  


.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 640px) {
  


.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 1024px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}
@media (max-width: 700px) {
  
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 350px);
  gap: 20px;
  justify-content: center;
  align-items: start;
}
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 350px); justify-content: center; }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
}
.card.service {
  width: 350px;
  min-height: 330px;
  padding: 18px;
  display:flex;
  flex-direction:column;
}
.card.service .cta-row {
  margin-top: auto;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
}
/* Align Servicios heading with grid start */
#servicios h2, .services-section h2 {
  margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
}


/* ===== Responsive polish (phones/tablets/desktop) ===== */

/* Containers: center and give safe side padding */
.container { max-width: 1100px; margin: 0 auto; padding: 0 16px; }

/* Images scale down correctly */
img { max-width: 100%; height: auto; }

/* Service detail pages: 2-col to 1-col on smaller screens */
.service-detail-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; }
@media (max-width: 900px) {
  .service-detail-grid { grid-template-columns: 1fr; }
  .service-media { order: -1; margin-bottom: 12px; }
}

/* Services cards: keep desktop 3x2 fixed, but on mobile use full width */
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; justify-content: center; }
  .card.service { width: 100%; max-width: 360px; min-height: 300px; }
}

/* Titles scale smoothly */
.hero h1 { font-size: clamp(28px, 6vw, 44px); }
.section-title { font-size: clamp(22px, 4.5vw, 32px); }

/* Buttons slightly tighter on phones */
@media (max-width: 480px) {
  .btn { padding: 10px 14px; font-size: 0.95rem; }
  .cta-row { gap: 10px; flex-wrap: wrap; }
}

/* Header nav wraps on small screens */
@media (max-width: 900px) {
  .nav { display:flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
  .nav a { margin: 0; }
}

/* Promo modal scales to viewport */
.modal .promo-card { max-width: min(520px, 90vw); }

/* Prices table: allow horizontal scroll instead of breaking layout */
#precios table { width: 100%; border-collapse: collapse; }
#precios .table-responsive { overflow-x: auto; }
@media (max-width: 700px) {
  #precios table { min-width: 640px; } /* keep columns readable, scroll container will handle overflow */
}

/* Align the "Servicios" heading with grid (keeps alignment when viewport changes) */
#servicios .section-title {
  width: fit-content;
  margin-left: 0;
}
@media (min-width: 1100px) {
  #servicios .section-title {
    margin-left: calc((100% - (3 * 350px) - (2 * 20px)) / 2);
  }
}
@media (min-width: 700px) and (max-width: 1099px) {
  #servicios .section-title {
    margin-left: calc((100% - (2 * 350px) - (1 * 20px)) / 2);
  }
}
a:link {
  color: #ff4de6; /* rosa neón */
  text-decoration: none; /* elimina subrayado */
}

a:visited {
  color: #ff4de6; /* mantiene el mismo color si ya fue visitado */
}

a:hover {
  color: #c715ff; /* violeta neón al pasar el mouse */
}

a:active {
  color: #ff0099; /* rosa fuerte al hacer clic */
}



/* === Sistema de Links Photolife (robusto) === */
/* Variables */
:root{
  --link: #b39dff;
  --link-hover: #d3b3ff;
  --link-underline: rgba(157,75,255,.5);
}

/* Normalizamos TODOS los estados de links (sin afectar botones ni items especiales) */
a:any-link:not([class*="btn"]):not(.gallery-item):not(.fab-item):not(.fab-toggle):not(.fab-ig):not(.fab-wa):not(.nav a) {
  color: var(--link) !important;
  text-decoration: none !important;
  font-weight: 600;
  transition: color .2s ease, text-shadow .2s ease, border-color .2s ease;
}

/* Hover/Focus */
a:hover:not([class*="btn"]):not(.gallery-item):not(.fab-item):not(.fab-toggle):not(.fab-ig):not(.fab-wa):not(.nav a),
a:focus-visible:not([class*="btn"]):not(.gallery-item):not(.fab-item):not(.fab-toggle):not(.fab-ig):not(.fab-wa):not(.nav a){
  color: var(--link-hover) !important;
  text-shadow: 0 0 8px rgba(179,157,255,.6);
  outline: none;
}

/* Dentro de texto (p, li, .note, .table, .card, .section) agrega subrayado dashed fotolife */
p a:any-link:not([class*="btn"]), 
li a:any-link:not([class*="btn"]),
.note a:any-link:not([class*="btn"]),
.table a:any-link:not([class*="btn"]),
.card a:any-link:not([class*="btn"]),
.section a:any-link:not([class*="btn"]) {
  border-bottom: 1px dashed var(--link-underline);
}

p a:hover, li a:hover, .note a:hover, .table a:hover, .card a:hover, .section a:hover {
  border-bottom-color: rgba(255,255,255,.7);
}

/* Footer y navegación ya tienen reglas propias, las respetamos */
footer a, .footer-links a, .nav a { text-decoration: none; }

/* Estados activos/visited para evitar azul/morado por defecto del navegador */
a:link:not([class*="btn"]):not(.gallery-item):not(.fab-item):not(.fab-toggle):not(.fab-ig):not(.fab-wa):not(.nav a){ 
  color: var(--link) !important;
}
a:visited:not([class*="btn"]):not(.gallery-item):not(.fab-item):not(.fab-toggle):not(.fab-ig):not(.fab-wa):not(.nav a){ 
  color: var(--link) !important;
}
a:active:not([class*="btn"]):not(.gallery-item):not(.fab-item):not(.fab-toggle):not(.fab-ig):not(.fab-wa):not(.nav a){ 
  color: var(--link-hover) !important;
}


/* Enlaces de la sección Contacto */
.contacto a {
  color: #ff4fa3 !important;   /* rosa */
  text-decoration: none;
  transition: color 0.3s ease, text-shadow 0.3s ease;
}
.contacto a:hover {
  color: #fff !important;      /* blanco al pasar el mouse */
  text-shadow: 0 0 8px #ff4fa3, 0 0 16px #ff4fa3;
}


/* --- Mobile spacing so FAB doesn't tap over content --- */
@media (max-width:640px){
  #opiniones.section{ padding-bottom: 96px; }
  .fab-wrap{ right:14px; bottom:14px; }
}


/* --- Mobile heading clamp for oversized titles --- */
@media (max-width:640px){
  .section-title{
    font-size: clamp(22px, 6vw, 32px);
    line-height:1.2;
    margin-bottom:14px;
  }
}