/* =========================
   SUCURSALES
========================= */

.branch-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}

.branch-card {
  position: relative;
  min-height: 455px;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: var(--graphite-2);
  isolation: isolate;
  transition: .38s ease;
}

.branch-card:hover {
  transform: translateY(-10px) scale(1.012);
  box-shadow:
    0 30px 80px rgba(0, 0, 0, .42),
    0 0 45px rgba(225, 6, 0, .2);
}

.branch-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, .02) 0%,
    rgba(0, 0, 0, .42) 42%,
    rgba(0, 0, 0, .94) 100%
  );
}

.branch-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .7s ease;
}

.branch-card:hover img {
  transform: scale(1.1);
}

.branch-content {
  position: absolute;
  z-index: 2;
  left: 16px;
  right: 16px;
  bottom: 18px;
}

.branch-content small {
  display: inline-flex;
  padding: 6px 9px;
  border-radius: 999px;
  background: rgba(225, 6, 0, .82);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.branch-content h3 {
  margin-top: 11px;
  font-family: Anton, sans-serif;
  font-size: 30px;
  line-height: .98;
  text-transform: uppercase;
}

.branch-content p {
  margin: 10px 0 18px;
  color: rgba(255, 255, 255, .76);
  font-size: 12.5px;
  line-height: 1.55;
}

.branch-btn {
  width: 100%;
  min-height: 48px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  overflow: hidden;
  border-radius: 16px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.branch-btn span,
.branch-btn strong {
  position: relative;
  z-index: 2;
}

.branch-btn strong {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  border-radius: 50%;
  font-size: 18px;
  background: rgba(255, 255, 255, .16);
}

.branch-btn--active {
  color: #fff;
  background: linear-gradient(135deg, #e10600, #8e0000);
  border: 1px solid rgba(255, 255, 255, .18);
  box-shadow: 0 12px 34px rgba(225, 6, 0, .42);
}

.branch-btn--soon {
  color: #fff;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .24);
  backdrop-filter: blur(12px);
}

.branch-btn--soon::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background: linear-gradient(
    135deg,
    rgba(225, 6, 0, .34),
    rgba(255, 255, 255, .06)
  );
  opacity: .85;
}

.branch-btn:hover {
  transform: translateY(-3px);
}

.branch-btn--active:hover {
  box-shadow: 0 18px 46px rgba(225, 6, 0, .56);
}

.branch-btn--soon:hover {
  border-color: rgba(225, 6, 0, .65);
  box-shadow: 0 16px 38px rgba(225, 6, 0, .26);
}


/* =========================
   NOSOTROS / EXPERIENCE
========================= */

.experience {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      #050505 0%,
      #0b0b0d 45%,
      #050505 100%
    );
}

.experience::before {
  content: "ATHLETIC";
  position: absolute;
  left: -40px;
  top: 40px;
  font-family: Anton, sans-serif;
  font-size: 18vw;
  color: rgba(255, 255, 255, .025);
  line-height: 1;
  pointer-events: none;
}

.experience::after {
  content: "";
  position: absolute;
  right: -180px;
  top: 120px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(225, 6, 0, .12);
  filter: blur(120px);
  pointer-events: none;
}

.experience-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
}

.feature-img {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid rgba(255, 255, 255, .12);
  box-shadow:
    0 30px 90px rgba(0, 0, 0, .42),
    0 0 50px rgba(225, 6, 0, .08);
}

.feature-img::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(
      180deg,
      rgba(0, 0, 0, .08) 0%,
      rgba(0, 0, 0, .28) 42%,
      rgba(0, 0, 0, .74) 100%
    );
}

.feature-img::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 160px;
  z-index: 2;
  background:
    linear-gradient(
      180deg,
      transparent,
      rgba(225, 6, 0, .18)
    );
}

.feature-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    transform 1s ease,
    filter .8s ease;
}

.feature-img:hover img {
  transform: scale(1.06);
  filter: contrast(1.08) saturate(1.08);
}

.feature-stack {
  display: grid;
  gap: 18px;
}

.info-card {
  position: relative;
  padding: 34px;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid rgba(255, 255, 255, .10);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, .08),
      rgba(255, 255, 255, .03)
    );
  backdrop-filter: blur(14px);
  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}

.info-card::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity .35s ease;
  background:
    linear-gradient(
      135deg,
      rgba(225, 6, 0, .18),
      transparent 45%
    );
}

.info-card:hover {
  transform: translateY(-8px);
  border-color: rgba(225, 6, 0, .35);
  box-shadow:
    0 24px 70px rgba(0, 0, 0, .34),
    0 0 40px rgba(225, 6, 0, .12);
}

.info-card:hover::before {
  opacity: 1;
}

.info-card h3 {
  position: relative;
  z-index: 2;
  margin-bottom: 14px;
  font-family: Anton, sans-serif;
  font-size: 34px;
  line-height: 1;
  text-transform: uppercase;
}

.info-card p {
  position: relative;
  z-index: 2;
  color: rgba(255, 255, 255, .72);
  font-size: 15px;
  line-height: 1.75;
}


/* =========================
   PLANES
========================= */

.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.plan-card {
  position: relative;
  min-height: 330px;
  padding: 30px;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, .055);
}

.plan-card.featured {
  background: linear-gradient(
    145deg,
    rgba(225, 6, 0, .26),
    rgba(255, 255, 255, .055)
  );
  box-shadow: var(--shadow-red);
}

.plan-card h3 {
  font-family: Anton, sans-serif;
  font-size: 36px;
  text-transform: uppercase;
}

.price {
  margin: 24px 0;
  font-family: Anton, sans-serif;
  font-size: 54px;
}

.plan-card ul {
  list-style: none;
  color: rgba(255, 255, 255, .7);
  font-size: 14px;
  line-height: 2;
}


/* =========================
   HERRAMIENTAS
========================= */

.tool-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.tool-card {
  padding: 28px;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, .08),
    rgba(255, 255, 255, .03)
  );
  transition: .3s ease;
}

.tool-card:hover {
  transform: translateY(-8px);
  border-color: rgba(225, 6, 0, .38);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

.tool-card span {
  font-size: 36px;
}

.tool-card h3 {
  margin: 16px 0 8px;
  font-family: Anton, sans-serif;
  font-size: 28px;
  text-transform: uppercase;
}

.tool-card p {
  color: rgba(255, 255, 255, .68);
  line-height: 1.6;
}


/* =========================
   GALERÍA
========================= */

.gallery-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr 1fr;
  grid-auto-rows: 230px;
  gap: 18px;
}

