/*
  Affordable Office Spaces — Day Office Premium v4
  Direct, product-led refinements layered over the approved shared shell,
  day-office.css and the v3 visual foundation. This file intentionally does
  not redefine shared navigation or global readability rules.
*/

.day-office-v4 {
  --day-v4-night: #071d25;
  --day-v4-night-2: #0b303a;
  --day-v4-ink: #102b34;
  --day-v4-muted: #60727a;
  --day-v4-orange: #f46b2a;
  --day-v4-aqua: #61d8ce;
  --day-v4-ice: #eff8fa;
  --day-v4-line: rgba(16, 43, 52, .12);
  --day-v4-shadow: 0 28px 80px rgba(5, 29, 38, .15);
}

.day-office-v4 #day-guide,
.day-office-v4 #day-scenarios,
.day-office-v4 #day-planner,
.day-office-v4 #experience,
.day-office-v4 #included,
.day-office-v4 #gallery,
.day-office-v4 #locations,
.day-office-v4 #stories,
.day-office-v4 #how-it-works,
.day-office-v4 #contact {
  scroll-margin-top: 154px;
}

.day-office-v4 .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Direct hero controls -------------------------------------------------- */
.day-office-v4 .day-intro h1 {
  max-width: 760px;
  text-wrap: balance;
}

.day-office-v4 .day-intro__lede {
  max-width: 720px;
  font-size: clamp(1.02rem, 1.25vw, 1.18rem);
}

.day-office-v4 .day-intro__facts dd {
  max-width: 210px;
}

.day-office-v4 .day-mode-switcher {
  padding-right: 68px;
}

.day-v4-icon-toggle {
  display: inline-grid;
  place-items: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid rgba(16, 43, 52, .14);
  border-radius: 50%;
  color: var(--day-v4-ink);
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 12px 28px rgba(7, 29, 37, .12);
  transition: transform .25s ease, color .25s ease, background .25s ease,
    border-color .25s ease, box-shadow .25s ease;
}

.day-v4-icon-toggle svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}

.day-v4-icon-toggle:hover {
  transform: translateY(-2px);
  color: #fff;
  border-color: var(--day-v4-ink);
  background: var(--day-v4-ink);
  box-shadow: 0 15px 34px rgba(7, 29, 37, .2);
}

.day-v4-icon-toggle:focus-visible {
  outline: 3px solid rgba(244, 107, 42, .36);
  outline-offset: 4px;
}

.day-office-v4 .day-v3-hero-autoplay {
  top: 10px;
  right: 10px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
}

.day-office-v4 .day-v3-hero-autoplay span:not(.sr-only) {
  font-size: inherit;
}

/* Direct workspace comparison ----------------------------------------- */
.day-space-guide-v4 {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 118px 0 126px;
  background:
    radial-gradient(circle at 10% 22%, rgba(97, 216, 206, .13), transparent 30%),
    radial-gradient(circle at 88% 80%, rgba(244, 107, 42, .1), transparent 28%),
    linear-gradient(180deg, #f7fbfc 0%, #eef7f8 100%);
}

.day-space-guide-v4 .day-match-v3__grid,
.day-space-guide-v4 .day-match-v3__glow {
  pointer-events: none;
}

.day-space-guide-v4__shell {
  position: relative;
  z-index: 2;
  margin-top: 60px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .86);
  border-radius: 42px;
  background: rgba(255, 255, 255, .72);
  box-shadow: var(--day-v4-shadow);
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
}

.day-space-guide-v4__tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  padding: 10px;
  background: rgba(7, 29, 37, .04);
}

.day-space-guide-v4__tabs button {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  min-height: 90px;
  padding: 15px 18px;
  border: 1px solid transparent;
  border-radius: 24px;
  color: var(--day-v4-muted);
  text-align: left;
  background: transparent;
  transition: transform .25s ease, color .25s ease, background .25s ease,
    border-color .25s ease, box-shadow .25s ease;
}

.day-space-guide-v4__tabs button:hover {
  transform: translateY(-2px);
  color: var(--day-v4-ink);
  background: rgba(255, 255, 255, .68);
}

.day-space-guide-v4__tabs button.is-active {
  color: var(--day-v4-ink);
  border-color: rgba(16, 43, 52, .09);
  background: #fff;
  box-shadow: 0 14px 35px rgba(7, 29, 37, .1);
}

.day-space-guide-v4__tabs button:focus-visible {
  outline: 3px solid rgba(244, 107, 42, .3);
  outline-offset: 2px;
}

.day-space-guide-v4__tabs button > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(16, 43, 52, .12);
  border-radius: 14px;
  color: var(--day-v4-ink);
  font-family: var(--font-display);
  font-size: .84rem;
  font-weight: 800;
  background: rgba(239, 248, 250, .88);
}

.day-space-guide-v4__tabs button.is-active > span {
  color: #fff;
  border-color: var(--day-v4-orange);
  background: var(--day-v4-orange);
  box-shadow: 0 9px 22px rgba(244, 107, 42, .22);
}

.day-space-guide-v4__tabs strong,
.day-space-guide-v4__tabs small {
  display: block;
}

.day-space-guide-v4__tabs strong {
  color: inherit;
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: -.02em;
}

.day-space-guide-v4__tabs small {
  margin-top: 4px;
  color: #71828a;
  font-size: .82rem;
  line-height: 1.42;
}

.day-space-guide-v4__stage {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
  min-height: 650px;
}

.day-space-guide-v4__visual {
  position: relative;
  min-height: 650px;
  overflow: hidden;
  background: var(--day-v4-night);
}

.day-space-guide-v4__visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 42%, rgba(4, 22, 29, .68) 100%);
  pointer-events: none;
}

.day-space-guide-v4__visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.07);
  transition: opacity .55s ease, transform 1s cubic-bezier(.2, .8, .2, 1);
}

.day-space-guide-v4__visual img.is-active {
  opacity: 1;
  transform: scale(1.015);
}

.day-space-guide-v4__badge {
  position: absolute;
  z-index: 3;
  right: 24px;
  bottom: 24px;
  left: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 17px 19px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 22px;
  color: #fff;
  background: rgba(5, 28, 37, .58);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.day-space-guide-v4__badge span,
.day-space-guide-v4__badge strong {
  display: block;
}

.day-space-guide-v4__badge span {
  color: rgba(255, 255, 255, .74);
  font-size: .82rem;
  font-weight: 750;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.day-space-guide-v4__badge strong {
  color: #fff;
  font-family: var(--font-display);
  font-size: .96rem;
  text-align: right;
}

.day-space-guide-v4__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(42px, 5vw, 76px);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(247, 251, 252, .86));
}

