@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;500;600;700;800;900&display=swap');
/* ============================================================
   Salva diCosta — capa de sitio sobre GeneratePress
   Header oscuro de marca + hero YouTube + footer propio.
   Paleta gym: naranja #FF6A00 / rojo #FF2338 sobre #05070c.
   ============================================================ */
:root{
  --o:#FF6A00; --a:#FFC400; --r:#FF2338; --g:#22E06B;
  --bg:#05070c; --card:#0e1119; --line:#232a3a; --ink:#f4f6fb; --mut:#9aa4b8;
  --grad:linear-gradient(135deg,#FF6A00,#FF2338);
}

/* ---- Fondo general oscuro ---- */
body{ background:var(--bg); color:var(--ink); }
.site-content, .content-area, #content{ background:var(--bg); }
a{ color:var(--o); }

/* ============================================================
   HEADER / NAV de GeneratePress -> oscuro de marca
   ============================================================ */
.site-header{
  background:#05070c !important;
  border-bottom:1px solid var(--line);
}
.inside-header{ padding-top:18px; padding-bottom:18px; }
.main-title a, .site-title a, .main-title{ color:#fff !important; font-weight:900 !important; letter-spacing:-.02em; }
.main-title a:hover{ color:var(--a) !important; }
.site-description{ color:var(--o) !important; font-weight:700; text-transform:uppercase; letter-spacing:.12em; font-size:.7rem; }

.main-navigation,
.main-navigation .inside-navigation{ background:#05070c !important; border-top:1px solid var(--line); }
.main-navigation .main-nav ul li a{ color:#e7ebf4 !important; font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:.86rem; }
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item a{ color:#fff !important; background:rgba(255,106,0,.16) !important; }
.main-navigation .menu-bar-item.sdc-yt > a{ background:var(--grad) !important; color:#fff !important; border-radius:10px; margin:6px; }
button.menu-toggle, .menu-toggle{ color:#fff !important; }

/* Oculta el título de la página en la portada (la tienda) */
.home .entry-header, .home .page-header, .home .entry-title{ display:none !important; }
.home .site-main > .entry, .home article.page{ border:0; padding-top:0; }
.home .entry-content{ margin-top:0; }

/* ============================================================
   HERO — foto original + texto HTML superpuesto (responsive)
   ============================================================ */
.sdc-hero{
  display:flex; width:100%; background:#05070c; overflow:hidden;
  min-height:clamp(440px,46vw,600px);
}
.sdc-hero-photo{
  flex:1 1 50%; position:relative; align-self:stretch;
  background-size:cover; background-position:center 20%; background-repeat:no-repeat;
}
.sdc-hero-photo::before{ /* funde el borde izquierdo de la foto con el panel oscuro */
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, #05070c 0%, rgba(5,7,12,.6) 12%, rgba(5,7,12,0) 34%);
}
.sdc-hero-photo::after{ /* acento naranja inferior */
  content:""; position:absolute; left:0; right:0; bottom:0; height:5px; background:var(--grad);
}
.sdc-hero-copy{
  flex:1 1 50%; display:flex; flex-direction:column; justify-content:center;
  padding:clamp(34px,5vw,64px) clamp(24px,5vw,60px);
  position:relative; z-index:2;
}
.sdc-hero-kicker{
  display:inline-block; position:relative; padding-left:52px; margin-bottom:14px;
  font-size:clamp(.72rem,1.4vw,.9rem); font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--o);
}
.sdc-hero-kicker::before{ content:""; position:absolute; left:0; top:50%; width:38px; height:3px; background:var(--o); }
.sdc-hero-h1{
  margin:0; color:#fff; font-weight:900; letter-spacing:-.02em; line-height:.95;
  font-size:clamp(2.8rem,8vw,6rem); text-transform:uppercase;
  text-shadow:0 6px 40px rgba(0,0,0,.5);
}
.sdc-hero-h1 span{ background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.sdc-hero-sub{ margin:.35em 0 0; font-size:clamp(1.2rem,3.4vw,2rem); font-weight:800; color:#fff; text-transform:uppercase; letter-spacing:-.01em; }
.sdc-hero-sub b{ color:var(--o); }
.sdc-hero-desc{ margin:.5em 0 0; color:#c7cede; font-size:clamp(.95rem,2vw,1.1rem); font-weight:600; }
.sdc-hero-cta{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:26px; }
.sdc-hero-btn{
  display:inline-flex; align-items:center; gap:8px; background:var(--grad); color:#fff !important;
  font-weight:900; text-transform:uppercase; letter-spacing:.02em; font-size:clamp(.9rem,2vw,1.05rem);
  padding:15px 26px; border-radius:14px; text-decoration:none;
  box-shadow:0 14px 34px -10px rgba(255,60,0,.6); transition:transform .15s, filter .15s;
}
.sdc-hero-btn:hover{ transform:translateY(-2px); filter:brightness(1.08); }
.sdc-hero-scroll{ color:#fff; font-weight:800; text-transform:uppercase; letter-spacing:.04em; font-size:.86rem; text-decoration:none; opacity:.9; }
.sdc-hero-scroll:hover{ color:var(--a); }

/* lead-in naranja hacia la tienda (barra full-width bajo el hero) */
.sdc-hero-lead-wrap{ width:100%; background:var(--grad); }
.sdc-hero-lead{
  display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap;
  line-height:1.2; text-decoration:none;
  color:#fff; padding:14px 20px; text-align:center;
}
.sdc-hero-lead span{ font-weight:700; font-size:1rem; }
.sdc-hero-lead b{ font-weight:900; text-transform:uppercase; letter-spacing:.03em; }
.sdc-hero-lead:hover b{ transform:translateY(2px); }

@media (max-width:820px){
  .sdc-hero{ flex-direction:column; min-height:0; }
  .sdc-hero-photo{ flex:none; width:100%; height:58vw; max-height:380px; background-position:center 18%; }
  .sdc-hero-photo::before{ background:linear-gradient(0deg, #05070c 0%, rgba(5,7,12,0) 42%); }
  .sdc-hero-copy{ flex:none; padding:clamp(28px,7vw,44px) clamp(22px,6vw,40px) clamp(32px,7vw,48px); }
}

/* La tienda va pegada al hero, sin hueco extra */
.home .entry-content > .sdc-wrap{ margin-top:0; }

/* Quita el marco blanco del contenedor de GeneratePress en la portada:
   contenido full-width y oscuro de borde a borde */
.home #content.site-content{ padding:0 !important; }
.home .content-area,
.home #primary,
.home .site-main{
  background:transparent !important; padding:0 !important; margin:0 !important;
  width:100% !important; max-width:100% !important;
}
.home .site-content > .container,
.home .site-content > .grid-container{ max-width:100% !important; padding:0 !important; }
.home article,
.home .inside-article,
.home .entry-content{
  background:transparent !important; padding:0 !important; margin:0 !important;
  border:0 !important; box-shadow:none !important;
}
/* limita el ancho útil de la rejilla en pantallas muy grandes, centrado */
.home .sdc-wrap{ max-width:1360px; margin-left:auto; margin-right:auto; }

/* ============================================================
   FOOTER propio
   ============================================================ */
.sdc-foot{
  background:linear-gradient(180deg,#0b0e16,#05070c);
  border-top:1px solid var(--line);
  color:var(--ink);
  padding:clamp(34px,5vw,60px) clamp(18px,5vw,60px) 26px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.sdc-foot-in{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:34px; align-items:start;
}
.sdc-foot-brand{ display:flex; gap:16px; align-items:flex-start; }
.sdc-foot-brand img{
  width:74px; height:74px; border-radius:50%; object-fit:cover; flex:none;
  border:3px solid var(--o); box-shadow:0 0 0 4px rgba(255,106,0,.16);
}
.sdc-foot-name{ display:block; font-size:1.35rem; font-weight:900; color:#fff; letter-spacing:-.01em; }
.sdc-foot-tag{ display:block; font-size:.74rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--o); margin:3px 0 8px; }
.sdc-foot-brand p{ margin:0; color:var(--mut); font-size:.92rem; max-width:38ch; }

.sdc-foot-h{ display:block; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.14em; color:var(--a); margin-bottom:14px; }
.sdc-foot-links{ display:flex; flex-direction:column; gap:10px; }
.sdc-foot-links a{ color:#dfe4ee; text-decoration:none; font-weight:600; font-size:.95rem; }
.sdc-foot-links a:hover{ color:var(--o); }

.sdc-foot-icons{ display:flex; gap:12px; margin-bottom:16px; }
.sdc-foot-icons a{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center;
  background:var(--card); border:1px solid var(--line); transition:transform .15s,border-color .15s,background .15s;
}
.sdc-foot-icons a:hover{ transform:translateY(-3px); border-color:var(--o); background:rgba(255,106,0,.12); }
.sdc-foot-icons svg{ width:22px; height:22px; fill:#fff; }
.sdc-foot-icons a.yt:hover svg{ fill:#FF3D3D; }
.sdc-foot-icons a.ig:hover svg{ fill:#E1306C; }
.sdc-foot-sub{
  display:inline-block; background:var(--grad); color:#fff !important; text-decoration:none;
  font-weight:900; text-transform:uppercase; letter-spacing:.02em; font-size:.82rem;
  padding:11px 16px; border-radius:12px; box-shadow:0 10px 24px -10px rgba(255,60,0,.6);
}
.sdc-foot-sub:hover{ filter:brightness(1.08); }

.sdc-foot-legal{
  max-width:1180px; margin:30px auto 0; padding-top:20px; border-top:1px solid var(--line);
  color:var(--mut); font-size:.78rem; text-align:center;
}

/* Barra de copyright de GeneratePress */
.site-info{ background:#05070c !important; border-top:1px solid var(--line); color:var(--mut) !important; }
.site-info a, .sdc-copy{ color:var(--mut) !important; }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:900px){
  .sdc-foot-in{ grid-template-columns:1fr 1fr; }
  .sdc-foot-brand{ grid-column:1 / -1; }
}
@media (max-width:600px){
  .sdc-foot-in{ grid-template-columns:1fr; gap:26px; }
  .sdc-hero-lead span{ font-size:.9rem; }
  .sdc-hero-lead{ padding:12px 14px; }
}

/* ============================================================
   Enlaces legales del footer + pulido profesional
   ============================================================ */
.sdc-foot-legal-links{
  max-width:1180px; margin:14px auto 0; display:flex; gap:14px 26px; flex-wrap:wrap; justify-content:center;
}
.sdc-foot-legal-links a{ color:#7d8598; font-size:.8rem; text-decoration:none; }
.sdc-foot-legal-links a:hover{ color:var(--o); }

/* Header pegajoso (sensación pro) */
.site-header{ position:sticky; top:0; z-index:60; }
.admin-bar .site-header{ top:32px; }
@media (max-width:782px){ .admin-bar .site-header{ top:46px; } }

/* CTA primaria del hero (Ver mi equipo) bien destacada, secundaria discreta */
.sdc-hero-cta .sdc-hero-scroll{ opacity:.92; }
.sdc-hero-cta .sdc-hero-scroll:hover{ opacity:1; }

/* La rejilla respira un poco más */
.sdc-grid{ gap:24px; }

/* ============================================================
   Tipografías premium (Inter cuerpo + Anton titulares) + aire
   ============================================================ */
body, .sdc-wrap, .sdc-foot, .site-header, .main-navigation,
.sdc-hero, button, input, select, textarea{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}
.sdc-hero-h1, .sdc-banner-title{
  font-family:'Anton', 'Inter', sans-serif; font-weight:400 !important;
  letter-spacing:.01em; line-height:.92;
}
.main-title a, .site-title a, .sdc-h2, .sdc-card-title,
.sdc-hero-sub, .sdc-foot-name, h1, h2, h3{
  font-family:'Inter', sans-serif;
}
body{ -webkit-font-smoothing:antialiased; letter-spacing:-.005em; }

/* Más márgenes laterales (que respire y se lea bien) */
.sdc-hero-copy{ padding:clamp(40px,5vw,74px) clamp(30px,6vw,90px) !important; }
.sdc-hero-lead{ padding:16px clamp(24px,5vw,56px); }
.sdc-wrap{ padding-left:clamp(22px,5vw,56px) !important; padding-right:clamp(22px,5vw,56px) !important; }
.home .sdc-wrap{ max-width:1300px; }
.sdc-foot, .sdc-foot-in{ padding-left:clamp(22px,5vw,40px); padding-right:clamp(22px,5vw,40px); }

/* Que se le vea más entero en el hero (menos barras arriba, más cuerpo) */
.sdc-hero{ min-height:clamp(470px,48vw,650px); }
.sdc-hero-photo{ background-position:center 35% !important; }
@media (max-width:820px){
  .sdc-hero-photo{ background-position:center 26% !important; height:66vw; max-height:440px; }
}

/* ============================================================
   Hero v2: foto MÁS grande y protagonista + más margen lateral
   ============================================================ */
.sdc-hero{ min-height:clamp(500px,53vw,720px) !important; }
.sdc-hero-photo{ flex:1 1 58% !important; background-position:center 32% !important; }
.sdc-hero-copy{
  flex:1 1 42% !important;
  padding:clamp(44px,6vw,100px) clamp(36px,6vw,112px) !important;
}
/* un poco más de aire lateral en toda la tienda */
.sdc-wrap{ padding-left:clamp(24px,6vw,72px) !important; padding-right:clamp(24px,6vw,72px) !important; }

@media (max-width:820px){
  .sdc-hero-photo{ flex:none !important; height:72vw !important; max-height:500px !important; background-position:center 24% !important; }
  .sdc-hero-copy{ flex:none !important; padding:clamp(32px,8vw,50px) clamp(24px,7vw,40px) !important; }
}