.gallery-item {
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid var(--line);
}

.gallery-item.large {
  grid-row: span 2;
}

.gallery-item.wide {
  grid-column: span 2;
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .7s ease;
}

.gallery-item:hover img {
  transform: scale(1.08);
  filter: contrast(1.1) saturate(1.08);
}


/* =========================
   TIENDA
========================= */

.shop-preview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.shop-card {
  position: relative;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding: 34px;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: linear-gradient(
    135deg,
    rgba(225, 6, 0, .18),
    rgba(255, 255, 255, .05)
  );
}

.shop-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("../img/gym-maquinas-02.jpg") center / cover no-repeat;
  opacity: .25;
}

.shop-card--alt::before {
  background-image: url("../img/gym-maquinas-03.jpg");
}

.shop-card > * {
  position: relative;
  z-index: 1;
}

.shop-card h3 {
  margin-bottom: 10px;
  font-family: Anton, sans-serif;
  font-size: 44px;
  text-transform: uppercase;
}

.shop-card p {
  margin-bottom: 22px;
  color: rgba(255, 255, 255, .7);
  line-height: 1.7;
}


/* =========================
   CTA FINAL
========================= */

.cta {
  padding: 120px 0;
  text-align: center;
  background:
    radial-gradient(circle at center, rgba(225, 6, 0, .25), transparent 35%),
    linear-gradient(180deg, var(--black), #080000);
}

.cta h2 {
  max-width: 900px;
  margin: auto;
  font-family: Anton, sans-serif;
  font-size: clamp(46px, 7vw, 96px);
  line-height: .95;
  text-transform: uppercase;
}

.cta p {
  max-width: 620px;
  margin: 24px auto 34px;
  color: rgba(255, 255, 255, .7);
  line-height: 1.7;
}

/* =========================
   CTA FINAL
========================= */

.cta{
  position:relative;

  overflow:hidden;

  padding:140px 0 120px;

  text-align:center;

  background:
    radial-gradient(
      circle at center,
      rgba(225,6,0,.22),
      transparent 35%
    ),
    linear-gradient(
      180deg,
      #050505 0%,
      #090909 45%,
      #020202 100%
    );
}

/* sombra de separación */

.cta-shadow{
  position:absolute;

  top:0;
  left:0;
  right:0;

  height:140px;

  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.82),
      transparent
    );

  pointer-events:none;
}

.cta::before{
  content:"";

  position:absolute;

  width:420px;
  height:420px;

  left:50%;
  top:50%;

  transform:translate(-50%,-50%);

  border-radius:50%;

  background:rgba(225,6,0,.12);

  filter:blur(120px);

  pointer-events:none;
}

.cta .container{
  position:relative;
  z-index:2;
}

.cta h2{
  max-width:900px;

  margin:auto;

  font-family:Anton,sans-serif;

  font-size:clamp(46px,7vw,96px);

  line-height:1.05;

  letter-spacing:.015em;

  text-transform:uppercase;
}

.cta p{
  max-width:640px;

  margin:26px auto 36px;

  color:rgba(255,255,255,.72);

  font-size:16px;

  line-height:1.8;
}

.cta-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:16px;
}

/* ======================================================
   SERVICES CINEMATIC
====================================================== */

.services-section{
  position:relative;
  overflow:hidden;
}

.services-blur{
  position:absolute;
  border-radius:50%;
  filter:blur(120px);
  pointer-events:none;
}

.services-blur--1{
  top:-120px;
  left:-120px;
  width:320px;
  height:320px;
  background:rgba(225,6,0,.14);
}

.services-blur--2{
  right:-120px;
  bottom:-120px;
  width:340px;
  height:340px;
  background:rgba(41,43,134,.16);
}

.services-grid{
  position:relative;
  z-index:2;
}

.service-card{
  position:relative;

  min-height:340px;

  padding:34px 30px;

  overflow:hidden;

  border-radius:30px;

  border:1px solid rgba(255,255,255,.08);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.08),
      rgba(255,255,255,.03)
    );

  backdrop-filter:blur(14px);

  transition:
    transform .45s ease,
    border-color .45s ease,
    box-shadow .45s ease,
    background .45s ease;
}

.service-card::before{
  content:"";

  position:absolute;
  inset:0;

  opacity:0;

  transition:opacity .45s ease;

  background:
    linear-gradient(
      135deg,
      rgba(225,6,0,.18),
      transparent 40%
    );
}

.service-card:hover{
  transform:
    translateY(-14px)
    scale(1.02);

  border-color:
    rgba(225,6,0,.34);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.11),
      rgba(255,255,255,.04)
    );

  box-shadow:
    0 26px 70px rgba(0,0,0,.36),
    0 0 45px rgba(225,6,0,.16);
}

.service-card:hover::before{
  opacity:1;
}

.service-number{
  position:absolute;
  top:24px;
  right:24px;

  color:rgba(255,255,255,.08);

  font-family:Anton,sans-serif;

  font-size:74px;

  line-height:1;
}

.service-icon{
  width:78px;
  height:78px;

  display:flex;
  align-items:center;
  justify-content:center;

  margin-bottom:26px;

  border-radius:24px;

  font-size:34px;

  background:
    linear-gradient(
      145deg,
      rgba(225,6,0,.20),
      rgba(255,255,255,.05)
    );

  border:
    1px solid rgba(255,255,255,.08);

  box-shadow:
    inset 0 0 24px rgba(255,255,255,.03);
}

.service-card h3{
  margin-bottom:16px;

  font-size:34px;

  line-height:1.08;
}

.service-card p{
  position:relative;
  z-index:2;

  max-width:92%;

  color:rgba(255,255,255,.92);

  line-height:1.8;
}

.service-line{
  position:absolute;
  left:0;
  bottom:0;

  width:0;
  height:3px;

  background:
    linear-gradient(
      90deg,
      var(--red),
      transparent
    );

  transition:width .45s ease;
}

.service-card:hover .service-line{
  width:100%;
}


/* =========================
   RESPONSIVE
========================= */

@media(max-width:980px){

  .service-card{
    min-height:auto;
  }

}

@media(max-width:620px){

  .service-number{
    font-size:58px;
  }

  .service-card h3{
    font-size:28px;
  }

}

/* ======================================================
   PÁGINA SUCURSALES
====================================================== */

.branches-page-hero {
  position: relative;
  overflow: hidden;
}

.branches-page-hero::before {
  content: "";
  position: absolute;
  right: -160px;
  top: 40px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(225, 6, 0, .16);
  filter: blur(120px);
  pointer-events: none;
}

