/* Nov 4, 2026 (Kelly's site list). Loaded last on every page that needs it. Each block names its item number. */

/* ---- 1 and 2 (homepage). 1: the voice row's interview card, arrow and laptop sit 40px further right, so the headline column has
   room (the gap between the words and the card is 64px, was 24; the laptop keeps its right edge and gives up those 40px).
   2: the One wedding row is rebuilt on the voice row's exact grid: the card in the same spot and width as the interview card, the
   laptop the same size as the voice laptop; "20 pieces of content." on one line; the paragraph narrower, not the headline. ---- */
@media (min-width: 1024px) and (max-width: 1279px) {
  html body #main#main#main#main#main#main :is(#example-brand-guide .wrap.v3col, #how .wrap.ow3col) { grid-template-columns: minmax(0, 1fr) calc(var(--card) + 20px) calc(var(--lap) - 40px) !important; }
  html body #main#main#main#main#main#main :is(#example-brand-guide .v3words, #how .owwords) { padding-right: 60px !important; }
  html body #main#main#main#main#main#main #how .owadd { grid-column: 2 !important; width: var(--card) !important; margin: 0 20px 0 0 !important; justify-self: end !important; }
  html body #main#main#main#main#main#main #how .ow3col > .varrow { grid-column: 2 !important; }
  html body #main#main#main#main#main#main :is(#example-brand-guide .vlaptop, #how .owlap) { grid-column: 3 !important; width: 100% !important; }
}
@media (min-width: 1280px) {
  html body #main#main#main#main#main#main :is(#example-brand-guide .wrap.v3col, #how .wrap.ow3col) { --w: 376px; --c: 280px; --a: 72px; grid-template-columns: var(--w) 64px var(--c) var(--a) minmax(0, 1fr) !important; }
  html body #main#main#main#main#main#main #how .owadd { width: var(--c) !important; justify-self: stretch !important; }
  /* "20 pieces of content." on one line inside the words column, about 50px clear of the card */
  html body #main#main#main#main#main#main #how .owwords > h2 { font-size: min(44px, 9.6cqw) !important; }
}
@media (min-width: 1440px) {
  html body #main#main#main#main#main#main :is(#example-brand-guide .wrap.v3col, #how .wrap.ow3col) { --w: 392px; --c: 290px; --a: 76px; }
}
@media (min-width: 1024px) {
  html body #main#main#main#main#main#main #how .owwords h2 .owline1 { white-space: nowrap !important; display: inline-block; }
  html body #main#main#main#main#main#main #how .owwords .lede { max-width: 330px !important; }
}

/* Item 5 (Kelly, Nov 4, 2026): "wherever you are." on one line; the device group shifted right. */
@media (min-width: 1024px) {
  html body #main#main#main#main#main#main #devices h2 .g br.dbr { display: none !important; }
  html body #main#main#main#main#main#main #devices h2 .g { white-space: nowrap !important; }
  html body #main#main#main#main#main#main #devices > .wrap { --dl: 360px; }
  html body #main#main#main#main#main#main #devices .devs2 { margin-left: 24px !important; }
}
@media (min-width: 1600px) { html body #main#main#main#main#main#main #devices > .wrap { --dl: 400px; } }