/* Landing del Temario General de Andalucia.
   Extraido del bloque HTML de la pagina 13089 el 2026-09-20.
   Se encola solo en la plantilla template-temario-general.php. */
#main {
    padding: 0px;
}
.breadcrumbs-listing,
.heading {
    display: none !important;
}
.site-content-contain {
    padding-top: 0px !important;
}
#comprar a:hover {
    color: black !important;
}
#colophon {
    margin-top: 0px !important;
}
.site-footer .site-info {
    margin-top: 0px !important;
}
.site-info {
    border-top: 0px !important;
}

.otl {
    --otl-black: #24354e;
    --otl-black-2: #15181d;
    --otl-lime: #d9ff4e;
    --otl-lime-dark: #b9df2e;
    --otl-cream: #f7f5ef;
    --otl-white: #fff;
    --otl-ink: #14171c;
    --otl-muted: #666f7a;
    --otl-line: #e7e3d8;
    font-family:
        "Manrope",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        sans-serif;
    color: var(--otl-ink);
    background: #fff;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}
.otl,
.otl * {
    box-sizing: border-box;
}
.otl h1,
.otl h2,
.otl h3 {
    font-weight: 800;
    letter-spacing: -0.02em;
    margin: 0 0 0.5em;
    line-height: 1.1;
}
.otl p {
    margin: 20px auto;
}
.otl a {
    text-decoration: none;
}

.otl-wrap {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 1;
}
.otl-wrap--narrow {
    max-width: 720px;
}
.otl-section {
    padding: 80px 0;
}
.otl-section--alt {
    background: var(--otl-cream);
}

/* Reveal on scroll */
.otl-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity 0.6s ease,
        transform 0.6s ease;
}
.otl-reveal.otl-visible {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    .otl-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* HERO */
.otl-hero {
    position: relative;
    overflow: hidden;
    background: var(--otl-black);
    color: #f2f1ea;
    padding: 96px 0;
    text-align: center;
}
.otl-grain {
    position: absolute;
    inset: 0;
    opacity: 0.5;
    pointer-events: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/></svg>");
}
.otl-eyebrow {
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 12px;
    font-weight: 700;
    color: var(--otl-lime);
    background: rgba(217, 255, 78, 0.1);
    border: 1px solid rgba(217, 255, 78, 0.35);
    padding: 6px 14px;
    border-radius: 999px;
    margin: 0 0 20px;
}
.otl-h1 {
    font-size: clamp(30px, 5.2vw, 52px);
    margin-left: auto;
    margin-right: auto;
}
.otl-accent-text {
    color: var(--otl-lime);
}
.otl-lead {
    font-size: 18px;
    color: #c7c9c2;
    max-width: 600px;
    margin: 0 auto 32px;
    font-weight: 500;
}
.otl-buybox {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}
.otl-price {
    font-size: 22px;
    font-weight: 800;
}
.otl-price small {
    font-weight: 500;
    font-size: 13px;
    color: #a9ab9f;
    display: block;
}
.otl-microtrust {
    margin-top: 16px;
    font-size: 13px;
    color: #8f9289;
}

.otl-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 15px 28px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 16px;
    transition:
        transform 0.15s ease,
        background 0.15s ease,
        box-shadow 0.15s ease;
}
.otl-btn--accent {
    background: var(--otl-lime);
    color: #10130a;
    box-shadow: 0 0 0 0 rgba(217, 255, 78, 0.5);
}
.otl-btn--accent:hover {
    background: var(--otl-lime-dark);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(217, 255, 78, 0.25);
    color: black;
}
.otl-btn--lg {
    padding: 18px 36px;
    font-size: 18px;
}
.otl-btn--sm {
    padding: 10px 20px;
    font-size: 14px;
}

.otl-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    max-width: 720px;
    margin: 48px auto 0;
}
.otl-stat {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    padding: 18px 8px;
}
.otl-stat strong {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: #fff;
}
.otl-stat span {
    font-size: 12px;
    color: #a9ab9f;
}

.otl-hero--cta {
    padding: 80px 0;
}
.otl-h2--onhero {
    color: #fff;
    font-size: clamp(26px, 4vw, 38px);
}

/* Genéricos */
.otl-h2 {
    font-size: 30px;
}
.otl-h2--center {
    text-align: center;
}
.otl-h4 {
    color: #00316a;
}
.otl-p--center {
    text-align: center;
}
.otl-note {
    text-align: center;
    font-style: italic;
    color: var(--otl-muted);
    font-size: 14px;
}
.otl-warn {
    text-align: center;
    font-size: 13px;
    color: #8a5a12;
    background: #fbeecb;
    border: 1px solid #f0d99a;
    padding: 10px 14px;
    border-radius: 12px;
    max-width: 640px;
    margin: 0 auto 32px;
}

.otl-card {
    background: var(--otl-white);
    border: 1px solid var(--otl-line);
    border-radius: 20px;
    box-shadow: 0 1px 2px rgba(20, 23, 28, 0.04);
}

