/*
 * e2c-vars.css  -  Design tokens extracted from e2cui kit-8.
 * Previously scoped to the global kit (legacy kit-8); now applied via :root.
 */

:root {
  /* Brand kit  -  canonical tokens (docs/brand-kit.md appendix) */
  --c-brand-dark: #1C244B;
  --c-header-bg: #B1D5C1;
  --c-brand-mid: #31B387;
  --c-brand-hover: #259970;
  --c-brand-light: #F9FAFD;
  --c-text: #1C244B;
  --c-text-muted: #324A6D;
  --c-accent-light: #C8D5DC;
  --c-border: #e5e5e5;
  --c-white: #ffffff;
  --spacing-xs: 0.5rem;
  --spacing-sm: 1rem;
  --spacing-md: 1.5rem;
  --spacing-lg: 2rem;
  --spacing-xl: 3rem;
  --radius-sm: 4px;
  --radius-md: 8px;
  --max-content: 1100px;
  --max-prose: 760px;
  --transition: 0.2s ease;
  --font-base: 'Poppins', sans-serif;

  /* Page / blog cover strips — same as blog listing hero (e2c-blog.css) */
  --e2c-cover-min-height: clamp(220px, 36vh, 360px);

  --e2c-kit-color-primary:#1C244B;
  /* Header + footer surface (brand kit --c-header-bg) */
  --e2c-kit-header-bg:#B1D5C1;
  --e2c-kit-color-secondary:#F3F5F8;
  --e2c-kit-color-text:#324A6D;
  --e2c-kit-color-accent:#31B387;
  --e2c-kit-color-c696dce:#FFFFFF;
  --e2c-kit-color-14ef391:#C8D5DC;
  --e2c-kit-color-764183d:#F9FAFD;
  --e2c-kit-color-d6cea4e:#FFFFFF;
  --e2c-kit-color-86b4fcd:#02010100;
  --e2c-kit-color-57c8da2:#000000CC;
  --e2c-kit-typography-primary-font-family:"Poppins";
  --e2c-kit-typography-primary-font-size:65px;
  --e2c-kit-typography-primary-font-weight:600;
  --e2c-kit-typography-primary-text-transform:none;
  --e2c-kit-typography-primary-font-style:normal;
  --e2c-kit-typography-primary-text-decoration:none;
  --e2c-kit-typography-primary-line-height:1.2em;
  --e2c-kit-typography-primary-letter-spacing:0px;
  --e2c-kit-typography-secondary-font-family:"Poppins";
  --e2c-kit-typography-secondary-font-size:38px;
  --e2c-kit-typography-secondary-font-weight:600;
  --e2c-kit-typography-secondary-text-transform:capitalize;
  --e2c-kit-typography-secondary-font-style:normal;
  --e2c-kit-typography-secondary-text-decoration:none;
  --e2c-kit-typography-secondary-line-height:1.1em;
  --e2c-kit-typography-secondary-letter-spacing:0px;
  --e2c-kit-typography-text-font-family:"Poppins";
  --e2c-kit-typography-text-font-size:18px;
  --e2c-kit-typography-text-font-weight:300;
  --e2c-kit-typography-text-text-transform:none;
  --e2c-kit-typography-text-font-style:normal;
  --e2c-kit-typography-text-text-decoration:none;
  --e2c-kit-typography-text-line-height:1.5em;
  --e2c-kit-typography-text-letter-spacing:0px;
  --e2c-kit-typography-accent-font-family:"Poppins";
  --e2c-kit-typography-accent-font-size:18px;
  --e2c-kit-typography-accent-font-weight:400;
  --e2c-kit-typography-accent-text-transform:capitalize;
  --e2c-kit-typography-accent-font-style:normal;
  --e2c-kit-typography-accent-text-decoration:none;
  --e2c-kit-typography-accent-line-height:1em;
  --e2c-kit-typography-accent-letter-spacing:0px;
  --e2c-kit-typography-392b9e0-font-family:"Poppins";
  --e2c-kit-typography-392b9e0-font-size:24px;
  --e2c-kit-typography-392b9e0-font-weight:600;
  --e2c-kit-typography-392b9e0-text-transform:capitalize;
  --e2c-kit-typography-392b9e0-font-style:normal;
  --e2c-kit-typography-392b9e0-text-decoration:none;
  --e2c-kit-typography-392b9e0-line-height:1.2em;
  --e2c-kit-typography-392b9e0-letter-spacing:0px;
  --e2c-kit-typography-c05b693-font-family:"Poppins";
  --e2c-kit-typography-c05b693-font-size:24px;
  --e2c-kit-typography-c05b693-font-weight:300;
  --e2c-kit-typography-c05b693-text-transform:none;
  --e2c-kit-typography-c05b693-font-style:normal;
  --e2c-kit-typography-c05b693-text-decoration:none;
  --e2c-kit-typography-c05b693-line-height:1.5em;
  --e2c-kit-typography-c05b693-letter-spacing:0px;
  --e2c-kit-typography-6558fb1-font-family:"Poppins";
  --e2c-kit-typography-6558fb1-font-size:18px;
  --e2c-kit-typography-6558fb1-font-weight:300;
  --e2c-kit-typography-6558fb1-text-transform:uppercase;
  --e2c-kit-typography-6558fb1-font-style:normal;
  --e2c-kit-typography-6558fb1-text-decoration:none;
  --e2c-kit-typography-6558fb1-line-height:1.5em;
  --e2c-kit-typography-6558fb1-letter-spacing:10px;
  --e2c-kit-typography-92bce3b-font-family:"Poppins";
  --e2c-kit-typography-92bce3b-font-size:18px;
  --e2c-kit-typography-92bce3b-font-weight:400;
  --e2c-kit-typography-92bce3b-text-transform:capitalize;
  --e2c-kit-typography-92bce3b-font-style:italic;
  --e2c-kit-typography-92bce3b-text-decoration:underline;
  --e2c-kit-typography-92bce3b-line-height:1em;
  --e2c-kit-typography-92bce3b-letter-spacing:0px;
  --e2c-kit-typography-b2deeae-font-family:"Poppins";
  --e2c-kit-typography-b2deeae-font-size:85px;
  --e2c-kit-typography-b2deeae-font-weight:600;
  --e2c-kit-typography-b2deeae-text-transform:none;
  --e2c-kit-typography-b2deeae-font-style:normal;
  --e2c-kit-typography-b2deeae-text-decoration:none;
  --e2c-kit-typography-b2deeae-line-height:1em;
  --e2c-kit-typography-b2deeae-letter-spacing:0px;
  --e2c-kit-typography-fb1a3e0-font-family:"Poppins";
  --e2c-kit-typography-fb1a3e0-font-size:200px;
  --e2c-kit-typography-fb1a3e0-font-weight:600;
  --e2c-kit-typography-fb1a3e0-text-transform:none;
  --e2c-kit-typography-fb1a3e0-font-style:normal;
  --e2c-kit-typography-fb1a3e0-text-decoration:none;
  --e2c-kit-typography-fb1a3e0-line-height:1.2em;
  --e2c-kit-typography-fb1a3e0-letter-spacing:0px;
  --e2c-kit-typography-397e168-font-family:"Poppins";
  --e2c-kit-typography-397e168-font-size:16px;
  --e2c-kit-typography-397e168-font-weight:400;
  --e2c-kit-typography-397e168-text-transform:capitalize;
  --e2c-kit-typography-397e168-font-style:italic;
  --e2c-kit-typography-397e168-text-decoration:none;
  --e2c-kit-typography-397e168-line-height:1.3em;
  --e2c-kit-typography-397e168-letter-spacing:0px;
  --e2c-kit-typography-primary-font-size:45px;
  --e2c-kit-typography-secondary-font-size:25px;
  --e2c-kit-typography-text-font-size:14px;
  --e2c-kit-typography-accent-font-size:14px;
  --e2c-kit-typography-c05b693-font-size:18px;
  --e2c-kit-typography-c05b693-line-height:1.4em;
  --e2c-kit-typography-6558fb1-font-size:14px;
  --e2c-kit-typography-92bce3b-font-size:14px;
  --e2c-kit-typography-b2deeae-font-size:65px;
  --e2c-kit-typography-fb1a3e0-font-size:145px;
  --e2c-kit-typography-397e168-font-size:14px;
  --e2c-kit-typography-primary-font-size:28px;
  --e2c-kit-typography-primary-line-height:1.1em;
  --e2c-kit-typography-secondary-font-size:20px;
  --e2c-kit-typography-392b9e0-font-size:18px;
  --e2c-kit-typography-c05b693-font-size:16px;
  --e2c-kit-typography-b2deeae-font-size:42px;
  --e2c-kit-typography-b2deeae-line-height:1em;
  --e2c-kit-typography-fb1a3e0-font-size:100px;
  --e2c-kit-typography-fb1a3e0-line-height:1em;
}

