/* =========================================================
   HOME – GOLDEN ALLIANCES S.R.L.
   Estilos completos (dark/light, carrusel full, hero, servicios,
   blog, cita, clientes y reseñas) + animaciones AOS intensas
   ========================================================= */

/* ---------- Paleta y controles por tema ---------- */
:root {
   --ga-accent: #f4c542;
   /* dorado */
   --ga-accent-contrast: #111;
   /* texto sobre dorado */

   /* Altura del carrusel/hero (fallback universal) */
   --ga-hero-h: 95vh;
}

@supports (height: 95dvh) {
   :root {
      --ga-hero-h: 95dvh;
   }
}

/* Offset por header fijo (ajustado por JS opcional) */
:root {
   --ga-offset-top: 0px;
}

/* Overlay del HERO (más oscuro) */
:root {
   --ga-hero-overlay: rgba(0, 0, 0, .60);
}

[data-theme="dark"] {
   --ga-bg: #0f1113;
   --ga-fg: #e9ecef;
   --ga-muted: #b0b6bc;
   --ga-card: #1a1d20;
   --ga-border: #2a2f34;
   --ga-btn-bg: #f4c542;
   --ga-btn-fg: #111;
   --ga-btn-outline: #989ba0;
   --ga-btn-success: #25d366;

   /* Controles carrusel */
   --ga-ctrl-bg: rgba(21, 24, 28, .55);
   --ga-ctrl-bg-hover: rgba(21, 24, 28, .8);
   --ga-ctrl-border: rgba(255, 255, 255, .18);
   --ga-ctrl-fg: #fff;
}

:root:not([data-theme="dark"]) {
   --ga-bg: #f8f9fa;
   --ga-fg: #212529;
   --ga-muted: #6c757d;
   --ga-card: #ffffff;
   --ga-border: #e5e7eb;
   --ga-btn-bg: #d4a017;
   /* dorado en light */
   --ga-btn-fg: #fff;
   --ga-btn-outline: #343a40;
   --ga-btn-success: #25d366;

   /* Controles carrusel */
   --ga-ctrl-bg: rgba(255, 255, 255, .75);
   --ga-ctrl-bg-hover: rgba(255, 255, 255, .95);
   --ga-ctrl-border: rgba(0, 0, 0, .12);
   --ga-ctrl-fg: #111;
}

/* Utilidades básicas */
.ga-accent {
   color: var(--ga-accent);
}

.section-title {
   color: var(--ga-fg);
   font-weight: 800;
}

/* =========================================================
   AOS – estados iniciales + intensidad visible
   ========================================================= */
[data-aos] {
   opacity: 0;
   transition-property: transform, opacity;
}

.aos-animate[data-aos] {
   opacity: 1;
}

/* Más desplazamiento para que se note mejor */
[data-aos="fade-up"] {
   transform: translate3d(0, 36px, 0);
}

[data-aos="fade-down"] {
   transform: translate3d(0, -24px, 0);
}

[data-aos="zoom-in"] {
   transform: scale(.94);
}

.aos-animate[data-aos="fade-up"],
.aos-animate[data-aos="fade-down"],
.aos-animate[data-aos="zoom-in"] {
   transform: none;
}

/* =========================================================
   CARRUSEL (cabecera) – altura a pantalla completa
   ========================================================= */
.ga-carousel {
   background: #000;
}

.ga-slide .ga-media {
   object-fit: cover;
   width: 100%;
   height: calc(var(--ga-hero-h) - var(--ga-offset-top));
   max-height: calc(var(--ga-hero-h) - var(--ga-offset-top));
   filter: saturate(.9) contrast(.95);
}

.ga-overlay {
   position: absolute;
   inset: 0;
   background: linear-gradient(180deg, rgba(0, 0, 0, .25), rgba(0, 0, 0, .55));
}

/* Contenido sobre el slide */
.ga-caption {
   position: absolute;
   inset: 0;
   display: flex;
   align-items: center;
   color: #fff;
   pointer-events: none;
   /* evita bloquear el drag del carrusel */
   min-height: calc(var(--ga-hero-h) - var(--ga-offset-top));
}

.ga-caption .ga-caption__inner {
   pointer-events: auto;
   /* permite clickear CTAs */
   max-width: 880px;
}

.ga-badge {
   display: inline-block;
   font-weight: 700;
   letter-spacing: .04em;
   padding: .4rem .75rem;
   border-radius: 999px;
   background: rgba(0, 0, 0, .45);
   border: 1px solid rgba(255, 255, 255, .25);
   backdrop-filter: blur(2px);
   font-size: .9rem;
}

.ga-title {
   margin: .5rem 0 .25rem;
   line-height: 1.05;
   font-weight: 900;
   font-size: clamp(1.8rem, 4.6vw, 3.2rem);
   text-shadow: 0 2px 18px rgba(0, 0, 0, .35);
}

.ga-subtitle {
   color: #e6eaee;
   margin-bottom: 1.25rem;
   font-size: clamp(1rem, 1.5vw, 1.25rem);
}