/* Checklist como chips */
.otl-checklist {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    max-width: 820px;
    margin: 32px auto 12px;
}
.otl-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--otl-white);
    border: 1px solid var(--otl-line);
    border-radius: 12px;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 500;
}
.otl-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--otl-black);
    color: var(--otl-lime);
    font-size: 11px;
    font-weight: 800;
    flex: none;
}

/* Tabla */
.otl-tablewrap {
    overflow-x: auto;
    margin-top: 28px;
    padding: 8px;
}
.otl-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 560px;
}
.otl-table th,
.otl-table td {
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid var(--otl-line);
    font-size: 14px;
    white-space: nowrap;
}
.otl-table tr:last-child td {
    border-bottom: none;
}
.otl-table th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--otl-muted);
    font-weight: 700;
}
.otl-table td:nth-child(4) {
    display: flex;
    align-items: center;
    gap: 10px;
}
.otl-bar {
    width: 80px;
    height: 8px;
    background: var(--otl-line);
    border-radius: 99px;
    overflow: hidden;
}
.otl-bar span {
    display: block;
    height: 100%;
    background: var(--otl-black);
    border-radius: 99px;
}

/* Testimonios */
.otl-testimonials {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.otl-quote {
    margin: 0;
    padding: 28px 24px;
    font-size: 15px;
    position: relative;
}
.otl-quotemark {
    font-size: 40px;
    font-weight: 800;
    color: var(--otl-lime-dark);
    line-height: 1;
    display: block;
    margin-bottom: 4px;
}
.otl-quote p {
    margin: 0 0 14px;
}
.otl-quote cite {
    font-style: normal;
    font-size: 13px;
    color: var(--otl-muted);
    font-weight: 700;
}

/* Equipo */
.otl-team {
    display: flex;
    justify-content: center;
    gap: 36px;
    flex-wrap: wrap;
    margin-top: 28px;
}
.otl-member {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 600;
}
.otl-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--otl-black);
    color: var(--otl-lime);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 16px;
}

/* Línea de tiempo */
.otl-timeline {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    margin-top: 32px;
    position: relative;
}
.otl-timeline::before {
    content: "";
    position: absolute;
    top: 19px;
    left: 16%;
    right: 16%;
    height: 2px;
    background: var(--otl-line);
    z-index: 0;
}
.otl-step {
    text-align: center;
    position: relative;
    z-index: 1;
}
.otl-stepnum {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--otl-black);
    color: var(--otl-lime);
    font-weight: 800;
    margin-bottom: 14px;
}
.otl-step h3 {
    font-size: 17px;
}
.otl-step p {
    font-size: 14px;
    color: var(--otl-muted);
}

/* Acordeón FAQ */
.otl-accordion {
    border-top: 1px solid var(--otl-line);
}
.otl-acc-item {
    border-bottom: 1px solid var(--otl-line);
}
.otl-acc-trigger {
    width: 100%;
    text-align: left;
    background: none;
    border: 0;
    cursor: pointer;
    padding: 18px 4px;
    font-family: inherit;
    font-weight: 700;
    font-size: 16px;
    color: var(--otl-ink);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    box-shadow: none !important;
}
.otl-acc-icon {
    flex: none;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid var(--otl-line);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    transition:
        transform 0.25s ease,
        background 0.2s ease,
        color 0.2s ease;
}
.otl-acc-trigger[aria-expanded="true"] .otl-acc-icon {
    transform: rotate(135deg);
    background: var(--otl-black);
    color: var(--otl-lime);
    border-color: var(--otl-black);
    box-shadow: none !important;
}
.otl-acc-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.otl-acc-inner {
    padding: 0 4px 18px;
    font-size: 15px;
    color: var(--otl-muted);
}
.otl-acc-inner p {
    margin: 0;
}
.otl-guarantee {
    margin-top: 24px;
    background: var(--otl-cream);
    border: 1px solid var(--otl-line);
    border-radius: 16px;
    padding: 16px 20px;
    text-align: center;
}

/* Barra fija móvil */
.otl-stickybar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(11, 13, 16, 0.75);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    transform: translateY(100%);
    transition: transform 0.25s ease;
    color: #fff;
}
.otl-stickybar.otl-show {
    transform: translateY(0);
}
.otl-stickybar span {
    font-weight: 800;
    font-size: 14px;
}