.day-space-guide-v4__kicker {
  margin: 0;
  color: var(--day-v4-orange);
  font-size: .83rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.day-space-guide-v4__content h3 {
  max-width: 590px;
  margin: 12px 0 16px;
  color: var(--day-v4-ink);
  font-family: var(--font-display);
  font-size: clamp(2rem, 3.2vw, 3.5rem);
  letter-spacing: -.055em;
  line-height: 1.04;
  text-wrap: balance;
}

.day-space-guide-v4__content > p:not(.day-space-guide-v4__kicker):not(.day-space-guide-v4__note) {
  max-width: 610px;
  margin: 0;
  color: var(--day-v4-muted);
  font-size: 1rem;
  line-height: 1.75;
}

.day-space-guide-v4__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 27px 0 0;
}

.day-space-guide-v4__facts > div {
  min-width: 0;
  padding: 15px;
  border: 1px solid rgba(16, 43, 52, .09);
  border-radius: 17px;
  background: rgba(239, 248, 250, .62);
}

.day-space-guide-v4__facts dt,
.day-space-guide-v4__facts dd {
  margin: 0;
}

.day-space-guide-v4__facts dt {
  color: #71828a;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.day-space-guide-v4__facts dd {
  margin-top: 7px;
  color: var(--day-v4-ink);
  font-size: .88rem;
  font-weight: 750;
  line-height: 1.45;
}

.day-space-guide-v4__content ul {
  display: grid;
  gap: 9px;
  margin: 25px 0 0;
  padding: 0;
  list-style: none;
}

.day-space-guide-v4__content li {
  position: relative;
  padding-left: 25px;
  color: #324b55;
  font-size: .92rem;
  font-weight: 700;
  line-height: 1.5;
}

.day-space-guide-v4__content li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #188d89;
  font-weight: 900;
}

.day-space-guide-v4__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.day-space-guide-v4__actions .button--glass {
  border-color: rgba(16, 43, 52, .13);
  color: var(--day-v4-ink);
  background: rgba(255, 255, 255, .82);
}

.day-space-guide-v4__note {
  margin: 21px 0 0;
  padding-top: 16px;
  border-top: 1px solid rgba(16, 43, 52, .09);
  color: #788890;
  font-size: .82rem;
  line-height: 1.55;
}

/* Scenario facts replace abstract score bars --------------------------- */
.day-summary-v4 .day-shift-lab__visual {
  min-height: 720px;
}

.day-summary-v4 .day-shift-lab__headline {
  max-width: 440px;
}

.day-v4-scenario-facts {
  position: absolute;
  z-index: 4;
  right: 22px;
  bottom: 22px;
  left: 22px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.day-v4-scenario-facts > div {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 16px;
  color: #fff;
  background: rgba(5, 27, 35, .64);
  backdrop-filter: blur(17px);
  -webkit-backdrop-filter: blur(17px);
}

.day-v4-scenario-facts span,
.day-v4-scenario-facts strong {
  display: block;
}

.day-v4-scenario-facts span {
  color: rgba(255, 255, 255, .64);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.day-v4-scenario-facts strong {
  margin-top: 5px;
  color: #fff;
  font-size: .86rem;
  line-height: 1.42;
}

.day-summary-v4 .day-shift-lab__controls {
  justify-content: center;
}

.day-summary-v4 .day-shift-lab__outcome {
  margin-top: 20px;
}

.day-summary-v4 .day-shift-lab__note {
  margin: 20px 0 0;
  color: #74858c;
  font-size: .82rem;
  line-height: 1.55;
}

.day-summary-v4 [data-day-v4-scenario-plan] {
  width: 100%;
  margin-top: 22px;
}

/* Availability selector ------------------------------------------------ */
.day-office-v4 .day-planner-v4 .day-planner__card {
  border-color: rgba(255, 255, 255, .17);
  background: linear-gradient(145deg, rgba(11, 48, 58, .97), rgba(6, 29, 37, .97));
  box-shadow: 0 34px 90px rgba(2, 18, 24, .28);
}

.day-v4-request-state {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 99px;
  color: rgba(255, 255, 255, .76);
  font-size: .8rem;
  font-weight: 800;
  white-space: nowrap;
  background: rgba(255, 255, 255, .06);
}

.day-v4-request-state i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--day-v4-orange);
  box-shadow: 0 0 0 5px rgba(244, 107, 42, .12);
}