.location-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.location-summary article {
  padding: 30px;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}

.location-summary strong {
  display: block;
  font-family: Anton, sans-serif;
  font-size: 52px;
  font-weight: 400;
  color: var(--red-light);
}

.location-summary span {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.branches-detail-grid {
  display: grid;
  gap: 24px;
}

.branch-detail-card {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 0;
  overflow: hidden;
  border-radius: 32px;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
}

.branch-detail-img {
  position: relative;
  min-height: 390px;
  overflow: hidden;
}

.branch-detail-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.72));
}

.branch-detail-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .75s ease;
}

.branch-detail-card:hover .branch-detail-img img {
  transform: scale(1.07);
}

.branch-detail-img span {
  position: absolute;
  left: 22px;
  bottom: 22px;
  z-index: 2;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(225,6,0,.85);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.branch-detail-info {
  position: relative;
  padding: 42px;
}

.branch-detail-info h3 {
  margin-bottom: 16px;
  font-family: Anton, sans-serif;
  font-size: clamp(38px, 5vw, 62px);
  font-weight: 400;
  line-height: 1.05;
  text-transform: uppercase;
}

.branch-detail-info p {
  max-width: 620px;
  margin-bottom: 22px;
  color: rgba(255,255,255,.92);
  line-height: 1.8;
}

.branch-detail-info ul {
  display: grid;
  gap: 10px;
  margin-bottom: 28px;
  list-style: none;
}

.branch-detail-info li {
  position: relative;
  padding-left: 24px;
  color: rgba(255,255,255,.9);
  line-height: 1.6;
}

.branch-detail-info li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--red-light);
  font-weight: 900;
}

.branch-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.branch-detail-card--active {
  box-shadow: 0 30px 90px rgba(0,0,0,.34), 0 0 42px rgba(225,6,0,.12);
}

.branches-detail-section{
  background:
    linear-gradient(
      180deg,
      #070707,
      #0d0d0d
    );
}

.locations-cta {

  position: relative;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 34px;

  padding: 52px;

  overflow: hidden;

  border-radius: 34px;

  border: 1px solid rgba(255,255,255,.10);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.025)
    );

  box-shadow:
    0 24px 60px rgba(0,0,0,.22);
}

.locations-cta h2 {
  max-width: 720px;
  margin-bottom: 16px;
  font-family: Anton, sans-serif;
  font-size: clamp(38px, 5vw, 72px);
  font-weight: 400;
  line-height: 1.05;
  text-transform: uppercase;
}

.locations-cta p {
  max-width: 620px;
  color: rgba(255,255,255,.9);
  line-height: 1.75;
}

@media (max-width: 900px) {
  .location-summary {
    grid-template-columns: 1fr;
  }

  .branch-detail-card {
    grid-template-columns: 1fr;
  }

  .locations-cta {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ======================================================
   SEPARADORES ENTRE SECCIONES
====================================================== */

.section{

  position:relative;
}


/* LINEA SUPERIOR SUAVE */

.section::before{

  content:"";

  position:absolute;

  top:0;
  left:50%;

  transform:translateX(-50%);

  width:min(92%,1200px);

  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.06),
      transparent
    );
}


/* SOMBRA SUAVE ENTRE BLOQUES */

.section::after{

  content:"";

  position:absolute;

  left:0;
  right:0;
  bottom:-1px;

  height:120px;

  pointer-events:none;

  background:
    linear-gradient(
      180deg,
      transparent,
      rgba(0,0,0,.28)
    );
}


/* HERO NO NECESITA SEPARADOR */

.hero::before,
.page-title::before{
  display:none;
}

/* ======================================================
   PÁGINA UBICACIÓN SECHURA
====================================================== */

.location-page-hero{
  position:relative;
  overflow:hidden;
}

.location-section{
  background:
    linear-gradient(
      180deg,
      #050505,
      #0b0b0d
    );
}

.location-layout{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:28px;
  align-items:stretch;
}

.location-info{
  padding:46px;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.08),
      rgba(255,255,255,.025)
    );
}

.location-info h2{
  margin-bottom:18px;
  font-family:Anton,sans-serif;
  font-size:clamp(42px,6vw,78px);
  font-weight:400;
  line-height:1.05;
  text-transform:uppercase;
}

.location-info p{
  max-width:620px;
  margin-bottom:28px;
  color:rgba(255,255,255,.92);
  line-height:1.8;
}

.location-data{
  display:grid;
  gap:14px;
  margin-bottom:30px;
}

.location-data article{
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
}

.location-data strong{
  display:block;
  margin-bottom:6px;
  color:#ff2a2a;
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.location-data span{
  color:rgba(255,255,255,.92);
  line-height:1.6;
}

.location-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

.location-map{
  min-height:560px;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:
    0 30px 80px rgba(0,0,0,.38);
}

.location-map iframe{
  width:100%;
  height:100%;
  border:0;
  filter:grayscale(1) contrast(1.1) brightness(.82);
}

@media(max-width:900px){
  .location-layout{
    grid-template-columns:1fr;
  }

  .location-map{
    min-height:420px;
  }
}

/* ======================================================
   HORARIOS UBICACIÓN
====================================================== */

.location-data article:last-child{

  background:
    linear-gradient(
      145deg,
      rgba(225,6,0,.10),
      rgba(255,255,255,.03)
    );

  border-color:
    rgba(225,6,0,.20);
}

.location-data b{

  color:#ffffff;

  font-weight:800;

  letter-spacing:.04em;

  text-transform:uppercase;
}

/* ======================================================
   PÁGINA NOSOTROS
====================================================== */

.about-hero{
  overflow:hidden;
}

.about-hero-grid{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:34px;
  align-items:center;
}

.about-hero-image,
.about-image{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 90px rgba(0,0,0,.38);
}

.about-hero-image img,
.about-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  min-height:420px;
  transition:transform .8s ease, filter .8s ease;
}

.about-hero-image:hover img,
.about-image:hover img{
  transform:scale(1.06);
  filter:contrast(1.08) saturate(1.08);
}

.about-intro-grid{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:34px;
  align-items:center;
}

.about-content h2{
  margin-bottom:22px;
  font-family:Anton,sans-serif;
  font-size:clamp(42px,6vw,78px);
  font-weight:400;
  line-height:1.06;
  text-transform:uppercase;
}

.about-content p{
  margin-bottom:18px;
  color:rgba(255,255,255,.92);
  line-height:1.8;
}

.about-values-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}

