.elementor-9 .elementor-element.elementor-element-ee3835a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-1459c04{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-8714987{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-9759bb9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-daef388{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-aa8651c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-b48aefe{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-3d1d712{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-4173a30{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-6ed1eb7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-4c07be9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-c561b0c *//* ============================================================
   OCTÁGONO · DISEÑO + CONSTRUCCIÓN
   Estilos generales + Botón flotante de WhatsApp animado
   ============================================================ */

/* ===== Tokens de marca ===== */
:root{
  --brand:#0b1f2a;     /* azul petróleo */
  --brand2:#1c3c4e;    /* azul oscuro */
  --acc:#d4a373;       /* acento arena */
  --bg:#f6f7f8;
  --txt:#0d0f12;
  --muted:#6b7280;
  --radius:16px;
  --shadow:0 10px 25px rgba(0,0,0,.08);
}

/* ===== Base ===== */
body{
  color:var(--txt);
  font-family:system-ui,-apple-system,Roboto,Inter,Arial,sans-serif;
}

/* ===== Secciones, tarjetas y utilidades ===== */
.o-section{padding:68px 0}
.o-muted{color:var(--muted)}
.o-pill{display:inline-block;background:#fff2;border:1px solid #ffffff40;color:#fff;padding:6px 12px;border-radius:999px;font-size:12px}
.o-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}

/* ===== Botones ===== */
.o-btn{
  display:inline-block;
  background:var(--acc);
  color:#111;
  padding:12px 18px;
  border-radius:999px;
  text-decoration:none;
  font-weight:600;
  box-shadow:var(--shadow);
  transition:filter .2s ease;
}
.o-btn:hover{filter:brightness(.95)}
.o-btn.outline{background:transparent;border:2px solid var(--acc);color:var(--acc)}

/* ===== Grillas ===== */
.o-grid{display:grid;gap:20px}
.o-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.o-grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}

/* ===== HERO ===== */
.o-hero{
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  color:#fff;
  padding:84px 0 64px;
}
.o-hero h1{font-size:46px;line-height:1.04;margin:0 0 12px}
.o-hero p{font-size:18px;margin:0 0 22px;opacity:.95}
.o-hero .cta-row{display:flex;gap:12px;flex-wrap:wrap}

/* ===== Servicios ===== */
.o-svc h3{margin:8px 0 6px}
.o-svc ul{margin:10px 0 0;padding-left:18px}
.o-svc li{margin:6px 0}

/* ===== Portafolio ===== */
.o-pf figure{margin:0}
.o-pf figcaption{margin-top:8px;font-size:14px;color:var(--muted)}

/* ===== Proceso ===== */
.o-steps{counter-reset:step}
.o-step{
  display:flex;gap:14px;align-items:flex-start;
  padding:16px;border:1px solid #eee;border-radius:14px;background:#fff
}
.o-step::before{
  counter-increment:step;content:counter(step);
  display:inline-grid;place-items:center;
  width:34px;height:34px;border-radius:999px;
  background:var(--acc);font-weight:700
}

/* ===== Contacto ===== */
.o-contact{background:var(--bg);border:1px solid #eee;border-radius:18px;padding:26px}

/* ===== Footer ===== */
.o-footer{background:#0c151a;color:#cdd6db;padding:24px 0}

/* ============================================================
   BOTÓN FLOTANTE DE WHATSAPP – con animación de burbuja
   ============================================================ */
.wa-float{
  position:fixed;
  right:16px;
  bottom:20px;
  width:60px;
  height:60px;
  border-radius:50%;
  background:#25D366;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:800;
  text-decoration:none;
  font-size:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
  z-index:2147483647;
  transition:transform .2s ease, box-shadow .2s ease;
  animation:pulseWA 5s ease-in-out infinite;
}
.wa-float:hover{
  transform:scale(1.08);
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}

/* Animación tipo "latido" */
@keyframes pulseWA{
  0%,90%,100%{transform:scale(1)}
  95%{transform:scale(1.12)}
}

/* ===== Versión móvil y tablet ===== */
@media (max-width:1024px){
  .wa-float{
    right:14px;
    width:66px;
    height:66px;
    bottom:calc(env(safe-area-inset-bottom,0px) + 80px);
  }
}

/* Compatibilidad iPhone – evita que quede bajo la barra de gestos */
@supports (bottom:max(0px)){
  @media (max-width:1024px){
    .wa-float{
      bottom:max(80px,env(safe-area-inset-bottom));
    }
  }
}

/* ===== Responsive general ===== */
@media (max-width:960px){
  .o-grid-3,.o-grid-5{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .o-grid-3,.o-grid-5{grid-template-columns:1fr}
  .o-hero h1{font-size:38px}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7814f1b *//* ===== Octágono – Tokens & Utilidades ===== */
:root{
  --brand:#0b1f2a;     /* azul petróleo */
  --brand2:#1c3c4e;    /* azul oscuro */
  --acc:#d4a373;       /* acento arena */
  --bg:#f6f7f8;
  --txt:#0d0f12;
  --muted:#6b7280;
  --radius:16px;
  --shadow:0 10px 25px rgba(0,0,0,.08);
}

/* Tipografía base */
body{color:var(--txt);font-family:system-ui,-apple-system,Roboto,Inter,Arial,sans-serif}

/* Contenedores */
.o-section{padding:68px 0}
.o-muted{color:var(--muted)}
.o-pill{display:inline-block;background:#fff2;border:1px solid #ffffff40;color:#fff;padding:6px 12px;border-radius:999px;font-size:12px}

/* Cards y botones */
.o-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
.o-btn{display:inline-block;background:var(--acc);color:#111;padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:600;box-shadow:var(--shadow);transition:filter .2s ease}
.o-btn:hover{filter:brightness(.95)}
.o-btn.outline{background:transparent;border:2px solid var(--acc);color:var(--acc)}

/* Grid helpers */
.o-grid{display:grid;gap:20px}
.o-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.o-grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}

/* HERO */
.o-hero{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;padding:84px 0 64px}
.o-hero h1{font-size:46px;line-height:1.04;margin:0 0 12px}
.o-hero p{font-size:18px;margin:0 0 22px;opacity:.95}
.o-hero .cta-row{display:flex;gap:12px;flex-wrap:wrap}

/* Servicios */
.o-svc h3{margin:8px 0 6px}
.o-svc ul{margin:10px 0 0;padding-left:18px}
.o-svc li{margin:6px 0}

/* Portafolio */
.o-pf figure{margin:0}
.o-pf figcaption{margin-top:8px;font-size:14px;color:var(--muted)}

/* Proceso numerado */
.o-steps{counter-reset:step}
.o-step{display:flex;gap:14px;align-items:flex-start;padding:16px;border:1px solid #eee;border-radius:14px;background:#fff}
.o-step::before{counter-increment:step;content:counter(step);display:inline-grid;place-items:center;width:34px;height:34px;border-radius:999px;background:var(--acc);font-weight:700}

/* Contacto */
.o-contact{background:var(--bg);border:1px solid #eee;border-radius:18px;padding:26px}

/* Footer */
.o-footer{background:#0c151a;color:#cdd6db;padding:24px 0}

/* === BOTÓN FLOTANTE DE WHATSAPP === */
.wa-float{
  position:fixed;
  right:16px;
  bottom:20px; /* posición escritorio */
  width:60px;
  height:60px;
  border-radius:50%;
  background:#25D366;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:800;
  text-decoration:none;
  font-size:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
  z-index:2147483647;
  transition:transform .2s ease, box-shadow .2s ease;
}
.wa-float:hover{
  transform:scale(1.05);
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}

/* Ajustes móviles y tablets */
@media (max-width:1024px){
  .wa-float{
    right:14px;
    width:66px;
    height:66px;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 80px);
  }
}

/* Compatibilidad con iPhone (safe-area) */
@supports (bottom: max(0px)){
  @media (max-width:1024px){
    .wa-float{
      bottom:max(80px, env(safe-area-inset-bottom));
    }
  }
}

/* Responsive general */
@media (max-width:960px){
  .o-grid-3,.o-grid-5{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .o-grid-3,.o-grid-5{grid-template-columns:1fr}
  .o-hero h1{font-size:38px}
}/* End custom CSS */