/*
 * Chairos brand expression.
 *
 * A bold red/orange editorial layer with compact typography, hard shadows
 * and poster-like geometry. Loaded only by the Chairos brand lock.
 */

:root {
	--chairos-red: #ff0136;
	--chairos-red-accessible: #d5002f;
	--chairos-orange: #ff7900;
	--chairos-ink: #21070d;
	--chairos-paper: #fff8f5;
	--pedro-radius-sm: 0.25rem;
	--pedro-radius-md: 0.4rem;
	--pedro-radius-lg: 0.55rem;
	--pedro-shadow-sm: 7px 7px 0 rgb( 33 7 13 / 10% );
	--pedro-shadow-lg: 14px 14px 0 rgb( 33 7 13 / 18% );
}

:root[data-theme='dark'] {
	--pedro-background: #16060a;
	--pedro-surface: #230a10;
	--pedro-border: #65303c;
	--pedro-text: #fff8f5;
	--pedro-muted: #d7b2ba;
	--pedro-primary: #d36b82;
	--pedro-accent: #ff6687;
}

.pedro-topbar {
	border-bottom: 5px solid var( --chairos-orange );
	background: var( --chairos-red );
	color: #ffffff;
	font-weight: 850;
}

.pedro-main-header {
	border-bottom: 1px solid color-mix( in srgb, var( --chairos-red ) 35%, var( --pedro-border ) );
	background:
		linear-gradient( 90deg, rgb( 255 1 54 / 8% ) 0 14%, transparent 14% 17%, rgb( 255 121 0 / 8% ) 17% 20%, transparent 20% ),
		var( --pedro-surface );
}

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

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

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

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

.pedro-header__menu-list a::after {
	bottom: -0.1rem;
	height: 6px;
	background: linear-gradient( 90deg, var( --chairos-red ) 0 72%, var( --chairos-orange ) 72% );
}

.pedro-button {
	border: 2px solid var( --chairos-ink );
	border-radius: 0.2rem;
	background: var( --chairos-red-accessible );
	color: #ffffff;
	box-shadow: 5px 5px 0 var( --chairos-orange );
	text-transform: uppercase;
}

.pedro-button:hover,
.pedro-button:focus-visible {
	background: var( --chairos-orange );
	color: var( --chairos-ink );
	box-shadow: 2px 2px 0 var( --chairos-red );
	filter: none;
	transform: translate( 3px, 3px );
}

.pedro-ticker__label {
	border-radius: 0;
	background: var( --chairos-red-accessible );
	letter-spacing: 0.05em;
	transform: skewX( -5deg );
}

.pedro-ticker__label span {
	display: inline-block;
	transform: skewX( 5deg );
}

.pedro-ticker__story {
	border-radius: 0;
	border-left: 6px solid var( --chairos-orange );
}

.pedro-lead-card {
	border: 0;
	border-radius: 0.5rem 0.5rem 2.4rem 0.5rem;
	box-shadow: 12px 12px 0 var( --chairos-orange );
}

.pedro-lead-card__overlay {
	background:
		linear-gradient( 90deg, rgb( 33 7 13 / 96% ) 0%, rgb( 80 0 18 / 76% ) 50%, transparent 85% ),
		linear-gradient( 0deg, rgb( 33 7 13 / 92% ), transparent 62% );
}

.pedro-lead-card .pedro-eyebrow,
.pedro-overlay-card .pedro-eyebrow {
	border-radius: 0;
	background: var( --chairos-orange );
	color: var( --chairos-ink );
	transform: rotate( -1.5deg );
}

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

.pedro-secondary-card:hover,
.pedro-article-horizontal:hover,
.pedro-category-tile:hover {
	border-color: var( --chairos-red );
	box-shadow: 8px 8px 0 color-mix( in srgb, var( --chairos-orange ) 58%, transparent );
	transform: translate( -2px, -2px );
}

.pedro-section-heading {
	font-size: 1.25rem;
	letter-spacing: 0.065em;
}

.pedro-section-heading::after {
	width: 4rem;
	height: 8px;
	background: linear-gradient( 90deg, var( --chairos-red ) 0 70%, var( --chairos-orange ) 70% );
}

.pedro-most-read__number {
	border-radius: 0;
	background: var( --chairos-red );
	color: #ffffff;
	box-shadow: 3px 3px 0 var( --chairos-orange );
}

.pedro-newsletter {
	position: relative;
	overflow: hidden;
	border: 3px solid var( --chairos-red );
	background:
		linear-gradient( 115deg, transparent 0 72%, rgb( 255 121 0 / 25% ) 72% 78%, transparent 78% ),
		linear-gradient( 135deg, var( --chairos-ink ), #710019 );
}

.pedro-newsletter::after {
	position: absolute;
	top: -2rem;
	right: -1rem;
	width: 9rem;
	height: 120%;
	background: repeating-linear-gradient( 90deg, transparent 0 15px, rgb( 255 121 0 / 17% ) 15px 24px );
	content: '';
	transform: rotate( 8deg );
	pointer-events: none;
}

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

.pedro-newsletter__benefits .pedro-icon {
	stroke: var( --chairos-orange );
}

.pedro-category-tile {
	grid-template-columns: 92px minmax( 0, 1fr );
	border-radius: 0.25rem 0.25rem 1.5rem 0.25rem;
}

.pedro-category-tile__art,
.pedro-category-tile__art--1,
.pedro-category-tile__art--2 {
	background:
		linear-gradient( 100deg, transparent 0 62%, rgb( 255 255 255 / 20% ) 62% 70%, transparent 70% ),
		linear-gradient( 145deg, var( --chairos-red ), var( --chairos-orange ) );
}

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

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

.pedro-coming-card {
	border-radius: 0.3rem 0.3rem 2rem 0.3rem;
	background:
		linear-gradient( 110deg, transparent 0 75%, rgb( 255 121 0 / 14% ) 75% ),
		var( --pedro-surface );
}

.pedro-editorial-values {
	border: 4px solid var( --chairos-orange );
	border-radius: 0.5rem 0.5rem 3rem 0.5rem;
	background:
		repeating-linear-gradient( 90deg, transparent 0 54px, rgb( 255 121 0 / 10% ) 54px 60px ),
		linear-gradient( 138deg, var( --chairos-ink ), #7a001a 72%, var( --chairos-red ) );
}

.pedro-editorial-values__dot {
	border-color: var( --chairos-orange );
}

.pedro-editorial-values__check {
	border-radius: 0;
	background: var( --chairos-orange );
	color: var( --chairos-ink );
}

.pedro-editorial-values__check .pedro-icon {
	stroke: currentcolor;
}

.pedro-term-hero {
	padding-left: clamp( 1rem, 3vw, 2rem );
	border-left: 12px solid var( --chairos-red );
	border-radius: 0;
	box-shadow: inset 5px 0 0 var( --chairos-orange );
}

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

.pedro-footer {
	border-top: 10px solid;
	border-image: linear-gradient( 90deg, var( --chairos-red ) 0 76%, var( --chairos-orange ) 76% ) 1;
	background:
		linear-gradient( 100deg, rgb( 255 1 54 / 16% ) 0 12%, transparent 12% 16%, rgb( 255 121 0 / 13% ) 16% 20%, transparent 20% ),
		var( --chairos-ink );
}

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

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

	.pedro-lead-card {
		border-radius: 0.35rem 0.35rem 1.5rem 0.35rem;
		box-shadow: 7px 7px 0 var( --chairos-orange );
	}

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