/*
 Theme Name: GeneratePress Child
 Theme URI: https://autoescaner.com
 Description: Tema hijo de GeneratePress con Material Design 3 y landing a ancho completo
 Author: Tu nombre
 Author URI: https://autoescaner.com
 Template: generatepress
 Version: 1.0.0
*/

/* ===== Material Design 3 – Variables ===== */
:root{
  --md-primary:#6750a4;
  --md-primary-light:#eaddff;
  --md-primary-dark:#21005d;

  --md-secondary:#625b71;
  --md-background:#fef7ff;
  --md-surface:#ffffff;
  --md-error:#b3261e;

  --md-on-primary:#ffffff;
  --md-on-secondary:#ffffff;
  --md-on-background:#1c1b1f;
  --md-on-surface:#1c1b1f;
  --md-on-error:#ffffff;

  --md-radius:16px;
  --md-shadow:0 4px 10px rgba(0,0,0,.10);
  --md-transition:.25s ease-in-out;
}

/* ===== Resets suaves / anti scroll horizontal ===== */
html,body{max-width:100%;overflow-x:hidden;}
*{box-sizing:border-box;}
img,video,svg{max-width:100%;height:auto;display:block;}
body{
  font-family:'Roboto',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:var(--md-background);
  color:var(--md-on-background);
  margin:0;
}

/* ===== Fuerza home sin sidebar en GeneratePress ===== */
.home .sidebar,
.home .is-right-sidebar,
.home .is-left-sidebar{display:none!important;}
.home .content-area{width:100%!important;}
.home .inside-article{background:transparent;padding:0;box-shadow:none;}
.one-container .site-content{padding:0;}
.separate-containers .site-main{padding:0;}

/* ===== Sección genérica ===== */
section{width:100%;max-width:1200px;margin:0 auto;padding:2rem;}
h1,h2,h3,h4,h5,h6{font-weight:500;letter-spacing:-.25px;margin:0 0 16px;}
a{color:var(--md-primary);text-decoration:none;transition:var(--md-transition);}
a:hover{color:var(--md-primary-dark);}

/* ===== Botones MD3 ===== */
.md-button,
button,
input[type="submit"],
.wp-block-button__link{
  display:inline-block;
  background:var(--md-primary);
  color:var(--md-on-primary);
  padding:12px 22px;
  border:none;
  border-radius:24px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.4px;
  box-shadow:var(--md-shadow);
  transition:var(--md-transition);
  cursor:pointer;
}
.md-button:hover,
button:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover{background:var(--md-primary-dark);}
.md-button--outline{
  background:transparent;color:var(--md-on-surface);
  border:2px solid var(--md-primary);box-shadow:none;
}
.md-button--accent{background:#ffca28;color:#000;}
.md-button--accent:hover{background:#ffb300;color:#fff;}

/* ===== HERO ===== */
.hero{
  display:flex;align-items:center;justify-content:space-between;gap:32px;
  padding:60px 20px;
  background:linear-gradient(135deg,#7e57c2,#5c6bc0);
  color:var(--md-on-primary);
}
.hero-content{flex:1;min-width:260px;}
.hero h1{font-size:clamp(2rem,3.6vw,2.9rem);margin:0 0 12px;}
.hero p{font-size:1.1rem;opacity:.95;margin:0 0 22px;}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;}
.hero-bullets{margin:18px 0 0;padding:0;list-style:none;opacity:.9}
.hero-bullets li{margin:.25rem 0}
.hero-image{flex:1;min-width:260px;}
.hero-image img{border-radius:12px;box-shadow:var(--md-shadow);}

/* ===== Containers / grids ===== */
.container{max-width:1200px;margin:60px auto;padding:20px;}
.container h2{text-align:center;margin-bottom:32px;font-size:clamp(1.6rem,2.5vw,2rem);}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}

/* ===== Card ===== */
.card{
  background:var(--md-surface);border-radius:var(--md-radius);
  box-shadow:var(--md-shadow);padding:24px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:0 8px 16px rgba(0,0,0,.15)}
.card img{width:56px;height:auto;margin-bottom:12px}

/* ===== Testimonios ===== */
.testimonials{background:#f6f6fb;padding:60px 0}
.testi-wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.testi blockquote{font-style:italic;color:#3f3f3f;margin:0 0 8px}

/* ===== Newsletter ===== */
.newsletter{text-align:center}
.newsletter p{margin:0 auto 16px;max-width:640px}

/* ===== CTA final ===== */
.cta{padding:80px 20px;text-align:center;background:linear-gradient(135deg,#5c6bc0,#3949ab);color:#fff}
.cta .md-button{margin-top:12px}
.cta-image{max-width:680px;margin:26px auto 0}

/* ===== Responsive ===== */
@media (max-width: 900px){
  .hero{flex-direction:column;text-align:center}
  .hero-content{max-width:720px;margin:0 auto}
}