.about-value-card{
  position:relative;
  min-height:320px;
  padding:32px;
  overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
  transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

.about-value-card:hover{
  transform:translateY(-10px);
  border-color:rgba(225,6,0,.32);
  box-shadow:0 26px 70px rgba(0,0,0,.34),0 0 38px rgba(225,6,0,.12);
}

.about-value-card span{
  display:block;
  margin-bottom:28px;
  color:rgba(255,255,255,.12);
  font-family:Anton,sans-serif;
  font-size:72px;
  line-height:1;
}

.about-value-card h3{
  margin-bottom:14px;
  font-family:Anton,sans-serif;
  font-size:34px;
  font-weight:400;
  text-transform:uppercase;
}

.about-value-card p{
  color:rgba(255,255,255,.9);
  line-height:1.75;
}

.about-philosophy-grid{
  display:grid;
  gap:24px;
}

.about-philosophy-card{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
}

.about-philosophy-card img{
  width:100%;
  height:100%;
  min-height:340px;
  object-fit:cover;
}

.about-philosophy-card div{
  padding:44px;
}

.about-philosophy-card span{
  display:inline-flex;
  margin-bottom:14px;
  color:#ff2a2a;
  font-size:12px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.about-philosophy-card h3{
  margin-bottom:16px;
  font-family:Anton,sans-serif;
  font-size:clamp(36px,5vw,62px);
  font-weight:400;
  line-height:1.06;
  text-transform:uppercase;
}

.about-philosophy-card p{
  color:rgba(255,255,255,.92);
  line-height:1.8;
}

.about-reasons-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

@media(max-width:980px){
  .about-hero-grid,
  .about-intro-grid,
  .about-philosophy-card{
    grid-template-columns:1fr;
  }

  .about-values-grid,
  .about-reasons-grid{
    grid-template-columns:1fr;
  }
}

/* ======================================================
   PÁGINA SERVICIOS
====================================================== */

.services-page-hero {
  overflow: hidden;
}

.services-page-hero .hero-actions{
  margin-top:42px;
}

.services-hero-grid {
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 34px;
  align-items: center;
}

.services-hero-image,
.service-method-image {
  position: relative;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 30px 90px rgba(0,0,0,.38);
}

.services-hero-image::after,
.service-method-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.04),
      rgba(0,0,0,.42)
    );
  pointer-events: none;
}

.services-hero-image img,
.service-method-image img {
  width: 100%;
  height: 100%;
  min-height: 430px;
  object-fit: cover;
  transition: transform .85s ease, filter .85s ease;
}

.services-hero-image:hover img,
.service-method-image:hover img {
  transform: scale(1.06);
  filter: contrast(1.08) saturate(1.08);
}

.services-page-section {
  position: relative;
  overflow: hidden;
}

.services-detail-grid {
  display: grid;
  gap: 24px;
}

.services-detail-card {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.075),
      rgba(255,255,255,.025)
    );
  transition:
    transform .38s ease,
    border-color .38s ease,
    box-shadow .38s ease;
}

.services-detail-card:hover {
  transform: translateY(-8px);
  border-color: rgba(225,6,0,.32);
  box-shadow:
    0 30px 80px rgba(0,0,0,.38),
    0 0 42px rgba(225,6,0,.12);
}

.services-detail-img {
  position: relative;
  min-height: 360px;
  overflow: hidden;
}

.services-detail-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.04),
      rgba(0,0,0,.70)
    );
}

.services-detail-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .75s ease, filter .75s ease;
}

.services-detail-card:hover .services-detail-img img {
  transform: scale(1.07);
  filter: contrast(1.08) saturate(1.08);
}

.services-detail-content {
  position: relative;
  padding: 42px;
}

.services-detail-content span {
  display: block;
  margin-bottom: 16px;
  color: rgba(255,255,255,.12);
  font-family: Anton, sans-serif;
  font-size: 72px;
  line-height: 1;
}

.services-detail-content h3 {
  margin-bottom: 16px;
  font-family: Anton, sans-serif;
  font-size: clamp(38px,5vw,64px);
  font-weight: 400;
  line-height: 1.06;
  text-transform: uppercase;
}

.services-detail-content p {
  max-width: 620px;
  margin-bottom: 24px;
  color: rgba(255,255,255,.92);
  line-height: 1.8;
}

.services-detail-content ul {
  display: grid;
  gap: 10px;
  list-style: none;
}

.services-detail-content li {
  position: relative;
  padding-left: 24px;
  color: rgba(255,255,255,.9);
  line-height: 1.65;
}

.services-detail-content li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--red-light);
  font-weight: 900;
}

.service-method-section {
  background:
    linear-gradient(
      180deg,
      #050505,
      #0b0b0d
    );
}

.service-method-grid {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 34px;
  align-items: center;
}

.service-method-content h2 {
  margin-bottom: 22px;
  font-family: Anton, sans-serif;
  font-size: clamp(42px,6vw,78px);
  font-weight: 400;
  line-height: 1.06;
  text-transform: uppercase;
}

.service-method-content p {
  margin-bottom: 28px;
  color: rgba(255,255,255,.92);
  line-height: 1.8;
}

.method-list {
  display: grid;
  gap: 14px;
}

.method-list article {
  padding: 20px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.025)
    );
}

.method-list strong {
  display: block;
  margin-bottom: 6px;
  color: #ff2a2a;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.method-list span {
  color: rgba(255,255,255,.9);
  line-height: 1.6;
}

@media(max-width:980px) {
  .services-hero-grid,
  .services-detail-card,
  .service-method-grid {
    grid-template-columns: 1fr;
  }
}

/* ======================================================
   PÁGINA HERRAMIENTAS
====================================================== */

.tools-page-hero {
  overflow: hidden;
}

.tools-hero-grid {
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 34px;
  align-items: center;
}

.tools-hero-image,
.tools-progress-image {
  position: relative;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 30px 90px rgba(0,0,0,.38);
}

.tools-hero-image::after,
.tools-progress-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.04),
      rgba(0,0,0,.42)
    );
  pointer-events: none;
}

.tools-hero-image img,
.tools-progress-image img {
  width: 100%;
  height: 100%;
  min-height: 430px;
  object-fit: cover;
  transition: transform .85s ease, filter .85s ease;
}

.tools-hero-image:hover img,
.tools-progress-image:hover img {
  transform: scale(1.06);
  filter: contrast(1.08) saturate(1.08);
}

.tools-section {
  position: relative;
  overflow: hidden;
}

