/* Only palette and the supplied hero artwork; original geometry lives in styles.css. */
:root {
    --color-background: #fff;
    --color-foreground: #111;
    --color-dk-blue: #f5f5f5;
    --color-dark-gradient: linear-gradient(#fff 0%, #f7f7f7 100%);
}
.header-wrapper {
    background: rgba(255, 255, 255, .94);
    border-color: rgba(0, 0, 0, .08);
    color: #111;
}
header a, header a:visited { color: #111; }
header .nb-logo-icon, header .btn-icon-s { filter: brightness(0); }
header a:hover { color: var(--color-red); }
.hero-bg { background: #f2f2f2; }
.hero-img { object-fit: contain; }
/* Separate supplied title above the original hero buttons. */
.hero-name-logo { opacity: 1; }
.hero .btn-secondary, .hero .btn-secondary .txt-white { color: #111; }
.track { -webkit-text-stroke-color: #111; }
.letras .txt-white { color: var(--color-red); }
.left .card-bg, .right .card-bg { background: rgba(255, 255, 255, .96); }
.card.center:after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 86.05%);
}
#informacion .txt-white, #informacion a.txt-white { color: #111; }
.timeline-section .txt-white { color: #111; }
/* Preserve the paths and stroke weights of the original lettering includes. */
#programa svg path[fill="white"], #evento svg path[fill="white"] { fill: #111; }
#programa svg path[stroke="white"], #evento svg path[stroke="white"] { stroke: #111; }
.bg-red { background: #fff; }
#registro .h2, #registro .txt-white, #registro .privacy-consent { color: #111; }
#registro input, #registro select { background: #f0f0f0; color: #111; }
#registro input::placeholder { color: #666; }
#registro .error { color: #b5092a; }
#registro .success, #registro .nb-success-message h2 { color: #111; }
.privacy-consent__check { border-color: rgba(0, 0, 0, .65); }
.privacy-consent input:checked + .privacy-consent__check {
    background: var(--color-red);
    border-color: var(--color-red);
}
.privacy-consent input:checked + .privacy-consent__check::after { border-color: #fff; }
.privacy-consent__link { color: var(--color-red); }
form .btn-primary { background: var(--color-red); border-color: var(--color-red); }
/* Same full-screen hero and controls; fit the complete artwork above them on mobile. */
@media (max-width: 768px) {
    .hero-img { object-position: center top; }
}
@media (min-width: 601px) and (max-width: 768px) {
    .hero .hero-name-logo { width: 50%; align-self: flex-start; }
}
@media (max-width: 600px) {
    .hero-img { object-position: center 16%; }
}
/* Keep the mobile artwork above the existing title and buttons. */
@media (max-width: 768px) {
    .hero-bg .hero-img.hide-dt {
        height: max(8rem, calc(100% - 27rem));
        margin-top: 6rem;
        object-position: center top;
    }
    .hero > .page-wrapper {
        align-items: flex-end;
        margin-top: 0;
        padding-bottom: 3rem;
    }
}

/* Fit the talk introduction inside the original card silhouette. */
.card.left .inner-padding { justify-content: center; }
.card.left .card-txt { gap: 1.125rem; }
.card.left .subtitle {
    font-size: clamp(1.75rem, 2.1vw, 2.25rem);
    line-height: 1.08;
}
.card.left .card-txt p {
    font-size: .9375rem;
    line-height: 1.5;
}
/* Reserve the space occupied by the inclined right edge of the background. */
@media (min-width: 769px) {
    .card.left .inner-padding {
        padding-right: calc(11% + 4rem);
    }
}
@media (min-width: 769px) and (max-width: 1100px) {
    .card.left .inner-padding {
        padding-left: 1rem;
        padding-right: calc(11% + 3.5rem);
    }
    .card.left .subtitle { font-size: 1.5rem; }
    .card.left .card-txt p { font-size: .8125rem; line-height: 1.45; }
}
@media (min-width: 769px) and (max-width: 850px) {
    .card.left .inner-padding {
        padding-left: 1.75rem;
        padding-right: calc(11% + 3rem);
    }
    .card.left .subtitle { font-size: 1.375rem; }
}