.day-planner-v4 .day-choice-grid--purpose {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.day-planner-v4 .day-choice-grid--purpose button,
.day-planner-v4 .day-duration-grid button {
  min-height: 92px;
}

.day-planner-v4 .day-choice-grid--purpose small,
.day-planner-v4 .day-duration-grid small {
  font-size: .82rem;
  line-height: 1.42;
}

.day-planner-v4 .day-planner__fields--four {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.day-planner-v4 .day-pass {
  overflow: hidden;
  border-color: rgba(255, 255, 255, .13);
  background: rgba(255, 255, 255, .97);
}

.day-planner-v4 .day-pass__head small {
  color: #73858d;
}

.day-planner-v4 .day-planner__actions {
  gap: 11px;
}

.day-planner-v4 .day-planner__actions .button {
  min-height: 50px;
}

.day-planner-v4 .day-copy-button strong {
  white-space: nowrap;
}

.day-planner-v4 .day-planner__disclaimer {
  margin: 18px 0 0;
  color: rgba(255, 255, 255, .58);
  font-size: .82rem;
  line-height: 1.55;
}

/* Direct benefit sequence --------------------------------------------- */
.day-flow-v4 .section-heading__aside {
  align-items: flex-start;
}

.day-flow-v4 .day-flow__autoplay {
  position: static;
  margin-top: 16px;
}

.day-flow-v4 .day-flow__hud strong {
  text-wrap: balance;
}

.day-flow-v4 .day-flow__item h3 {
  text-wrap: balance;
}

/* Truthful feature grid ------------------------------------------------ */
.day-ready-v4 .day-ready__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.day-ready-v4 .day-ready-card--feature {
  grid-column: span 2;
  grid-row: span 2;
}

.day-ready-v4 .day-ready-card:not(.day-ready-card--feature):not(.day-ready-card--cta) {
  min-height: 290px;
}

.day-ready-v4 .day-ready-card--cta {
  min-height: 320px;
}

.day-ready-v4 .day-ready-card h3 {
  text-wrap: balance;
}

.day-ready-v4 .day-ready-card p {
  font-size: .91rem;
  line-height: 1.65;
}

.day-ready-v4 .day-room-detail p {
  display: block;
}

/* Reservation path ----------------------------------------------------- */
.day-booking-path-v4 .day-booking-path__shell {
  box-shadow: 0 30px 86px rgba(5, 29, 38, .16);
}

.day-booking-path-v4 .day-booking-path__copy h3 {
  text-wrap: balance;
}

.day-booking-path-v4 .day-booking-path__rail small {
  line-height: 1.4;
}

/* Contact confidence --------------------------------------------------- */
.day-office-v4 .day-contact .contact__copy > .eyebrow {
  display: none;
}

.day-office-v4 .day-form-brief {
  border-color: rgba(97, 216, 206, .24);
}

.day-office-v4 .day-form-next-note small {
  font-size: .82rem;
}

/* Responsive ----------------------------------------------------------- */
@media (max-width: 1180px) {
  .day-space-guide-v4__stage {
    grid-template-columns: minmax(0, 1fr) minmax(390px, .92fr);
  }

  .day-space-guide-v4__content {
    padding: 48px 38px;
  }

  .day-space-guide-v4__facts {
    grid-template-columns: 1fr;
  }

  .day-ready-v4 .day-ready__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .day-space-guide-v4 {
    padding: 92px 0 104px;
  }

  .day-space-guide-v4__tabs {
    grid-template-columns: 1fr;
  }

  .day-space-guide-v4__tabs button {
    min-height: 78px;
  }

  .day-space-guide-v4__stage {
    grid-template-columns: 1fr;
  }

  .day-space-guide-v4__visual {
    min-height: 570px;
  }

  .day-space-guide-v4__content {
    padding: 52px;
  }

  .day-space-guide-v4__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .day-summary-v4 .day-shift-lab__visual {
    min-height: 650px;
  }

  .day-ready-v4 .day-ready-card--feature {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

@media (max-width: 720px) {
  .day-office-v4 .day-mode-switcher {
    padding: 10px 62px 10px 10px;
  }

  .day-office-v4 .day-v3-hero-autoplay {
    top: 9px;
    right: 9px;
    width: 44px;
    min-width: 44px;
    padding: 0;
  }

  .day-space-guide-v4 {
    padding: 78px 0 88px;
  }

  .day-space-guide-v4__shell {
    margin-top: 38px;
    border-radius: 30px;
  }

  .day-space-guide-v4__tabs {
    padding: 7px;
  }

  .day-space-guide-v4__tabs button {
    grid-template-columns: 40px minmax(0, 1fr);
    min-height: 74px;
    padding: 12px;
    border-radius: 20px;
  }

  .day-space-guide-v4__tabs button > span {
    width: 40px;
    height: 40px;
  }

  .day-space-guide-v4__visual {
    min-height: 450px;
  }

  .day-space-guide-v4__badge {
    right: 14px;
    bottom: 14px;
    left: 14px;
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
    padding: 14px;
  }

  .day-space-guide-v4__badge strong {
    text-align: left;
  }

  .day-space-guide-v4__content {
    padding: 36px 22px 38px;
  }

  .day-space-guide-v4__content h3 {
    font-size: clamp(1.85rem, 9vw, 2.7rem);
  }

  .day-space-guide-v4__facts {
    grid-template-columns: 1fr;
  }

  .day-space-guide-v4__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .day-space-guide-v4__actions .button {
    width: 100%;
  }

  .day-summary-v4 .day-shift-lab__visual {
    min-height: 620px;
  }

  .day-v4-scenario-facts {
    right: 14px;
    bottom: 14px;
    left: 14px;
    grid-template-columns: 1fr;
  }

  .day-v4-scenario-facts > div {
    padding: 10px 12px;
  }

  .day-v4-scenario-facts > div:nth-child(3),
  .day-v4-scenario-facts > div:nth-child(4) {
    display: none;
  }

  .day-planner-v4 .day-choice-grid--purpose,
  .day-planner-v4 .day-planner__fields--four {
    grid-template-columns: 1fr;
  }

  .day-planner-v4 .day-planner__top {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .day-v4-request-state {
    align-self: flex-start;
  }

  .day-ready-v4 .day-ready__grid {
    grid-template-columns: 1fr;
  }

  .day-ready-v4 .day-ready-card--feature {
    grid-column: auto;
  }
}

@media (max-width: 460px) {
  .day-office-v4 .day-mode-switcher__buttons {
    grid-template-columns: 1fr;
  }

  .day-space-guide-v4__visual {
    min-height: 390px;
  }

  .day-space-guide-v4__tabs small {
    font-size: .78rem;
  }

  .day-summary-v4 .day-shift-lab__visual {
    min-height: 580px;
  }

  .day-v4-scenario-facts strong {
    font-size: .82rem;
  }

  .day-planner-v4 .day-choice-grid--purpose button,
  .day-planner-v4 .day-duration-grid button {
    min-height: 84px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .day-space-guide-v4__visual img,
  .day-space-guide-v4__tabs button,
  .day-v4-icon-toggle {
    transition: none !important;
  }
}

/* Layout-balance polish -------------------------------------------------
   The use selector now spans the full hero width, matching the more open
   interaction treatment used on the Home and Conference Room pages. The
   published features are arranged as one room visual with a compact facts
   grid beside it on larger screens, rather than a long stack of oversized
   cards. ---------------------------------------------------------------- */

.day-office-v4 .day-mode-switcher--wide {
  position: relative;
  z-index: 7;
  display: grid;
  grid-template-areas: "intro buttons toggle";
  grid-template-columns: minmax(220px, 1.05fr) minmax(0, 4fr) 54px;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  max-width: none;
  margin: 28px 0 0;
  padding: 9px;
  border-radius: 25px;
}

.day-office-v4 .day-mode-switcher--wide .day-mode-switcher__intro {
  grid-area: intro;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 9px 18px;
  border-right: 1px solid rgba(16, 43, 52, .11);
}

.day-office-v4 .day-mode-switcher--wide .day-mode-switcher__intro small {
  font-size: .8125rem;
}

.day-office-v4 .day-mode-switcher--wide .day-mode-switcher__intro strong {
  margin-top: 4px;
  font-size: .98rem;
}

.day-office-v4 .day-mode-switcher--wide .day-mode-switcher__buttons {
  grid-area: buttons;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  min-width: 0;
}

.day-office-v4 .day-mode-switcher--wide .day-mode-switcher__buttons button {
  justify-content: flex-start;
  min-width: 0;
  min-height: 58px;
  padding: 10px 13px;
  border-radius: 17px;
  text-align: left;
  white-space: normal;
  line-height: 1.25;
}

.day-office-v4 .day-mode-switcher--wide .day-mode-switcher__buttons button span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 9px;
  background: rgba(244, 107, 42, .085);
}

.day-office-v4 .day-mode-switcher--wide .day-mode-switcher__buttons button.is-active span {
  background: rgba(255, 255, 255, .1);
}

.day-office-v4 .day-mode-switcher--wide .day-v3-hero-autoplay {
  position: static;
  grid-area: toggle;
  align-self: center;
  justify-self: center;
  top: auto;
  right: auto;
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
}

.day-ready-v4 {
  padding-block: 112px 118px;
}

.day-ready-v4 .day-ready__grid.day-ready-v4__showcase {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(460px, .92fr);
  align-items: stretch;
  gap: 20px;
  margin-top: 54px;
}

.day-ready-v4__showcase > .day-ready-card--feature {
  grid-column: auto;
  grid-row: auto;
  min-width: 0;
  min-height: 780px;
  height: auto;
}

.day-ready-v4__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(0, 1fr));
  gap: 16px;
  min-width: 0;
  min-height: 780px;
}

.day-ready-v4 .day-ready-v4__facts .day-ready-card:not(.day-ready-card--feature),
.day-ready-v4 .day-ready-v4__facts .day-ready-card--cta {
  grid-column: auto;
  grid-row: auto;
  min-width: 0;
  min-height: 0;
  height: auto;
  padding: 21px;
  border-radius: 26px;
}

.day-ready-v4__facts .day-ready-card__icon {
  width: 43px;
  height: 43px;
  border-radius: 14px;
}

.day-ready-v4__facts .day-ready-card > small {
  margin-top: 15px;
  font-size: .8125rem;
  line-height: 1.35;
}

.day-ready-v4__facts .day-ready-card > h3 {
  margin: 7px 0 8px;
  font-size: clamp(1rem, 1.1vw, 1.16rem);
  line-height: 1.22;
}

.day-ready-v4__facts .day-ready-card > p {
  font-size: .8125rem;
  line-height: 1.5;
}

.day-ready-v4__facts .day-ready-card--cta .button {
  min-height: 44px;
  margin-top: 14px;
  padding-inline: 15px;
  font-size: .8rem;
}

.day-ready-v4__facts .day-ready-card__ring {
  top: -54px;
  right: -52px;
  transform: scale(.8);
}

.day-ready-v4__facts .day-ready-card__pulse {
  right: 14px;
  bottom: 14px;
}

@media (max-width: 1180px) {
  .day-office-v4 .day-mode-switcher--wide {
    grid-template-columns: minmax(190px, .92fr) minmax(0, 4fr) 52px;
  }

  .day-ready-v4 .day-ready__grid.day-ready-v4__showcase {
    grid-template-columns: minmax(0, 1.04fr) minmax(420px, .96fr);
  }

  .day-ready-v4__showcase > .day-ready-card--feature,
  .day-ready-v4__facts {
    min-height: 780px;
  }

  .day-ready-v4__facts .day-ready-card {
    padding: 18px;
  }
}

@media (max-width: 1100px) {
  .day-ready-v4 .day-ready__grid.day-ready-v4__showcase {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .day-ready-v4__showcase > .day-ready-card--feature {
    min-height: 650px;
  }

  .day-ready-v4__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    min-height: 0;
  }

  .day-ready-v4 .day-ready-v4__facts .day-ready-card:not(.day-ready-card--feature),
  .day-ready-v4 .day-ready-v4__facts .day-ready-card--cta {
    min-height: 220px;
  }
}

@media (max-width: 980px) {
  .day-office-v4 .day-mode-switcher--wide {
    grid-template-areas:
      "intro toggle"
      "buttons buttons";
    grid-template-columns: minmax(0, 1fr) 54px;
    width: min(100%, 820px);
    margin: 24px auto 0;
  }

  .day-office-v4 .day-mode-switcher--wide .day-mode-switcher__intro {
    border-right: 0;
  }

  .day-ready-v4 {
    padding-block: 96px 104px;
  }

  .day-ready-v4 .day-ready__grid.day-ready-v4__showcase {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 44px;
  }

  .day-ready-v4__showcase > .day-ready-card--feature {
    min-height: 650px;
  }

  .day-ready-v4__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    min-height: 0;
  }

  .day-ready-v4__facts .day-ready-card,
  .day-ready-v4__facts .day-ready-card--cta {
    min-height: 220px;
  }
}

@media (max-width: 720px) {
  .day-office-v4 .day-mode-switcher--wide {
    grid-template-areas:
      "intro toggle"
      "buttons buttons";
    grid-template-columns: minmax(0, 1fr) 52px;
    gap: 9px;
    padding: 10px;
  }

  .day-office-v4 .day-mode-switcher--wide .day-mode-switcher__intro {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    padding: 7px 10px;
  }

  .day-office-v4 .day-mode-switcher--wide .day-mode-switcher__buttons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .day-office-v4 .day-mode-switcher--wide .day-mode-switcher__buttons button {
    min-height: 62px;
    padding: 10px 12px;
  }

  .day-office-v4 .day-mode-switcher--wide .day-v3-hero-autoplay {
    position: static;
    top: auto;
    right: auto;
  }

  .day-ready-v4__showcase > .day-ready-card--feature {
    min-height: 620px;
  }

  .day-ready-v4__facts {
    gap: 12px;
  }

  .day-ready-v4__facts .day-ready-card,
  .day-ready-v4__facts .day-ready-card--cta {
    min-height: 230px;
    padding: 18px;
  }
}

@media (max-width: 560px) {
  .day-ready-v4__facts {
    grid-template-columns: 1fr;
  }

  .day-ready-v4__facts .day-ready-card,
  .day-ready-v4__facts .day-ready-card--cta {
    min-height: 0;
  }
}

@media (max-width: 420px) {
  .day-office-v4 .day-mode-switcher--wide .day-mode-switcher__buttons button {
    min-height: 58px;
  }

  .day-ready-v4 {
    padding-block: 82px 90px;
  }

  .day-ready-v4__showcase > .day-ready-card--feature {
    min-height: 540px;
  }
}


/* Day Office use-cases expansion --------------------------------------- */
.day-use-cases-v4 {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 126px 0 132px;
  color: #fff;
  background:
    radial-gradient(circle at 9% 18%, rgba(244, 107, 42, .19), transparent 31rem),
    radial-gradient(circle at 92% 68%, rgba(97, 216, 206, .18), transparent 34rem),
    linear-gradient(145deg, #061b23 0%, #082a34 52%, #0a3540 100%);
}

.day-use-cases-v4__grid {
  position: absolute;
  inset: 0;
  z-index: -3;
  opacity: .17;
  background-image:
    linear-gradient(rgba(255, 255, 255, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .09) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, black, transparent 92%);
}

.day-use-cases-v4__glow {
  position: absolute;
  z-index: -2;
  width: 660px;
  height: 660px;
  border-radius: 50%;
  filter: blur(8px);
  pointer-events: none;
}

.day-use-cases-v4__glow--one {
  top: -340px;
  right: -260px;
  background: radial-gradient(circle, rgba(97, 216, 206, .2), transparent 68%);
}

.day-use-cases-v4__glow--two {
  bottom: -390px;
  left: -280px;
  background: radial-gradient(circle, rgba(244, 107, 42, .18), transparent 68%);
}

.day-use-cases-v4__heading {
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(330px, .72fr);
  align-items: end;
  gap: clamp(38px, 6vw, 94px);
}

.day-use-cases-v4__heading h2 {
  max-width: 870px;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(3rem, 4.55vw, 5.55rem);
  font-weight: 700;
  letter-spacing: -.066em;
  line-height: 1.01;
  text-wrap: balance;
}

.day-use-cases-v4__heading h2 em {
  color: var(--day-v4-orange);
  font-style: normal;
}

.day-use-cases-v4__intro {
  padding-bottom: 8px;
}

.day-use-cases-v4__intro p {
  max-width: 590px;
  margin: 0;
  color: rgba(255, 255, 255, .68);
  font-size: 1rem;
  line-height: 1.76;
}

.day-use-cases-v4__intro .text-link {
  margin-top: 20px;
}

.day-use-cases-v4__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(450px, .92fr);
  align-items: start;
  gap: 22px;
  margin-top: 64px;
}

.day-use-cases-v4__cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
}

.day-use-case-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 296px;
  overflow: hidden;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 28px;
  color: #fff;
  background: linear-gradient(145deg, rgba(255, 255, 255, .085), rgba(255, 255, 255, .035));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 19px 52px rgba(1, 14, 19, .14);
  backdrop-filter: blur(19px) saturate(125%);
  -webkit-backdrop-filter: blur(19px) saturate(125%);
  transition: transform .32s var(--ease-out), border-color .32s ease,
    background .32s ease, box-shadow .32s ease;
}