.tools-section .container {
  position: relative;
  z-index: 2;
}

.tools-glow {
  position: absolute;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  filter: blur(130px);
  pointer-events: none;
}

.tools-glow--left {
  left: -160px;
  top: 120px;
  background: rgba(225,6,0,.15);
}

.tools-glow--right {
  right: -160px;
  bottom: 70px;
  background: rgba(41,43,134,.15);
}

.tools-card-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 22px;
}

.tool-feature-card {
  position: relative;
  min-height: 560px;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.12);
  background: #080808;
  isolation: isolate;
  transition:
    transform .42s ease,
    border-color .42s ease,
    box-shadow .42s ease;
}

.tool-feature-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.06) 0%,
      rgba(0,0,0,.44) 42%,
      rgba(0,0,0,.94) 100%
    );
}

.tool-feature-card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
  width: 0;
  height: 3px;
  background:
    linear-gradient(
      90deg,
      var(--red-light),
      transparent
    );
  transition: width .42s ease;
}

.tool-feature-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s ease, filter .8s ease;
}

.tool-feature-card:hover {
  transform: translateY(-12px);
  border-color: rgba(225,6,0,.34);
  box-shadow:
    0 30px 80px rgba(0,0,0,.42),
    0 0 46px rgba(225,6,0,.16);
}

.tool-feature-card:hover img {
  transform: scale(1.08);
  filter: contrast(1.12) saturate(1.12);
}

.tool-feature-card:hover::after {
  width: 100%;
}

.tool-feature-content {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 28px;
  z-index: 4;
}

.tool-feature-content span {
  display: block;
  margin-bottom: 18px;
  color: rgba(255,255,255,.18);
  font-family: Anton,sans-serif;
  font-size: 64px;
  line-height: 1;
}

.tool-feature-content h3 {
  margin-bottom: 14px;
  font-family: Anton,sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 1.08;
  text-transform: uppercase;
}

.tool-feature-content p {
  margin-bottom: 24px;
  color: rgba(255,255,255,.92);
  line-height: 1.75;
}

.tools-progress-section {
  background:
    linear-gradient(
      180deg,
      #050505,
      #0b0b0d
    );
}

.tools-progress-grid {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 34px;
  align-items: center;
}

.tools-progress-content h2 {
  margin-bottom: 22px;
  font-family: Anton,sans-serif;
  font-size: clamp(42px,6vw,78px);
  font-weight: 400;
  line-height: 1.06;
  text-transform: uppercase;
}

.tools-progress-content p {
  margin-bottom: 28px;
  color: rgba(255,255,255,.92);
  line-height: 1.8;
}

/* HERO BOTONES - HERRAMIENTAS */

.tools-page-hero .hero-actions{
  margin-top:42px;
}

.progress-list {
  display: grid;
  gap: 14px;
}

.progress-list article {
  padding: 20px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.025)
    );
}

.progress-list strong {
  display: block;
  margin-bottom: 6px;
  color: #ff2a2a;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.progress-list span {
  color: rgba(255,255,255,.9);
  line-height: 1.6;
}

@media(max-width:980px) {
  .tools-hero-grid,
  .tools-progress-grid {
    grid-template-columns: 1fr;
  }

  .tools-card-grid {
    grid-template-columns: 1fr;
  }

  .tool-feature-card {
    min-height: 460px;
  }
}

/* ======================================================
   CALCULADORA IMC FITNESS PRO
====================================================== */

.imc-page-hero{
  overflow:hidden;
}

.imc-section{
  position:relative;
  overflow:hidden;

  background:
    radial-gradient(
      circle at 18% 18%,
      rgba(225,6,0,.10),
      transparent 32%
    ),
    radial-gradient(
      circle at 88% 70%,
      rgba(8,145,178,.10),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #050505,
      #0b0b0d
    );
}

.imc-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:28px;
  align-items:stretch;
}

.imc-card,
.imc-result-card{
  position:relative;
  overflow:hidden;

  padding:46px;

  border-radius:34px;
  border:1px solid rgba(255,255,255,.11);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.085),
      rgba(255,255,255,.025)
    );

  box-shadow:
    0 30px 80px rgba(0,0,0,.32);
}

.imc-card::before,
.imc-result-card::before{
  content:"";
  position:absolute;
  inset:0;

  background:
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.014) 0px,
      rgba(255,255,255,.014) 1px,
      transparent 1px,
      transparent 34px
    );

  opacity:.45;
  pointer-events:none;
}

.imc-card > *,
.imc-result-card > *{
  position:relative;
  z-index:2;
}

.imc-card h2{
  margin-bottom:28px;

  font-family:Anton,sans-serif;
  font-size:clamp(38px,5vw,64px);
  font-weight:400;

  line-height:1.05;
  text-transform:uppercase;
}


/* FORMULARIO */

.imc-form{
  display:grid;
  gap:20px;
}

.imc-form label{
  display:grid;
  gap:10px;

  color:#ffffff;

  font-size:12px;
  font-weight:900;

  letter-spacing:.12em;
  text-transform:uppercase;
}

.imc-form label small{
  color:rgba(255,255,255,.54);
  font-size:10px;
  font-weight:800;
  letter-spacing:.10em;
}

.imc-form input,
.imc-form select{
  width:100%;
  height:56px;

  padding:0 18px;

  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);

  outline:none;

  color:#ffffff;

  font-size:16px;
  font-weight:700;

  background:
    rgba(255,255,255,.06);

  transition:
    border-color .28s ease,
    box-shadow .28s ease,
    background .28s ease;
}

.imc-form select{
  padding-right:54px;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  cursor:pointer;
}

.imc-form option{
  background:#0a0a0a;
  color:#ffffff;
}

.imc-form input:focus,
.imc-form select:focus{
  border-color:rgba(225,6,0,.55);

  background:rgba(255,255,255,.085);

  box-shadow:
    0 0 0 4px rgba(225,6,0,.12);
}


/* CHECKBOX */

.checkbox-label{
  display:flex !important;
  align-items:center;

  gap:14px;

  margin-top:4px;
  padding:18px;

  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.06),
      rgba(255,255,255,.025)
    );
}

.checkbox-label input{
  width:18px;
  height:18px;

  flex:0 0 18px;

  accent-color:#ff2a2a;
}

.checkbox-label span{
  color:#ffffff;

  font-size:13px;
  font-weight:700;

  line-height:1.5;
  letter-spacing:.02em;

  text-transform:none;
}


/* RESULTADO DASHBOARD */