@media (max-width: 760px) {
    .otl-checklist {
        grid-template-columns: 1fr;
    }
    .otl-testimonials {
        grid-template-columns: 1fr;
    }
    .otl-timeline {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .otl-timeline::before {
        display: none;
    }
    .otl-stats {
        grid-template-columns: repeat(2, 1fr);
    }
    .otl-stickybar {
        display: flex;
    }
}

/* Boton de pago de LearnDash dentro de esta landing.
   El shortcode lo envuelve en .opotest-cta y llega sin estilos propios
   (estilo="0"), asi que se viste aqui igual que .otl-btn--accent.otl-btn--lg. */
.otl .opotest-cta {
    display: flex;
    justify-content: center;
}
.otl .opotest-cta .learndash-wrapper,
.otl .opotest-cta .learndash_checkout_buttons {
    margin: 0;
}
.otl .opotest-cta #btn-join,
.otl .opotest-cta .btn-join {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--otl-lime) !important;
    color: #10130a !important;
    box-shadow: 0 0 0 0 rgba(217, 255, 78, 0.5) !important;
    text-shadow: none !important;
    width: auto;
    cursor: pointer;
    transition:
        transform 0.15s ease,
        background 0.15s ease;
}
.otl .opotest-cta #btn-join::after {
    content: " →";
}
.otl .opotest-cta #btn-join:hover,
.otl .opotest-cta .btn-join:hover,
.otl .opotest-cta #btn-join:focus {
    background: var(--otl-lime-dark) !important;
    color: #10130a !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(217, 255, 78, 0.25) !important;
}
/* Si ya lo compro, en vez del boton sale un enlace a la descarga. */
.otl .opotest-cta-ya-comprado
/* Aviso que solo ve quien puede editar, donde LearnDash no pinta el boton. */
.otl .opotest-cta{flex-direction:column;align-items:center;gap:10px;}
.otl .opotest-cta-aviso{max-width:46ch;margin:0;font-size:.875rem;line-height:1.5;color:var(--otl-muted);text-align:center;}
.otl .opotest-cta #btn-join[disabled]{opacity:.5;cursor:not-allowed;}
 {
    text-align: center;
}
.otl .opotest-cta-ya-comprado
/* Aviso que solo ve quien puede editar, donde LearnDash no pinta el boton. */
.otl .opotest-cta{flex-direction:column;align-items:center;gap:10px;}
.otl .opotest-cta-aviso{max-width:46ch;margin:0;font-size:.875rem;line-height:1.5;color:var(--otl-muted);text-align:center;}
.otl .opotest-cta #btn-join[disabled]{opacity:.5;cursor:not-allowed;}
 a {
    color: var(--otl-lime);
    font-weight: 800;
}

/* Carrusel de testimonios: tres por vista en escritorio, dos en tableta,
   una en movil. La pista se mueve con transform, no con scroll. */
.otl-carousel{position:relative;}
.otl-carousel-viewport{overflow:hidden;}
.otl-carousel-track{
  display:flex;gap:20px;margin:0;padding:0;list-style:none;
  transition:transform .45s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.otl-carousel-slide{flex:0 0 calc((100% - 40px) / 3);display:flex;}
.otl-carousel-slide > .otl-quote{width:100%;display:flex;flex-direction:column;}
.otl-carousel-slide cite{margin-top:auto;padding-top:14px;font-style:normal;color:var(--otl-muted);}
/* Controles del carrusel. Secundarios a proposito: el lima esta reservado
   para el boton de compra, asi que aqui mandan la tinta y el filete.
   Van con !important porque el tema estira los <button> con su propio padding
   y les cuelga una sombra gris: sin esto salen ovalos de 100px con sombra. */
.otl-carousel-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:28px;}
.otl-carousel-btn{
  -webkit-appearance:none;appearance:none;
  box-sizing:border-box!important;
  width:40px!important;height:40px!important;
  min-width:0!important;min-height:0!important;
  padding:0!important;margin:0!important;
  display:inline-flex!important;align-items:center;justify-content:center;
  border:1px solid var(--otl-line)!important;border-radius:999px!important;
  background:transparent!important;background-image:none!important;
  color:var(--otl-muted)!important;
  box-shadow:none!important;text-shadow:none!important;
  font-size:0!important;line-height:1!important;cursor:pointer;
  transition:color .15s ease,border-color .15s ease,background .15s ease;
}
.otl-carousel-btn svg{width:16px;height:16px;display:block;}
.otl-carousel-btn:hover{
  background:var(--otl-white)!important;
  border-color:var(--otl-black)!important;
  color:var(--otl-black)!important;
}
.otl-carousel-btn:focus-visible{outline:3px solid var(--otl-black);outline-offset:3px;}
.otl-carousel-dots{display:flex;align-items:center;gap:8px;}
.otl-carousel-dot{
  -webkit-appearance:none;appearance:none;
  box-sizing:border-box!important;
  width:8px!important;height:8px!important;
  min-width:0!important;min-height:0!important;
  padding:0!important;margin:0!important;
  border:0!important;border-radius:999px!important;
  background:var(--otl-line)!important;background-image:none!important;
  box-shadow:none!important;cursor:pointer;
  transition:background .15s ease,width .15s ease;
}
.otl-carousel-dot[aria-current="true"]{background:var(--otl-black)!important;width:22px!important;}
.otl-carousel-dot:focus-visible{outline:3px solid var(--otl-black);outline-offset:3px;}
@media (max-width:980px){
  .otl-carousel-slide{flex-basis:calc((100% - 20px) / 2);}
}
@media (max-width:640px){
  .otl-carousel-track{gap:14px;}
  .otl-carousel-slide{flex-basis:100%;}
}
/* Quien pide menos movimiento no recibe ni transicion ni avance automatico. */
@media (prefers-reduced-motion:reduce){
  .otl-carousel-track{transition:none;}
}