.day-use-case-card::after {
  content: "";
  position: absolute;
  right: -82px;
  bottom: -86px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  opacity: .45;
  background: radial-gradient(circle, rgba(97, 216, 206, .13), transparent 70%);
  transition: opacity .32s ease, transform .5s var(--ease-out);
}

.day-use-case-card:hover {
  transform: translateY(-5px);
  border-color: rgba(97, 216, 206, .34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 28px 70px rgba(1, 14, 19, .24);
}

.day-use-case-card:hover::after {
  opacity: .86;
  transform: scale(1.12);
}

.day-use-case-card.is-active {
  border-color: rgba(244, 107, 42, .5);
  background:
    radial-gradient(circle at 95% 5%, rgba(97, 216, 206, .13), transparent 38%),
    linear-gradient(145deg, rgba(244, 107, 42, .17), rgba(255, 255, 255, .065));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 31px 76px rgba(1, 14, 19, .29);
}

.day-use-case-card__top {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

.day-use-case-card__top > span {
  color: var(--day-v4-orange);
  font-family: var(--font-display);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .1em;
}

.day-use-case-card__top > i {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 15px;
  color: #9af3eb;
  background: rgba(255, 255, 255, .07);
}

.day-use-case-card__top svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.day-use-case-card h3 {
  position: relative;
  z-index: 1;
  margin: 20px 0 10px;
  font-family: var(--font-display);
  font-size: clamp(1.08rem, 1.3vw, 1.34rem);
  letter-spacing: -.035em;
  line-height: 1.2;
}

.day-use-case-card p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: rgba(255, 255, 255, .65);
  font-size: .875rem;
  line-height: 1.62;
}

.day-use-case-card__tags {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.day-use-case-card__tags span {
  display: inline-flex;
  align-items: center;
  min-height: 29px;
  padding: 6px 9px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 999px;
  color: rgba(255, 255, 255, .68);
  background: rgba(255, 255, 255, .045);
  font-size: .72rem;
  font-weight: 800;
}

.day-use-case-card button {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 48px;
  margin-top: auto;
  padding: 18px 0 0;
  border: 0;
  color: #96eee6;
  background: transparent;
  font-size: .82rem;
  font-weight: 800;
  text-align: left;
}

.day-use-case-card button span {
  font-size: 1rem;
  transition: transform .22s ease;
}

.day-use-case-card button:hover span,
.day-use-case-card button:focus-visible span {
  transform: translateX(4px);
}

.day-use-case-card button:focus-visible {
  outline: 3px solid rgba(244, 107, 42, .4);
  outline-offset: 6px;
  border-radius: 8px;
}

.day-use-case-spotlight {
  position: sticky;
  top: 154px;
  min-width: 0;
  overflow: hidden;
  border-color: rgba(255, 255, 255, .18);
  border-radius: 38px;
  color: #fff;
  background: linear-gradient(148deg, rgba(6, 27, 35, .96), rgba(10, 52, 63, .94));
  box-shadow: 0 38px 100px rgba(1, 14, 19, .36), inset 0 1px 0 rgba(255, 255, 255, .1);
}

.day-use-case-spotlight__media {
  position: relative;
  min-height: 310px;
  overflow: hidden;
  background: #0a2932;
}

.day-use-case-spotlight__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.015);
  transition: opacity .26s ease, transform .7s var(--ease-out);
}