.imc-dashboard{
  margin-top:22px;
  margin-bottom:22px;

  padding:30px;

  border-radius:30px;
  border:1px solid rgba(255,255,255,.10);

  background:
    radial-gradient(
      circle at 20% 20%,
      rgba(225,6,0,.18),
      transparent 35%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.08),
      rgba(255,255,255,.025)
    );
}

.imc-dashboard small{
  display:block;

  margin-bottom:14px;

  color:rgba(255,255,255,.72);

  font-size:11px;
  font-weight:900;

  letter-spacing:.14em;
  text-transform:uppercase;
}

.imc-result-number{
  margin:0 0 12px;

  color:var(--red-light);

  font-family:Anton,sans-serif;
  font-size:clamp(76px,10vw,132px);

  line-height:.88;
}

.imc-result-card h3{
  margin-bottom:0;

  font-family:Anton,sans-serif;
  font-size:clamp(34px,5vw,58px);
  font-weight:400;

  line-height:1.08;
  text-transform:uppercase;
}

.imc-result-card p{
  max-width:620px;

  color:rgba(255,255,255,.9);

  line-height:1.8;
}


/* ESCALA */

.imc-scale{
  display:grid;
  grid-template-columns:repeat(6,1fr);

  gap:8px;

  margin:34px 0 16px;
}

.imc-scale span{
  padding:12px 8px;

  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);

  background:rgba(255,255,255,.06);

  text-align:center;

  font-size:10px;
  font-weight:900;

  letter-spacing:.08em;
  text-transform:uppercase;

  transition:
    background .35s ease,
    border-color .35s ease,
    color .35s ease,
    transform .35s ease,
    box-shadow .35s ease;
}

.imc-scale span.active{
  color:#ffffff;
  transform:translateY(-3px);
}

.imc-progress-track{
  width:100%;
  height:8px;

  margin-bottom:34px;

  overflow:hidden;

  border-radius:999px;

  background:
    linear-gradient(
      90deg,
      #2563eb,
      #16a34a,
      #0891b2,
      #f59e0b,
      #9333ea
    );

  opacity:.72;
}

.imc-progress-track div{
  width:0;
  height:100%;

  border-radius:999px;

  background:#ffffff;

  box-shadow:
    0 0 14px rgba(255,255,255,.65);

  transition:width .6s ease;
}


/* ESTADOS */

#scale-bajo.active{
  background:linear-gradient(135deg,#2563eb,#1e40af);
  border-color:rgba(37,99,235,.28);
  box-shadow:0 4px 18px rgba(37,99,235,.16);
}

#scale-normal.active{
  background:linear-gradient(135deg,#16a34a,#166534);
  border-color:rgba(22,163,74,.28);
  box-shadow:0 4px 18px rgba(22,163,74,.16);
}

#scale-fitness.active{
  background:linear-gradient(135deg,#0ea5e9,#0369a1);
  border-color:rgba(14,165,233,.28);
  box-shadow:0 4px 18px rgba(14,165,233,.16);
}

#scale-atletico.active{
  background:linear-gradient(135deg,#0891b2,#0e7490);
  border-color:rgba(8,145,178,.28);
  box-shadow:0 4px 18px rgba(8,145,178,.16);
}

#scale-sobrepeso.active{
  background:linear-gradient(135deg,#f59e0b,#d97706);
  border-color:rgba(245,158,11,.28);
  box-shadow:0 4px 18px rgba(245,158,11,.16);
}

#scale-obesidad.active{
  background:linear-gradient(135deg,#9333ea,#6b21a8);
  border-color:rgba(147,51,234,.28);
  box-shadow:0 4px 18px rgba(147,51,234,.16);
}


/* INSIGHTS */

.imc-insights{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;

  margin-bottom:28px;
}

.imc-insights article,
.imc-note,
.imc-disclaimer{
  padding:22px;

  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.065),
      rgba(255,255,255,.025)
    );
}

.imc-insights article{
  transition:
    transform .3s ease,
    border-color .3s ease,
    box-shadow .3s ease;
}

.imc-insights article:hover{
  transform:translateY(-6px);
  border-color:rgba(225,6,0,.24);
  box-shadow:0 20px 50px rgba(0,0,0,.24);
}

.imc-insights small{
  display:block;

  margin-bottom:10px;

  color:rgba(255,255,255,.62);

  font-size:11px;
  font-weight:900;

  letter-spacing:.10em;
  text-transform:uppercase;
}

.imc-insights strong{
  display:block;

  color:#ffffff;

  font-family:Anton,sans-serif;
  font-size:34px;
  font-weight:400;

  line-height:1;
}

.imc-insights span{
  display:block;

  margin-top:8px;

  color:rgba(255,255,255,.74);

  font-size:13px;
  line-height:1.5;
}

.imc-note{
  margin-bottom:18px;
}

.imc-note strong{
  display:block;

  margin-bottom:10px;

  color:var(--red-light);

  font-size:12px;
  font-weight:900;

  letter-spacing:.12em;
  text-transform:uppercase;
}

.imc-note p{
  color:rgba(255,255,255,.88);
  line-height:1.75;
}

.imc-disclaimer{
  margin-bottom:34px;

  color:rgba(255,255,255,.68);

  font-size:13px;
  line-height:1.7;
}


/* ACCIONES */

.imc-actions{
  display:flex;
  flex-wrap:wrap;
  gap:16px;

  margin-top:42px;
}


/* RESPONSIVE */

@media(max-width:1000px){

  .imc-grid{
    grid-template-columns:1fr;
  }

  .imc-insights{
    grid-template-columns:1fr;
  }
}

@media(max-width:700px){

  .imc-card,
  .imc-result-card{
    padding:30px;
  }

  .imc-scale{
    grid-template-columns:1fr 1fr;
  }
}

/* ======================================================
   CALCULADORA CALORÍAS PREMIUM
====================================================== */

.calories-page-hero{
  overflow:hidden;
}

.calories-section{
  background:
    linear-gradient(
      180deg,
      #050505,
      #0b0b0d
    );
}

.calories-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:28px;
}

.calories-form-card,
.calories-result-card{
  padding:46px;

  border-radius:34px;

  border:1px solid rgba(255,255,255,.10);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.025)
    );

  box-shadow:
    0 30px 80px rgba(0,0,0,.32);
}

.calories-form{
  display:grid;
  gap:20px;
}

.calories-form label{
  display:grid;
  gap:10px;

  color:#ffffff;

  font-size:12px;
  font-weight:900;

  letter-spacing:.12em;
  text-transform:uppercase;
}