.ga-btn-cta {
   display: inline-flex;
   align-items: center;
   gap: .5rem;
   padding: .9rem 1.5rem;
   border-radius: 999px;
   border: 0;
   background: var(--ga-btn-bg);
   color: var(--ga-btn-fg);
   font-weight: 800;
   box-shadow: 0 8px 22px rgba(0, 0, 0, .25);
}

/* Hover invertido (pedido) */
.ga-btn-cta:hover {
   background: var(--ga-btn-fg);
   color: var(--ga-btn-bg);
   filter: brightness(.96);
   transform: translateY(-1px);
   -webkit-transform: translateY(-1px);
   -moz-transform: translateY(-1px);
   -ms-transform: translateY(-1px);
   -o-transform: translateY(-1px);
}

.ga-btn-cta:active {
   transform: translateY(0);
}

/* Indicadores visibles */
.carousel-indicators [data-bs-target] {
   width: 28px;
   height: 4px;
   border-radius: 4px;
   background: rgba(255, 255, 255, .6);
}

.carousel-indicators .active {
   background: #fff;
}

/* Controles del carrusel con fondo (dark/light) */
.ga-ctrl {
   width: 46px;
   height: 46px;
   top: 50%;
   transform: translateY(-50%);
   background: var(--ga-ctrl-bg);
   border: 1px solid var(--ga-ctrl-border);
   border-radius: 12px;
   backdrop-filter: blur(2px);
   transition: background .2s ease, border-color .2s ease, transform .1s ease;
}

.ga-ctrl:hover {
   background: var(--ga-ctrl-bg-hover);
}

.ga-ctrl:active {
   transform: translateY(-50%) scale(.98);
}

.ga-ctrl .carousel-control-prev-icon,
.ga-ctrl .carousel-control-next-icon {
   filter: invert(0);
}

.ga-ctrl-prev {
   left: 18px;
}

.ga-ctrl-next {
   right: 18px;
}

/* Responsive: centrado en móviles */
@media (max-width: 576px) {
   .ga-caption {
      text-align: center;
   }

   .ga-caption .ga-caption__inner {
      margin: 0 auto;
   }
}

/* =========================================================
   HERO destacado (con overlay más oscuro + imagen desde la VISTA)
   ========================================================= */
.ga-hero {
   position: relative;
   background: #000;
   background-image: var(--hero-bg, none);
   /* <— se pasa desde la vista */
   background-size: cover;
   background-position: center;
   min-height: 58vh;
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--ga-fg);
}

.ga-hero__layer {
   position: absolute;
   inset: 0;
   background: var(--ga-hero-overlay);
   /* más oscuro */
}

.ga-hero__title {
   font-weight: 800;
   font-size: clamp(1.4rem, 2.2vw, 2.6rem);
}

.ga-hero__subtitle {
   color: var(--ga-muted);
}

/* =========================================================
   SERVICIOS (cards + parallax) – imagen desde la VISTA
   ========================================================= */
.ga-servicios {
   position: relative;
   padding: 80px 0;
   color: var(--ga-fg);
   background-attachment: fixed;
   background-image: var(--parallax, none);
   /* <— se pasa desde la vista */
   background-size: cover;
   background-position: center;
}

.ga-servicios::before {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(0, 0, 0, .55);
}

.ga-servicios .container {
   position: relative;
}

.ga-card {
   background: var(--ga-card);
   border: 1px solid var(--ga-border);
   padding: 24px;
   border-radius: 16px;
   transition: transform .2s, box-shadow .2s;
}

.ga-card:hover {
   transform: translateY(-4px);
   box-shadow: 0 10px 24px rgba(0, 0, 0, .25);
}

.ga-card__icon {
   font-size: 2rem;
   color: var(--ga-accent);
   margin-bottom: .5rem;
}

.ga-card__title {
   font-weight: 800;
}

/* =========================================================
   BLOG / NOVEDADES
   ========================================================= */
.ga-blog {
   padding: 80px 0;
   background: var(--ga-bg);
   color: var(--ga-fg);
}

.ga-post {
   background: var(--ga-card);
   border: 1px solid var(--ga-border);
   border-radius: 16px;
   overflow: hidden;
}

.ga-post__media {
   background: var(--ga-border);
   aspect-ratio: 16 / 9;
   display: flex;
   align-items: center;
   justify-content: center;
}

.ga-post__media img {
   width: 100%;
   height: 100%;
   object-fit: contain;
   display: block;
}

.ga-post__body {
   padding: 16px 16px 0 16px;
}

.ga-post__date {
   text-align: right;
   font-size: .875rem;
   color: var(--ga-muted);
}

.ga-post__title {
   font-weight: 800;
   margin: .25rem 0 .5rem;
}

.ga-post__excerpt {
   color: var(--ga-muted);
   margin: 0 0 12px;
}

.ga-post__footer {
   padding: 16px 16px 20px 16px;
}

.ga-post__footer .btn {
   border-radius: 12px;
}

/* Botones auxiliares usados en cards/clientes */
.ga-btn-outline {
   background: transparent;
   color: var(--ga-btn-outline);
   border: 1px solid var(--ga-btn-outline);
}