.day-use-case-spotlight:hover .day-use-case-spotlight__media img {
  transform: scale(1.045);
}

.day-use-case-spotlight__media img.is-changing {
  opacity: .24;
  transform: scale(1.07);
}

.day-use-case-spotlight__wash {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(4, 19, 25, .02) 16%, rgba(4, 19, 25, .26) 53%, rgba(4, 19, 25, .94) 100%);
}

.day-use-case-spotlight__media figcaption {
  position: absolute;
  right: 28px;
  bottom: 25px;
  left: 28px;
}

.day-use-case-spotlight__media figcaption span,
.day-use-case-spotlight__media figcaption strong {
  display: block;
}

.day-use-case-spotlight__media figcaption span {
  color: #93efe6;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.day-use-case-spotlight__media figcaption strong {
  max-width: 510px;
  margin-top: 7px;
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 2vw, 2.02rem);
  letter-spacing: -.045em;
  line-height: 1.14;
}

.day-use-case-spotlight__body {
  padding: 31px 31px 34px;
}

.day-use-case-spotlight__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.day-use-case-spotlight__top > span {
  color: var(--day-v4-orange);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.day-use-case-spotlight__top > strong {
  color: rgba(255, 255, 255, .48);
  font-size: .78rem;
}

.day-use-case-spotlight__top i {
  color: #fff;
  font-style: normal;
}

.day-use-case-spotlight__body > h3 {
  margin: 15px 0 12px;
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 2.35vw, 2.52rem);
  letter-spacing: -.052em;
  line-height: 1.08;
  text-wrap: balance;
}

.day-use-case-spotlight__body > p {
  margin: 0;
  color: rgba(255, 255, 255, .68);
  font-size: .93rem;
  line-height: 1.68;
}

.day-use-case-spotlight__path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 24px;
}

.day-use-case-spotlight__path > div {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 17px;
  background: rgba(255, 255, 255, .045);
}

.day-use-case-spotlight__path span,
.day-use-case-spotlight__path strong,
.day-use-case-spotlight__path small {
  display: block;
}