.calories-form input,
.calories-form select{
  width:100%;
  height:58px;

  padding:0 18px;

  border:none;
  outline:none;

  border-radius:18px;

  color:#ffffff;

  font-size:15px;
  font-weight:700;

  background:
    rgba(255,255,255,.06);

  appearance:none;
}

.calories-form input:focus,
.calories-form select:focus{

  box-shadow:
    0 0 0 4px rgba(225,6,0,.12);

  background:
    rgba(255,255,255,.09);
}

.select-wrap{
  position:relative;
}

.select-wrap::after{
  content:"⌄";

  position:absolute;

  top:50%;
  right:20px;

  transform:translateY(-52%);

  color:rgba(255,255,255,.88);

  font-size:22px;
  font-weight:700;

  pointer-events:none;

  opacity:.95;

  transition:
    transform .25s ease,
    opacity .25s ease;
}

.select-wrap:hover::after{
  transform:translateY(-52%) scale(1.08);
}

.select-wrap:focus-within::after{
  color:#ffffff;
  opacity:1;
}

.calories-form option{
  background:#0a0a0a;
  color:#ffffff;
}

.calorie-main-box{
  margin:28px 0 34px;
  padding:34px;

  border-radius:28px;

  border:1px solid rgba(255,255,255,.10);

  background:
    linear-gradient(
      145deg,
      rgba(225,6,0,.14),
      rgba(255,255,255,.03)
    );
}

.calorie-main-box span{
  display:block;

  margin-bottom:12px;

  color:rgba(255,255,255,.82);

  font-size:12px;
  font-weight:900;

  letter-spacing:.12em;
  text-transform:uppercase;
}

.calorie-main-box strong{
  display:block;

  color:var(--red-light);

  font-family:Anton,sans-serif;
  font-size:clamp(58px,7vw,96px);
  font-weight:400;

  line-height:.95;
}

.calorie-main-box small{
  display:block;

  margin-top:12px;

  color:rgba(255,255,255,.78);

  font-size:13px;
  font-weight:800;

  text-transform:uppercase;
}

.calorie-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;

  margin-bottom:30px;
}

.calorie-card{
  padding:26px 18px;

  border-radius:24px;

  border:1px solid rgba(255,255,255,.10);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.025)
    );

  text-align:center;
}

.calorie-icon{
  margin-bottom:14px;
  font-size:24px;
}

.calorie-card strong{
  display:block;

  margin-bottom:10px;

  color:#ffffff;

  font-family:Anton,sans-serif;
  font-size:34px;
  font-weight:400;
}

.calorie-card span{
  color:rgba(255,255,255,.74);

  font-size:11px;
  font-weight:900;

  letter-spacing:.08em;
  text-transform:uppercase;
}

.calorie-info-box{
  margin-top:10px;
}

.calorie-info-box h3{
  margin-bottom:18px;

  font-family:Anton,sans-serif;
  font-size:clamp(32px,5vw,54px);
  font-weight:400;

  line-height:1.05;
  text-transform:uppercase;
}

.calorie-info-box p{
  color:rgba(255,255,255,.9);
  line-height:1.8;
}

.calorie-extra-info{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;

  margin-top:34px;
}

.calorie-extra-info article{
  padding:22px;

  border-radius:22px;

  border:1px solid rgba(255,255,255,.10);

  background:
    rgba(255,255,255,.04);
}

.calorie-extra-info small{
  display:block;

  margin-bottom:10px;

  color:rgba(255,255,255,.65);

  font-size:11px;
  font-weight:900;

  letter-spacing:.08em;
  text-transform:uppercase;
}

.calorie-extra-info strong{
  color:#ffffff;

  font-family:Anton,sans-serif;
  font-size:34px;
  font-weight:400;
}

.calories-actions{
  margin-top:54px;
}

@media(max-width:980px){

  .calories-grid{
    grid-template-columns:1fr;
  }

  .calorie-cards{
    grid-template-columns:1fr;
  }

  .calorie-extra-info{
    grid-template-columns:1fr;
  }
}

/* ======================================================
   CALCULADORA DE MACROS PRO
====================================================== */

.macros-page-hero{
  overflow:hidden;
}

.macros-section{
  background:
    linear-gradient(
      180deg,
      #050505,
      #0b0b0d
    );
}

.macro-calories-box{
  margin-bottom:30px;
  padding:28px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(
      145deg,
      rgba(225,6,0,.12),
      rgba(255,255,255,.025)
    );
}

.macro-calories-box span{
  display:block;
  margin-bottom:10px;
  color:rgba(255,255,255,.82);
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.macro-calories-box strong{
  display:block;
  color:var(--red-light);
  font-family:Anton,sans-serif;
  font-size:clamp(56px,7vw,92px);
  font-weight:400;
  line-height:.95;
}

.macro-calories-box small{
  display:block;
  margin-top:10px;
  color:rgba(255,255,255,.78);
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
}

.macro-results--pro{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-bottom:34px;
}

.macro-results--pro article{
  padding:24px 18px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.075),
      rgba(255,255,255,.025)
    );
}

.macro-results--pro strong{
  display:block;
  margin-bottom:10px;
  color:#ffffff;
  font-family:Anton,sans-serif;
  font-size:clamp(38px,5vw,58px);
  font-weight:400;
  line-height:1;
}

.macro-results--pro span{
  display:block;
  color:rgba(255,255,255,.86);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.macro-results--pro small{
  display:block;
  margin-top:8px;
  color:rgba(255,255,255,.68);
  font-size:12px;
  font-weight:700;
}

.macro-bar{
  width:100%;
  height:8px;
  margin-top:18px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.08);
}

.macro-bar div{
  width:0;
  height:100%;
  border-radius:999px;
  background:
    linear-gradient(
      90deg,
      var(--red-light),
      var(--red)
    );
  transition:width .6s ease;
}

@media(max-width:700px){
  .macro-results--pro{
    grid-template-columns:1fr;
  }
}

/* SEPARACIÓN BOTONES MACROS */

.macros-section .imc-actions{
  margin-top:48px;
}

/* ======================================================
   SELECTS PREMIUM GLOBAL CALCULADORAS
====================================================== */

.select-wrap{
  position:relative;
}

.select-wrap select,
.imc-form select,
.calories-form select{
  width:100%;
  height:58px;

  padding:0 54px 0 18px;

  border:1px solid rgba(255,255,255,.12);
  outline:none;

  border-radius:18px;

  color:#ffffff;

  font-size:15px;
  font-weight:800;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.08),
      rgba(255,255,255,.035)
    );

  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;

  cursor:pointer;
}