.ga-btn-outline:hover {
   background: var(--ga-btn-outline);
   color: #fff;
}

.ga-btn-success {
   background: var(--ga-btn-success);
   color: #fff;
   border: 0;
}

.ga-btn-success:hover {
   filter: brightness(.95);
}

/* =========================================================
   FRASE / CITA
   ========================================================= */
.ga-quote {
   background: linear-gradient(180deg, #0d0f11, #14181c);
   color: var(--ga-fg);
   min-height: 72vh;
   display: flex;
   align-items: center;
}

:root:not([data-theme="dark"]) .ga-quote {
   background: linear-gradient(180deg, #f6f7f9, #e9ecef);
}

.ga-quote__text {
   font-size: clamp(1.4rem, 3.4vw, 3rem);
   font-weight: 900;
   line-height: 1.1;
}

.ga-quote__author {
   color: var(--ga-accent);
   margin-top: 1rem;
   font-weight: 800;
}

/* =========================================================
   CLIENTES (slider de tarjetas)
   ========================================================= */
.ga-clientes {
   padding: 80px 0;
   background: var(--ga-bg);
   color: var(--ga-fg);
}

.ga-slider {
   display: flex;
   gap: 16px;
   overflow-x: auto;
   scroll-snap-type: x mandatory;
   padding: 4px;
}

.ga-client {
   scroll-snap-align: start;
   background: var(--ga-card);
   border: 1px solid var(--ga-border);
   min-width: 300px;
   max-width: 360px;
   border-radius: 16px;
   overflow: hidden;
}

.ga-client__media img {
   width: 100%;
   height: 160px;
   object-fit: cover;
   display: block;
}

.ga-client__body {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 12px 14px;
}

.ga-client__title {
   margin: 0;
   font-weight: 800;
}

.ga-client__since {
   font-size: .875rem;
   color: var(--ga-muted);
}

.ga-client__footer {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 12px 14px 16px;
   gap: 8px;
}

.ga-client__actions .btn {
   margin-right: 6px;
}

.ga-client__social a {
   color: var(--ga-muted);
   margin-left: 10px;
   font-size: 1.1rem;
}

.ga-client__social a:hover {
   color: var(--ga-fg);
}

/* Botones del slider de clientes (no confundir con .ga-ctrl del carrusel principal) */
.ga-slider-btn {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   width: 40px;
   height: 40px;
   border-radius: 50%;
   border: 1px solid var(--ga-border);
   background: #15181caa;
   color: #fff;
   display: grid;
   place-items: center;
}

:root:not([data-theme="dark"]) .ga-slider-btn {
   background: #ffffffcc;
   color: #111;
}

.ga-slider-btn.prev {
   left: -4px;
}

.ga-slider-btn.next {
   right: -4px;
}

/* =========================================================
   RESEÑAS (glass container para el widget)
   ========================================================= */
.ga-reviews {
   padding: 80px 0;
   background: linear-gradient(180deg, var(--ga-bg), #0b0d10);
}

:root:not([data-theme="dark"]) .ga-reviews {
   background: linear-gradient(180deg, #f8f9fa, #eef1f4);
}

.ga-glass {
   background: linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .06));
   backdrop-filter: blur(10px);
   border: 1px solid rgba(255, 255, 255, .18);
   border-radius: 16px;
   padding: 24px;
   min-height: 260px;
   color: var(--ga-fg);
}

:root:not([data-theme="dark"]) .ga-glass {
   background: linear-gradient(180deg, rgba(0, 0, 0, .04), rgba(0, 0, 0, .02));
   border-color: rgba(0, 0, 0, .08);
}



/* ====== HOME – Clientes: fixes de superposición y espaciados (v1.1) ====== */

/* El contenedor del slider debe ser posicionamiento de referencia */
.ga-clients-wrap {
   position: relative;
}

/* Deja “gutter” interno para que las flechas no se superpongan a la primera/última tarjeta */
#gaClientsSlider {
   padding-left: 3.25rem;
   /* espacio para la flecha prev */
   padding-right: 3.25rem;
   /* espacio para la flecha next */
   scroll-padding-left: 3.25rem;
   scroll-padding-right: 3.25rem;
}

/* Flechas por encima de las tarjetas */
.ga-slider-btn {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   z-index: 20;
   /* > z-index de las cards */
   pointer-events: auto;
}

.ga-slider-btn.prev {
   left: .5rem;
}

.ga-slider-btn.next {
   right: .5rem;
}

/* Tarjeta de cliente: estética consistente */
.ga-client {
   border-radius: 1rem;
   overflow: hidden;
}

/* Footer con aire arriba y abajo (antes estaba pt-0) */
.ga-client .card-footer {
   padding-top: .5rem !important;
   padding-bottom: .5rem !important;
}

/* Botoneras: pequeña separación visual interna */
.ga-client .btn-group .btn {
   padding: .25rem .5rem;
}

/* Opcional: línea sutil para separar body/footer si lo querés */
.ga-client .card-footer {
   border-top: 1px solid var(--bs-border-color, rgba(255, 255, 255, .125));
}