/* Marinova Formula 1 Abu Dhabi page: the race countdown band. A dark race-night background, kept subdued with a
   quiet centre for the countdown, then a calm confirmation panel in the reading column. The background sits on its own
   layer behind the text (::before); if it does not load, the band keeps the same charcoal colour, so the text stays
   readable. The band starts with a clean edge (the picture fades in from charcoal, so no light strip shows between it
   and the section above) and the picture settles into charcoal before the band eases out into the next section.
   Spacing comes from the content and padding only (no fixed heights). Loaded after the page layout layer. */

.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd{--f1cd-ink:#0f1012;--f1cd-fade:48px;position:relative;isolation:isolate;padding:clamp(48px,5.9vw,80px) var(--ui-gutter);background:transparent;border:0;color:#fff;text-align:center}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-color:var(--f1cd-ink);background-image:linear-gradient(to bottom,var(--f1cd-ink) 0,rgba(15,16,18,.6) 24px,rgba(15,16,18,0) 72px),linear-gradient(to top,var(--f1cd-ink) 0,rgba(15,16,18,.7) 48px,rgba(15,16,18,0) 160px),radial-gradient(ellipse 56% 62% at 50% 48%,rgba(15,16,18,.88) 0%,rgba(15,16,18,.7) 50%,rgba(15,16,18,.26) 84%,rgba(15,16,18,.1) 100%),linear-gradient(rgba(15,16,18,.24),rgba(15,16,18,.24)),url(/assets/ui-system/pages/f1-race-wide.257e62891255.webp);background-size:auto,auto,auto,auto,cover;background-position:center,center,center,center,center 30%;background-repeat:no-repeat;-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--f1cd-fade)),rgba(0,0,0,.9) calc(100% - var(--f1cd-fade) * .8),rgba(0,0,0,.66) calc(100% - var(--f1cd-fade) * .6),rgba(0,0,0,.36) calc(100% - var(--f1cd-fade) * .4),rgba(0,0,0,.12) calc(100% - var(--f1cd-fade) * .2),transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--f1cd-fade)),rgba(0,0,0,.9) calc(100% - var(--f1cd-fade) * .8),rgba(0,0,0,.66) calc(100% - var(--f1cd-fade) * .6),rgba(0,0,0,.36) calc(100% - var(--f1cd-fade) * .4),rgba(0,0,0,.12) calc(100% - var(--f1cd-fade) * .2),transparent 100%)}

/* ---- Heading, date and the countdown ---- */
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-event{margin:0 0 12px;font-size:11px;font-weight:600;letter-spacing:2.6px;text-transform:uppercase;color:#f2c230}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-date{margin:0 0 clamp(24px,3vw,34px);font-size:15px;letter-spacing:.2px;color:rgba(255,255,255,.86)}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-blocks{margin:0;align-items:flex-start;gap:clamp(10px,2.6vw,26px)}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-num{font-size:clamp(30px,5.2vw,52px);color:#fff}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-lbl{margin-top:10px;letter-spacing:1.8px;color:rgba(255,255,255,.7)}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-sep{font-size:clamp(22px,4.4vw,38px);color:#e5484d}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-cap{margin:clamp(20px,2.4vw,28px) auto 0;max-width:46ch;font-size:14.5px;line-height:1.6;color:rgba(255,255,255,.82)}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd :focus-visible{outline:2px solid #f2c230;outline-offset:3px}

/* ---- Confirmation panel: centred in the reading column, text start-aligned ---- */
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf{max-width:var(--ui-container-reading);margin:clamp(36px,4vw,48px) auto 0;padding:clamp(24px,3vw,40px);text-align:start;background:rgba(17,18,21,.9);border:1px solid rgba(255,255,255,.14);border-radius:16px;box-shadow:inset 0 3px 0 #c4161c,0 18px 40px rgba(0,0,0,.35)}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-ti{margin:0 0 14px;font-size:15.5px;font-weight:600;line-height:1.4;color:#fff}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-de{margin:0;font-size:14.5px;line-height:1.75;color:rgba(255,255,255,.84)}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-de + .f1-conf-de{margin-top:12px}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-src{margin:20px 0 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;line-height:1.7;color:rgba(255,255,255,.7);overflow-wrap:anywhere}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-src a{color:#f5c542;border-bottom:1px solid rgba(245,197,66,.5)}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-src a:hover,
.uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-src a:focus-visible{color:#ffd866;border-bottom-color:#ffd866}

/* ---- Separators in a lighter red and brighter unit labels, readable over the photograph ---- */
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-sep{color:#ff7a7e}
.uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-lbl{color:rgba(255,255,255,.86)}

/* ---- Art direction. Tablets: the whole frame at the band width, from the top, already blended into charcoal at its
   foot. Phones: the lower right part of the frame (grandstand, track and the white car) at the band width, from the
   top, also blended into charcoal, with a shade behind the heading and the countdown; a tall section simply continues
   in charcoal (never repeated or stretched). ---- */
@media (max-width:1100px){
  .uirh-service.uirh-service.uirh-service.uirh-service .f1-cd::before{background-image:linear-gradient(to bottom,var(--f1cd-ink) 0,rgba(15,16,18,.6) 24px,rgba(15,16,18,0) 72px),radial-gradient(ellipse 66% 58% at 50% 46%,rgba(15,16,18,.88) 0%,rgba(15,16,18,.68) 52%,rgba(15,16,18,.24) 86%,rgba(15,16,18,.08) 100%),linear-gradient(rgba(15,16,18,.24),rgba(15,16,18,.24)),url(/assets/ui-system/pages/f1-race-medium.486804f1e763.webp);background-size:auto,auto,auto,100% auto;background-position:center,center,center,center top}
}
@media (max-width:640px){
  .uirh-service.uirh-service.uirh-service.uirh-service .f1-cd{--f1cd-fade:32px}
  .uirh-service.uirh-service.uirh-service.uirh-service .f1-cd::before{background-image:linear-gradient(to bottom,var(--f1cd-ink) 0,rgba(15,16,18,.6) 24px,rgba(15,16,18,0) 72px),radial-gradient(ellipse 15em 5.5em at 50% calc(48px + 1.7em),rgba(15,16,18,.8) 0%,rgba(15,16,18,.6) 55%,rgba(15,16,18,0) 100%),linear-gradient(rgba(15,16,18,.58),rgba(15,16,18,.58)),url(/assets/ui-system/pages/f1-race-tall.359e3ca72a4c.webp);background-size:auto,auto,auto,100% auto;background-position:center,center,center,center top}
  .uirh-service.uirh-service.uirh-service.uirh-service .f1-cd-date{font-size:14.5px}
  .uirh-service.uirh-service.uirh-service.uirh-service .f1-conf-de{font-size:14px}
}