.day-use-case-spotlight__path span {
  color: var(--day-v4-orange);
  font-family: var(--font-display);
  font-size: .72rem;
  font-weight: 800;
}

.day-use-case-spotlight__path strong {
  margin-top: 8px;
  font-size: .82rem;
  line-height: 1.3;
}

.day-use-case-spotlight__path small {
  margin-top: 5px;
  color: rgba(255, 255, 255, .5);
  font-size: .72rem;
  line-height: 1.45;
}

.day-use-case-spotlight__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 22px 0 0;
}

.day-use-case-spotlight__facts > div {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
  background: rgba(255, 255, 255, .038);
}

.day-use-case-spotlight__facts dt {
  color: rgba(255, 255, 255, .43);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.day-use-case-spotlight__facts dd {
  margin: 6px 0 0;
  color: #fff;
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.38;
}

.day-use-case-spotlight__confirm {
  margin-top: 20px;
  padding: 17px 18px;
  border: 1px solid rgba(97, 216, 206, .16);
  border-radius: 19px;
  background: linear-gradient(135deg, rgba(97, 216, 206, .1), rgba(244, 107, 42, .055));
}

.day-use-case-spotlight__confirm > span {
  color: #91eee5;
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.day-use-case-spotlight__confirm ul {
  display: grid;
  gap: 7px;
  margin: 11px 0 0;
  padding: 0;
  list-style: none;
}

.day-use-case-spotlight__confirm li {
  position: relative;
  padding-left: 19px;
  color: rgba(255, 255, 255, .67);
  font-size: .8rem;
  line-height: 1.42;
}

.day-use-case-spotlight__confirm li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--day-v4-orange);
  font-weight: 900;
}

.day-use-case-spotlight__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 22px;
}

.day-use-case-spotlight__actions .button {
  min-height: 48px;
}

.day-use-case-spotlight__note {
  margin-top: 16px !important;
  color: rgba(255, 255, 255, .48) !important;
  font-size: .76rem !important;
  line-height: 1.52 !important;
}

.day-use-cases-v4__proof {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 20px;
}

.day-use-cases-v4__proof article {
  min-width: 0;
  min-height: 158px;
  padding: 19px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 22px;
  background: rgba(255, 255, 255, .045);
}

.day-use-cases-v4__proof span,
.day-use-cases-v4__proof strong,
.day-use-cases-v4__proof small {
  display: block;
}

.day-use-cases-v4__proof span {
  color: var(--day-v4-orange);
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.day-use-cases-v4__proof strong {
  margin-top: 11px;
  font-family: var(--font-display);
  font-size: .93rem;
  line-height: 1.3;
}

.day-use-cases-v4__proof small {
  margin-top: 8px;
  color: rgba(255, 255, 255, .52);
  font-size: .76rem;
  line-height: 1.48;
}

.day-use-cases-v4__alternatives {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
  margin-top: 18px;
  padding: 24px 26px;
  border-color: rgba(255, 255, 255, .14);
  border-radius: 24px;
  color: #fff;
  background: rgba(255, 255, 255, .055);
}

.day-use-cases-v4__alternatives > div:first-child {
  max-width: 730px;
}

.day-use-cases-v4__alternatives span,
.day-use-cases-v4__alternatives strong {
  display: block;
}

.day-use-cases-v4__alternatives span {
  color: #91eee5;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.day-use-cases-v4__alternatives strong {
  margin-top: 7px;
  font-family: var(--font-display);
  font-size: 1.05rem;
}

.day-use-cases-v4__alternatives p {
  margin: 7px 0 0;
  color: rgba(255, 255, 255, .58);
  font-size: .82rem;
  line-height: 1.52;
}

.day-use-cases-v4__alternatives > div:last-child {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.day-use-cases-v4__alternatives a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 13px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 13px;
  color: #fff;
  background: rgba(255, 255, 255, .055);
  font-size: .78rem;
  font-weight: 800;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}

.day-use-cases-v4__alternatives a:hover {
  transform: translateY(-2px);
  border-color: rgba(97, 216, 206, .38);
  background: rgba(97, 216, 206, .09);
}

.day-use-cases-v4__alternatives a:focus-visible {
  outline: 3px solid rgba(244, 107, 42, .38);
  outline-offset: 3px;
}

/* Exact-use-case handoff in the existing availability selector. */
.day-use-case-selection {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  align-items: center;
  gap: 14px;
  margin: 15px 0 4px;
  padding: 14px 15px;
  border: 1px solid rgba(97, 216, 206, .38);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(97, 216, 206, .14), rgba(244, 107, 42, .065));
}

.day-use-case-selection[hidden] {
  display: none;
}

.day-use-case-selection span,
.day-use-case-selection strong,
.day-use-case-selection small {
  display: block;
}

.day-use-case-selection span {
  color: #9cf3eb;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.day-use-case-selection strong {
  margin-top: 5px;
  color: #fff;
  font-family: var(--font-display);
  font-size: .92rem;
}

.day-use-case-selection small {
  margin-top: 4px;
  color: rgba(255, 255, 255, .58);
  font-size: .76rem;
  line-height: 1.4;
}

.day-use-case-selection button {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 14px;
  color: #fff;
  background: rgba(255, 255, 255, .07);
  font-size: 1.15rem;
}

.day-use-case-selection button:hover {
  background: rgba(244, 107, 42, .2);
}

.day-use-case-selection button:focus-visible {
  outline: 3px solid rgba(244, 107, 42, .4);
  outline-offset: 3px;
}

