/* ========================================
   Ser Profe UDP - Custom Styles
   Based on Figma Design Tokens
   ======================================== */


/* ABCArizonaFlare-Bold */
@font-face {
  font-family: 'ABC Arizona Flare';
  src: url('../fonts/ABCArizonaFlare-Bold.otf') format('opentype');
  font-weight: bold;
  font-style: normal;
}
/* ABCArizonaFlare-BoldItalic */
@font-face {
  font-family: 'ABC Arizona Flare';
  src: url('../fonts/ABCArizonaFlare-BoldItalic.otf') format('opentype');
  font-weight: bold;
  font-style: italic;
}
/* ABCArizonaFlare-Medium */
@font-face {
  font-family: 'ABC Arizona Flare';
  src: url('../fonts/ABCArizonaFlare-Medium.otf') format('opentype');
  font-weight: 500; /* or whatever value 'Medium' represents */
  font-style: normal;
}
/* ABCArizonaFlare-MediumItalic */
@font-face {
  font-family: 'ABC Arizona Flare';
  src: url('../fonts/ABCArizonaFlare-MediumItalic.otf') format('opentype');
  font-weight: 500; /* or whatever value 'Medium' represents */
  font-style: italic;
}
/* ABCArizonaFlare-Regular */
@font-face {
  font-family: 'ABC Arizona Flare';
  src: url('../fonts/ABCArizonaFlare-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}
/* ABCArizonaFlare-RegularItalic */
@font-face {
  font-family: 'ABC Arizona Flare';
  src: url('../fonts/ABCArizonaFlare-RegularItalic.otf') format('opentype');
  font-weight: normal;
  font-style: italic;
}
/* ABCArizonaFlare-Light */
@font-face {
  font-family: 'ABC Arizona Flare';
  src: url('../fonts/ABCArizonaFlare-Light.otf') format('opentype');
  font-weight: lighter;
  font-style: normal;
}
/* NectoMono-Regular */
@font-face {
  font-family: 'Necto Mono';
  src: url('../fonts/NectoMono-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

/* ---- CSS Custom Properties / Design Tokens ---- */
:root {
    /* Primary Colors */
    --sp-pink: #F59BC5;
    --sp-pink-light: #FDDEED;
    --sp-magenta: #E84FAC;
    --sp-purple: #7B2D8E;
    --sp-purple-dark: #5A1D6B;

    /* Accent Colors */
    --sp-lime: #C8F542;
    --sp-lime-hover: #B8E530;
    --sp-yellow: #FFD84D;
    --sp-yellow-light: #FFF4CC;
    --sp-orange: #F5A623;
    --sp-cyan: #4FD1C5;
    --sp-cyan-light: #B2F5EA;

    /* Neutrals */
    --sp-dark: #1A1A2E;
    --sp-dark-alt: #16213E;
    --sp-gray-900: #212529;
    --sp-gray-700: #495057;
    --sp-gray-500: #6C757D;
    --sp-gray-300: #DEE2E6;
    --sp-gray-100: #F8F9FA;
    --sp-white: #FFFFFF;

    /* Typography */
    --sp-font-heading: 'Work Sans', sans-serif;
    --sp-font-body: 'Work Sans', sans-serif;

    /* Spacing */
    --sp-section-py: 5rem;
    --sp-radius-sm: 0.5rem;
    --sp-radius-md: 1rem;
    --sp-radius-lg: 1.5rem;
    --sp-radius-xl: 2rem;
}

/* ---- Global Styles ---- */
html { overflow-x: hidden; max-width: 100%; }
body {
    font-family: var(--sp-font-body);
    color: var(--sp-gray-900);
    overflow-x: hidden;
    max-width: 100%;
}
/* Decorative random icons — clip inside their card on mobile so they don't
   push the viewport width and cause a horizontal scroll */
@media (max-width: 767.98px) {
    .destacado-color,
    .conoce_la_linea,
    .cta-doble-boton__inner {
        overflow: hidden !important;
    }
    .destacado-color__icon,
    .conoce-linea__icon,
    .cta-doble-boton__icon {
        max-width: 64px;
        width: 64px;
    }
    .destacado-color__icon--top-left,
    .conoce-linea__icon--top-left,
    .cta-doble-boton__icon--top-left { top: 6px; left: 6px; }
    .destacado-color__icon--top-right,
    .conoce-linea__icon--top-right,
    .cta-doble-boton__icon--top-right { top: 6px; right: 6px; }
    .destacado-color__icon--bottom-left,
    .conoce-linea__icon--bottom-left,
    .cta-doble-boton__icon--bottom-left { bottom: 6px; left: 6px; }
    .destacado-color__icon--bottom-right,
    .conoce-linea__icon--bottom-right,
    .cta-doble-boton__icon--bottom-right { bottom: 6px; right: 6px; }
}

h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
    font-family: var(--sp-font-heading);
    font-weight: 500;
}

.section-title {
    font-family: var(--sp-font-heading);
}

a {
    color: var(--sp-purple);
    transition: color 0.2s ease;
}

a:hover {
    color: var(--sp-purple-dark);
}

img {
    max-width: 100%;
    height: auto;
}

/* ---- Logo ---- */
.logo-text {
    display: inline-flex;
    flex-direction: column;
    line-height: 1;
    font-family: var(--sp-font-heading);
}

.logo-ser {
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.05em;
}

.logo-profe {
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.logo-udp {
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.1em;
}

/* ---- Navigation ---- */
.site-header {
    z-index: 1030;
	    top: 20px;
    width: 98%;
    margin-left: 15px;
	position:fixed;
}

.site-header .navbar {border-radius:20px;}

.navbar {
    padding: 0.75rem 0;
}

.navbar-brand {
    padding: 0;
}

.navbar-brand img {
    height: 90px;
    width: auto;
}

.nav-link {
    font-size: 16px;
    font-weight: 500;
    color: var(--sp-gray-700) !important;
    padding: 0.5rem 1.6rem !important;
    transition: color 0.2s ease;
}

.nav-link:hover,
.nav-link.active,
.nav-item.active .nav-link {
    color: var(--sp-gray-700) !important;
}

/* CTA Button */
.btn-cta {
    background-color: #015CE4;
    color: #FFF;
    border: none;
	border-radius:7px!important;
	text-transform:uppercase;
    border-radius: 50px;
    padding: 0.5rem 1.5rem;
    font-weight: 600;
    font-size: 15px;
    transition: all 0.3s ease;
}

.btn-cta:hover {
    background-color: #015CE4;
    color: #FFF;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(200, 245, 66, 0.4);
}

/* ---- Buttons ---- */

.btn-accent-lime {
    background-color: var(--sp-lime);
    color: var(--sp-gray-900);
    border: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-accent-lime:hover {
    background-color: var(--sp-lime-hover);
    color: var(--sp-gray-900);
    transform: translateY(-1px);
}

.btn-link-arrow {
    color: var(--sp-purple);
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.btn-link-arrow:hover {
    color: var(--sp-purple-dark);
    gap: 0.5rem;
}

/* ---- Menu ---- */

.dropdown-item:hover, .dropdown-item:focus {background:none!important;}

/* ---- Hero Section ---- */

.hero-section {
    background-color: #E7E4D9;
    min-height: 650px;
	padding-top: 180px;
}

.hero-image-wrapper {
    position: absolute;
    inset: 0;
}

.hero-bg-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-overlay {
    position: absolute;
    inset: 0;
}

.hero-title {
    color: var(--sp-gray-900);
	margin-top: 0;
	font-weight: 600 !important;
}

.hero-subtitle {
    color: #222;
    font-weight: 500;
    padding-right: 10%;
}

.min-vh-50 {
    min-height: 50vh;
}

.btn-ver-video {border:1px solid #000; border-radius:5px; text-align: center; color:#000; text-decoration:none;     width: fit-content;
    padding: 5px 10px;
    display: block;
    margin-bottom: 30px;}

/* Interiores */
.page-content {border-top-left-radius:20px; border-top-right-radius:20px; background-color:#FFF; }
.post_parent {font-size:18px; margin-bottom:0;}
p.en_esta_pagina {text-transform:uppercase; font-size:12px; color:#111; margin-top:0;}
ul.sub-temas {padding-left:0;}
ul.sub-temas li {list-style:none; margin-bottom:10px;}
ul.sub-temas li a {text-decoration:none; color:#000; display:block; font-size:14px; font-weight:400;}
ul.sub-temas li a:hover {color:#000;}
.hero-inner {
    background-color: var(--sp-pink);
	height: 400px;
    padding-top: 200px !important;
}

/* Nosotros */

body.parent-pageid-9 .hero-inner {
    background-color: #F59BC5;
}

/* Red Ser Profe UDP */

body.parent-pageid-21 .hero-inner {
    background-color: #2fcc65;
}

div.repeat-alianza {background-color:#f8f7f4; border-radius:10px; padding:20px; margin-bottom:30px;}
div.repeat-alianza div.thumb {display:block; border-top-left-radius:10px; border-top-right-radius:10px; margin-bottom:20px; overflow:hidden; height:150px; background-position:center center; background-repeat:no-repeat; background-size:cover;}
div.repeat-alianza h5 {font-size:1rem; margin-bottom:20px;}
div.repeat-alianza p {font-size:0.8rem;}
div.repeat-alianza p a {color:#111; text-decoration:none;}

div.repeat-bloque {border-radius:20px; padding:30px; min-height:280px; margin-bottom:30px;}
div.repeat-bloque img {height:60px!important; width:auto!important; margin-bottom:20px;}
div.repeat-bloque a {display:block; text-decoration:none; color:#000;}
div.repeat-bloque h5 {}
div.repeat-bloque p {}

body.page-id-33 div.repeat-bloque {min-height:430px;}

/* Familias y Ser Profe UDP */

body.parent-pageid-29 .hero-inner {
    background-color: #754a99;
	color:#FFF;
}

body.parent-pageid-29 .hero-inner .post_parent img {filter:invert(1)}


/* Preguntas Frecuentes */

body.page-id-37 .hero-inner {
    background-color: #FECE00;
}

body.page-id-37 .hero-title {
    color: #FFF;
}

.accordion-button:not(.collapsed) {background-color:#e6e4da!important; color:#000!important;}


/* Contacto */

body.page-id-40 .hero-inner {
    background-color: #fb9a00;
}

body.page-id-40 .hero-title {
   
}

/* Derribando Mitos */
.repeat-mito {margin-bottom:20px;}
.box-mito {background-color:#fc471b; padding:30px; border-radius:20px; font-size:30px; line-height:120%;}
.box-respuesta {background-color:#015ce4; padding:30px; border-radius:20px; color:#FFF; font-size:18px; }
.box-respuesta ul {padding-left:15px;}
.box-respuesta ul li {margin-bottom:15px;}

@media (max-width: 992px) {
  .repeat-mito > [class*="col-"] {
    display: block;
	margin-bottom:30px;  
  }
  .repeat-mito .box-mito,
  .repeat-mito .box-respuesta {
    height: auto;
    width: auto;
	padding-bottom:60px;  
  }
	.page-container {
    border-left: none!important;
    padding-left: 0!important;
}
	.site-header {width: 93%;}
}

@media (min-width: 992px) {
  .repeat-mito > [class*="col-"] {
    display: flex;
  }
  .repeat-mito .box-mito,
  .repeat-mito .box-respuesta {
    height: 100%;
    width: 100%;
  }
}


/* Secciones */

.page-container {border-left:1px solid #000; padding-left:30px;}

.destacado {border-radius:20px; padding:30px; margin:30px 0;}
.destacado h3 {margin-bottom:30px; margin-top:0; font-size:26px; line-height:130%;}
.destacado p {font-weight:400; font-size:24px;}
.destacado small {font-size:16px; opacity:0.7;}

.conoce_la_linea {border-radius:20px; padding:30px; margin:30px 0;}
.conoce_la_linea h3 {margin-bottom:30px; margin-top:0; font-size:32px; line-height:130%;}
.conoce_la_linea p {font-weight:400; font-size:24px;}
.conoce_la_linea small {font-size:16px; opacity:0.7;}
.conoce_la_linea a {display:block; text-decoration:none;}

.contenido {margin:30px 0;}
.contenido p {margin-bottom:30px; line-height:150%; font-size:18px;}
.contenido h3 {margin-bottom:30px; margin-top:0; font-size:26px; line-height:130%;}
.contenido h4 {margin-bottom:30px; margin-top:0; font-size:20px; line-height:130%;}
.page-container h2 {margin-bottom:30px; margin-top:0; font-size:40px;}

div.foto-destacado {background-position:center center; background-repeat: no-repeat; background-size: cover; border-radius:10px; overflow: hidden; width:100%; height: 200px; margin-bottom:20px;}

.cita {margin:30px 0 60px; font-weight:400; font-size:24px;}
.cita small {font-size:16px; opacity:0.7;}

.video {margin:30px 0;}
.video iframe {width:100%; height:480px;}

.hero-nosotros {
    background: linear-gradient(135deg, var(--sp-pink) 0%, var(--sp-magenta) 100%);
}

.hero-quienes {
    background: linear-gradient(135deg, var(--sp-pink) 0%, var(--sp-pink-light) 100%);
}

/* ---- Portada Page ---- */
.hero-portada {border-top-left-radius:20px; border-top-right-radius:20px; margin-top:-20px; background-color: #dcd9cc; overflow: hidden;}
.hero-portada .container-fluid {padding-left: 0!important; padding-right: 0!important;}
.hero-portada { min-height: 70vh; }
@media (min-width: 992px) {
    .hero-portada .row { min-height: 70vh; align-items: stretch; }
    .hero-portada .row > [class*="col-"] { position: relative; min-height: 70vh; padding: 0; }
    .hero-portada .row > [class*="col-"] > .thumb-page-portada {
        position: absolute !important;
        top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
    }
}
.thumb-page-portada {
    width: 100%;
    min-height: 240px;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    overflow: hidden;
}
.title-portada {padding: 16%; position: relative;}
.title-portada h2 {font-weight: 600; font-size: 40px; line-height: 130%;}
.title-portada a.btn-descubre-mas {display: inline-block; margin: 30px 0; background-color: #000; color:#FFF; text-align: center; border-radius: 8px; padding: 10px 20px;}
.title-portada img {position: absolute;}
.title-portada img.img-01 {top:30px; left: 30px;}
.title-portada img.img-02 {right: 30px; top:60px;}
.title-portada img.img-03 {bottom: 60px; right:90px;}

/* ---- Hero ---- */

.hero-icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    background-color: var(--sp-lime);
    border-radius: 50%;
    color: var(--sp-gray-900);
}

.text-accent-lime {
    color: var(--sp-lime) !important;
}

/* ---- Section Backgrounds ---- */
.bg-pink {
    background-color: var(--sp-pink-light) !important;
}

.bg-purple {
    background-color: var(--sp-purple) !important;
}

.bg-accent-yellow {
    background-color: var(--sp-yellow-light) !important;
}

.bg-accent-lime {
    background-color: var(--sp-lime) !important;
}

.bg-cyan {
    background-color: var(--sp-cyan-light) !important;
}

.bg-category {
    background-color: var(--sp-purple) !important;
    color: var(--sp-white);
}

.text-purple {
    color: var(--sp-purple) !important;
}

/* ---- Cards ---- */
.card-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1) !important;
}

.card-img-top-wrapper {
    overflow: hidden;
}

.card-img-top-wrapper img {
    transition: transform 0.4s ease;
}

.card-hover:hover .card-img-top-wrapper img {
    transform: scale(1.05);
}

/* News Ticker Cards */
.news-ticker-card {
    transition: all 0.3s ease;
}

.news-ticker-card:hover {
    border-color: var(--sp-purple) !important;
}

/* Video Cards */
.video-card .video-placeholder {
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.video-card:hover .video-placeholder {
    opacity: 0.9;
}

/* Feature Cards */
.feature-card {
    transition: transform 0.3s ease;
}

.feature-card:hover {
    transform: translateY(-4px);
}

/* ---- Testimonials ---- */
.testimonial-card {
    background-color: var(--sp-white);
    border: 1px solid var(--sp-gray-300);
    display: flex;
    flex-direction: column;
}

.testimonial-text {
    font-style: italic;
    color: var(--sp-gray-700);
    line-height: 1.7;
}

.quote-icon span {
    color: var(--sp-purple);
}

/* ---- Team Members ---- */
.team-photo-wrapper {
    width: 120px;
    height: 120px;
}

.team-photo {
    width: 120px;
    height: 120px;
    object-fit: cover;
}

.team-photo-placeholder {
    width: 120px;
    height: 120px;
    background-color: var(--sp-gray-300);
}

.team-name {
    font-family: var(--sp-font-heading);
}

/* ---- Career Cards ---- */
.career-card .career-img-wrapper {
    height: 180px;
    overflow: hidden;
}

.career-card .career-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.career-card:hover .career-img-wrapper img {
    transform: scale(1.05);
}

/* ---- Timeline ---- */
.timeline-item {
    position: relative;
    border-left: 3px solid var(--sp-purple);
}

/* ---- Blockquote ---- */
.blockquote-custom {
    border-left: 4px solid var(--sp-purple);
}

.blockquote-custom p {
    font-style: italic;
    font-size: 1.1rem;
    line-height: 1.7;
}

/* ---- Sidebar Navigation ---- */
.sidebar-nav .nav-link {
    font-size: 0.9rem !important;
    color: var(--sp-gray-500) !important;
    padding: 0.5rem 1rem !important;
    border-left: 3px solid transparent;
    border-radius: 0;
}

.sidebar-nav .nav-link.active,
.sidebar-nav .nav-link:hover {
    color: var(--sp-purple) !important;
    border-left-color: var(--sp-purple);
    background-color: var(--sp-pink-light);
}


/* ---- Section Hero ---- */

.hero-image-wrapper {position:relative; margin-top: 0; border-radius:20px; overflow:hidden;}

/* ---- Section News ---- */
.necto {font-family: 'Necto Mono', monospace; text-transform:uppercase; }
.section-news-ticker {padding-bottom:90px!important; background-color: #E7E4D9;}
.news-ticker-card { min-height:360px; position:relative;}
.news-ticker-card .bg-category {background: none !important;
    border: 1px solid #222;
    color: #222;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-radius: 20px;
    padding: 6px 15px !important;
    font-size: 14px;
    font-weight: normal;
    line-height: 100%;
	margin-bottom:20px!important;
}
.news-ticker-card .bg-category a {text-decoration:none; color:#222;}
.news-ticker-card h5 {font-weight:600; padding-right:10%;}

#news-0 span.img-svg {position:absolute; top:85%; left: 78%; height:110px; width:110px; background-image:url(https://serprofe.udp.cl/cms/wp-content/uploads/2026/04/Vector-10.svg); background-position:center center; background-repeat:no-repeat; background-size:contain;}
#news-1 span.img-svg {position:absolute; top:-60px; left: 38%; height:100px; width:100px; background-image:url(https://serprofe.udp.cl/cms/wp-content/uploads/2026/04/Vector-2.svg); background-position:center center; background-repeat:no-repeat; background-size:contain;}
#news-2 span.img-svg {position:absolute; top:80%; left: 80%; height:100px; width:100px; background-image:url(https://serprofe.udp.cl/cms/wp-content/uploads/2026/04/Union-3.svg); background-position:center center; background-repeat:no-repeat; background-size:contain;}


/* ---- Section Que es ---- */

section.section-que-es {background-color: #015ce5; border-radius: 20px; width: 90%; margin: 60px auto 120px; color: #FFF; position:relative;}
section.section-que-es .section-title {font-weight:500; font-size:44px;}
section.section-que-es img.img-svg {position: absolute; top:-30px; left:88%;}
section.section-que-es img.img-svg-2 {position: absolute; bottom:-30px; left:2%;}
section.section-que-es .btn-1 {background-color:#FFF; color:#222; border-radius:7px!important;}
section.section-que-es .btn-2 {border:1px solid #FFF; color:#FFF; border-radius:7px!important;}

/* ---- Section Descubre ---- */

section.section-descubre {background-color:#222; border-top-left-radius:20px; border-top-right-radius:20px; margin-top:-20px; position:relative; padding:90px 0!important;}
section.section-descubre img.img-svg {position: absolute; top:-30px; left:45%;}
section.section-descubre .section-title {text-align:left; border-bottom:1px solid #FFF; font-weight:500; font-size:44px; padding-bottom:10px; margin-bottom:30px; color:#FFF;}
section.section-descubre .video-card {background-position:center center; background-size:cover; background-repeat:no-repeat; height:320px;}
section.section-descubre .video-card h5 {color:#FFF; padding:30px; min-height:108px; background: linear-gradient(0deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);}

/* ---- Section Como Funciona ---- */

section.section-como-funciona {background-color:#FFF; border-top-left-radius:20px; border-top-right-radius:20px; margin-top:-20px; position:relative; padding:90px 0!important;}
section.section-como-funciona img.img-svg {position: absolute; top:-30px; left:30%;}
section.section-como-funciona .section-title {font-weight:600; font-size:40px;}
section.section-como-funciona .feature-card {background-color:#f8f7f3;}
section.section-como-funciona .feature-card .btn-link-arrow {color:#222;}
section.section-como-funciona .feature-card .feature-img {height:250px; overflow:hidden;}


/* ---- Section Nuestro Equipo ---- */

section.section-equipo {background-color:#f9f7f4; border-top-left-radius:20px; border-top-right-radius:20px; margin-top:-20px; position:relative;}
section.section-equipo {background-image:url(https://serprofe.udp.cl/cms/wp-content/uploads/2026/04/Union-3.svg), url(https://serprofe.udp.cl/cms/wp-content/uploads/2026/04/Union-2.svg); background-repeat:no-repeat, no-repeat; background-position:95% 80%, 70% 20%;}
section.section-equipo img.img-svg {position: absolute; top:-30px; left:90px;}
section.section-equipo .section-title {font-weight:600; font-size:40px;}
section.section-equipo p {font-size:24px; width:75%;}
section.section-equipo .btn {background-color:#222; color:#FFF; border-radius:7px!important;}

/* ---- Section Eventos ---- */

section.section-eventos {background-color:#fc9b00; border-top-left-radius:20px; border-top-right-radius:20px; margin-top:-20px; position:relative;}
section.section-eventos img.img-svg {position: absolute; top:-30px; left:30px;}
section.section-eventos {background-image:url(https://serprofe.udp.cl/cms/wp-content/uploads/2026/04/Union.svg); background-repeat:no-repeat; background-position:95% 80%;}
section.section-eventos .btn {background-color:#222; color:#FFF; border-radius:7px!important; float:right;}
section.section-eventos .section-title {font-weight:600; font-size:40px;}

/* ---- Section Historias ---- */

section.section-historias {border-top-left-radius:20px; border-top-right-radius:20px; margin-top:-20px; background-color:#FFF;}
section.section-historias .section-title {text-align:left; border-bottom:1px solid #000; font-weight:500; font-size:44px; padding-bottom:10px; margin-bottom:30px;}
section.section-historias .btn {border-radius:5px!important;}
section.section-historias .btn-conoce-mas {background-color:#222; color:#FFF;}
section.section-historias .testimonial-card {border:none;}
section.section-historias .testimonial-card .quote-icon span {color:#44ccff!important; font-size: 120px; line-height: 100%; display: block; height: 80px;}
section.section-historias .testimonial-card .testimonial-text {font-style:normal; font-size:18px; line-height:150%;}

/* ---- Section Carreras ---- */

section.section-carreras {border-top-left-radius:20px; border-top-right-radius:20px; background-color:#e7e4d9;} 
section.section-carreras .section-title {font-weight:600; font-size:44px;}

.career-card {min-height:400px;}
.career-img-wrapper {margin:20px 20px 0 20px;}
.career-card .card-title {text-align:left; font-size: 18px; min-height: 70px; margin-bottom: 20px;}
.career-card .btn {display:block; border-radius:7px!important; margin-bottom:10px;}
.career-card .btn-carrera {background-color:#222; color:#FFF;}

/* ---- Link Cards ---- */

section.section-enlaces {border-top-left-radius:20px; border-top-right-radius:20px; margin-top:-20px; }
.link-card {
	background-color: #000;
    color: #FFF;
	min-height:280px;
}
.link-card h5 {font-size:24px;}
.link-card h5 a {text-decoration:none;}
.link-card a {color: #FFF;}
.link-card .btn-link-arrow {color:#FFF;}


/* ---- Accordion ---- */
.accordion-button {
    font-family: var(--sp-font-heading);
    font-weight: 500;
	font-size: 1.5rem;
	background-color:#F8F7F4;
}


.accordion-button:focus {
    box-shadow: none;
}

/* ---- Stat Cards ---- */
.stat-card {
    transition: transform 0.3s ease;
}

.stat-card:hover {
    transform: translateY(-4px);
}

/* ---- Contact Form ---- */
.contact-form .form-control,
.contact-form .form-select {
    border-color: var(--sp-gray-300);
    padding: 0.75rem 1rem;
}

.contact-form .form-control:focus,
.contact-form .form-select:focus {
    border-color: var(--sp-purple);
    box-shadow: 0 0 0 0.2rem rgba(123, 45, 142, 0.15);
}

/* ---- Footer ---- */
.site-footer {
    background-color: #000 !important;
	border-top-left-radius:20px;
	border-top-right-radius:20px;
}

.site-footer .footer-logo {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.site-footer .footer-logo img {
    width:auto;
	height:150px;
	object-fit:contain;
}

.site-footer .footer-sticker img {
    width:auto;
	height:200px;
	object-fit:contain;
}

.site-footer .footer-logo .logo-ser {
    font-size: 0.875rem;
}

.site-footer .text-muted {opacity:0.3; color:#FFF!important;}

.site-footer .footer-logo .logo-profe {
    font-size: 2rem;
    font-weight: 800;
    font-family: var(--sp-font-heading);
}

.site-footer .footer-logo .logo-udp {
    font-size: 0.875rem;
}

    .footer-contact {
        justify-content: left;
		margin-top:30px;
    }

.social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.3);
    transition: all 0.3s ease;
}

.social-link:hover {
    background-color: var(--sp-lime);
    border-color: var(--sp-lime);
    color: var(--sp-gray-900) !important;
}

.footer-partner-logo {
    opacity: 0.7;
    transition: opacity 0.3s ease;
}

.footer-partner-logo:hover {
    opacity: 1;
}

/* ---- 404 Page ---- */
.error-404 .display-1 {
    font-size: 8rem;
}

/* ---- Post Content ---- */
.entry-content {
    font-size: 1.05rem;
    line-height: 1.8;
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.entry-content img {
    border-radius: var(--sp-radius-md);
}

.entry-content blockquote {
    border-left: 4px solid var(--sp-purple);
    padding: 1rem 1.5rem;
    background-color: var(--sp-gray-100);
    border-radius: 0 var(--sp-radius-sm) var(--sp-radius-sm) 0;
    margin: 1.5rem 0;
}

/* ---- WordPress Specific ---- */
.wp-block-image img {
    border-radius: var(--sp-radius-md);
}

.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin: 0 0.25rem;
    text-decoration: none;
    color: var(--sp-gray-700);
    transition: all 0.3s ease;
}

.page-numbers:hover,
.page-numbers.current {
    background-color: var(--sp-purple);
    color: var(--sp-white);
}

/* ---- Scrollbar Marquee (inscríbete) ---- */
.marquee-bar {
    background-color: var(--sp-lime);
    overflow: hidden;
    white-space: nowrap;
    padding: 0.5rem 0;
}

.marquee-bar .marquee-text {
    display: inline-block;
    animation: marquee 20s linear infinite;
    font-weight: 700;
    font-size: 0.875rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

@keyframes marquee {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

/* ---- Utility Classes ---- */
.rounded-4 {
    border-radius: var(--sp-radius-lg) !important;
}

.gap-3 {
    gap: 1rem !important;
}

/* ---- Animations ---- */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in-up {
    animation: fadeInUp 0.6s ease forwards;
}

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

/* Large Desktop (1440px+) */
@media (min-width: 1400px) {
    .container {
        max-width: 1320px;
    }
}

/* Tablet (768px - 1024px) */
@media (max-width: 1024px) {
    .hero-section {
        min-height: 350px;
    }

    .hero-title {
        font-size: 2.5rem;
    }

    .display-4 {
        font-size: 2.25rem;
    }
}

/* Mobile (max 767px) */
@media (max-width: 767.98px) {
    :root {
        --sp-section-py: 3rem;
    }

    /* Navigation */
    .navbar-collapse {
        padding: 1rem 0;
    }

    .navbar-nav {
        gap: 0;
    }

    .btn-cta {
        width: 100%;
        text-align: center;
        margin-top: 0.5rem;
    }

    /* Hero */
    .hero-section {
        min-height: auto;
        padding: 3rem 0;
    }

    .hero-title {
        font-size: 2rem;
    }

    .hero-subtitle {
        font-size: 1rem;
    }

    .min-vh-50 {
        min-height: auto;
    }

    /* Sections */
    .display-3 { font-size: 2rem; }
    .display-4 { font-size: 1.75rem; }
    .display-5 { font-size: 1.5rem; }

    .section-title {
        font-size: 1.5rem;
    }

    /* Team */
    .team-photo-wrapper,
    .team-photo,
    .team-photo-placeholder {
        width: 90px;
        height: 90px;
    }

    /* Cards */
    .news-ticker-card {
        flex-direction: column;
    }

    .news-ticker-img {
        width: 100% !important;
    }

    .news-ticker-img img {
        width: 100% !important;
        height: 150px !important;
    }

    /* Footer */
    .site-footer {
        text-align: center;
    }

    .footer-social {
        justify-content: center !important;
    }

    .footer-contact {
        justify-content: left;
		margin-top:30px;
    }

    /* Sidebar nav becomes horizontal on mobile */
    .sidebar-nav {
        position: static !important;
    }

    .sidebar-nav .nav {
        flex-direction: row !important;
        flex-wrap: wrap;
        gap: 0.5rem !important;
    }

    .sidebar-nav .nav-link {
        border-left: none !important;
        border-bottom: 2px solid transparent;
        font-size: 0.8rem !important;
        padding: 0.5rem !important;
    }

    .sidebar-nav .nav-link.active,
    .sidebar-nav .nav-link:hover {
        border-left-color: transparent !important;
        border-bottom-color: var(--sp-purple);
    }

    /* Events */
    .d-flex.justify-content-between {
        flex-direction: column;
        gap: 1rem;
    }

    /* Accordion */
    .accordion-button {
        font-size: 0.9rem;
        padding: 0.75rem 1rem;
    }

    /* 404 */
    .error-404 .display-1 {
        font-size: 5rem;
    }

    /* Hero Icons */
    .hero-icon-badge {
        width: 70px;
        height: 70px;
    }

    .hero-icon-badge i {
        font-size: 2rem !important;
    }
}

/* Small Mobile (max 480px) */
@media (max-width: 480px) {
    .hero-title {
        font-size: 1.75rem;
    }

    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .btn-lg {
        font-size: 0.9rem;
        padding: 0.6rem 1.5rem;
    }
}

/* ========================================
   RESPONSIVE AUDIT — PASS 1
   Adjustments to make full theme responsive
   ======================================== */

/* ---- Tablet (<= 991.98px) ---- */
@media (max-width: 991.98px) {
    /* Hero interior */
    .hero-inner {
        height: auto;
        min-height: 260px;
        padding-top: 140px !important;
        padding-bottom: 40px;
    }

    /* Portada page */
    .title-portada { padding: 8% 6%; }
    .title-portada h2 { font-size: 30px; }
    .thumb-page-portada { height: 45vh; min-height: 280px; }
    .title-portada img.img-01,
    .title-portada img.img-02,
    .title-portada img.img-03 { max-width: 70px; height: auto; }

    /* Front-page section titles */
    section.section-que-es .section-title,
    section.section-descubre .section-title,
    section.section-historias .section-title,
    section.section-carreras .section-title { font-size: 32px; }

    section.section-como-funciona .section-title,
    section.section-equipo .section-title,
    section.section-eventos .section-title { font-size: 30px; }

    section.section-equipo p { width: 100%; font-size: 18px; }

    /* Eventos button stops floating right */
    section.section-eventos .btn { float: none; display: inline-block; }
    section.section-eventos .row > .col-6 { width: 100%; max-width: 100%; flex: 0 0 100%; text-align: left; }

    /* Section que-es internal width */
    section.section-que-es { width: 94%; margin: 30px auto 60px; }

    /* Min-heights on cards relaxed */
    .news-ticker-card,
    .career-card,
    .link-card,
    .repeat-bloque,
    body.page-id-33 .repeat-bloque { min-height: 0; }

    /* Page container */
    .page-container h2 { font-size: 28px; }

    /* Destacado / contenido */
    .destacado h3,
    .conoce_la_linea h3,
    .contenido h3 { font-size: 22px; }
    .destacado p,
    .conoce_la_linea p,
    .cita { font-size: 18px; }

    /* Mitos */
    .box-mito { font-size: 22px; padding: 24px; }
    .box-respuesta { font-size: 16px; padding: 24px; }

    /* Video aspect-ratio responsive */
    .video iframe {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    /* Hide decorative SVG blobs that overflow on tablets/phones */
    section.section-que-es img.img-svg,
    section.section-que-es img.img-svg-2,
    section.section-descubre img.img-svg,
    section.section-como-funciona img.img-svg,
    section.section-equipo img.img-svg,
    section.section-eventos img.img-svg,
    #news-0 span.img-svg,
    #news-1 span.img-svg,
    #news-2 span.img-svg { display: none; }

    /* Section equipo background images scaled down */
    section.section-equipo { background-size: 80px, 80px; background-position: 95% 95%, 70% 10%; }

    /* Home hero image — limit height on tablet */
    .hero-section .hero-image-wrapper {
        height: 380px !important;
        max-height: 380px;
        width: 100%;
        overflow: hidden;
        border-radius: 16px;
    }
    .hero-section .hero-image-wrapper img,
    .hero-section .hero-bg-image {
        width: 100% !important;
        height: 100% !important;
        max-height: 380px;
        object-fit: cover !important;
        display: block;
    }

    /* Footer */
    .site-footer .footer-logo img { height: auto; max-height: 120px; width: auto; max-width: 90%; }
    .site-footer .footer-sticker img { height: auto; max-height: 150px; }
}

/* ---- Mobile (<= 767.98px) ---- */
@media (max-width: 767.98px) {
    /* Site header full width on phones */
    .site-header { width: calc(100% - 20px); margin-left: 10px; top: 10px; }
    .navbar-brand img { height: 60px; }

    /* Hero (interior) */
    .hero-inner {
        min-height: 200px;
        padding-top: 120px !important;
        padding-bottom: 30px;
        padding-left: 16px;
        padding-right: 16px;
    }

    /* Portada page */
    .title-portada { padding: 30px 20px; }
    .title-portada h2 { font-size: 24px; line-height: 130%; }
    .thumb-page-portada { height: 240px; min-height: 0; }
    .title-portada img.img-01,
    .title-portada img.img-02,
    .title-portada img.img-03 { display: none; }

    /* Front-page section titles even smaller */
    section.section-que-es .section-title,
    section.section-descubre .section-title,
    section.section-historias .section-title,
    section.section-carreras .section-title,
    section.section-como-funciona .section-title,
    section.section-equipo .section-title,
    section.section-eventos .section-title { font-size: 26px; line-height: 120%; }

    .page-container h2 { font-size: 24px; }
    .page-container { padding-left: 0; border-left: none; }

    /* Que-es spacing */
    section.section-que-es { width: 100%; border-radius: 16px; margin: 20px auto 40px; padding: 30px 0; }

    /* Section paddings */
    section.section-descubre,
    section.section-como-funciona { padding: 50px 0 !important; }

    /* Eventos: stack header + button */
    section.section-eventos .row.mb-4 .col-6 { width: 100%; flex: 0 0 100%; max-width: 100%; }

    /* Destacado / contenido smaller */
    .destacado,
    .conoce_la_linea { padding: 20px; }
    .destacado h3,
    .conoce_la_linea h3,
    .contenido h3 { font-size: 20px; margin-bottom: 16px; }
    .destacado p,
    .conoce_la_linea p,
    .cita { font-size: 16px; }
    .contenido p { font-size: 16px; }

    /* Mitos */
    .box-mito { font-size: 18px; padding: 20px; }
    .box-respuesta { font-size: 15px; padding: 20px; }

    /* Section descubre video card height */
    section.section-descubre .video-card { height: 240px; }

    /* Como funciona feature image */
    section.section-como-funciona .feature-card .feature-img { height: 180px; }

    /* Foto destacado */
    div.foto-destacado { height: 160px; }

    /* Site footer centered already; tighten */
    .site-footer { border-top-left-radius: 16px; border-top-right-radius: 16px; text-align: center; }
    .site-footer .footer-logo { display: flex; justify-content: center; margin: 12px 0; }
    .site-footer .footer-logo img { height: auto; max-height: 140px; width: auto; max-width: 80%; }
    .site-footer .footer-sticker img { height: auto; max-height: 160px; width: auto; max-width: 70%; }

    /* Swap order on mobile: image first, text after */
    .hero-section .hero-slide .row { flex-direction: column-reverse; }
    .hero-section .hero-slide .row > .col-lg-6 { width: 100%; max-width: 100%; flex: 0 0 100%; }

    /* Home hero image — force fixed height on phones */
    .hero-section .hero-image-wrapper {
        height: 220px !important;
        max-height: 220px;
        width: 100%;
        overflow: hidden;
        border-radius: 16px;
        margin-top: 0;
        margin-bottom: 16px;
    }
    .hero-section .hero-image-wrapper img,
    .hero-section .hero-bg-image {
        width: 100% !important;
        height: 100% !important;
        max-height: 220px;
        object-fit: cover !important;
        display: block;
    }
    .hero-section { padding-top: 120px !important; padding-bottom: 30px; overflow: hidden; }
    /* Ensure slider stays a flex row (one slide per viewport, not stacking) */
    .hero-section .hero-slider { flex-direction: row !important; flex-wrap: nowrap !important; }
    .hero-section .hero-slide { min-width: 100% !important; flex: 0 0 100% !important; }
    .hero-section .hero-slide .container,
    .hero-section .hero-slide .row { padding-left: 12px; padding-right: 12px; margin-left: 0; margin-right: 0; }
    .hero-section .hero-slide .col-lg-6 { padding-left: 8px; padding-right: 8px; }
    .hero-section .hero-title {
        font-size: 1.6rem;
        line-height: 1.2;
        word-wrap: break-word;
        overflow-wrap: break-word;
        hyphens: auto;
        margin-bottom: 0.75rem;
    }
    .hero-section .hero-subtitle {
        font-size: 0.95rem;
        padding-right: 0 !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
        margin-bottom: 1rem;
    }
    .hero-section .min-vh-50 { min-height: auto !important; }
    /* Arrows smaller on phones, don't crowd text */
    .hero-arrow { width: 36px; height: 36px; }
    .hero-arrow svg { width: 16px; height: 16px; }

    /* CTA Doble Botón */
    .cta-doble-boton__title { font-size: 1.5rem; }
}

/* ---- Extra small (<= 480px) ---- */
@media (max-width: 480px) {
    .navbar-brand img { height: 50px; }
    .hero-inner { padding-top: 100px !important; }
    section.section-descubre .video-card { height: 200px; }
    .accordion-button { font-size: 1rem; }
}

/* ========================================
   MEGA MENU (desktop only)
   ======================================== */
@media (min-width: 992px) {
    /* Anchor the absolute mega panel to the navbar container, not the li */
    .site-header .navbar .container { position: relative; }
    .navbar-nav .has-mega { position: static; }

    /* Reset BS dropdown styling for mega items.
       Panel sits below header and slides in from above (fast). */
    .navbar-nav .has-mega .mega-menu {
        display: block !important;
        visibility: hidden;
        opacity: 0;
        transform: translateY(-100vh);
        pointer-events: none;
        transition: transform .2s ease-out, opacity .15s ease-out, visibility 0s linear .2s;
        position: absolute;
        left: 0;
        right: 0;
        top: calc(100% + 8px);
        width: 100%;
        max-width: 1180px;
        margin: 0 auto;
        background: #111;
        color: #fff;
        border: 0;
        border-radius: 24px;
        padding: 40px;
        box-shadow: 0 18px 50px rgba(0,0,0,0.25);
        z-index: 1050;
    }

    /* Click open — slides down to rest below header */
    .navbar-nav .has-mega > .mega-menu.show {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
        transition: transform .2s ease-out, opacity .15s ease-out, visibility 0s linear 0s;
    }

    .mega-menu__inner {
        display: grid;
        grid-template-columns: 1fr 1.15fr;
        gap: 56px;
        align-items: start;
    }

    .mega-menu__title {
        color: #fff;
        font-family: var(--sp-font-heading);
        font-size: 2rem;
        font-weight: 600;
        margin: 0 0 24px;
    }

    .mega-menu__items {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .mega-menu__item + .mega-menu__item { margin-top: 6px; }

    .mega-menu__link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 14px 0;
        color: #fff !important;
        text-decoration: none;
        font-size: 1.05rem;
        line-height: 1.3;
        border-bottom: 1px solid rgba(255,255,255,0.08);
        transition: padding-left .2s ease, color .2s ease;
    }

    .mega-menu__link:hover { padding-left: 8px; color: #fff !important; }

    .mega-menu__arrow {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        background: rgba(255,255,255,0.10);
        border-radius: 50%;
        font-size: 1.1rem;
        line-height: 1;
        transition: background .2s ease, transform .2s ease;
    }

    .mega-menu__link:hover .mega-menu__arrow {
        background: rgba(255,255,255,0.20);
        transform: translateX(2px);
    }

    .mega-menu__grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .mega-menu__image {
        aspect-ratio: 4 / 3;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 16px;
    }
}

/* Mobile: no dropdown toggle — plain expanded list */
@media (max-width: 991.98px) {
    /* Mega panel always open as plain list */
    .navbar-nav .has-mega .mega-menu,
    .navbar-nav .dropdown .dropdown-menu {
        display: block !important;
        position: static !important;
        float: none !important;
        background: transparent !important;
        color: inherit !important;
        padding: 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        transform: none !important;
        opacity: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .mega-menu__inner { display: block; }
    .mega-menu__col--images { display: none !important; }
    .mega-menu__title { display: none; } /* parent label already shown as nav-link */
    .mega-menu__items { padding-left: 0; list-style: none; margin: 0; }
    .mega-menu__item { padding-left: 40px; }
    .mega-menu__link {
        color: inherit !important;
        text-decoration: none;
        padding: 0;
        display: block;
        border-bottom: 0;
        font-weight: 400;
    }
    .mega-menu__arrow { display: none; }

    /* Main nav items: bold + left-aligned + tighter padding */
    .navbar-nav { text-align: left !important; align-items: flex-start !important; }
    .navbar-nav .nav-item { width: 100%; text-align: left; }
    .navbar-nav .nav-link {
        font-weight: 700 !important;
        text-align: left !important;
        padding: 6px 0 !important;
    }

    /* Hide the dropdown caret on mobile and disable click toggle visually */
    .navbar-nav .dropdown-toggle::after { display: none !important; }
    .navbar-nav .nav-item.dropdown > .nav-link.dropdown-toggle {
        pointer-events: none; /* parent acts as a label, not a toggle */
    }
}

/* ========================================
   Contact Form 7 — Formulario de contacto
   ======================================== */
.wpcf7 form { width: 100%; }

.wpcf7 .row,
.wpcf7 form > .row { row-gap: 16px; }

/* Label + asterisk */
.wpcf7-form label,
.wpcf7 label {
    display: block;
    font-weight: 700;
    color: #111;
    margin-bottom: 8px;
}
.wpcf7-form .required-mark,
.wpcf7-form label .required,
.wpcf7-form label .asterisk,
.wpcf7-form .ast {
    color: #F26A1F;
    margin-left: 2px;
}

/* Fields — white bg, gray border, lightly rounded */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="date"],
.wpcf7-form textarea,
.wpcf7-form select {
    display: block;
    width: 100%;
    background-color: #fff;
    border: 1px solid #999;
    border-radius: 8px;
    padding: 12px 18px;
    font-size: 1rem;
    line-height: 1.4;
    color: #111;
    box-shadow: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.wpcf7-form textarea {
    min-height: 120px;
    resize: vertical;
}
.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
    outline: none;
    border-color: #F26A1F;
    box-shadow: 0 0 0 3px rgba(242, 106, 31, 0.20);
}
.wpcf7-form ::placeholder { color: #6c757d; opacity: 1; }

/* Select with chevron */
.wpcf7-form select {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 14px;
    padding-right: 40px;
}

/* Form rows = two cols using existing BS grid in CF7 markup */
.wpcf7-form .form-row,
.wpcf7-form .form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 24px;
}
@media (max-width: 767.98px) {
    .wpcf7-form .form-row,
    .wpcf7-form .form-grid { grid-template-columns: 1fr; }
}

/* Submit button — black, fit-content, slight rounding */
.wpcf7-form input[type="submit"],
.wpcf7-form button[type="submit"],
.wpcf7-form .wpcf7-submit {
    display: inline-block;
    width: auto;
    background-color: #1A1A1A;
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 14px 48px;
    font-weight: 600;
    font-size: 1.05rem;
    cursor: pointer;
    transition: background-color .2s ease, transform .2s ease;
}
.wpcf7-form input[type="submit"]:hover,
.wpcf7-form button[type="submit"]:hover {
    background-color: #000;
    transform: translateY(-1px);
}

/* Helper / hint text */
.wpcf7-form .hint,
.wpcf7-form .form-hint,
.wpcf7-form small {
    color: #555;
    font-size: 0.9rem;
    margin-top: 6px;
    display: block;
}

/* CF7 validation states */
.wpcf7-not-valid {
    box-shadow: 0 0 0 2px #dc3545 inset;
}
.wpcf7-not-valid-tip {
    color: #dc3545;
    font-size: 0.9rem;
    margin-top: 6px;
}
.wpcf7-response-output {
    border: 0 !important;
    border-radius: 10px !important;
    padding: 12px 18px !important;
    margin: 20px 0 0 !important;
    background-color: #f8f9fa;
}
.wpcf7-form.sent .wpcf7-response-output {
    background-color: #d1e7dd;
    color: #0a3622;
}
.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.unaccepted .wpcf7-response-output {
    background-color: #f8d7da;
    color: #58151c;
}

/* reCAPTCHA spacing */
.wpcf7-form .g-recaptcha,
.wpcf7-form .grecaptcha-badge {
    margin: 20px 0;
}

/* ========================================
   Slider dots — iOS tap-target fix
   The visible dot is 10x10, but iOS needs ~44x44 for reliable taps.
   We render the visible dot via a ::before pseudo so the actual <button>
   can be larger and centered around it without changing the design.
   Also disable the 300ms tap delay & native tap highlight.
   ======================================== */
.bloque-pagination__dot,
.cm-pagination__dot,
.equipo-pagination__dot,
.talleres-pagination__dot,
.alianza-pagination__dot,
.galeria-pagination__dot,
.descubre-pagination__dot,
.enlaces-pagination__dot,
.carreras-pagination__dot,
.hero-pagination__dot {
    box-sizing: content-box;
    position: relative;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
/* Pad an invisible hit-area around each dot (12px each side = 34px tappable) */
.bloque-pagination__dot,
.cm-pagination__dot,
.equipo-pagination__dot,
.talleres-pagination__dot,
.alianza-pagination__dot,
.galeria-pagination__dot,
.descubre-pagination__dot,
.enlaces-pagination__dot,
.carreras-pagination__dot {
    padding: 6px !important;
    background-clip: content-box;
}
/* Hero dot — no extra padding */
.hero-pagination__dot {
    padding: 0 !important;
    background-clip: border-box;
}
/* Hero pagination — align right on mobile */
@media (max-width: 767.98px) {
    .hero-pagination {
        justify-content: flex-end !important;
        left: auto !important;
        right: 16px;
        transform: none !important;
    }
}
/* Pagination containers: increase tap area between dots */
.bloque-pagination,
.cm-pagination,
.equipo-pagination,
.talleres-pagination,
.alianza-pagination,
.galeria-pagination,
.descubre-pagination,
.enlaces-pagination,
.carreras-pagination,
.hero-pagination {
    gap: 4px !important;
}

/* ========================================
   Slider swipe — let vertical scroll pass through, capture horizontal only
   `touch-action: pan-y` tells the browser "this element handles horizontal,
   the user can still scroll the page vertically by dragging on it".
   Without it, iOS sometimes blocks the touchend callback when the user's
   finger drifts even a few pixels vertically, breaking the swipe.
   ======================================== */
.bloque-slider-track,
.cm-slider-track,
.equipo-slider-track,
.talleres-slider-track,
.alianza-slider-track,
.galeria-slider-track,
.descubre-slider-track,
.enlaces-slider-track,
.carreras-slider-track,
.hero-slider {
    touch-action: pan-y;
    -webkit-user-select: none;
    user-select: none;
}

/* ========================================
   .sidebar-only — used when the parent page has no content of its own;
   sidebar nav is shown at the top of the page without expanding the row width.
   Desktop: 25% wide, floats left so the next child <section> starts immediately
   below the hero (no white space).
   ======================================== */
@media (min-width: 992px) {
    .sidebar-only { position: relative; height: 0; padding: 0; margin: 0; }
    .sidebar-only > .container { position: relative; height: 0; padding-top: 0; padding-bottom: 0; }
    .sidebar-only .container-menu-sidebar {
        position: absolute;
        top: 60px;
        left: var(--bs-gutter-x, 12px);
        width: calc(25% - 24px);
        z-index: 5;
    }
}
@media (max-width: 991.98px) {
    .sidebar-only { display: none !important; }
}

/* ========================================
   .container-menu-sidebar — sticky after 100vh (desktop only),
   stacked BELOW .section-carreras / .section-enlaces / footer so they cover it on scroll.
   ======================================== */
@media (max-width: 991.98px) {
    .container-menu-sidebar { display: none !important; }
    .container-menu-sidebar.is-fixed {
        position: static !important;
        top: auto !important;
        left: auto !important;
        width: auto !important;
    }
}
@media (min-width: 992px) {
    .container-menu-sidebar {
        position: relative;
        z-index: 1;
        transition: opacity .25s ease, transform .25s ease;
    }
    .container-menu-sidebar.is-fixed {
        position: fixed;
        top: 170px; /* below floating site header, +60px clearance */
        z-index: 1; /* low — covered by carreras/enlaces/footer */
        /* left + width are set inline via JS to match the sidebar column position */
        animation: cms-sidebar-fade-in .35s ease forwards;
    }
    @keyframes cms-sidebar-fade-in {
        from { opacity: 0; transform: translateY(-14px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    section.section-carreras,
    section.section-enlaces,
    .site-footer {
        position: relative;
        z-index: 10;
    }
}