/* Visibility alias  -  native-animate.js removes .e2c-invisible on scroll.
 * Keep this rule so elements are hidden before the IntersectionObserver fires. */
.e2c-invisible { visibility: hidden; }

/* Hero background video  -  full-bleed “cover” (rules in e2c-frontend were .e2cui-scoped) */
.e2c-section:has(> .e2c-bg-video-container) {
  overflow: hidden;
}

.e2c-section > .e2c-bg-video-container {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  background-color: #1a1a1a;
}

/* Still from YouTube CDN while the iframe/player boots (~fast with preload + preconnect). */
.e2c-section > .e2c-bg-video-container > .e2c-bg-video-poster {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  border: 0;
}

.e2c-section .e2c-bg-video-embed {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

/* 16:9 iframe scaled to cover the section (letterboxing removed vs width/height 100% only) */
.e2c-section .e2c-bg-video-embed iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 56.25vw;
  min-width: max(100%, 177.77vh);
  min-height: max(100%, 56.25vw);
  transform: translate(-50%, -50%);
  border: 0;
  pointer-events: none;
}

/* Vídeo alojado no site (1.º partido, sem leitor do YouTube; substitui iframe onde aplicável) */
.e2c-section .e2c-bg-video-hosted {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  border: 0;
  appearance: none;
}
.e2c-section .e2c-bg-video-hosted::-webkit-media-controls {
  display: none !important;
}
.e2c-section .e2c-bg-video-hosted::-webkit-media-controls-enclosure {
  display: none !important;
}

.e2c-section > .e2c-bg-overlay-inner {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.e2c-section:has(> .e2c-bg-video-container) > .e2c-container,
.e2c-section:has(> .e2c-bg-overlay-inner) > .e2c-container {
  position: relative;
  z-index: 2;
}
