/*
 * La Cortinilla brand expression.
 *
 * Cinema-inspired surfaces, curtain geometry and spotlight accents. Loaded
 * only by the La Cortinilla brand lock.
 */

:root {
	--cortinilla-red: #ff0606;
	--cortinilla-red-accessible: #c90000;
	--cortinilla-wine: #7b0a0a;
	--cortinilla-black: #170707;
	--cortinilla-cream: #fff8f2;
	--pedro-radius-sm: 0.8rem;
	--pedro-radius-md: 1.8rem;
	--pedro-radius-lg: 3rem;
	--pedro-shadow-sm: 0 14px 38px rgb( 63 5 5 / 10% );
	--pedro-shadow-lg: 0 30px 80px rgb( 23 7 7 / 24% );
}

:root[data-theme='dark'] {
	--pedro-background: #100505;
	--pedro-surface: #1c0b0b;
	--pedro-border: #552727;
	--pedro-text: #fff8f2;
	--pedro-muted: #d9b7b2;
	--pedro-primary: #cd7373;
	--pedro-accent: #ff7070;
}

.pedro-topbar {
	border-bottom: 3px solid var( --cortinilla-red );
	background: #090303;
	color: #ffffff;
}

.pedro-main-header {
	border-bottom: 5px solid var( --cortinilla-red );
	background:
		repeating-linear-gradient( 90deg, transparent 0 80px, rgb( 255 6 6 / 8% ) 80px 120px ),
		linear-gradient( 180deg, #210808, var( --cortinilla-black ) );
}

.pedro-main-header__inner {
	min-height: 126px;
}

.pedro-main-header .pedro-logo,
.pedro-main-header .custom-logo {
	max-width: 104px;
	max-height: 104px;
}

.pedro-footer-logo {
	max-width: 112px;
	max-height: 120px;
}

.pedro-main-header .pedro-header__menu-list a,
.pedro-main-header .pedro-icon-button,
.pedro-main-header .pedro-header__menu-toggle {
	color: #ffffff;
}

.pedro-header__menu-list a {
	letter-spacing: 0.07em;
}

.pedro-header__menu-list a::after {
	bottom: -0.2rem;
	height: 4px;
	border-radius: 50%;
	background: var( --cortinilla-red );
	box-shadow: 0 0 18px rgb( 255 6 6 / 75% );
}

.pedro-button {
	border-radius: 999px;
	background: var( --cortinilla-red-accessible );
	color: #ffffff;
	box-shadow: 0 8px 24px rgb( 201 0 0 / 24% );
}

.pedro-button:hover,
.pedro-button:focus-visible {
	background: var( --cortinilla-red );
	filter: none;
	transform: translateY( -2px );
}

.pedro-ticker-wrap {
	background: color-mix( in srgb, var( --cortinilla-red ) 4%, var( --pedro-surface ) );
}

.pedro-ticker__label {
	border-radius: 999px;
	background: var( --cortinilla-red-accessible );
}

.pedro-ticker__story {
	border-radius: 999px;
}

.pedro-lead-card {
	border-radius: 3.5rem 3.5rem 0.9rem 0.9rem;
}

.pedro-lead-card__overlay {
	background:
		radial-gradient( ellipse at 45% 20%, transparent 0 20%, rgb( 23 7 7 / 20% ) 50% ),
		linear-gradient( 90deg, rgb( 23 7 7 / 96% ) 0%, rgb( 69 5 5 / 68% ) 50%, transparent 84% ),
		linear-gradient( 0deg, rgb( 23 7 7 / 90% ), transparent 62% );
}

.pedro-lead-card .pedro-eyebrow,
.pedro-overlay-card .pedro-eyebrow {
	border-radius: 999px;
	background: var( --cortinilla-red );
	color: #ffffff;
	box-shadow: 0 0 20px rgb( 255 6 6 / 42% );
}

.pedro-secondary-card,
.pedro-most-read,
.pedro-widget,
.pedro-article-horizontal,
.pedro-category-tile,
.pedro-coming-card {
	border-color: color-mix( in srgb, var( --cortinilla-red-accessible ) 22%, var( --pedro-border ) );
}

.pedro-secondary-card:hover,
.pedro-article-horizontal:hover,
.pedro-category-tile:hover {
	border-color: var( --cortinilla-red-accessible );
	box-shadow: 0 20px 54px rgb( 123 10 10 / 15% );
}

.pedro-section-heading {
	letter-spacing: 0.06em;
}

.pedro-section-heading::after {
	width: 3.8rem;
	height: 5px;
	border-radius: 50%;
	background: var( --cortinilla-red );
	box-shadow: 0 0 14px rgb( 255 6 6 / 38% );
}

.pedro-most-read__number {
	background: var( --cortinilla-red );
	color: #ffffff;
	box-shadow: 0 0 0 5px color-mix( in srgb, var( --cortinilla-red ) 12%, transparent );
}

.pedro-newsletter {
	position: relative;
	overflow: hidden;
	border: 2px solid var( --cortinilla-red );
	border-radius: 3rem 3rem 0.8rem 0.8rem;
	background:
		radial-gradient( ellipse at 50% -15%, rgb( 255 255 255 / 18% ), transparent 34% ),
		repeating-linear-gradient( 90deg, transparent 0 9%, rgb( 255 6 6 / 11% ) 9% 18% ),
		linear-gradient( 145deg, #100505, var( --cortinilla-wine ) );
}

.pedro-newsletter::after {
	position: absolute;
	inset: 0;
	background: linear-gradient( 105deg, transparent 0 46%, rgb( 255 255 255 / 7% ) 50%, transparent 54% );
	content: '';
	pointer-events: none;
}

.pedro-newsletter__copy,
.pedro-newsletter__signup {
	position: relative;
	z-index: 1;
}

.pedro-newsletter__benefits .pedro-icon {
	stroke: #ff8585;
}

.pedro-category-tile {
	grid-template-columns: 94px minmax( 0, 1fr );
	border-radius: 2.4rem 0.6rem 2.4rem 0.6rem;
}

.pedro-category-tile__art,
.pedro-category-tile__art--1,
.pedro-category-tile__art--2 {
	background:
		radial-gradient( circle at 50% 50%, rgb( 255 255 255 / 18% ), transparent 30% ),
		linear-gradient( 160deg, var( --cortinilla-red ), var( --cortinilla-wine ) );
}

.pedro-category-tile__art .pedro-icon {
	stroke: #ffffff;
}

.pedro-category-tile__cta,
.pedro-text-link,
.pedro-section-title-row--action > a {
	color: var( --cortinilla-red-accessible );
}

.pedro-coming-card {
	border-radius: 2.8rem 0.7rem 2.8rem 0.7rem;
	background:
		radial-gradient( circle at 80% 20%, rgb( 255 6 6 / 15% ), transparent 25% ),
		var( --pedro-surface );
}

.pedro-editorial-values {
	border: 3px solid var( --cortinilla-red );
	border-radius: 4rem 4rem 1rem 1rem;
	background:
		radial-gradient( ellipse at 50% -10%, rgb( 255 255 255 / 17% ), transparent 32% ),
		repeating-linear-gradient( 90deg, transparent 0 10%, rgb( 255 6 6 / 10% ) 10% 20% ),
		linear-gradient( 145deg, var( --cortinilla-black ), var( --cortinilla-wine ) );
}

.pedro-editorial-values__dot {
	border-color: #ff8a8a;
}

.pedro-editorial-values__check {
	background: var( --cortinilla-red );
}

.pedro-term-hero {
	padding: clamp( 1.5rem, 4vw, 2.75rem );
	border-radius: 3rem 3rem 0.75rem 0.75rem;
	background:
		radial-gradient( ellipse at 50% 0%, rgb( 255 6 6 / 16% ), transparent 42% ),
		var( --pedro-surface );
}

.pedro-term-hero__title,
.pedro-single__title {
	text-wrap: balance;
}

.pedro-footer {
	border-top: 7px solid var( --cortinilla-red );
	background:
		repeating-linear-gradient( 90deg, transparent 0 9%, rgb( 255 6 6 / 9% ) 9% 18% ),
		var( --cortinilla-black );
}

@media ( max-width: 767px ) {
	.pedro-main-header__inner {
		min-height: 98px;
	}

	.pedro-main-header .pedro-logo,
	.pedro-main-header .custom-logo {
		max-width: 72px;
		max-height: 78px;
	}

	.pedro-lead-card,
	.pedro-newsletter,
	.pedro-editorial-values {
		border-radius: 2rem 2rem 0.65rem 0.65rem;
	}

	.pedro-category-tile {
		grid-template-columns: 76px minmax( 0, 1fr );
		border-radius: 1.6rem 0.5rem 1.6rem 0.5rem;
	}
}
