/* Homepage campaign: removing teamday-active restores the regular design. */
html.teamday-active {
  --red: #ba007d;
  --black: #25216f;
  --dark: #25216f;
  --surface-alt: #edf5ff;
  --line: #ccdcef;
}
html.teamday-active[data-theme="dark"] {
  --red: #ff74d1;
  --surface: #15152d;
  --surface-alt: #1d2041;
  --line: #41466c;
}
.teamday-active .header-cta,
.teamday-active .button-red,
.teamday-active .quick-actions > a:hover,
.teamday-active .skip-link { background: #ba007d; color: #fff; }
.teamday-active .hero-shade { background: linear-gradient(90deg,rgba(37,33,111,.88),rgba(37,33,111,.4) 55%,rgba(37,33,111,.08)); }
.teamday-active .filter-row button.active { background: #ba007d; border-color: #ba007d; }
.teamday-active .stock-used .button-white:hover,
.teamday-active .social-strip a:hover { background: #ba007d; border-color: #ba007d; }
.teamday-active .service-grid article:hover { --red: #ff74d1; }
.teamday-active .quick-actions > a:hover small { color: #fff; }
.teamday-active .stock-toyota { background: linear-gradient(145deg,#fff,#e3f0ff); }
.teamday-active .stock-toyota::after { border-color: rgba(75,151,230,.12); }
.teamday-active .stock-toyota .stock-copy > span { color: #ba007d; }
.teamday-active .contact-strip { border-top: 4px solid #ffad42; }
/* The campaign replaces the normal hero only while active. */
.teamday-active .hero { display: none; }
.teamday-active .quick-actions { margin-top: 0; }
.teamday[hidden] { display: none; }
.teamday { position: relative; isolation: isolate; overflow: hidden; padding: 56px var(--pad) 70px; background: #25216f; color: #fff; }
.teamday::before { content: ""; position: absolute; z-index: -1; width: 65vw; height: 65vw; max-width: 950px; max-height: 950px; right: -30vw; top: -25vw; border-radius: 50%; background: #ba007d; }
.teamday::after { content: ""; position: absolute; z-index: -1; width: 350px; height: 350px; left: -230px; bottom: -150px; border: 60px solid #ffad42; border-radius: 50%; }
.teamday-inner { max-width: 1240px; margin: auto; display: grid; grid-template-columns: minmax(0,1fr) minmax(260px,380px); grid-template-areas: "copy media" "action media"; column-gap: clamp(36px,7vw,100px); row-gap: 30px; align-items: center; }
.teamday-copy { grid-area: copy; align-self: end; scroll-margin-top: 90px; }
.teamday-eyebrow { margin: 0 0 26px; color: #ffb34f; font-size: 11px; font-weight: 700; line-height: 1.6; letter-spacing: .14em; text-transform: uppercase; }
.teamday h2 { margin: 0; font-size: clamp(46px,6.3vw,90px); line-height: .98; letter-spacing: -.055em; }
.teamday h2 span { color: #8ecaff; }
.teamday-intro { max-width: 480px; margin: 26px 0 30px; font-size: 17px; line-height: 1.7; color: #e2e5ff; }
.teamday-details { display: flex; flex-wrap: wrap; gap: 24px 36px; margin: 0; padding-top: 24px; border-top: 1px solid #625fa0; }
.teamday-details dt { margin-bottom: 9px; color: #ffb34f; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: .1em; }
.teamday-details dd { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.6; }
.teamday-details dd span { font-size: 14px; color: #e2e5ff; font-weight: 400; }
.teamday-media { grid-area: media; position: relative; min-width: 0; width: 100%; max-width: 380px; justify-self: center; }
.teamday-media video { display: block; width: 100%; height: auto; aspect-ratio: 9 / 16; object-fit: contain; background: #25216f; border: 1px solid #6963b1; border-radius: 10px; box-shadow: 18px 18px 0 #4f96e6, 0 25px 65px #100c4950; }
.teamday-scroll { display: none; }
.teamday-action { grid-area: action; align-self: start; }
.teamday-action .button { min-height: 52px; gap: 40px; background: #ba007d; color: white; }
.teamday-action .button:hover { background: #990067; }
.teamday a:focus-visible, .teamday video:focus-visible { outline: 3px solid #ffb34f; outline-offset: 5px; }
@media (min-width: 721px) and (max-width: 1050px) {
  .teamday { padding-top: 44px; padding-bottom: 60px; }
  .teamday-inner { grid-template-columns: minmax(0,1fr) minmax(240px, .8fr); gap: 28px; }
  .teamday h2 { font-size: clamp(44px,6vw,63px); }
  .teamday-intro { font-size: 15px; }
  .teamday-details { gap: 16px; }
  .teamday-details dd { font-size: 16px; }
}
@media (max-width: 720px) {
  .teamday-active .site-header { position: absolute; width: 100%; top: 0; background: linear-gradient(#18154fcc, transparent); border-bottom: 0; box-shadow: none; }
  .teamday { padding: 0; }
  .teamday::before, .teamday::after { display: none; }
  .teamday-inner { display: grid; grid-template-columns: minmax(0,1fr); grid-template-areas: "media" "copy" "action"; gap: 0; }
  .teamday-media { width: 100%; max-width: none; height: 100vh; height: 100svh; background: #4f96e6; }
  .teamday-media video { width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; border: 0; border-radius: 0; box-shadow: none; background: linear-gradient(#25216f 0%,#25216f 35%,#4f96e6 60%); }
  .teamday-scroll { position: absolute; bottom: 64px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 20px; min-height: 44px; padding: 10px 20px; border: 1px solid #ffffff80; border-radius: 30px; background: #25216fe8; color: white; font-size: 12px; white-space: nowrap; }
  .teamday-copy { padding: 44px var(--pad) 0; scroll-margin-top: 24px; }
  .teamday h2 { font-size: clamp(40px,10vw,64px); }
  .teamday-eyebrow { margin-bottom: 18px; }
  .teamday-intro { font-size: 16px; margin: 22px 0; }
  .teamday-action { padding: 28px var(--pad) 44px; }
  .teamday-action .button { width: 100%; }
}

/* Decorative campaign balloons: no hit targets, no horizontal overflow. */
.teamday-balloons, .teamday-balloon-toggle { display: none; }
.teamday-active .teamday-balloons { display: block; position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 8; }
.teamday-balloon { --balloon-color: #d60099; position: absolute; left: 3%; top: 100%; width: 58px; height: 73px; border-radius: 49% 51% 47% 48%; background: radial-gradient(ellipse at 30% 22%,#ffffffcc 0%,#ffffff44 13%,transparent 35%),radial-gradient(ellipse at 38% 32%,var(--balloon-color) 45%,#25216f 130%); box-shadow: inset -7px -9px 13px #25216f30; opacity: .72; animation: teamday-balloon-float 27s linear infinite; }
.teamday-balloon::before { content: ""; position: absolute; bottom: -6px; left: calc(50% - 4px); border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 7px solid var(--balloon-color); }
.teamday-balloon::after { content: ""; position: absolute; width: 12px; height: 66px; top: calc(100% + 5px); left: 50%; border-left: 1px solid #aab6cf99; border-radius: 50%; }
.teamday-balloon:nth-child(2) { --balloon-color: #1262ed; left: 91%; width: 46px; height: 59px; animation-duration: 33s; animation-delay: -15s; }
.teamday-balloon:nth-child(3) { --balloon-color: #ffcd36; left: 76%; width: 50px; height: 64px; animation-duration: 31s; animation-delay: -7s; }
.teamday-balloon:nth-child(4) { --balloon-color: #da0097; left: 16%; width: 38px; height: 49px; animation-duration: 38s; animation-delay: -24s; }
@keyframes teamday-balloon-float {
  0% { transform: translate3d(0,120px,0) rotate(-9deg); }
  25% { transform: translate3d(18px,-30vh,0) rotate(7deg); }
  50% { transform: translate3d(-12px,-65vh,0) rotate(-6deg); }
  75% { transform: translate3d(16px,-100vh,0) rotate(8deg); }
  100% { transform: translate3d(0,calc(-100vh - 180px),0) rotate(-9deg); }
}
.teamday-active .teamday-balloon-toggle { display: block; position: fixed; z-index: 9; left: 12px; bottom: max(12px,env(safe-area-inset-bottom)); min-height: 44px; padding: 10px 14px; border: 1px solid #ffffff80; border-radius: 24px; background: #25216f; color: #fff; font-size: 11px; cursor: pointer; }
.teamday-balloons-paused .teamday-balloon { animation-play-state: paused; }
@media (max-width: 720px) {
  .teamday-balloon { left: 2%; width: 34px; height: 44px; opacity: .58; }
  .teamday-balloon:nth-child(2) { left: 88%; width: 31px; height: 40px; }
  .teamday-balloon:nth-child(n+3) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .teamday-active .teamday-balloons, .teamday-active .teamday-balloon-toggle { display: none; }
  .teamday-balloon { animation: none; }
}

/* Stage colours and shapes echo the supplied Teamday artwork. */
.teamday {
  background:
    linear-gradient(0deg,#5097e6 0%,#5097e6 29%,transparent 29%),
    radial-gradient(ellipse 30% 83% at 67% 3%,#ffa33e 0%,#ffa33e 66%,transparent 66.4%),
    linear-gradient(90deg,#25216f 0%,#25216f 33%,#8546ac 33%,#ad57b7 51%,#c6008a 51%,#c6008a 86%,#ff9540 86%,#ffad50 100%);
}
.teamday::before { width: 160%; height: 42%; max-width: none; max-height: none; left: -30%; right: auto; top: auto; bottom: -17%; border: 3px solid #a5d0ff80; border-radius: 50%; background: transparent; transform: rotate(-12deg); }
.teamday::after { width: 80%; height: 38%; left: -28%; bottom: -10%; border: 3px solid #a5d0ff80; border-radius: 50%; background: transparent; transform: rotate(15deg); }
.teamday-copy { padding: 30px; border-radius: 4px; background: #25216fe8; }
.teamday-action { padding-left: 30px; }
.teamday-media video { border: 0; box-shadow: 0 24px 60px #25216f50; }
/* Gloss, a tapered silhouette, a knot and a fine string give the balloons volume. */
.teamday-balloon { --drift: 24vw; --tilt: 14deg; left: -8%; border-radius: 48% 49% 45% 46% / 45% 45% 55% 55%; background: radial-gradient(ellipse 34% 15% at 32% 16%,#fffffff0 0%,#ffffff80 35%,transparent 100%),radial-gradient(ellipse at 29% 28%,#ffffff44 0%,transparent 45%),radial-gradient(ellipse at 38% 32%,var(--balloon-color) 43%,#25216f 135%); box-shadow: inset 3px 2px 5px #ffffff55,inset -8px -9px 13px #25216f40,0 4px 8px #25216f18; opacity: .87; animation-name: teamday-balloon-diagonal; animation-timing-function: linear; }
.teamday-balloon:nth-child(2) { --drift: -29vw; --tilt: -17deg; left: 96%; }
.teamday-balloon:nth-child(3) { --drift: 34vw; --tilt: 20deg; left: 36%; }
.teamday-balloon:nth-child(4) { --drift: -27vw; --tilt: -12deg; left: 58%; }
@keyframes teamday-balloon-diagonal {
  from { transform: translate3d(0,120px,0) rotate(var(--tilt)); }
  to { transform: translate3d(var(--drift),calc(-100vh - 180px),0) rotate(var(--tilt)); }
}
@media (max-width: 1050px) and (min-width: 721px) {
  .teamday-copy { padding: 22px; }
  .teamday-action { padding-left: 22px; }
}
@media (max-width: 720px) {
  .teamday { background: #5097e6; }
  .teamday-copy { margin: 0; padding: 38px var(--pad) 0; border-radius: 0; background: #25216f; }
  .teamday-action { padding: 28px var(--pad) 44px; background: #25216f; }
  .teamday-media video { box-shadow: none; }
  .teamday-balloon { --drift: 38vw; left: -6%; opacity: .78; }
  .teamday-balloon:nth-child(2) { --drift: -40vw; left: 98%; }
}
@media (prefers-reduced-motion: reduce) {
  .teamday-balloon { animation: none; }
}

/* Match the campaign's square magenta action buttons. */
@media (max-width: 720px) {
  .teamday-scroll { border: 1px solid transparent; border-radius: 0; background: #ba007d; color: #fff; min-height: 50px; padding: 16px 18px; gap: 32px; font-size: 12px; font-weight: 700; }
  .teamday-scroll:hover { background: #990067; }
}

/* Keep the campaign name together at every viewport width. */
.teamday-copy { container-type: inline-size; }
.teamday h2 { font-size: clamp(24px,3.4vw,52px); font-size: 9.5cqi; }
.teamday h2 .teamday-title-line { display: block; white-space: nowrap; color: #fff; }
@media (max-width: 720px) {
  .teamday h2 { font-size: clamp(22px,7vw,48px); font-size: 9.5cqi; }
}

/* Balloons are clipped to the first campaign section on the homepage. */
.teamday-active .teamday .teamday-balloons { position: absolute; inset: 0; z-index: 3; container-type: size; }
.teamday-active .teamday-balloon-toggle { display: none; }
@keyframes teamday-balloon-diagonal {
  from { transform: translate3d(0,120px,0) rotate(var(--tilt)); }
  to { transform: translate3d(var(--drift),calc(-100cqh - 180px),0) rotate(var(--tilt)); }
}

/* Warm yellow accents connect the service section to the Teamday artwork. */
.teamday-active .service-icon { background: #ffcd36; border-color: #ffcd36; }
.teamday-active .service-icon svg { stroke: #25216f; }
.teamday-active .service-grid article { border-top: 3px solid #ffcd36; }
.teamday-active .service-grid article:hover a { color: #ffcd36; }
.teamday-active .quick-actions > a:hover svg { stroke: #ffcd36; }
.teamday-active .teamday-eyebrow,
.teamday-active .teamday-details dt { color: #ffcd36; }
.teamday-active .contact-strip { border-top-color: #ffcd36; }

/* Uninterrupted decorative video on phone, tablet and desktop. */
.teamday-media video { pointer-events: none; user-select: none; }
.teamday-media video::-webkit-media-controls { display: none !important; }
.teamday-details dd [data-teamday-hours], .teamday-details dd [data-teamday-locations] { color: inherit; font-size: inherit; font-weight: inherit; }

/* Two quick-action columns prevent overflow on tablet widths. */
@media (min-width:721px) and (max-width:1050px) {
  .quick-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .quick-actions > a { min-width:0; }
}