@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,900|Droid+Serif:400,700|Nunito:400,600,700,800&display=swap");

:root{
  --navy:#0b1f46;
  --navy2:#10285a;
  --blue:#262a7a;
  --bright:#2176ff;

  --orange:#f58a1f;

  --text:#101828;
  --muted:#667085;
  --line:#e4e7ec;

  --bg:#f5f6f8;
  --white:#fff;
}

*{
  box-sizing:border-box;
}

body{
  margin:0;

  background:var(--bg);

  color:var(--text);

  font-family:
    "Source Sans Pro",
    sans-serif;
}

.container{
  width:min(1180px,calc(100% - 42px));

  margin:0 auto;
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header{
  background:#fff;

  border-bottom:
    1px solid
    #eceef2;
}

.header-inner{
  width:min(1180px,calc(100% - 42px));

  min-height:88px;

  margin:0 auto;

  display:flex;
  align-items:center;

  gap:28px;
}

.brand{
  flex:0 0 auto;

  text-decoration:none;
}

.brand-logo{
  display:block;

  max-width:230px;
  max-height:48px;
}

.brand-fallback{
  display:none;

  color:#111;

  font-size:22px;

  font-weight:900;

  letter-spacing:.12em;
}

.brand-fallback span{
  font-weight:400;
}

.main-nav{
  display:flex;

  gap:34px;

  margin-left:auto;

  align-items:center;
}

.main-nav a{
  color:#16213b;

  font-size:13px;

  font-weight:600;

  letter-spacing:.08em;

  text-decoration:none;
}

.main-nav a:hover{
  color:var(--bright);
}

.header-cta{
  min-height:40px;

  display:inline-flex;

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

  padding:0 18px;

  border-radius:5px;

  background:var(--bright);

  color:#fff;

  font-size:12px;

  font-weight:700;

  letter-spacing:.07em;

  text-decoration:none;
}


/* =========================================================
   HERO
   ========================================================= */

.hero{
  padding:
    78px 0
    86px;

  background:
    linear-gradient(
      180deg,
      #f9fbfd 0%,
      #ffffff 100%
    );
}

.hero-inner{
  max-width:970px;

  text-align:center;
}

.hero h1{
  margin:0;

  font-family:
    "Droid Serif",
    serif;

  color:#111;

  font-size:58px;

  line-height:1.05;

  font-weight:700;

  letter-spacing:-.025em;
}

.hero h1 span{
  display:block;

  color:var(--blue);
}

.hero-subtitle{
  margin:
    30px 0
    0;

  font-size:21px;

  line-height:1.4;
}

.hero-support{
  margin:
    23px 0
    0;

  font-size:18px;

  font-weight:700;

  line-height:1.45;
}

.hero-button{
  display:inline-flex;

  margin-top:34px;

  min-height:54px;

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

  padding:0 27px;

  border-radius:5px;

  background:var(--bright);

  color:#fff;

  font-size:13px;

  font-weight:800;

  letter-spacing:.06em;

  text-decoration:none;
}

.hero-small{
  margin-top:19px;

  color:#6a6e78;

  font-size:12px;

  line-height:1.5;
}


/* =========================================================
   DARK SECTIONS
   ========================================================= */

.dark-section{
  padding:78px 0;

  background:var(--navy);

  color:#fff;
}

.section-kicker{
  margin-bottom:10px;

  color:var(--blue);

  font-size:11px;

  font-weight:800;

  letter-spacing:.10em;
}

.section-kicker.light{
  color:#8eadff;
}


/* =========================================================
   PHILOSOPHY
   ========================================================= */

.philosophy-wrap{
  display:grid;

  grid-template-columns:
    1fr 1fr;

  gap:62px;

  align-items:start;
}

.philosophy-copy h2{
  margin:
    0 0
    17px;

  font-family:
    "Droid Serif",
    serif;

  font-size:42px;

  line-height:1.15;
}

.philosophy-copy p{
  margin:0;

  color:#d5deec;

  font-size:16px;

  line-height:1.65;
}

.philosophy-list{
  display:grid;

  gap:13px;
}

.philosophy-item{
  display:flex;

  gap:14px;

  padding:17px 18px;

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

  border-radius:12px;

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

.check{
  flex:0 0 26px;

  width:26px;
  height:26px;

  display:flex;

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

  border-radius:50%;

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

  font-size:12px;

  font-weight:800;
}

.philosophy-item strong{
  display:block;

  margin-bottom:4px;

  font-size:14px;
}

.philosophy-item span{
  display:block;

  color:#c9d3e3;

  font-size:12px;

  line-height:1.5;
}


/* =========================================================
   GENERAL WHITE SECTIONS
   ========================================================= */

.section{
  padding:78px 0;
}

.white{
  background:#fff;
}

.section-heading{
  max-width:800px;

  margin-bottom:36px;
}

.section-heading.centered{
  margin-left:auto;
  margin-right:auto;

  text-align:center;
}

.section-heading h2,
.two-col h2,
.founder-copy h2{
  margin:
    0 0
    14px;

  font-family:
    "Droid Serif",
    serif;

  font-size:40px;

  line-height:1.15;

  letter-spacing:-.02em;
}

.section-heading p,
.two-col p,
.founder-copy p{
  color:var(--muted);

  font-size:15px;

  line-height:1.65;
}


/* =========================================================
   PROGRAMS
   ========================================================= */

.program-grid{
  display:grid;

  grid-template-columns:
    1fr 1fr;

  gap:22px;
}

.program-card{
  padding:32px;

  border-radius:16px;

  border:
    1px solid
    #dfe3ef;

  background:
    #f7f8ff;
}

.program-card.orca{
  border-color:#ffd7ad;

  background:#fff8ee;
}

.program-label{
  display:inline-block;

  padding:
    6px 9px;

  border-radius:999px;

  background:#e7eaff;

  color:var(--blue);

  font-size:10px;

  font-weight:800;

  letter-spacing:.08em;
}

.program-label.orange{
  background:#ffe8d0;

  color:#a85100;
}

.program-top h3{
  margin:
    17px 0
    9px;

  font-family:
    "Droid Serif",
    serif;

  font-size:30px;
}

.program-top p{
  margin:0;

  color:var(--muted);

  font-size:14px;

  line-height:1.6;
}

.program-facts{
  display:grid;

  grid-template-columns:
    1fr 1fr;

  gap:10px;

  margin:
    24px 0;
}

.program-facts div{
  padding:13px;

  border-radius:10px;

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

.program-facts span{
  display:block;

  color:#808896;

  font-size:10px;
}

.program-facts strong{
  display:block;

  margin-top:4px;

  font-size:14px;
}

.program-button{
  display:inline-flex;

  min-height:44px;

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

  padding:0 18px;

  border-radius:6px;

  color:#fff;

  font-size:12px;

  font-weight:800;

  text-decoration:none;
}

.program-button.blue{
  background:var(--blue);
}

.program-button.orange-button{
  background:var(--orange);
}


/* =========================================================
   TWO COL
   ========================================================= */

.two-col{
  display:grid;

  grid-template-columns:
    1fr 1fr;

  gap:58px;

  align-items:center;
}

.dark-section .two-col h2{
  color:#fff;
}

.dark-section .two-col p{
  color:#d5deec;
}

.dark-button{
  display:inline-flex;

  margin-top:16px;

  min-height:46px;

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

  padding:0 20px;

  border-radius:6px;

  background:#fff;

  color:var(--navy);

  font-size:12px;

  font-weight:800;

  text-decoration:none;
}

.results-preview{
  padding:23px;

  border-radius:15px;

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

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

.results-head{
  color:#99b8ff;

  font-size:10px;

  font-weight:800;

  letter-spacing:.10em;
}

.mock-chart{
  position:relative;

  height:240px;

  margin-top:12px;

  overflow:hidden;

  border-radius:10px;

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

.chart-grid{
  position:absolute;

  inset:0;

  background-image:
    linear-gradient(
      rgba(255,255,255,.06) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.05) 1px,
      transparent 1px
    );

  background-size:
    100% 55px,
    80px 100%;
}

.mock-chart svg{
  position:absolute;

  inset:0;

  width:100%;
  height:100%;
}

.strategy-path{
  fill:none;

  stroke:#4fb5ff;

  stroke-width:5;
}

.benchmark-path{
  fill:none;

  stroke:#8d9caf;

  stroke-width:3;

  stroke-dasharray:8 8;
}

.results-caption{
  margin-top:10px;

  color:#c5cede;

  font-size:11px;
}


/* =========================================================
   PLANNER
   ========================================================= */

.planner-preview{
  padding:26px;

  border:
    1px solid
    var(--line);

  border-radius:15px;

  background:#f7f8fa;
}

.planner-row{
  display:flex;

  justify-content:space-between;

  gap:20px;

  padding:13px 0;

  border-bottom:
    1px solid
    var(--line);

  font-size:13px;
}

.planner-row span{
  color:var(--muted);
}

.planner-divider{
  height:8px;

  margin:
    24px 0
    15px;

  border-radius:999px;

  background:
    linear-gradient(
      90deg,
      var(--blue) 0 65%,
      #e4e7ec 65%
    );
}

.planner-copy{
  color:#596170;

  font-size:12px;

  line-height:1.5;
}

.simple-button{
  display:inline-flex;

  margin-top:15px;

  min-height:44px;

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

  padding:0 19px;

  border-radius:6px;

  background:var(--bright);

  color:#fff;

  font-size:12px;

  font-weight:800;

  text-decoration:none;
}


/* =========================================================
   FOUNDER
   ========================================================= */

.founder-section{
  padding:78px 0;

  background:#eef1f5;
}

.founder-grid{
  display:grid;

  grid-template-columns:
    .8fr 1.2fr;

  gap:54px;

  align-items:center;
}

.founder-photo-wrap{
  min-height:370px;

  overflow:hidden;

  border-radius:16px;

  background:#dfe3ea;
}

.founder-photo{
  width:100%;

  height:100%;

  min-height:370px;

  object-fit:cover;

  display:block;
}

.text-link{
  display:inline-block;

  margin-top:10px;

  color:var(--blue);

  font-size:12px;

  font-weight:800;

  text-decoration:none;
}


/* =========================================================
   NEWSLETTER
   ========================================================= */

.newsletter-section{
  padding:78px 0;

  background:#fff;
}

.newsletter{
  display:flex;

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

  gap:34px;

  padding:
    40px 42px;

  border-radius:18px;

  background:var(--navy);

  color:#fff;
}

.newsletter-kicker{
  color:#8eadff;

  font-size:10px;

  font-weight:800;

  letter-spacing:.10em;
}

.newsletter h2{
  margin:
    8px 0
    9px;

  font-family:
    "Droid Serif",
    serif;

  font-size:30px;

  line-height:1.2;
}

.newsletter p{
  max-width:760px;

  margin:0;

  color:#d4ddec;

  font-size:14px;

  line-height:1.6;
}

.newsletter-button{
  flex:0 0 auto;

  min-height:48px;

  display:inline-flex;

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

  padding:0 22px;

  border-radius:7px;

  background:var(--bright);

  color:#fff;

  font-size:12px;

  font-weight:800;

  text-decoration:none;
}


/* =========================================================
   FOOTER
   ========================================================= */

.site-footer{
  padding:
    40px 0
    22px;

  background:#07172f;

  color:#fff;
}

.footer-top{
  display:flex;

  justify-content:space-between;

  align-items:flex-start;

  gap:30px;
}

.footer-brand{
  font-size:14px;

  font-weight:800;

  letter-spacing:.08em;
}

.footer-links{
  display:flex;

  flex-wrap:wrap;

  justify-content:flex-end;

  gap:18px;
}

.footer-links a{
  color:#c2ccda;

  font-size:10px;

  letter-spacing:.05em;

  text-decoration:none;
}

.footer-bottom{
  margin-top:28px;

  padding-top:16px;

  border-top:
    1px solid
    rgba(255,255,255,.09);

  color:#7f8da4;

  font-size:10px;
}


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

@media(max-width:950px){

  .main-nav{
    display:none;
  }

  .header-cta{
    margin-left:auto;
  }

  .philosophy-wrap,
  .two-col,
  .founder-grid{
    grid-template-columns:1fr;
  }

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

  .hero h1{
    font-size:48px;
  }

  .founder-photo-wrap,
  .founder-photo{
    min-height:300px;
  }
}


@media(max-width:700px){

  .container,
  .header-inner{
    width:min(100% - 24px,1180px);
  }

  .site-header{
    position:relative;
  }

  .header-inner{
    min-height:74px;
  }

  .brand-logo{
    max-width:170px;
  }

  .header-cta{
    padding:0 12px;

    font-size:10px;
  }

  .hero{
    padding:
      58px 0
      62px;
  }

  .hero h1{
    font-size:39px;
  }

  .hero-subtitle{
    font-size:18px;
  }

  .hero-support{
    font-size:16px;
  }

  .hero-button{
    width:100%;
  }

  .section,
  .dark-section,
  .founder-section,
  .newsletter-section{
    padding:58px 0;
  }

  .section-heading h2,
  .two-col h2,
  .founder-copy h2,
  .philosophy-copy h2{
    font-size:31px;
  }

  .program-facts{
    grid-template-columns:1fr;
  }

  .newsletter{
    flex-direction:column;
    align-items:flex-start;

    padding:
      29px 23px;
  }

  .newsletter-button{
    width:100%;
  }

  .footer-top{
    flex-direction:column;
  }

  .footer-links{
    justify-content:flex-start;
  }
}


/* =========================================================
   HOME V2.1 - IDENTIDAD VISUAL SHARK
   ========================================================= */

.brand{
  display:flex;
  align-items:center;
  flex:0 0 auto;
}

.brand-logo{
  display:block;
  width:230px;
  max-width:230px;
  height:auto;
  max-height:none;
  object-fit:contain;
}


/*
 * Menú actual Shark:
 * Source Sans Pro, algo más visible.
 */

.main-nav{
  gap:31px;
}

.main-nav a{
  font-family:"Source Sans Pro",sans-serif;
  font-size:16px;
  font-weight:400;
  letter-spacing:.055em;
  line-height:1;
}


/*
 * Botón cabecera
 */

.header-cta{
  font-family:"Source Sans Pro",sans-serif;
  font-size:14px;
  font-weight:600;
  letter-spacing:.055em;
}


/*
 * Texto general más parecido a la web original.
 */

body{
  font-family:"Source Sans Pro",sans-serif;
  font-size:18px;
}


/*
 * H1/H2: misma familia editorial de la web actual.
 */

h1,
h2{
  font-family:"Droid Serif",serif;
}


/*
 * Textos de apoyo.
 */

.hero-subtitle{
  font-family:"Source Sans Pro",sans-serif;
  font-weight:400;
}

.hero-support{
  font-family:"Source Sans Pro",sans-serif;
  font-weight:700;
}


/*
 * Kicker y pequeños labels:
 * dejamos Source Sans Pro para evitar aspecto "robot".
 */

.section-kicker,
.newsletter-kicker,
.program-label,
.results-head{
  font-family:"Source Sans Pro",sans-serif;
}


/*
 * Footer
 */

.site-footer{
  font-family:"Nunito","Source Sans Pro",sans-serif;
}


@media(max-width:700px){

  .brand-logo{
    width:180px;
    max-width:180px;
  }

  .header-cta{
    font-size:11px;
  }
}



/* =========================================================
   HOME V2.2 - HERO
   ========================================================= */

/*
 * CTA principal del hero:
 * más oscuro y más alineado con la identidad Shark.
 */

.hero-button{
  min-height:58px;

  padding:
    0 31px;

  background:#262a7a;

  font-size:15px;

  font-weight:700;

  letter-spacing:.045em;

  box-shadow:
    0 5px 14px
    rgba(38,42,122,.16);

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

.hero-button:hover{
  background:#1d2168;

  transform:
    translateY(-1px);

  box-shadow:
    0 7px 18px
    rgba(38,42,122,.20);
}


/*
 * "En tu propia cuenta de inversión"
 */

.hero-subtitle{
  margin-top:32px;

  font-size:25px;

  line-height:1.35;

  font-weight:400;
}


/*
 * "Gestión cuantitativa..."
 */

.hero-support{
  margin-top:22px;

  font-size:21px;

  line-height:1.45;

  font-weight:700;
}


/*
 * Algo más de espacio antes del botón
 */

.hero-button{
  margin-top:37px;
}


/*
 * Ocultamos definitivamente cualquier hero-small
 * por si quedara en caché o se reintrodujera.
 */

.hero-small{
  display:none !important;
}


@media(max-width:700px){

  .hero-subtitle{
    font-size:21px;
  }

  .hero-support{
    font-size:18px;
  }

  .hero-button{
    min-height:54px;

    padding:
      0 20px;

    font-size:13px;
  }
}


/* =========================================================
   HOME V2.3 - JERARQUIA HERO
   ========================================================= */

.hero-subtitle{
  font-size:28px !important;
  line-height:1.35 !important;
  font-weight:400 !important;
}

.hero-support{
  font-size:24px !important;
  line-height:1.45 !important;
  font-weight:700 !important;
}

.hero-button{
  min-height:62px !important;
  padding:0 34px !important;

  font-size:16px !important;
  line-height:1.2 !important;

  font-weight:700 !important;
  letter-spacing:.04em !important;
}


@media(max-width:700px){

  .hero-subtitle{
    font-size:23px !important;
  }

  .hero-support{
    font-size:20px !important;
  }

  .hero-button{
    min-height:58px !important;
    padding:0 22px !important;
    font-size:14px !important;
  }
}


/* =========================================================
   HOME V2.4
   AUTORIDAD + CONFIANZA + PROCESO
   ========================================================= */


/* ---------------------------------------------------------
   FRANJA DE AUTORIDAD
   --------------------------------------------------------- */

.authority-strip{
  background:#ffffff;

  border-top:
    1px solid #edf0f5;

  border-bottom:
    1px solid #e5e8ef;
}

.authority-inner{
  min-height:94px;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:26px;
}

.authority-item{
  min-width:150px;

  text-align:center;
}

.authority-item strong{
  display:block;

  color:#23267d;

  font-size:17px;

  font-weight:700;

  line-height:1.25;
}

.authority-item span{
  display:block;

  margin-top:4px;

  color:#697080;

  font-size:13px;

  line-height:1.3;
}

.authority-separator{
  width:1px;

  height:36px;

  background:#dfe3ea;
}



/* ---------------------------------------------------------
   BLOQUE CONTROL DEL DINERO
   --------------------------------------------------------- */

.trust-section{
  padding:82px 0;

  background:#0b1f46;

  color:#ffffff;
}

.trust-grid{
  display:grid;

  grid-template-columns:
    .92fr 1.08fr;

  gap:70px;

  align-items:center;
}

.trust-intro h2{
  margin:
    7px 0
    18px;

  color:#ffffff;

  font-family:
    "Droid Serif",
    serif;

  font-size:45px;

  line-height:1.15;
}

.trust-intro p{
  max-width:540px;

  margin:0;

  color:#d5deec;

  font-size:18px;

  line-height:1.7;
}

.trust-points{
  display:grid;

  gap:15px;
}

.trust-point{
  display:flex;

  gap:17px;

  padding:
    20px 22px;

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

  border-radius:12px;

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

.trust-icon{
  flex:0 0 38px;

  height:38px;

  display:flex;

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

  border-radius:50%;

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

  color:#a8c1ff;

  font-size:12px;

  font-weight:700;
}

.trust-point h3{
  margin:
    1px 0
    5px;

  color:#ffffff;

  font-size:18px;

  font-weight:600;
}

.trust-point p{
  margin:0;

  color:#cbd5e4;

  font-size:15px;

  line-height:1.5;
}



/* ---------------------------------------------------------
   PROCESO
   --------------------------------------------------------- */

.process-section{
  padding:86px 0;

  background:#ffffff;
}

.process-heading{
  max-width:760px;

  margin-bottom:46px;
}

.process-flow{
  position:relative;

  display:grid;

  grid-template-columns:
    repeat(5,1fr);

  gap:14px;
}


/*
 * Línea horizontal del proceso.
 */

.process-flow:before{
  content:"";

  position:absolute;

  top:28px;

  left:9%;

  right:9%;

  height:2px;

  background:#dfe4ef;

  z-index:0;
}

.process-step{
  position:relative;

  z-index:1;

  min-height:310px;

  padding:
    0 17px
    22px;

  text-align:center;
}

.process-number{
  width:56px;
  height:56px;

  display:flex;

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

  margin:
    0 auto
    17px;

  border-radius:50%;

  background:#262a7a;

  color:#ffffff;

  font-size:18px;

  font-weight:700;

  box-shadow:
    0 0 0 8px
    #ffffff;
}

.process-icon{
  height:31px;

  color:#2176ff;

  font-size:27px;

  font-weight:400;

  line-height:31px;
}

.process-step h3{
  min-height:48px;

  margin:
    11px 0
    8px;

  color:#151b2d;

  font-size:18px;

  font-weight:700;

  line-height:1.3;
}

.process-step p{
  margin:0;

  color:#697080;

  font-size:14px;

  line-height:1.55;
}

.process-note{
  margin-top:12px;

  padding-top:10px;

  border-top:
    1px solid #e4e7ec;

  color:#262a7a;

  font-size:12px;

  font-weight:600;

  line-height:1.4;
}



/* ---------------------------------------------------------
   SIPC SIMPLE
   --------------------------------------------------------- */

.sipc-simple{
  max-width:930px;

  margin:
    34px auto
    0;

  display:flex;

  align-items:flex-start;

  gap:18px;

  padding:
    20px 22px;

  border:
    1px solid
    #dfe4ee;

  border-radius:12px;

  background:#f7f8fb;
}

.sipc-mark{
  flex:0 0 58px;

  min-height:34px;

  display:flex;

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

  border-radius:7px;

  background:#262a7a;

  color:#ffffff;

  font-size:12px;

  font-weight:800;

  letter-spacing:.06em;
}

.sipc-simple strong{
  display:block;

  color:#151b2d;

  font-size:15px;

  line-height:1.4;
}

.sipc-simple p{
  margin:
    5px 0
    0;

  color:#6c7380;

  font-size:13px;

  line-height:1.5;
}



/* ---------------------------------------------------------
   SERGIO - POSICION TEMPRANA
   --------------------------------------------------------- */

.founder-early{
  padding:86px 0;

  background:#f2f3f6;
}

.founder-early .founder-grid{
  max-width:1030px;
}

.founder-early .founder-photo-wrap{
  min-height:0;

  background:transparent;

  border-radius:4px;
}

.founder-early .founder-photo{
  width:100%;

  min-height:0;

  height:auto;

  object-fit:contain;

  border-radius:3px;
}

.founder-early .founder-copy h2{
  margin-bottom:17px;
}

.founder-lead{
  margin-bottom:8px !important;

  color:#151b2d !important;

  font-size:19px !important;
}

.founder-highlight{
  margin:
    4px 0
    20px !important;

  color:#101b3f !important;

  font-size:21px !important;

  font-weight:600;

  line-height:1.55 !important;
}



/* =========================================================
   RESPONSIVE V2.4
   ========================================================= */

@media(max-width:1000px){

  .process-flow{
    grid-template-columns:
      repeat(2,1fr);
  }

  .process-flow:before{
    display:none;
  }

  .process-step{
    min-height:0;

    padding:
      22px;

    border:
      1px solid #e4e7ec;

    border-radius:12px;
  }

  .process-number{
    box-shadow:none;
  }
}


@media(max-width:850px){

  .authority-inner{
    flex-wrap:wrap;

    padding:
      20px 0;

    gap:
      18px
      24px;
  }

  .authority-separator{
    display:none;
  }

  .authority-item{
    flex:
      1 1
      40%;
  }

  .trust-grid{
    grid-template-columns:1fr;

    gap:40px;
  }
}


@media(max-width:700px){

  .authority-item{
    flex:
      1 1
      100%;
  }

  .trust-section,
  .process-section,
  .founder-early{
    padding:
      58px 0;
  }

  .trust-intro h2{
    font-size:34px;
  }

  .trust-intro p{
    font-size:17px;
  }

  .process-flow{
    grid-template-columns:1fr;
  }

  .process-step{
    text-align:left;
  }

  .process-number{
    margin:
      0 0
      15px;
  }

  .process-step h3{
    min-height:0;
  }

  .sipc-simple{
    flex-direction:column;
  }
}


/* =========================================================
   HOME V2.5 - SERGIO DEBAJO DEL HERO
   ========================================================= */

.founder-home{
  padding:88px 0;

  background:#f3f4f6;
}

.founder-home .founder-grid{
  max-width:1080px;

  display:grid;

  grid-template-columns:
    .85fr 1.15fr;

  gap:64px;

  align-items:center;
}

.founder-home .founder-photo-wrap{
  min-height:0;

  overflow:hidden;

  border-radius:10px;

  background:#e5e7eb;

  box-shadow:
    0 14px 35px
    rgba(16,24,40,.08);
}

.founder-home .founder-photo{
  display:block;

  width:100%;

  height:auto;

  min-height:0;

  object-fit:cover;
}


/* kicker */

.founder-home .section-kicker{
  margin-bottom:10px;

  font-size:13px;

  font-weight:700;

  letter-spacing:.08em;

  color:#262a7a;
}


/* título */

.founder-home .founder-copy h2{
  margin:
    0 0
    18px;

  font-family:
    "Droid Serif",
    serif;

  font-size:44px;

  line-height:1.15;

  color:#151515;
}


/* gestor profesional */

.founder-role{
  margin:
    0 0
    14px;

  color:#0f2148;

  font-size:22px;

  font-weight:700;

  line-height:1.35;
}


/* frase principal */

.founder-main{
  margin:
    0 0
    20px;

  color:#101828;

  font-size:24px;

  font-weight:600;

  line-height:1.5;
}


/* cuerpo */

.founder-body,
.founder-account{
  margin:
    0 0
    16px;

  color:#4f5663;

  font-size:19px;

  line-height:1.7;
}


/* fácil seguro transparente */

.founder-values{
  margin:
    22px 0
    18px;

  color:#101828;

  font-size:23px;

  font-weight:700;

  line-height:1.4;
}


/* link */

.founder-link{
  display:inline-flex;

  align-items:center;

  margin-top:6px;

  color:#262a7a;

  font-size:15px;

  font-weight:700;

  letter-spacing:.035em;

  text-decoration:none;
}

.founder-link:hover{
  text-decoration:underline;

  text-underline-offset:4px;
}


/* ocultar cualquier resto de authority-strip */

.authority-strip{
  display:none !important;
}


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

@media(max-width:900px){

  .founder-home .founder-grid{
    grid-template-columns:1fr;

    gap:38px;
  }

  .founder-home .founder-photo-wrap{
    max-width:620px;

    margin:0 auto;
  }

}


@media(max-width:700px){

  .founder-home{
    padding:
      58px 0;
  }

  .founder-home .founder-copy h2{
    font-size:35px;
  }

  .founder-role{
    font-size:20px;
  }

  .founder-main{
    font-size:21px;
  }

  .founder-body,
  .founder-account{
    font-size:17px;
  }

  .founder-values{
    font-size:20px;
  }
}


/* =========================================================
   HOME V2.6 - SERGIO / JERARQUIA GRANDE
   ========================================================= */

.founder-home{
  padding:96px 0;
}

.founder-home .founder-grid{
  max-width:1120px;

  grid-template-columns:
    .88fr 1.12fr;

  gap:72px;
}


/* TITULO */

.founder-home .founder-copy h2{
  margin:
    0 0
    24px;

  font-size:50px !important;

  line-height:1.16 !important;

  font-weight:700 !important;
}


/* GESTOR DESDE 2011 */

.founder-role{
  margin:
    0 0
    20px !important;

  font-size:24px !important;

  line-height:1.4 !important;

  font-weight:700 !important;
}


/* FRASE PRINCIPAL */

.founder-main{
  margin:
    0 0
    24px !important;

  font-size:26px !important;

  line-height:1.5 !important;

  font-weight:600 !important;
}


/* TEXTO EXPLICATIVO */

.founder-body,
.founder-account{
  margin:
    0 0
    20px !important;

  font-size:22px !important;

  line-height:1.7 !important;

  font-weight:400 !important;
}


/* FACIL SEGURO TRANSPARENTE */

.founder-values{
  margin:
    27px 0
    22px !important;

  font-size:24px !important;

  line-height:1.4 !important;

  font-weight:700 !important;
}


/* LINK TRAYECTORIA */

.founder-link{
  margin-top:8px !important;

  font-size:17px !important;

  line-height:1.4 !important;

  font-weight:700 !important;
}


/* FOTO ALGO MAS PRESENTE */

.founder-home .founder-photo{
  width:100% !important;

  max-width:none !important;

  height:auto !important;
}


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

@media(max-width:900px){

  .founder-home .founder-grid{
    grid-template-columns:1fr;

    gap:44px;
  }

  .founder-home .founder-copy h2{
    font-size:44px !important;
  }

}


@media(max-width:700px){

  .founder-home{
    padding:
      64px 0;
  }

  .founder-home .founder-copy h2{
    font-size:36px !important;
  }

  .founder-role{
    font-size:21px !important;
  }

  .founder-main{
    font-size:22px !important;
  }

  .founder-body,
  .founder-account{
    font-size:19px !important;
  }

  .founder-values{
    font-size:21px !important;
  }

  .founder-link{
    font-size:15px !important;
  }
}


/* =========================================================
   HOME V2.8 - CIERRE BLOQUE SERGIO
   ========================================================= */


/* PIE DE FOTO */

.founder-caption{
  margin-top:10px;

  color:#7a8190;

  font-size:14px;

  font-style:italic;

  line-height:1.4;

  text-align:left;
}


/* CLAIM FINAL */

.founder-values{
  margin:
    30px 0
    19px !important;

  color:#0b1f46 !important;

  font-size:25px !important;

  font-weight:800 !important;

  line-height:1.45 !important;
}


/* LINK TRAYECTORIA */

.founder-link{
  display:inline-flex !important;

  align-items:center !important;

  margin-top:2px !important;

  color:#262a7a !important;

  font-size:16px !important;

  font-weight:600 !important;

  letter-spacing:.025em !important;

  text-decoration:none !important;
}

.founder-link:hover{
  text-decoration:underline !important;

  text-underline-offset:4px;
}


@media(max-width:700px){

  .founder-caption{
    font-size:13px;
  }

  .founder-values{
    font-size:22px !important;
  }

  .founder-link{
    font-size:15px !important;
  }
}


/* =========================================================
   HOME V3.0 - 3 PILARES
   ========================================================= */

.pillars-section{
  padding:86px 0;

  background:#0b1f46;

  color:#ffffff;
}


.pillars-heading{
  margin-bottom:38px;

  text-align:center;
}


.pillars-heading .section-kicker{
  margin:0;

  color:#9db9ff;

  font-size:14px;

  font-weight:700;

  letter-spacing:.08em;
}


/* GRID */

.pillars-grid{
  display:grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:22px;
}


/* CARD */

.pillar-card{
  min-height:310px;

  padding:
    30px 28px;

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

  border-radius:16px;

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


/* NUMERO */

.pillar-number{
  margin-bottom:16px;

  color:#8eadff;

  font-size:15px;

  font-weight:700;

  letter-spacing:.06em;
}


/* LABEL */

.pillar-label{
  margin-bottom:10px;

  color:#ffffff;

  font-size:14px;

  font-weight:700;

  letter-spacing:.08em;
}


/* TITULO */

.pillar-card h2{
  margin:
    0 0
    16px;

  color:#ffffff;

  font-family:
    "Droid Serif",
    serif;

  font-size:29px;

  line-height:1.25;

  font-weight:700;
}


/* TEXTO */

.pillar-card p{
  margin:0;

  color:#d5deec;

  font-size:18px;

  line-height:1.65;
}


/* HOVER MUY SUAVE */

.pillar-card{
  transition:
    transform .15s ease,
    background-color .15s ease;
}

.pillar-card:hover{
  transform:
    translateY(-2px);

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


/* =========================================================
   SERGIO - LIMPIEZA FINAL
   ========================================================= */

/* si quedara algún kicker antiguo */
.founder-home .section-kicker{
  display:none !important;
}


/* si quedara founder-values por cache o edición previa */
.founder-home .founder-values{
  display:none !important;
}


/* link trayectoria algo más separado */

.founder-home .founder-link{
  margin-top:8px !important;
}


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

@media(max-width:900px){

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

  .pillar-card{
    min-height:0;
  }

}


@media(max-width:700px){

  .pillars-section{
    padding:
      60px 0;
  }

  .pillars-heading{
    margin-bottom:28px;
  }

  .pillars-heading .section-kicker{
    font-size:12px;
  }

  .pillar-card{
    padding:
      24px 22px;
  }

  .pillar-card h2{
    font-size:25px;
  }

  .pillar-card p{
    font-size:17px;
  }

}


/* =========================================================
   HOME V3.1 - PILARES REFINADOS
   ========================================================= */


/*
 * Azul ligeramente más luminoso.
 * Sigue siendo serio pero menos duro que #0b1f46.
 */

.pillars-section{
  background:#142f62 !important;

  padding:
    92px 0
    96px !important;
}


/* TÍTULO PRINCIPAL */

.pillars-heading{
  max-width:900px;

  margin:
    0 auto
    48px !important;

  text-align:center;
}

.pillars-heading h2{
  margin:0;

  color:#ffffff;

  font-family:
    "Droid Serif",
    serif;

  font-size:40px;

  font-weight:700;

  line-height:1.2;

  letter-spacing:-.015em;
}


/* ICONOS */

.pillar-icon{
  width:58px;
  height:58px;

  display:flex;

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

  margin-bottom:22px;

  border-radius:14px;

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

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

.pillar-icon svg{
  width:31px;
  height:31px;

  fill:none;

  stroke:#a8c5ff;

  stroke-width:2;

  stroke-linecap:round;
  stroke-linejoin:round;
}


/* TU CUENTA / NUESTRA GESTIÓN / TRANSPARENCIA */

.pillar-label{
  margin-bottom:12px !important;

  color:#a8c5ff !important;

  font-size:16px !important;

  font-weight:700 !important;

  letter-spacing:.075em !important;
}


/* TARJETAS */

.pillar-card{
  padding:
    32px 30px !important;

  background:
    rgba(255,255,255,.06) !important;
}

.pillar-card h2{
  font-size:30px !important;
}

.pillar-card p{
  font-size:18px !important;
}


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

@media(max-width:700px){

  .pillars-section{
    padding:
      64px 0 !important;
  }

  .pillars-heading{
    margin-bottom:32px !important;
  }

  .pillars-heading h2{
    font-size:32px;
  }

  .pillar-icon{
    width:52px;
    height:52px;
  }

  .pillar-icon svg{
    width:28px;
    height:28px;
  }

  .pillar-label{
    font-size:15px !important;
  }

}


/* =========================================================
   NEWSLETTER GLOBAL ALIGN V1
   ========================================================= */

.newsletter{
  display:grid !important;

  grid-template-columns:
    minmax(0,1fr)
    minmax(240px,320px) !important;

  align-items:center !important;

  gap:50px !important;
}

.newsletter-button{
  justify-self:center !important;

  width:auto !important;

  min-width:220px;
}


@media(max-width:800px){

  .newsletter{
    grid-template-columns:1fr !important;

    gap:24px !important;
  }

  .newsletter-button{
    justify-self:start !important;

    min-width:0;

    width:100% !important;
  }
}


/* =========================================================
   NEWSLETTER GLOBAL V2
   ========================================================= */

.newsletter-section{
  padding:
    72px 0
    82px !important;

  background:#ffffff !important;
}

.newsletter{
  display:grid !important;

  grid-template-columns:
    minmax(0,1fr)
    285px !important;

  align-items:center !important;

  gap:38px !important;

  padding:
    42px 44px !important;

  background:#0b1f46 !important;

  border-radius:18px !important;
}

.newsletter > div:first-child{
  min-width:0;
}

.newsletter h2{
  margin:
    8px 0
    9px !important;

  font-family:
    "Droid Serif",
    serif !important;

  font-size:29px !important;

  line-height:1.25 !important;

  white-space:nowrap !important;
}

.newsletter p{
  max-width:none !important;

  font-size:17px !important;

  line-height:1.6 !important;
}

.newsletter-button{
  justify-self:center !important;

  width:260px !important;

  min-width:260px !important;

  min-height:50px !important;

  padding:
    0 18px !important;

  text-align:center !important;
}


@media(max-width:1100px){

  .newsletter h2{
    white-space:normal !important;
  }

}


@media(max-width:800px){

  .newsletter-section{
    padding:
      55px 0
      60px !important;
  }

  .newsletter{
    grid-template-columns:1fr !important;

    gap:24px !important;

    padding:
      30px 24px !important;
  }

  .newsletter h2{
    font-size:27px !important;

    white-space:normal !important;
  }

  .newsletter-button{
    justify-self:stretch !important;

    width:100% !important;

    min-width:0 !important;
  }

}


/* =========================================================
   HOME V3.2 - COMO FUNCIONA
   ========================================================= */


/* KICKER */

.process-heading .section-kicker{
  font-size:17px !important;
  font-weight:700 !important;
  letter-spacing:.075em !important;
}


/* TITULO */

.process-heading h2{
  font-size:44px !important;
  line-height:1.2 !important;
}


/* TEXTO INTRO */

.process-heading p{
  font-size:20px !important;
  line-height:1.65 !important;
}


/* =========================================================
   PASOS
   ========================================================= */

.process-number{
  width:60px !important;
  height:60px !important;

  margin:
    0 auto
    22px !important;

  font-size:20px !important;

  font-weight:700 !important;
}


/*
 * Ya no necesitamos espacio reservado para iconos.
 */

.process-step h3{
  min-height:50px;

  margin:
    0 0
    10px !important;

  font-size:19px !important;

  line-height:1.35 !important;
}


.process-step p{
  font-size:15px !important;

  line-height:1.6 !important;
}


.process-note{
  font-size:13px !important;

  line-height:1.5 !important;
}


/* =========================================================
   SIPC / PROTECCION
   ========================================================= */

.sipc-simple{
  max-width:980px !important;

  margin:
    42px auto
    0 !important;

  display:grid !important;

  grid-template-columns:
    72px 1fr !important;

  gap:22px !important;

  align-items:start !important;

  padding:
    25px 28px !important;

  border:
    1px solid #d9e0ec !important;

  border-radius:14px !important;

  background:#f5f7fb !important;
}


.sipc-mark{
  width:64px !important;

  min-height:40px !important;

  border-radius:8px !important;

  background:#262a7a !important;

  color:#ffffff !important;

  font-size:13px !important;

  font-weight:800 !important;

  letter-spacing:.06em !important;
}


.sipc-content h3{
  margin:
    0 0
    8px !important;

  color:#101828 !important;

  font-size:21px !important;

  line-height:1.4 !important;

  font-weight:700 !important;
}


.sipc-content p{
  margin:
    0 0
    7px !important;

  color:#667085 !important;

  font-size:16px !important;

  line-height:1.6 !important;
}


.sipc-content .sipc-warning{
  margin-top:8px !important;

  color:#4d5664 !important;

  font-size:14px !important;

  font-weight:600 !important;
}


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

@media(max-width:700px){

  .process-heading .section-kicker{
    font-size:14px !important;
  }

  .process-heading h2{
    font-size:33px !important;
  }

  .process-heading p{
    font-size:18px !important;
  }

  .process-number{
    margin-left:0 !important;
  }

  .sipc-simple{
    grid-template-columns:1fr !important;

    padding:
      22px !important;
  }

  .sipc-content h3{
    font-size:19px !important;
  }

}


/* =========================================================
   HOME V3.3 - RITMO VISUAL GLOBAL
   ========================================================= */


/* ---------------------------------------------------------
   PASO 2
   --------------------------------------------------------- */

.process-note-secondary{
  margin-top:8px !important;

  padding-top:8px !important;

  color:#667085 !important;

  font-weight:500 !important;
}


/* =========================================================
   PROGRAMAS - BLOQUE OSCURO
   ========================================================= */

.programs-dark{
  padding:
    92px 0 !important;

  background:#142f62 !important;

  color:#ffffff !important;
}


/* CABECERA */

.programs-dark .section-heading{
  max-width:1050px !important;

  margin:
    0 auto
    46px !important;

  text-align:center !important;
}


.programs-dark .section-kicker{
  color:#a8c5ff !important;

  font-size:16px !important;

  font-weight:700 !important;

  letter-spacing:.075em !important;
}


.programs-dark .section-heading h2{
  max-width:1000px !important;

  margin:
    0 auto
    17px !important;

  color:#ffffff !important;

  font-size:43px !important;

  line-height:1.2 !important;
}


.programs-dark .section-heading p{
  max-width:900px !important;

  margin:
    0 auto !important;

  color:#d8e1ef !important;

  font-size:21px !important;

  line-height:1.65 !important;
}


/* =========================================================
   TARJETAS DE PROGRAMAS
   ========================================================= */

.programs-dark .program-grid{
  gap:24px !important;
}


.programs-dark .program-card{
  min-height:100%;

  padding:
    34px 34px !important;

  border:
    1px solid
    rgba(255,255,255,.14) !important;

  background:
    rgba(255,255,255,.075) !important;

  color:#ffffff !important;
}


/* ORCA mantiene personalidad propia
   pero más integrada con el fondo oscuro */

.programs-dark .program-card.orca{
  border-color:
    rgba(245,138,31,.48) !important;

  background:
    rgba(245,138,31,.09) !important;
}


/* etiquetas */

.programs-dark .program-label{
  background:
    rgba(255,255,255,.11) !important;

  color:#c8d6ff !important;
}

.programs-dark .program-label.orange{
  background:
    rgba(245,138,31,.18) !important;

  color:#ffd0a2 !important;
}


/* títulos */

.programs-dark .program-top h3{
  color:#ffffff !important;

  font-size:31px !important;
}


/* textos */

.programs-dark .program-top p{
  color:#d6dfec !important;

  font-size:17px !important;

  line-height:1.65 !important;
}


/* =========================================================
   PERFIL / CAPITAL MINIMO
   Menos aspecto de formulario
   ========================================================= */

.programs-dark .program-facts{
  margin:
    27px 0
    25px !important;

  gap:12px !important;
}


.programs-dark .program-facts div{
  padding:
    14px 16px !important;

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

  background:
    rgba(255,255,255,.055) !important;

  border-radius:9px !important;
}


.programs-dark .program-facts span{
  color:#b9c7dc !important;

  font-size:12px !important;
}


.programs-dark .program-facts strong{
  color:#ffffff !important;

  font-size:17px !important;
}


/* botones */

.programs-dark .program-button.blue{
  background:#ffffff !important;

  color:#142f62 !important;
}


.programs-dark .program-button.orange-button{
  background:#f58a1f !important;

  color:#ffffff !important;
}


.programs-dark .program-button{
  min-height:48px !important;

  padding:
    0 20px !important;

  font-size:13px !important;
}


/* =========================================================
   RESULTADOS - CLARO
   ========================================================= */

.results-light{
  padding:
    88px 0 !important;

  background:#ffffff !important;

  color:#101828 !important;
}


.results-light .section-kicker{
  color:#262a7a !important;
}


.results-light h2{
  color:#101828 !important;
}


.results-light p{
  color:#667085 !important;

  font-size:19px !important;

  line-height:1.7 !important;
}


.results-light .dark-button{
  background:#262a7a !important;

  color:#ffffff !important;
}


/* preview del track record */

.results-light .results-preview{
  border:
    1px solid #dfe4ec !important;

  background:#f5f6f8 !important;
}


.results-light .results-head{
  color:#262a7a !important;
}


.results-light .mock-chart{
  background:#ffffff !important;
}


.results-light .chart-grid{
  background-image:
    linear-gradient(
      rgba(16,24,40,.06) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(16,24,40,.045) 1px,
      transparent 1px
    ) !important;
}


.results-light .strategy-path{
  stroke:#262a7a !important;
}


.results-light .benchmark-path{
  stroke:#98a2b3 !important;
}


.results-light .results-caption{
  color:#667085 !important;
}


/* =========================================================
   PLANIFICADOR - GRIS
   ========================================================= */

.planner-home-gray{
  padding:
    88px 0 !important;

  background:#f3f4f6 !important;
}


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

@media(max-width:700px){

  .programs-dark{
    padding:
      62px 0 !important;
  }

  .programs-dark .section-heading h2{
    font-size:33px !important;
  }

  .programs-dark .section-heading p{
    font-size:18px !important;
  }

  .results-light,
  .planner-home-gray{
    padding:
      60px 0 !important;
  }

}


/* =========================================================
   HOME V3.4
   PROGRAMAS + RESULTADOS + PLANIFICADOR + CTA
   ========================================================= */


/* =========================================================
   CTA INTERMEDIO
   ========================================================= */

.mid-call-section{
  padding:
    0 0
    82px;

  background:#ffffff;
}

.mid-call-box{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    300px;

  gap:48px;

  align-items:center;

  padding:
    38px 42px;

  border-radius:18px;

  background:#0b1f46;

  color:#ffffff;
}


.mid-call-kicker{
  margin-bottom:8px;

  color:#9db9ff;

  font-size:14px;

  font-weight:700;

  letter-spacing:.075em;
}


.mid-call-box h2{
  margin:
    0 0
    10px;

  color:#ffffff;

  font-family:
    "Droid Serif",
    serif;

  font-size:30px;

  line-height:1.25;
}


.mid-call-box p{
  max-width:740px;

  margin:0;

  color:#d8e0ef;

  font-size:18px;

  line-height:1.6;
}


.mid-call-actions{
  display:flex;

  flex-direction:column;

  align-items:center;

  gap:13px;
}


.mid-call-button{
  width:250px;

  min-height:50px;

  display:flex;

  align-items:center;

  justify-content:center;

  padding:0 18px;

  border-radius:7px;

  background:#2176ff;

  color:#ffffff;

  font-size:14px;

  font-weight:700;

  text-decoration:none;
}


.mid-call-secondary{
  color:#d8e0ef;

  font-size:14px;

  text-decoration:underline;

  text-underline-offset:4px;
}



/* =========================================================
   PROGRAMAS
   ========================================================= */

section.programs-dark{
  padding:
    92px 0 !important;

  background:#142f62 !important;

  color:#ffffff !important;
}


.programs-dark .section-heading{
  max-width:1100px !important;

  margin:
    0 auto
    48px !important;

  text-align:center !important;
}


.programs-dark .section-kicker{
  color:#a8c5ff !important;

  font-size:17px !important;

  font-weight:700 !important;
}


.programs-dark .section-heading h2{
  max-width:none !important;

  margin:
    0 auto
    18px !important;

  color:#ffffff !important;

  font-size:43px !important;

  line-height:1.2 !important;
}


.programs-dark .section-heading p{
  max-width:1050px !important;

  margin:0 auto !important;

  color:#d8e1ef !important;

  font-size:21px !important;

  line-height:1.6 !important;
}


/* GLOBAL MACRO */

.programs-dark .program-card.global{
  border:
    1px solid
    rgba(255,255,255,.18) !important;

  background:
    rgba(255,255,255,.085) !important;
}


/* ORCA */

.programs-dark .program-card.orca{
  border:
    1px solid
    rgba(245,138,31,.55) !important;

  background:
    rgba(245,138,31,.10) !important;
}


/* textos tarjetas */

.programs-dark .program-card h3{
  color:#ffffff !important;
}

.programs-dark .program-description,
.programs-dark .program-top p{
  color:#d8e1ef !important;

  font-size:17px !important;
}


/* etiquetas */

.programs-dark .program-label{
  background:
    rgba(255,255,255,.12) !important;

  color:#d8e3ff !important;
}

.programs-dark .program-label.orange{
  background:
    rgba(245,138,31,.20) !important;

  color:#ffd6ad !important;
}


/* perfil / capital */

.programs-dark .program-facts div{
  border:
    1px solid
    rgba(255,255,255,.10) !important;

  background:
    rgba(255,255,255,.06) !important;
}

.programs-dark .program-facts span{
  color:#b9c7da !important;

  font-size:12px !important;
}

.programs-dark .program-facts strong{
  color:#ffffff !important;

  font-size:17px !important;
}


/* botones */

.programs-dark .program-button.blue{
  background:#ffffff !important;

  color:#142f62 !important;
}

.programs-dark .program-button.orange-button{
  background:#f58a1f !important;

  color:#ffffff !important;
}



/* =========================================================
   RESULTADOS - BLANCO
   ========================================================= */

section.results-light{
  background:#ffffff !important;

  color:#101828 !important;
}


.results-light .section-kicker{
  color:#262a7a !important;
}


.results-light h2{
  color:#101828 !important;
}


.results-light p{
  color:#667085 !important;
}



/* =========================================================
   PLANIFICADOR - GRIS
   ========================================================= */

section.planner-home-gray{
  padding:
    88px 0 !important;

  background:#f3f4f6 !important;

  color:#101828 !important;
}


.planner-home-gray .section-kicker{
  color:#262a7a !important;
}


.planner-home-gray h2{
  color:#101828 !important;
}


.planner-home-gray p{
  color:#667085 !important;

  font-size:19px !important;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:800px){

  .mid-call-section{
    padding:
      0 0
      60px;
  }

  .mid-call-box{
    grid-template-columns:1fr;

    gap:25px;

    padding:
      30px 24px;
  }

  .mid-call-actions{
    align-items:stretch;
  }

  .mid-call-button{
    width:100%;
  }

  .mid-call-box h2{
    font-size:27px;
  }

}


@media(max-width:700px){

  section.programs-dark{
    padding:
      62px 0 !important;
  }

  .programs-dark .section-heading h2{
    font-size:33px !important;
  }

  .programs-dark .section-heading p{
    font-size:18px !important;
  }

  section.planner-home-gray{
    padding:
      60px 0 !important;
  }

}


/* =========================================================
   HOME V3.5
   ESTRUCTURA FINAL DEL FUNNEL
   ========================================================= */


/* =========================================================
   PROGRAMAS
   Mantener como bloque oscuro después de Cómo funciona
   ========================================================= */

section.programs-dark{
  padding:
    94px 0 !important;

  background:#142f62 !important;

  color:#ffffff !important;
}


.programs-dark .section-heading{
  max-width:1120px !important;

  margin:
    0 auto
    50px !important;

  text-align:center !important;
}


.programs-dark .section-kicker{
  color:#a8c5ff !important;

  font-size:17px !important;

  font-weight:700 !important;

  letter-spacing:.075em !important;
}


.programs-dark .section-heading h2{
  max-width:1100px !important;

  margin:
    0 auto
    19px !important;

  color:#ffffff !important;

  font-size:44px !important;

  line-height:1.18 !important;
}


.programs-dark .section-heading p{
  max-width:1050px !important;

  margin:0 auto !important;

  color:#d8e1ef !important;

  font-size:22px !important;

  line-height:1.6 !important;
}


/* ---------------------------------------------------------
   TARJETAS
   --------------------------------------------------------- */

.programs-dark .program-card{
  padding:
    34px !important;

  border-radius:15px !important;
}


.programs-dark .program-card.global{
  border:
    1px solid
    rgba(255,255,255,.18) !important;

  background:
    rgba(255,255,255,.085) !important;
}


.programs-dark .program-card.orca{
  border:
    1px solid
    rgba(245,138,31,.52) !important;

  background:
    rgba(245,138,31,.10) !important;
}


.programs-dark .program-card h3{
  color:#ffffff !important;
}


.programs-dark .program-top p{
  color:#d8e1ef !important;

  font-size:17px !important;

  line-height:1.65 !important;
}


.programs-dark .program-facts div{
  border:
    1px solid
    rgba(255,255,255,.11) !important;

  background:
    rgba(255,255,255,.055) !important;
}


.programs-dark .program-facts span{
  color:#b9c7da !important;
}


.programs-dark .program-facts strong{
  color:#ffffff !important;
}


/* =========================================================
   PLANIFICACIÓN PERSONALIZADA
   SECCIÓN COMPLETA - NO BANNER
   ========================================================= */

.personal-planning-section{
  width:100%;

  padding:
    96px 0
    100px;

  background:#f3f4f6;

  color:#101828;

  text-align:center;
}


.personal-planning-inner{
  max-width:1050px !important;
}


.personal-planning-section .section-kicker{
  margin-bottom:13px;

  color:#262a7a;

  font-size:17px;

  font-weight:700;

  letter-spacing:.075em;
}


.personal-planning-section h2{
  max-width:900px;

  margin:
    0 auto
    22px;

  font-family:
    "Droid Serif",
    serif;

  color:#101828;

  font-size:44px;

  line-height:1.2;
}


.personal-planning-lead{
  max-width:920px;

  margin:
    0 auto
    13px;

  color:#4f5b6b;

  font-size:22px;

  line-height:1.65;
}


.personal-planning-note{
  max-width:800px;

  margin:
    0 auto;

  color:#667085;

  font-size:18px;

  line-height:1.65;
}


.personal-planning-actions{
  display:flex;

  justify-content:center;

  align-items:center;

  gap:16px;

  flex-wrap:wrap;

  margin-top:34px;
}


.personal-planning-primary,
.personal-planning-secondary{
  min-height:52px;

  display:inline-flex;

  align-items:center;

  justify-content:center;

  padding:
    0 25px;

  border-radius:7px;

  font-size:14px;

  font-weight:700;

  text-decoration:none;
}


.personal-planning-primary{
  min-width:235px;

  background:#2176ff;

  border:1px solid #2176ff;

  color:#ffffff;
}


.personal-planning-primary:hover{
  background:#1468ed;
}


.personal-planning-secondary{
  min-width:235px;

  background:#ffffff;

  border:1px solid #cfd6e1;

  color:#262a7a;
}


.personal-planning-secondary:hover{
  background:#f9fafb;
}


/* =========================================================
   NEWSLETTER
   Dejar aire después de Planificación personalizada
   ========================================================= */

.newsletter-section{
  padding-top:
    76px !important;

  background:#ffffff !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:800px){

  section.programs-dark{
    padding:
      64px 0 !important;
  }

  .programs-dark .section-heading h2{
    font-size:34px !important;
  }

  .programs-dark .section-heading p{
    font-size:19px !important;
  }


  .personal-planning-section{
    padding:
      66px 0
      70px;
  }

  .personal-planning-section h2{
    font-size:34px;
  }

  .personal-planning-lead{
    font-size:19px;
  }

  .personal-planning-note{
    font-size:17px;
  }

  .personal-planning-actions{
    flex-direction:column;

    align-items:stretch;
  }

  .personal-planning-primary,
  .personal-planning-secondary{
    width:100%;
  }

}


/* =========================================================
   HOME V3.6
   FICHAS DE PROGRAMAS SIMPLIFICADAS
   ========================================================= */


/*
 * Quitar cualquier apariencia heredada de formulario
 */

.programs-dark .program-summary{
  margin:
    28px 0
    26px;

  border-top:
    1px solid
    rgba(255,255,255,.16);

  border-bottom:
    1px solid
    rgba(255,255,255,.16);
}


.programs-dark .program-summary-row{
  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:20px;

  padding:
    14px 0;

  background:transparent !important;
}


.programs-dark .program-summary-row + .program-summary-row{
  border-top:
    1px solid
    rgba(255,255,255,.10);
}


.programs-dark .program-summary-row span{
  color:#b9c7da;

  font-size:15px;

  line-height:1.4;
}


.programs-dark .program-summary-row strong{
  color:#ffffff;

  font-size:17px;

  line-height:1.4;

  font-weight:700;

  text-align:right;
}


/* GLOBAL MACRO */

.programs-dark .program-card.global .program-summary-row strong{
  color:#ffffff;
}


/* ORCA mantiene un pequeño acento */

.programs-dark .program-card.orca .program-summary{
  border-top-color:
    rgba(245,138,31,.35);

  border-bottom-color:
    rgba(245,138,31,.35);
}


.programs-dark .program-card.orca .program-summary-row + .program-summary-row{
  border-top-color:
    rgba(245,138,31,.22);
}


.programs-dark .program-card.orca .program-summary-row strong{
  color:#ffd0a2;
}


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

@media(max-width:600px){

  .programs-dark .program-summary-row{
    align-items:flex-start;
  }

  .programs-dark .program-summary-row span{
    font-size:14px;
  }

  .programs-dark .program-summary-row strong{
    font-size:16px;
  }

}


/* =========================================================
   HOME V3.7 - FOOTER
   ========================================================= */

.site-footer{
  background:#0b1f46;
  color:#ffffff;
}


/* =========================================================
   BLOQUE PRINCIPAL
   ========================================================= */

.footer-main{
  display:grid;

  grid-template-columns:
    minmax(280px,1.05fr)
    minmax(0,1.65fr);

  gap:90px;

  padding-top:68px;
  padding-bottom:54px;
}


/* =========================================================
   MARCA
   ========================================================= */

.footer-brand{
  max-width:420px;
}


.footer-logo-link{
  display:inline-block;

  margin-bottom:20px;
}


.footer-logo{
  display:block;

  width:270px;
  max-width:100%;

  height:auto;
}


.footer-brand p{
  max-width:390px;

  margin:0;

  color:#c6d1e2;

  font-size:17px;

  line-height:1.65;
}


/* =========================================================
   COLUMNAS
   ========================================================= */

.footer-nav-group{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:48px;
}


.footer-column{
  display:flex;

  flex-direction:column;

  align-items:flex-start;

  gap:10px;
}


.footer-title{
  margin-bottom:7px;

  color:#ffffff;

  font-size:14px;

  font-weight:700;

  letter-spacing:.07em;
}


.footer-column a{
  color:#c6d1e2;

  font-size:16px;

  line-height:1.5;

  text-decoration:none;

  transition:
    color .18s ease;
}


.footer-column a:hover{
  color:#ffffff;
}


/* =========================================================
   FRANJA INFERIOR
   ========================================================= */

.footer-bottom{
  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:30px;

  padding-top:23px;
  padding-bottom:26px;

  border-top:
    1px solid
    rgba(255,255,255,.13);
}


.footer-copyright{
  color:#9eacc2;

  font-size:14px;

  line-height:1.5;
}


.footer-bottom-links{
  display:flex;

  align-items:center;

  gap:24px;
}


.footer-bottom-links a{
  color:#9eacc2;

  font-size:14px;

  text-decoration:none;

  transition:
    color .18s ease;
}


.footer-bottom-links a:hover{
  color:#ffffff;
}


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

@media(max-width:950px){

  .footer-main{
    grid-template-columns:1fr;

    gap:45px;

    padding-top:58px;
  }

  .footer-brand{
    max-width:520px;
  }

}


@media(max-width:700px){

  .footer-main{
    padding-top:48px;
    padding-bottom:40px;
  }

  .footer-logo{
    width:235px;
  }

  .footer-nav-group{
    grid-template-columns:1fr 1fr;

    gap:
      36px
      26px;
  }

  .footer-bottom{
    flex-direction:column;

    align-items:flex-start;

    gap:14px;
  }

  .footer-bottom-links{
    flex-wrap:wrap;

    gap:
      10px
      20px;
  }

}


@media(max-width:480px){

  .footer-nav-group{
    grid-template-columns:1fr;
  }

}


/* =========================================================
   WHATSAPP CTA V1
   ========================================================= */

.whatsapp-cta{
  display:inline-flex !important;

  align-items:center !important;
  justify-content:center !important;

  gap:10px !important;

  background:#2176ff !important;

  color:#ffffff !important;
}


.whatsapp-icon{
  width:21px;
  height:21px;

  flex:0 0 auto;

  fill:none;

  stroke:#ffffff;

  stroke-width:1.6;

  stroke-linecap:round;
  stroke-linejoin:round;
}


.whatsapp-icon path:first-child{
  fill:none;
}


.whatsapp-icon path:last-child{
  fill:#ffffff;
  stroke:none;
}


.whatsapp-cta:hover{
  background:#1468ed !important;
}


@media(max-width:700px){

  .whatsapp-icon{
    width:20px;
    height:20px;
  }

}


/* =========================================================
   HOME V3.9 - FOOTER MINIMAL
   ========================================================= */

.site-footer-simple{
  background:#0b1f46 !important;
  color:#ffffff !important;
}


.footer-minimal{
  display:grid !important;

  grid-template-columns:
    minmax(220px,1fr)
    auto
    44px !important;

  align-items:center !important;

  gap:36px !important;

  padding-top:34px !important;
  padding-bottom:25px !important;
}


.footer-minimal-logo-link{
  display:inline-flex !important;

  align-items:center !important;

  width:max-content !important;
}


.footer-minimal-logo{
  display:block !important;

  width:220px !important;

  max-width:100% !important;

  height:auto !important;
}


.footer-minimal-links{
  display:flex !important;

  align-items:center !important;

  justify-content:flex-end !important;

  gap:28px !important;

  flex-wrap:wrap !important;
}


.footer-minimal-links a{
  color:#c6d1e2 !important;

  font-size:13px !important;

  font-weight:700 !important;

  letter-spacing:.055em !important;

  text-decoration:none !important;
}


.footer-minimal-links a:hover{
  color:#ffffff !important;
}


.footer-minimal-bottom{
  padding-top:18px !important;
  padding-bottom:23px !important;

  border-top:
    1px solid
    rgba(255,255,255,.12) !important;

  color:#8f9fb6 !important;

  font-size:13px !important;
}


/* botón volver arriba */

.site-footer-simple .back-to-top{
  width:42px !important;
  height:42px !important;

  display:flex !important;

  align-items:center !important;
  justify-content:center !important;

  border:
    1px solid
    rgba(255,255,255,.20) !important;

  border-radius:50% !important;

  background:
    rgba(255,255,255,.07) !important;

  color:#ffffff !important;

  font-size:21px !important;

  text-decoration:none !important;
}


.site-footer-simple .back-to-top:hover{
  background:
    rgba(255,255,255,.14) !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:750px){

  .footer-minimal{
    grid-template-columns:
      1fr
      auto !important;

    gap:
      24px
      20px !important;

    padding-top:30px !important;
  }

  .footer-minimal-links{
    grid-column:1 / -1 !important;

    justify-content:flex-start !important;

    gap:
      12px
      22px !important;
  }

  .footer-minimal-logo{
    width:195px !important;
  }

}


/* =========================================================
   SHARK HERO BACKGROUND
   HOME - FONDO 1
   ========================================================= */

.hero{
    position:relative !important;

    background-image:
        linear-gradient(
            90deg,
            rgba(255,255,255,.96) 0%,
            rgba(255,255,255,.91) 42%,
            rgba(255,255,255,.62) 72%,
            rgba(255,255,255,.38) 100%
        ),
        url("https://sharkinversiones.com/wp-content/uploads/2026/08/fondo1.png") !important;

    background-size:cover !important;

    background-position:center center !important;

    background-repeat:no-repeat !important;
}


/*
 * El contenido queda siempre sobre el fondo.
 */

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


/*
 * Evitar que alguna regla anterior deje una
 * caja independiente dentro del hero.
 */

.hero::before{
    pointer-events:none;
}


/* MOBILE */

@media(max-width:700px){

    .hero{
        background-image:
            linear-gradient(
                rgba(255,255,255,.93),
                rgba(255,255,255,.93)
            ),
            url("https://sharkinversiones.com/wp-content/uploads/2026/08/fondo1.png") !important;

        background-position:center center !important;
    }

}

