/* Team Caro · Offer Pages Premium V1
   Shared presentation layer for programa.html and club.html. */

:root:not([data-theme="dark"]){
  --ground:#ebe7de;
  --surface:#f7f4ed;
  --surface-2:#e4ded3;
  --inset:#efe9df;
  --line:rgba(54,44,32,.12);
  --line-soft:rgba(54,44,32,.07);
  --text:#211d18;
  --text-mut:#665d53;
  --text-dim:#91877b;
  --bronze:#9b6c2e;
  --bronze-br:#b48343;
  --steel:#596171;
  --good:#47775a;
  --btn-text:#fffaf2;
}
body{background:linear-gradient(180deg,#efede7 0%,#e8e4db 100%)}
.wrap{max-width:1120px;padding:0 28px}
header.bar{
  padding:16px clamp(20px,4vw,54px);
  border-bottom:1px solid rgba(255,255,255,.12);
  background:rgba(24,21,17,.80);
  color:#f7f3eb;
  backdrop-filter:blur(18px);
}
header .brand{font-size:10.5px;letter-spacing:.30em}
header .brand .dot{width:7px;height:7px;background:#d0a66c;box-shadow:none}
header .btn{padding:10px 17px;border-radius:999px;background:#a97638;border-color:#a97638;color:#fffaf2;font-size:11px}

.hero{
  min-height:640px;
  padding:0;
  display:flex;
  align-items:flex-end;
  text-align:left;
  color:#fff;
  background:#17140f;
}
.hero::before{
  inset:0;
  background:
    linear-gradient(90deg,rgba(19,17,13,.94) 0%,rgba(19,17,13,.80) 42%,rgba(19,17,13,.35) 74%,rgba(19,17,13,.08) 100%),
    linear-gradient(0deg,rgba(19,17,13,.60),transparent 45%),
    url('/assets/home/home-hero.webp') 68% 34%/cover no-repeat;
}
body:has(#precio) .hero::before{
  background:
    linear-gradient(90deg,rgba(19,17,13,.95) 0%,rgba(19,17,13,.82) 42%,rgba(19,17,13,.40) 74%,rgba(19,17,13,.12) 100%),
    linear-gradient(0deg,rgba(19,17,13,.60),transparent 48%),
    url('/assets/home/lifecycle-bg.webp') 54% 44%/cover no-repeat;
}
.hero .wrap{width:100%;padding-top:160px;padding-bottom:58px}
.hero .eyebrow{color:#dfbd89;font-size:9.5px;letter-spacing:.24em}
.hero h1{
  max-width:880px;
  margin:16px 0 19px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:clamp(56px,7vw,92px);
  line-height:.91;
  letter-spacing:-.045em;
  text-transform:none;
  color:#fff;
}
.hero .lead{
  max-width:56ch;
  margin:0 0 28px;
  color:rgba(255,255,255,.72);
  font-size:17px;
  line-height:1.68;
}
.hero .cta-row{justify-content:flex-start;gap:11px}
.hero .btn{border-radius:999px;padding:14px 23px;font-size:12px}
.hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.04)}
.hero .btn.ghost:hover{background:rgba(255,255,255,.10)}
.hero .plazas,.hero .note{color:rgba(255,255,255,.47);font-size:9.5px;letter-spacing:.10em}
.hero a[style]{color:#ddb77e!important;border-bottom-color:rgba(221,183,126,.35)!important;font-size:12px!important}

section{padding:95px 0;border-bottom:1px solid rgba(55,45,33,.09)}
.sec-eyebrow{font-size:9.5px;letter-spacing:.21em;color:#9c6e33}
.sec-title{
  margin-bottom:12px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:clamp(39px,5vw,61px);
  line-height:.98;
  letter-spacing:-.035em;
  text-transform:none;
  color:#2a241e;
}
.sec-sub{max-width:60ch;margin:0 auto 40px;color:#6b6258;font-size:15.5px;line-height:1.68}

/* Opening problem statement becomes a manifesto. */
.pain{
  padding:38px 40px;
  border:0;
  border-radius:23px;
  background:#1c1915;
  color:#fff;
  box-shadow:0 34px 82px -56px rgba(42,30,18,.68);
}
.pain ul{grid-template-columns:1fr 1fr;gap:0;border-top:1px solid rgba(255,255,255,.12)}
.pain li{
  min-height:88px;
  padding:20px 25px 20px 0;
  border-bottom:1px solid rgba(255,255,255,.11);
  color:rgba(255,255,255,.67);
  font-family:Georgia,'Times New Roman',serif;
  font-size:17px;
  line-height:1.5;
}
.pain li:nth-child(even){padding-left:25px;border-left:1px solid rgba(255,255,255,.11)}
.pain li::before{color:#d2aa70;font-family:'IBM Plex Mono',monospace;font-size:10px}
.pain .turn{
  margin-top:26px;
  padding-top:0;
  border-top:0;
  font-family:Georgia,'Times New Roman',serif;
  font-size:22px;
  line-height:1.5;
  color:#f5f0e8;
}
.pain .turn b{color:#dab67e;font-weight:400}

/* Steps = editorial timeline. */
.steps{gap:0;border-top:1px solid rgba(55,45,33,.11)}
.step{
  min-height:126px;
  padding:25px 0;
  gap:25px;
  border:0;
  border-bottom:1px solid rgba(55,45,33,.11);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.step .no{
  width:58px;
  height:auto;
  border:0;
  border-radius:0;
  background:transparent;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:39px;
  color:#a8793c;
}
.step h3{
  margin-bottom:7px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:23px;
  text-transform:none;
  color:#302a23;
}
.step p{max-width:70ch;color:#6c6359;font-size:14px;line-height:1.62}

/* Includes = joined magazine grid. */
.incl{grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(55,45,33,.11);border-left:1px solid rgba(55,45,33,.11)}
.icard{
  min-height:215px;
  padding:29px 26px;
  border:0;
  border-right:1px solid rgba(55,45,33,.11);
  border-bottom:1px solid rgba(55,45,33,.11);
  border-radius:0;
  background:#f4f0e8;
  box-shadow:none;
}
.icard .ic{font-size:20px;margin-bottom:17px;filter:grayscale(.18)}
.icard h3{
  margin-bottom:9px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:20px;
  text-transform:none;
  color:#312b24;
}
.icard p{color:#6c6359;font-size:14px;line-height:1.62}

/* Qualification split. */
.two{gap:1px;background:rgba(55,45,33,.11);border:1px solid rgba(55,45,33,.11)}
.forcard{
  padding:34px 32px;
  border:0;
  border-radius:0;
  background:#f5f1e9;
  box-shadow:none;
}
.forcard.yes{background:#eee6d9}
.forcard h3{
  margin-bottom:19px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:25px;
  text-transform:none;
}
.forcard ul{gap:0;border-top:1px solid rgba(55,45,33,.09)}
.forcard li{padding:13px 0;border-bottom:1px solid rgba(55,45,33,.08);color:#61584f;font-size:14px;line-height:1.55}
.forcard li a{color:#93662d!important;font-weight:500!important}

/* Coach block on 1:1 offer. */
.coach{
  gap:0;
  padding:0;
  overflow:hidden;
  flex-wrap:nowrap;
  border:0;
  border-radius:23px;
  background:#1c1915;
  color:#fff;
  box-shadow:0 34px 82px -56px rgba(42,30,18,.68);
}
.coach img,.coach .mono{
  width:35%;
  height:360px;
  border-radius:0;
  object-fit:cover;
  object-position:center top;
  flex:none;
}
.coach .ct{padding:38px 40px;min-width:0}
.coach h3{
  margin-bottom:12px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:31px;
  text-transform:none;
  color:#fff;
}
.coach p{max-width:54ch;color:rgba(255,255,255,.64);font-size:15px;line-height:1.68}

/* Club price card = one strong membership object. */
#precio{background:#e9e3d9}
.plans{max-width:520px}
.plan,
.plan.feat{
  padding:40px 36px 36px;
  border:1px solid rgba(154,108,46,.23);
  border-radius:23px;
  background:linear-gradient(145deg,#faf7ef 0%,#eee4d5 100%);
  box-shadow:0 32px 78px -58px rgba(47,34,20,.50);
}
.plan .ptag{top:20px;left:24px;transform:none;border-radius:999px;background:#9c6d31;color:#fff;font-size:8.5px;letter-spacing:.15em}
.plan h3{margin:36px 0 13px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;font-weight:500;letter-spacing:.15em;color:#81766a}
.plan .price{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:76px;letter-spacing:-.05em;color:#28221c}
.plan .per{font-size:9.5px;letter-spacing:.09em;color:#8b8074}
.plan .save{margin-top:17px;color:#6b6258;font-size:13px;font-weight:400}
.plan .btn{border-radius:999px;box-shadow:none;font-size:12px}

/* FAQs */
.faq,body:not(:has(#precio)) section details{box-shadow:none}
.faq{gap:0;border-top:1px solid rgba(55,45,33,.11)}
details{
  padding:0;
  border:0;
  border-bottom:1px solid rgba(55,45,33,.11);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
details summary{
  padding:21px 0;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:19px;
  text-transform:none;
  color:#302a23;
}
details .a,.faq .a{max-width:72ch;padding:0 0 23px;color:#6c6359;line-height:1.64}

.final{
  position:relative;
  overflow:hidden;
  padding:72px 52px;
  border:0;
  border-radius:25px;
  color:#fff;
  background:#17140f;
  box-shadow:0 38px 88px -56px rgba(41,30,18,.68);
}
.final::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(20,17,13,.92),rgba(20,17,13,.45)),
    url('/assets/home/home-detail.webp') center/cover no-repeat;
}
.final>*{position:relative}
.final .eyebrow{color:#dcb77e!important;font-size:9.5px}
.final h2{
  max-width:15ch;
  margin:0 auto 14px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:clamp(39px,5vw,61px);
  line-height:.98;
  letter-spacing:-.035em;
  text-transform:none;
  color:#fff;
}
.final p{max-width:49ch;color:rgba(255,255,255,.68);font-size:15px;line-height:1.66}
.final .btn{border-radius:999px;box-shadow:none;font-size:12px}
footer{padding:36px 20px 48px;background:#15130f;color:rgba(255,255,255,.44)}
footer a{color:rgba(255,255,255,.52)}

@media(max-width:760px){
  .wrap{padding:0 20px}
  header.bar{padding:13px 17px}
  .hero{min-height:700px}
  .hero::before,
  body:has(#precio) .hero::before{
    background:
      linear-gradient(0deg,rgba(19,17,13,.94) 0%,rgba(19,17,13,.64) 45%,rgba(19,17,13,.08) 82%),
      url('/assets/home/home-hero-mobile.webp') 50% 18%/cover no-repeat;
  }
  .hero .wrap{padding-top:295px;padding-bottom:44px}
  .hero h1{font-size:clamp(49px,14vw,72px)}
  .hero .lead{font-size:15px}
  section{padding:72px 0}
  .pain{padding:28px 22px;border-radius:20px}
  .pain ul{grid-template-columns:1fr}
  .pain li,.pain li:nth-child(even){min-height:0;padding:16px 0;border-left:0}
  .pain .turn{font-size:19px}
  .incl{grid-template-columns:1fr;border-left:0}
  .icard{min-height:0;padding:24px 0;border-right:0;background:transparent}
  .two{grid-template-columns:1fr}
  .forcard{padding:29px 22px}
  .coach{display:block}
  .coach img,.coach .mono{width:100%;height:330px}
  .coach .ct{padding:29px 24px 33px}
  .final{padding:54px 24px;border-radius:21px}
}