.select-wrap::after{
  content:"▼";

  position:absolute;

  top:50%;
  right:20px;

  transform:translateY(-50%);

  color:#ffffff;

  font-size:18px;
  line-height:1;

  pointer-events:none;

  opacity:.95;
}

.select-wrap:hover::after{
  transform:translateY(-50%) scale(1.08);
}

.select-wrap:focus-within::after{
  color:#ff2a2a;
}

.select-wrap select:focus,
.imc-form select:focus,
.calories-form select:focus{
  border-color:rgba(225,6,0,.55);

  box-shadow:
    0 0 0 4px rgba(225,6,0,.12);
}

.select-wrap select option,
.imc-form select option,
.calories-form select option{
  background:#0a0a0a;
  color:#ffffff;
}

/* ======================================================
   PÁGINA CONTACTO
====================================================== */

.contact-page-hero{
  overflow:hidden;
}

.contact-hero-grid{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:34px;
  align-items:center;
}

.contact-hero-image{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 90px rgba(0,0,0,.38);
}

.contact-hero-image img{
  width:100%;
  height:100%;
  min-height:430px;
  object-fit:cover;
  transition:transform .85s ease, filter .85s ease;
}

.contact-hero-image:hover img{
  transform:scale(1.06);
  filter:contrast(1.08) saturate(1.08);
}

.contact-page-hero .hero-actions{
  margin-top:72px;
  gap:22px;
}


/* CONTACTO RÁPIDO */

.contact-fast-section{
  position:relative;
  overflow:hidden;
}

.contact-fast-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}

.contact-fast-card{
  position:relative;
  overflow:hidden;
  min-height:280px;
  padding:30px;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.075),
      rgba(255,255,255,.025)
    );
  transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

.contact-fast-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(
      circle at 20% 20%,
      rgba(225,6,0,.14),
      transparent 38%
    );
  opacity:0;
  transition:opacity .35s ease;
}

.contact-fast-card:hover{
  transform:translateY(-10px);
  border-color:rgba(225,6,0,.28);
  box-shadow:0 26px 70px rgba(0,0,0,.34);
}

.contact-fast-card:hover::before{
  opacity:1;
}

.contact-fast-card span,
.contact-fast-card h3,
.contact-fast-card p,
.contact-fast-card a{
  position:relative;
  z-index:2;
}

.contact-fast-card > span{
  display:block;
  margin-bottom:22px;
  font-size:36px;
}

.contact-fast-card h3{
  margin-bottom:14px;
  font-family:Anton,sans-serif;
  font-size:34px;
  font-weight:400;
  text-transform:uppercase;
}

.contact-fast-card p{
  color:rgba(255,255,255,.88);
  line-height:1.7;
}

.contact-fast-card a{
  display:inline-flex;
  margin-top:22px;
  color:#ff2a2a;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.contact-fast-card--disabled{
  opacity:.72;
}


/* FORMULARIO Y MAPA */

.contact-main-section{
  background:
    radial-gradient(
      circle at 15% 20%,
      rgba(225,6,0,.10),
      transparent 32%
    ),
    linear-gradient(
      180deg,
      #050505,
      #0b0b0d
    );
}

.contact-main-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  align-items:stretch;
}

.contact-form-card,
.contact-map-card{
  position:relative;
  overflow:hidden;
  padding:46px;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.11);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.085),
      rgba(255,255,255,.025)
    );
  box-shadow:0 30px 80px rgba(0,0,0,.32);
}

.contact-form-card h2,
.contact-map-card h2{
  margin-bottom:18px;
  font-family:Anton,sans-serif;
  font-size:clamp(42px,6vw,72px);
  font-weight:400;
  line-height:1.05;
  text-transform:uppercase;
}

.contact-form-card p,
.contact-map-card p{
  margin-bottom:28px;
  color:rgba(255,255,255,.9);
  line-height:1.8;
}

.contact-form{
  display:grid;
  gap:18px;
}

.contact-form label{
  display:grid;
  gap:10px;
  color:#ffffff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  outline:none;
  border-radius:18px;
  color:#ffffff;
  font-size:15px;
  font-weight:700;
  background:rgba(255,255,255,.06);
}

.contact-form input,
.contact-form select{
  height:56px;
  padding:0 18px;
}

.contact-form select{
  padding-right:54px;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
}

.contact-form textarea{
  min-height:140px;
  resize:vertical;
  padding:18px;
  font-family:Montserrat,Arial,sans-serif;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  border-color:rgba(225,6,0,.55);
  background:rgba(255,255,255,.085);
  box-shadow:0 0 0 4px rgba(225,6,0,.12);
}

.contact-form option{
  background:#0a0a0a;
  color:#ffffff;
}


/* MAPA VISUAL */

.contact-map-visual{
  position:relative;
  min-height:360px;
  margin-bottom:30px;
  overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(
      circle at center,
      rgba(225,6,0,.18),
      transparent 34%
    ),
    linear-gradient(
      135deg,
      #080808,
      #141414
    );
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.contact-map-visual::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:34px 34px;
  opacity:.55;
}

.contact-map-visual strong,
.contact-map-visual span{
  position:relative;
  z-index:2;
}

.contact-map-visual strong{
  font-family:Anton,sans-serif;
  font-size:clamp(52px,7vw,96px);
  font-weight:400;
  color:#ffffff;
}

.contact-map-visual span{
  margin-top:10px;
  color:rgba(255,255,255,.78);
  font-size:13px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.map-pulse{
  position:absolute;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#ff2a2a;
  box-shadow:0 0 0 10px rgba(225,6,0,.12);
}

.map-pulse--one{
  top:28%;
  left:32%;
}

.map-pulse--two{
  top:58%;
  left:52%;
}

.map-pulse--three{
  top:38%;
  right:26%;
}


/* FAQ */

.faq-grid{
  display:grid;
  gap:16px;
}

.faq-item{
  padding:24px 28px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.025)
    );
}

.faq-item summary{
  cursor:pointer;
  color:#ffffff;
  font-size:15px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.faq-item p{
  margin-top:18px;
  color:rgba(255,255,255,.86);
  line-height:1.75;
}


/* RESPONSIVE */

@media(max-width:980px){

  .contact-hero-grid,
  .contact-main-grid{
    grid-template-columns:1fr;
  }

  .contact-fast-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:650px){

  .contact-fast-grid{
    grid-template-columns:1fr;
  }

  .contact-form-card,
  .contact-map-card{
    padding:30px;
  }
}