@media (max-width: 1180px) {
  .day-use-cases-v4__layout {
    grid-template-columns: 1fr;
  }

  .day-use-case-spotlight {
    position: relative;
    top: auto;
  }

  .day-use-case-spotlight__media {
    min-height: 420px;
  }

  .day-use-cases-v4__proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .day-use-cases-v4 {
    padding-block: 104px 112px;
  }

  .day-use-cases-v4__heading {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .day-use-cases-v4__intro {
    max-width: 760px;
  }

  .day-use-cases-v4__layout {
    margin-top: 48px;
  }

  .day-use-cases-v4__alternatives {
    align-items: stretch;
    flex-direction: column;
  }

  .day-use-cases-v4__alternatives > div:last-child {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .day-use-cases-v4 {
    padding-block: 88px 96px;
  }

  .day-use-cases-v4__heading h2 {
    font-size: clamp(2.65rem, 12vw, 4rem);
  }

  .day-use-cases-v4__cards {
    grid-template-columns: 1fr;
  }

  .day-use-case-card {
    min-height: 0;
    padding: 22px;
  }

  .day-use-case-spotlight {
    border-radius: 30px;
  }

  .day-use-case-spotlight__media {
    min-height: 340px;
  }

  .day-use-case-spotlight__body {
    padding: 26px 22px 28px;
  }

  .day-use-case-spotlight__path {
    grid-template-columns: 1fr;
  }

  .day-use-case-spotlight__path > div {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 3px 10px;
  }

  .day-use-case-spotlight__path span {
    grid-row: 1 / 3;
  }

  .day-use-case-spotlight__path strong,
  .day-use-case-spotlight__path small {
    margin-top: 0;
  }

  .day-use-case-spotlight__facts {
    grid-template-columns: 1fr;
  }

  .day-use-case-spotlight__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .day-use-case-spotlight__actions .button {
    width: 100%;
  }

  .day-use-cases-v4__proof {
    grid-template-columns: 1fr;
  }

  .day-use-cases-v4__proof article {
    min-height: 0;
  }

  .day-use-cases-v4__alternatives {
    padding: 22px;
  }

  .day-use-cases-v4__alternatives > div:last-child {
    flex-direction: column;
  }

  .day-use-cases-v4__alternatives a {
    justify-content: center;
    width: 100%;
  }
}

@media (max-width: 420px) {
  .day-use-case-spotlight__media {
    min-height: 300px;
  }

  .day-use-case-spotlight__media figcaption {
    right: 20px;
    bottom: 20px;
    left: 20px;
  }

  .day-use-case-card__tags {
    gap: 5px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .day-use-case-card,
  .day-use-case-card::after,
  .day-use-case-spotlight__media img,
  .day-use-cases-v4__alternatives a {
    transition: none !important;
  }
}

/* Readability safeguard for the new Day Office use-case experience. */
.day-use-cases-v4 .day-use-case-card__top > span,
.day-use-cases-v4 .day-use-case-card__tags span,
.day-use-cases-v4 .day-use-case-spotlight__media figcaption span,
.day-use-cases-v4 .day-use-case-spotlight__top > span,
.day-use-cases-v4 .day-use-case-spotlight__top > strong,
.day-use-cases-v4 .day-use-case-spotlight__path span,
.day-use-cases-v4 .day-use-case-spotlight__path small,
.day-use-cases-v4 .day-use-case-spotlight__facts dt,
.day-use-cases-v4 .day-use-case-spotlight__facts dd,
.day-use-cases-v4 .day-use-case-spotlight__confirm > span,
.day-use-cases-v4 .day-use-case-spotlight__confirm li,
.day-use-cases-v4 .day-use-case-spotlight__note,
.day-use-cases-v4 .day-use-cases-v4__proof span,
.day-use-cases-v4 .day-use-cases-v4__proof small,
.day-use-cases-v4 .day-use-cases-v4__alternatives span,
.day-use-cases-v4 .day-use-cases-v4__alternatives a,
.day-use-case-selection span,
.day-use-case-selection small {
  font-size: .8125rem !important;
}

/* ========================================================================
   Affordable Office Spaces — live Day Office booking system
   ======================================================================== */
.day-live-booking-form { position: relative; }
.day-live-booking-form .day-booking-honeypot {
  position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important;
  opacity: 0 !important; pointer-events: none !important;
}
.day-live-status,
.day-booking-review,
.day-booking-final-review,
.day-booking-disclosure {
  display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 13px;
  margin: 15px 0; padding: 15px 16px; border: 1px solid rgba(16,42,51,.09); border-radius: 18px;
  background: linear-gradient(135deg,rgba(100,217,207,.09),rgba(255,255,255,.72));
}
.day-live-status > span,
.day-booking-disclosure > span {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 12px;
  color: white; background: #117b78; font-size: .8rem; font-weight: 900;
}
.day-live-status > span::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 5px rgba(255,255,255,.18); }
.day-live-status[data-status="waiting"] > span { background: #789099; }
.day-live-status[data-status="loading"] > span { background: #e18a2d; animation: dayBookingPulse 1.2s ease-in-out infinite; }
.day-live-status[data-status="ready"] > span { background: #178d78; }
.day-live-status[data-status="empty"],
.day-live-status[data-status="error"] { border-color: rgba(211,73,48,.22); background: rgba(255,239,234,.76); }
.day-live-status[data-status="empty"] > span,
.day-live-status[data-status="error"] > span { background: #d34930; }
@keyframes dayBookingPulse { 50% { transform: scale(.82); opacity: .72; } }
.day-live-status p,
.day-booking-disclosure p { margin: 0; }
.day-live-status strong,
.day-live-status small,
.day-booking-disclosure strong,
.day-booking-disclosure small,
.day-booking-review span,
.day-booking-review strong,
.day-booking-review small,
.day-booking-final-review span,
.day-booking-final-review strong,
.day-booking-final-review small { display: block; }
.day-live-status strong,
.day-booking-disclosure strong { color: var(--ink); font-size: .88rem; }
.day-live-status small,
.day-booking-disclosure small { margin-top: 3px; color: #647a82; font-size: .78rem; line-height: 1.45; }
.day-booking-primary-grid { margin-top: 8px; }
.day-booking-time-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 12px; }
.day-booking-time-fields[hidden] { display: none; }

.day-booking-calendar {
  margin-top: 18px; padding: 18px; border: 1px solid rgba(16,42,51,.1); border-radius: 22px;
  background: linear-gradient(145deg,rgba(255,255,255,.85),rgba(238,248,249,.82));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.day-booking-calendar__header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.day-booking-calendar__header small,
.day-booking-calendar__header strong { display: block; }
.day-booking-calendar__header small { color: #117b78; font-size: .72rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.day-booking-calendar__header strong { margin-top: 4px; color: var(--ink); font-size: .94rem; }
.day-booking-calendar__controls { display: flex; align-items: center; gap: 9px; }
.day-booking-calendar__controls button {
  display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(16,42,51,.11); border-radius: 50%;
  color: var(--ink); background: white; font-weight: 900;
}
.day-booking-calendar__controls button:disabled { opacity: .35; cursor: not-allowed; }
.day-booking-calendar__controls span { min-width: 128px; color: var(--ink); font-size: .86rem; font-weight: 850; text-align: center; }
.day-booking-calendar__week,
.day-booking-calendar__days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 6px; }
.day-booking-calendar__week { margin-top: 18px; }
.day-booking-calendar__week span { color: #758990; font-size: .66rem; font-weight: 850; text-align: center; text-transform: uppercase; }
.day-booking-calendar__days { margin-top: 8px; }
.day-booking-calendar__blank { min-height: 58px; }
.day-booking-calendar__date {
  display: grid; place-items: center; align-content: center; gap: 2px; min-width: 0; min-height: 58px; padding: 5px 2px;
  border: 1px solid rgba(16,42,51,.08); border-radius: 13px; color: var(--ink); background: white;
  transition: transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.day-booking-calendar__date span { font-size: .86rem; font-weight: 900; }
.day-booking-calendar__date small { color: #6f838a; font-size: .61rem; font-weight: 800; }
.day-booking-calendar__date:not(:disabled):hover { transform: translateY(-2px); border-color: rgba(255,101,52,.45); box-shadow: 0 10px 22px rgba(7,28,36,.08); }
.day-booking-calendar__date.is-selected { color: white; border-color: #102a33; background: #102a33; box-shadow: 0 10px 22px rgba(7,28,36,.16); }
.day-booking-calendar__date.is-selected small { color: #8fe8df; }
.day-booking-calendar__date.is-limited:not(.is-selected) { border-color: rgba(225,138,45,.32); background: #fff8ed; }
.day-booking-calendar__date.is-full,
.day-booking-calendar__date.is-closed,
.day-booking-calendar__date.is-past { opacity: .45; background: rgba(231,237,239,.78); cursor: not-allowed; }
.day-booking-calendar__loading { grid-column: 1/-1; padding: 30px 12px; color: #647a82; text-align: center; }
.day-booking-calendar__loading.is-error { color: #b33f2e; }
.day-booking-calendar__legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 14px; color: #647a82; font-size: .69rem; font-weight: 750; }
.day-booking-calendar__legend span { display: inline-flex; align-items: center; gap: 6px; }
.day-booking-calendar__legend i { width: 9px; height: 9px; border-radius: 3px; background: #fff; box-shadow: inset 0 0 0 1px rgba(16,42,51,.18); }
.day-booking-calendar__legend i.is-limited { background: #fff0d8; }
.day-booking-calendar__legend i.is-full { background: #dce4e6; }

.day-booking-day {
  margin-top: 14px; padding: 17px; border: 1px solid rgba(100,217,207,.28); border-radius: 20px;
  background: rgba(242,251,251,.82);
}
.day-booking-day__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.day-booking-day__head small,
.day-booking-day__head strong { display: block; }
.day-booking-day__head small { color: #117b78; font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.day-booking-day__head strong { margin-top: 3px; color: var(--ink); font-size: .96rem; }
.day-booking-day__head > span { color: #627980; font-size: .76rem; font-weight: 750; text-align: right; }
.day-booking-day > p { margin: 12px 0; color: #647a82; font-size: .79rem; line-height: 1.5; }
.day-booking-day__timeline { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; }
.day-booking-day__slot {
  display: grid; min-height: 54px; padding: 8px; border: 1px solid rgba(16,42,51,.09); border-radius: 12px;
  color: var(--ink); background: white; text-align: left;
}
.day-booking-day__slot span,
.day-booking-day__slot small { display: block; }
.day-booking-day__slot span { font-size: .76rem; font-weight: 850; }
.day-booking-day__slot small { margin-top: 3px; color: #6d8288; font-size: .63rem; font-weight: 750; }
.day-booking-day__slot.is-selected { color: white; border-color: #117b78; background: #117b78; }
.day-booking-day__slot.is-selected small { color: rgba(255,255,255,.76); }
.day-booking-day__slot.is-busy { opacity: .45; background: #dfe7e9; cursor: not-allowed; }
.day-booking-day__loading { grid-column: 1/-1; padding: 20px; color: #647a82; text-align: center; }
.day-booking-day__loading.is-error { color: #b33f2e; }
.day-booking-day__date-list { display: grid; gap: 7px; }
.day-booking-day__date-list span { display: flex; justify-content: space-between; gap: 12px; padding: 9px 11px; border: 1px solid rgba(16,42,51,.08); border-radius: 11px; background: white; color: #4d6870; font-size: .76rem; }
.day-booking-day__date-list strong { color: var(--ink); }

.day-booking-review,
.day-booking-final-review { grid-template-columns: 1fr; gap: 3px; border-color: rgba(100,217,207,.35); background: linear-gradient(135deg,rgba(100,217,207,.12),rgba(255,101,52,.055)); }
.day-booking-review span,
.day-booking-final-review span { color: #117b78; font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.day-booking-review strong,
.day-booking-final-review strong { color: var(--ink); font-size: .9rem; }
.day-booking-review small,
.day-booking-final-review small { color: #607780; font-size: .76rem; line-height: 1.45; }
.day-booking-disclosure > span { background: #328b83; }
.day-live-booking-form .form-success > small { display: block; margin-top: 14px; color: #117b78; font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.day-live-booking-form .form-success > strong { display: block; margin-top: 4px; color: var(--ink); font-size: .94rem; }
.day-live-booking-form .form-success__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }

@media (max-width: 760px) {
  .day-booking-time-fields { grid-template-columns: 1fr; }
  .day-booking-calendar { padding: 14px 10px; }
  .day-booking-calendar__header { align-items: flex-start; flex-direction: column; }
  .day-booking-calendar__controls { width: 100%; justify-content: space-between; }
  .day-booking-calendar__week,
  .day-booking-calendar__days { gap: 3px; }
  .day-booking-calendar__blank,
  .day-booking-calendar__date { min-height: 52px; border-radius: 10px; }
  .day-booking-calendar__date small { font-size: .58rem; }
  .day-booking-day__timeline { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .day-booking-day__head { flex-direction: column; }
  .day-booking-day__head > span { text-align: left; }
  .day-live-booking-form .form-success__actions { display: grid; }
  .day-live-booking-form .form-success__actions .button { width: 100%; }
}

@media (max-width: 360px) {
  .day-booking-calendar__date span { font-size: .78rem; }
  .day-booking-calendar__date small { display: none; }
}

.day-booking-day__slot.is-past {
  cursor: not-allowed;
  color: #839399;
  border-color: rgba(16,42,51,.08);
  background: rgba(238,243,244,.72);
  box-shadow: none;
}
.day-booking-day__slot.is-past small { color: #8a9a9f; }

/* Keep the daily and weekly choices balanced after removing hourly rental. */
@media (min-width: 641px) {
  .day-planner-v4 .day-duration-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Preserve legibility of the revised labels on the dark planner panel. */
.day-office-v4 .day-planner-v4 .day-planner__top strong,
.day-office-v4 .day-planner-v4 .day-choice-group legend,
.day-office-v4 .day-planner-v4 .day-planner__fields .field > span {
  color: #f5fbfc;
}
.day-office-v4 .day-planner-v4 .day-choice-grid button,
.day-office-v4 .day-planner-v4 .day-duration-grid button:not(.is-selected),
.day-office-v4 .day-planner-v4 .day-timeline {
  background: #f3f8fa;
}
.day-office-v4 .day-planner-v4 .day-choice-grid button small,
.day-office-v4 .day-planner-v4 .day-duration-grid button:not(.is-selected) small {
  color: #46616c;
}
.day-office-v4 .day-planner-v4 .day-duration-grid button.is-selected small,
.day-office-v4 .day-planner-v4 .day-planner__disclaimer {
  color: #cedfe4;
}
.day-office-v4 .day-planner-v4 .day-timeline__track {
  grid-template-columns: auto minmax(0, 1fr) auto;
}