/* Juventus Weekend extensions only.
   Order: Bootstrap 4.6.1 → supplied style.css (unchanged) → this file.
   Layout, spacing, buttons, type utilities, navigation and footer reuse
   Bootstrap/Academy classes in the HTML. No copies of those components here. */

/* Weekend's parent-first cover, cut-out children and six-hour stamp. */
.wk-hero { padding-left: 80px; }
.wk-hero-copy { z-index: 2; }
.wk-hero-title {
  font-size: clamp(40px, 4.7vw, 76px);
  line-height: 1.08;
  letter-spacing: -.065em;
  text-transform: none;
  margin: 28px 0;
}
.wk-hero-title span {
  text-decoration: underline;
  text-decoration-color: #ffd600;
  text-decoration-thickness: .12em;
  text-underline-offset: .06em;
  text-decoration-skip-ink: none;
}
.wk-eyebrow { letter-spacing: .07em; font-size: 12px; }
.wk-lead { font-size: 17px; line-height: 1.7; }
.wk-hero-art { height: 740px; }
.wk-hero-pattern { position: absolute; width: 115%; max-width: none; height: 480px; object-fit: cover; top: 160px; right: -20%; }
.wk-hero-kids { position: absolute; top: 40px; right: -8%; width: 104%; max-width: 550px; z-index: 1; }
.wk-hero-stamp { position: absolute; left: -6%; bottom: 60px; z-index: 2; background: #ffd600; width: 158px; height: 158px; border-radius: 50%; display: flex; flex-direction: column; justify-content: center; transform: rotate(-9deg); }
.wk-hero-stamp span { font-size: 11px; font-weight: 700; }
.wk-hero-stamp strong { font-size: 22px; font-weight: 800; line-height: 1.15; margin-top: 10px; }
.wk-art-caption { position: absolute; top: 35px; right: -40px; writing-mode: vertical-rl; font-size: 13px; font-weight: 700; z-index: 3; }

/* Campaign photo and caption composition. */
.wk-experience-photo { min-height: 380px; border-radius: 24px; }
.wk-experience-photo img { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: 42% center; }
.wk-photo-tag { bottom: 0; left: 0; background: #ffd600; padding: 14px 18px; font-size: 11px; }

/* Existing .embed-responsive-9by16 supplies the video aspect ratio. */
.wk-video-section { background: #ffd600; }
.wk-video-frame { max-width: 345px; border-radius: 24px; box-shadow: 12px 12px 0 #000; }
.wk-video-frame video { object-fit: contain; }

/* Weekend-specific schedule, typographic accent and tariff amount. */
.wk-yellow-text { color: #ffd600; }
.wk-play-accent { font-family: 'juventus_fansbold_inline'; font-size: clamp(70px, 8vw, 120px); line-height: 1; margin: 60px 0 20px; transform: rotate(-6deg); }
.wk-play-accent span { display: table; background: #ffd600; color: #000; padding: 5px 15px; }
.wk-play-accent span + span { margin-left: 45px; background: #fff; }
.wk-day-tabs { gap: 12px; }
/* Bootstrap's tab plugin toggles only .active, so the selected-day look hangs off it. */
.wk-day-tabs .btn { color: #fff; }
.wk-day-tabs .btn.active { background: #D2B268; color: #000; }
.wk-schedule-row { border-bottom: 1px solid #373737; }
.wk-time { width: 110px; font-variant-numeric: tabular-nums; }
.wk-price { font-size: clamp(48px, 4.3vw, 68px); line-height: 1; letter-spacing: -.05em; }

/* Team photograph and the existing mascot invitation. */
.wk-location-photo { height: 540px; border-radius: 24px; }
.wk-location-photo img { width: 100%; height: 100%; object-fit: cover; }
.wk-location-label { left: 24px; bottom: 20px; }
.wk-closing { min-height: 610px; padding-top: 100px; }
.wk-closing-copy { z-index: 1; }
.wk-closing-pattern { width: 44%; height: 70%; object-fit: cover; right: 0; bottom: 0; }
.wk-closing-zebra { width: 410px; height: 600px; object-fit: contain; object-position: bottom; right: 5%; bottom: 0; z-index: 2; }
.wk-contact a { overflow-wrap: anywhere; }
.wk-socials img { max-width: none; }

@media (max-width: 1199px) {
  .wk-hero-title { font-size: clamp(40px, 4.8vw, 58px); }
  .wk-hero-kids { top: 110px; right: -17%; width: 117%; }
  .wk-art-caption { right: 0; }
  .wk-closing-zebra { width: 340px; right: 0; }
}

/* Desktop hero fits the first screen: the row fills the 100vh container under the fixed header,
   type, art and spacing scale with viewport height. !important only where it overrides Bootstrap utilities. */
@media (min-width: 992px) {
  .fullscreen-bg:has(.wk-hero-copy) { padding-top: calc(100vh - 100px); }
  .row:has(> .wk-hero-copy) { flex: 1 1 auto; align-self: stretch; }
  .wk-hero-copy { display: flex; flex-direction: column; justify-content: center; padding-top: clamp(1rem, 4vh, 3rem) !important; padding-bottom: clamp(1rem, 4vh, 3rem) !important; }
  .wk-hero-copy .wk-eyebrow { margin-bottom: 0; }
  .wk-hero-title { font-size: min(4.7vw, 9.5vh, 76px); margin: 3vh 0; }
  .wk-hero-copy .h3, .wk-hero-copy .wk-lead { margin-bottom: 2.5vh !important; }
  .wk-hero-copy .btn { align-self: start; }
  .wk-hero-art { height: auto; clip-path: inset(-100vh -100vw 0 -100vw); }
  .wk-hero-pattern { top: 18%; height: 66%; }
  .wk-hero-kids { top: 4%; width: min(104%, 550px, 62vh); }
  .wk-hero-stamp { bottom: 6vh; width: min(158px, 22vh); height: min(158px, 22vh); }
}

@media (max-width: 991px) {
  .wk-hero { padding-left: 0; }
  .wk-hero-title { font-size: clamp(40px, 7vw, 66px); }
  .wk-hero-art { height: 480px; }
  .wk-hero-kids { top: 0; right: 12%; width: 65%; max-width: 390px; }
  .wk-hero-pattern { top: 80px; right: -5%; width: 85%; height: 350px; }
  .wk-hero-stamp { left: 10%; bottom: 30px; }
  .wk-closing { padding-bottom: 500px; }
  .wk-closing-pattern { width: 100%; height: 320px; }
  .wk-closing-zebra { height: 470px; width: 320px; right: calc(50% - 160px); }
  .fullscreen-bg { height: auto; padding-top: 0; }
  .fullscreen-bg .overlay { position: relative; height: auto; }
  .fullscreen-bg .h-100vh { height: auto; padding-top: 40px; padding-bottom: 40px; }
}
@media (max-width: 575px) {
  .weekend-page { padding-top: 76px; }
  .weekend-page main section, .weekend-page footer { scroll-margin-top: 90px; }
  .wk-topbar { min-height: 76px; }
  .wk-hero-title { font-size: clamp(37px, 10.5vw, 56px); letter-spacing: -.055em; }
  .wk-hero-art { height: 405px; }
  .wk-hero-kids { width: 74%; right: 7%; }
  .wk-hero-pattern { height: 320px; width: 93%; right: -5%; }
  .wk-hero-stamp { width: 130px; height: 130px; left: 6%; bottom: 28px; }
  .wk-hero-stamp span { font-size: 10px; }
  .wk-hero-stamp strong { font-size: 19px; }
  .wk-eyebrow { font-size: 11px; }
  .wk-lead { font-size: 16px; }
  .wk-experience-photo { min-height: 280px; }
  .wk-video-frame { max-width: 280px; }
  .wk-time { width: 92px; }
  .wk-location-photo { height: 390px; }
  .wk-closing { padding-top: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .weekend-page *, .weekend-page *::before, .weekend-page *::after { transition: none !important; }
}