/* VendoPulse public-page wallpaper system. Keep application screens on their own styles. */
:root{
  --wallpaper-ink:#12382d;
  --wallpaper-muted:#456456;
  --wallpaper-paper:#f7faf6;
  --wallpaper-line:rgba(26,77,56,.16);
  --wallpaper-shadow:0 24px 70px rgba(13,54,37,.14);
}

body[class*="wallpaper-"]{
  background:#f3f7f2;
  color:var(--wallpaper-ink);
}

body[class*="wallpaper-"] .site-header{
  background:rgba(248,251,247,.90);
  border-bottom:1px solid rgba(26,77,56,.10);
  box-shadow:0 8px 28px rgba(17,53,38,.06);
  backdrop-filter:blur(18px);
}

body[class*="wallpaper-"] .site-footer{
  background:linear-gradient(180deg,#f4f8f2,#eaf3eb);
}

/* Homepage: readable copy sits directly over the softened retail scene. */
.wallpaper-home::before,
.wallpaper-home .brand-banner{
  display:none;
}

.wallpaper-home .hero{
  position:relative;
  isolation:isolate;
  min-height:min(850px,calc(100svh - 82px));
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  align-items:center;
  gap:clamp(24px,4vw,64px);
  padding:clamp(40px,5vw,80px) clamp(18px,4vw,64px);
  border-bottom:1px solid var(--wallpaper-line);
  background-image:
    linear-gradient(90deg,rgba(247,250,246,.93) 0%,rgba(247,250,246,.78) 37%,rgba(247,250,246,.18) 69%,rgba(16,48,34,.04) 100%),
    url("assets/landing-wallpapers/01-hero-retail-counter.jpg");
  background-position:center,center;
  background-size:cover;
}

.wallpaper-home .hero-copy{
  position:relative;
  z-index:1;
  max-width:680px;
}

.wallpaper-home .hero-copy::before{
  content:"";
  display:block;
  width:44px;
  height:3px;
  margin-bottom:18px;
  border-radius:99px;
  background:linear-gradient(90deg,#2be59d,#c99565);
}

.wallpaper-home .hero h1{
  max-width:17ch;
  margin-bottom:8px;
  font-size:clamp(38px,4.7vw,68px);
  line-height:1.06;
  letter-spacing:-.052em;
}

.wallpaper-home .hero .lead{
  max-width:61ch;
  color:#3b5b4e;
  font-size:clamp(15px,1.4vw,17px);
  line-height:1.65;
}

.wallpaper-home .hero-tagline{
  margin:0 0 12px;
  color:#237052;
}

.wallpaper-home .hero-trust li{
  background:rgba(255,255,255,.90);
  border-color:#cfdfd2;
}

.wallpaper-home .hero .fine-print{color:var(--wallpaper-muted)}

.wallpaper-home .hero-card{
  justify-self:end;
  align-self:end;
  width:min(100%,340px);
  margin-bottom:5px;
  padding:18px 19px;
  border:1px solid rgba(255,255,255,.94);
  border-radius:19px;
  background:rgba(255,255,255,.92);
  box-shadow:0 22px 60px rgba(14,45,31,.16);
  backdrop-filter:blur(12px);
  transform:none;
}

.wallpaper-home .hero-card .hero-number{font-size:40px}
.wallpaper-home .hero-card .hero-bars{height:105px}

/* Four photographic chapter bands keep the rest of the homepage coherent. */
.wallpaper-home #features,
.wallpaper-home #business-hub,
.wallpaper-home #downloads,
.wallpaper-home #plans{
  position:relative;
  isolation:isolate;
  border-block:1px solid rgba(29,81,57,.08);
  background-size:cover;
  background-position:center;
}

.wallpaper-home #features{
  background-image:
    linear-gradient(90deg,rgba(247,250,246,.97),rgba(247,250,246,.89) 55%,rgba(247,250,246,.64)),
    url("assets/landing-wallpapers/02-fast-checkout.jpg");
}

.wallpaper-home #business-hub{
  background-image:
    linear-gradient(90deg,rgba(236,246,236,.96),rgba(236,246,236,.88) 58%,rgba(236,246,236,.58)),
    url("assets/landing-wallpapers/03-stock-receiving.jpg");
}

.wallpaper-home #plans{
  background-image:
    linear-gradient(90deg,rgba(247,250,246,.97),rgba(247,250,246,.90) 55%,rgba(247,250,246,.62)),
    url("assets/landing-wallpapers/04-owner-overview.jpg");
}

.wallpaper-home #downloads{
  background-image:
    linear-gradient(90deg,rgba(238,247,239,.97),rgba(238,247,239,.90) 55%,rgba(238,247,239,.62)),
    url("assets/landing-wallpapers/05-windows-and-android.jpg");
}

.wallpaper-home #features .section-heading,
.wallpaper-home #business-hub .section-heading,
.wallpaper-home #downloads .section-heading,
.wallpaper-home #plans .section-heading{
  padding:26px 30px;
  border:1px solid rgba(255,255,255,.90);
  border-radius:22px;
  background:rgba(255,255,255,.82);
  box-shadow:0 12px 32px rgba(17,57,37,.08);
  backdrop-filter:blur(10px);
}

.wallpaper-home #features article,
.wallpaper-home #business-hub article,
.wallpaper-home #downloads article,
.wallpaper-home #plans article{
  background:rgba(255,255,255,.94);
  border-color:rgba(30,88,57,.15);
  box-shadow:0 16px 35px rgba(20,62,42,.08);
}

/* Three scene carousel: one readable card and two angled picture previews. */
.wallpaper-home #showcase{
  overflow:hidden;
  background:linear-gradient(145deg,#edf5ec 0%,#f9fbf7 55%,#e6f0e8 100%);
}
.wallpaper-home #showcase .section-heading{margin-bottom:8px}
.showcase-carousel{position:relative;isolation:isolate}
.showcase-carousel-stage{
  position:relative;
  height:clamp(460px,50vw,610px);
  margin-top:20px;
  perspective:1400px;
}
.showcase-carousel .showcase-card{
  position:absolute;
  top:50%;
  left:50%;
  z-index:1;
  width:min(70%,760px);
  height:min(94%,560px);
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:minmax(0,1.5fr) minmax(0,1fr);
  overflow:hidden;
  transform:translate(-50%,-50%) translateX(var(--carousel-shift)) rotateY(var(--carousel-turn)) scale(var(--carousel-scale));
  opacity:var(--carousel-opacity);
  box-shadow:0 28px 64px rgba(17,60,42,.20);
  transition:transform .8s cubic-bezier(.22,.72,.22,1),opacity .8s ease,box-shadow .8s ease;
  pointer-events:none;
  will-change:transform;
}
.showcase-carousel .showcase-card:hover{box-shadow:0 28px 64px rgba(17,60,42,.20)}
.showcase-carousel .showcase-card img,
.showcase-carousel .showcase-card.showcase-wide img{
  grid-row:1;
  width:100%;height:100%;min-height:0;
  object-fit:cover;
  border:0;
  background:#e7f1e8;
}
.showcase-carousel .showcase-card:hover img{transform:none}
.showcase-carousel .showcase-card .showcase-copy{
  grid-row:2;
  padding:clamp(20px,2.7vw,32px);
  background:#fff;
  transition:opacity .35s ease;
}
.showcase-carousel .showcase-card .showcase-copy h3{font-size:clamp(20px,2.2vw,28px)}
.showcase-carousel .showcase-card .showcase-copy p{max-width:67ch;color:#526e60;line-height:1.55}
.showcase-carousel .showcase-card[data-position="active"]{
  --carousel-shift:0px;--carousel-turn:0deg;--carousel-scale:1;--carousel-opacity:1;
  z-index:3;pointer-events:auto;
}
.showcase-carousel .showcase-card[data-position="previous"]{
  --carousel-shift:clamp(-480px,-39vw,-280px);--carousel-turn:24deg;--carousel-scale:.74;--carousel-opacity:.74;
}
.showcase-carousel .showcase-card[data-position="next"]{
  --carousel-shift:clamp(280px,39vw,480px);--carousel-turn:-24deg;--carousel-scale:.74;--carousel-opacity:.74;
  z-index:2;
}
.showcase-carousel .showcase-card[data-position="previous"] .showcase-copy,
.showcase-carousel .showcase-card[data-position="next"] .showcase-copy{opacity:0}
.showcase-carousel-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:8px}
.showcase-carousel-controls>button:not(.showcase-pause){
  display:grid;place-items:center;width:42px;height:42px;
  border:1px solid #b8d4c1;border-radius:50%;background:#fff;
  color:#164d36;font-size:24px;cursor:pointer;
  box-shadow:0 5px 18px rgba(20,68,43,.10);
}
.showcase-carousel-controls>button:hover,.showcase-carousel-controls>button:focus-visible{background:#dff4e5}
.showcase-carousel-controls .showcase-pause{
  min-height:42px;padding:0 15px;border:1px solid #b8d4c1;border-radius:23px;
  background:#fff;color:#164d36;font:700 12px/1 var(--body);cursor:pointer;
}
.showcase-carousel-dots{display:flex;gap:8px}
.showcase-carousel-dots button{
  width:9px;height:9px;padding:0;border:0;border-radius:50%;
  background:#a5c7af;cursor:pointer;transition:width .25s ease,background .25s ease;
}
.showcase-carousel-dots button[aria-current="true"]{width:27px;border-radius:10px;background:#1d7450}
.showcase-carousel-dots button:focus-visible{outline:2px solid #134a33;outline-offset:4px}
.showcase-carousel-note{margin:10px 0 0;text-align:center;color:#6a8373;font-size:12px}
.showcase-carousel .sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.showcase-carousel:not(.is-ready) .showcase-carousel-stage{height:auto;display:grid;gap:18px}
.showcase-carousel:not(.is-ready) .showcase-card{
  position:static;width:100%;height:auto;display:block;transform:none;opacity:1;
  pointer-events:auto;will-change:auto;
}
.showcase-carousel:not(.is-ready) .showcase-card img{height:auto;max-height:430px;object-fit:contain}
.showcase-carousel:not(.is-ready) .showcase-carousel-controls,
.showcase-carousel:not(.is-ready) .showcase-carousel-note{display:none}

@media(max-width:720px){
  .showcase-carousel-stage{height:600px;margin-top:22px}
  .showcase-carousel .showcase-card{width:88%;height:565px;grid-template-rows:220px 1fr}
  .showcase-carousel .showcase-card .showcase-copy{padding:20px}
  .showcase-carousel .showcase-card .showcase-copy p{font-size:13px}
  .showcase-carousel .showcase-card .showcase-copy .button{margin-top:12px}
  .showcase-carousel .showcase-card[data-position="previous"]{
    --carousel-shift:-45vw;--carousel-turn:20deg;--carousel-scale:.78;--carousel-opacity:.6;
  }
  .showcase-carousel .showcase-card[data-position="next"]{
    --carousel-shift:45vw;--carousel-turn:-20deg;--carousel-scale:.78;--carousel-opacity:.6;
  }
  .showcase-carousel-controls{gap:10px;flex-wrap:wrap}
  .showcase-carousel-controls .showcase-pause{flex-basis:100%;max-width:170px;margin-top:5px}
}
@media(prefers-reduced-motion:reduce){
  .showcase-carousel .showcase-card,.showcase-carousel-dots button{transition:none}
  .showcase-carousel-controls .showcase-pause{display:none}
}

/* Public inner pages: image as wallpaper, copy stays in the foreground. */
.wallpaper-features{--page-wallpaper:url("assets/landing-wallpapers/02-fast-checkout.jpg")}
.wallpaper-hub{--page-wallpaper:url("assets/landing-wallpapers/03-stock-receiving.jpg")}
.wallpaper-plans{--page-wallpaper:url("assets/landing-wallpapers/04-owner-overview.jpg")}
.wallpaper-downloads{--page-wallpaper:url("assets/landing-wallpapers/05-windows-and-android.jpg")}
.wallpaper-learn{--page-wallpaper:url("assets/landing-wallpapers/04-owner-overview.jpg")}

.wallpaper-page .page-hero{
  min-height:clamp(510px,59vw,690px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  padding:clamp(70px,8vw,116px) clamp(20px,5vw,76px);
  border-bottom:1px solid var(--wallpaper-line);
  background-image:
    linear-gradient(90deg,rgba(247,250,246,.96) 0%,rgba(247,250,246,.91) 37%,rgba(247,250,246,.56) 64%,rgba(247,250,246,.06) 100%),
    var(--page-wallpaper);
  background-position:center;
  background-size:cover;
}

.wallpaper-page .page-hero::before{
  content:"";
  width:46px;
  height:3px;
  margin-bottom:27px;
  border-radius:99px;
  background:linear-gradient(90deg,#2be59d,#c99565);
}

.wallpaper-page .page-hero h1{
  max-width:17ch;
  margin:0 0 21px;
  color:var(--wallpaper-ink);
  font-size:clamp(39px,4.7vw,68px);
  line-height:1.08;
  letter-spacing:-.047em;
  text-wrap:balance;
}

.wallpaper-page .page-hero .lead{
  max-width:60ch;
  margin:0 0 22px;
  color:#355749;
  font-size:clamp(16px,1.5vw,19px);
  line-height:1.65;
}

.wallpaper-page .page-hero .eyebrow{
  color:#276f50;
  font-weight:800;
}

.wallpaper-page .page-hero .page-chips{
  max-width:760px;
}

.wallpaper-page .page-hero .page-chips li,
.wallpaper-page .page-hero .button.secondary{
  background:rgba(255,255,255,.91);
  backdrop-filter:blur(8px);
}

.wallpaper-page .section-heading,
.wallpaper-page .deep-card,
.wallpaper-page .download-card,
.wallpaper-page .price-card{
  border-color:rgba(30,88,57,.14);
}

.wallpaper-page .section-wrap.section.tinted{
  background:linear-gradient(135deg,#ecf4eb,#f7faf6 72%);
}

/* Workflows retain opaque interactive surfaces while their introductions carry the imagery. */
.wallpaper-contact .contact-main{
  min-height:calc(100svh - 82px);
  padding-top:clamp(55px,7vw,100px);
  padding-bottom:clamp(65px,8vw,110px);
  background-image:
    linear-gradient(90deg,rgba(247,250,246,.89),rgba(247,250,246,.72)),
    url("assets/landing-wallpapers/01-hero-retail-counter.jpg");
  background-size:cover;
  background-position:center;
}

.wallpaper-contact .contact-intro{
  max-width:760px;
  margin-inline:auto;
  padding:24px 28px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:22px;
  background:rgba(255,255,255,.86);
  box-shadow:0 15px 38px rgba(17,57,37,.10);
  backdrop-filter:blur(10px);
}

.wallpaper-contact .contact-card,
.wallpaper-demo .demo-content,
.wallpaper-cashier .sample-board{
  background:rgba(255,255,255,.97);
  box-shadow:var(--wallpaper-shadow);
}

.wallpaper-demo .demo-main{
  min-height:calc(100svh - 82px);
  padding-top:clamp(50px,6vw,85px);
  padding-bottom:85px;
  background-image:
    linear-gradient(90deg,rgba(247,250,246,.93),rgba(247,250,246,.70)),
    url("assets/landing-wallpapers/02-fast-checkout.jpg");
  background-size:cover;
  background-position:center;
}

.wallpaper-demo .demo-heading,
.wallpaper-cashier .sample-head{
  padding:25px 30px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:22px;
  background:rgba(255,255,255,.87);
  box-shadow:0 15px 38px rgba(17,57,37,.10);
  backdrop-filter:blur(10px);
}

.wallpaper-cashier .sample-shell{
  min-height:calc(100svh - 82px);
  padding-top:clamp(50px,6vw,85px);
  padding-bottom:85px;
  background-image:
    linear-gradient(90deg,rgba(247,250,246,.94),rgba(247,250,246,.74)),
    url("assets/landing-wallpapers/02-fast-checkout.jpg");
  background-size:cover;
  background-position:center;
}

.wallpaper-legal{
  background-image:
    linear-gradient(rgba(247,250,246,.91),rgba(247,250,246,.95)),
    url("assets/landing-wallpapers/01-hero-retail-counter.jpg");
  background-size:cover;
  background-position:center top;
}

.wallpaper-legal main.section-wrap{
  margin-top:34px;
  margin-bottom:42px;
  border:1px solid var(--wallpaper-line);
  border-radius:22px;
  background:rgba(255,255,255,.97);
  box-shadow:var(--wallpaper-shadow);
}

@media(max-width:900px){
  .wallpaper-home .hero{
    grid-template-columns:1fr;
    min-height:0;
    padding-block:70px 76px;
    background-position:center,64% center;
  }
  .wallpaper-home .hero-copy{max-width:640px}
  .wallpaper-home .hero-card{justify-self:start;width:min(100%,370px)}
  .wallpaper-page .page-hero{background-position:center,65% center}
}

@media(max-width:640px){
  html:has(body[class*="wallpaper-"]){scroll-padding-top:122px}
  body[class*="wallpaper-"] .site-header{
    min-height:108px;
    height:auto;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-content:center;
    justify-content:stretch;
    gap:9px;
    padding:9px 14px 11px;
  }
  body[class*="wallpaper-"] .site-header nav{
    width:100%;
    min-width:0;
    justify-content:space-between;
    gap:10px;
    overflow-x:auto;
  }
  body[class*="wallpaper-"] .site-header nav a[href$="downloads.html"],
  body[class*="wallpaper-"] .site-header nav a.nav-cta{
    flex:0 0 auto;
  }
  .wallpaper-home .hero{
    padding:35px 16px 58px;
    background-image:
      linear-gradient(180deg,rgba(247,250,246,.96),rgba(247,250,246,.89) 58%,rgba(247,250,246,.70)),
      url("assets/landing-wallpapers/01-hero-retail-counter.jpg");
    background-position:center,68% center;
  }
  .wallpaper-home .hero-copy{
    padding:0;
  }
  .wallpaper-home .hero h1{
    max-width:none;
    font-size:clamp(35px,9vw,48px);
  }
  .wallpaper-home .hero-card{display:none}
  .wallpaper-home .hero::after{
    content:"";
    display:block;
    height:190px;
    margin-top:20px;
    border:1px solid rgba(255,255,255,.76);
    border-radius:19px;
    background:url("assets/landing-wallpapers/01-hero-retail-counter.jpg") 64% 60%/cover;
    box-shadow:0 18px 38px rgba(15,58,39,.14);
  }
  .wallpaper-home #features .section-heading,
  .wallpaper-home #business-hub .section-heading,
  .wallpaper-home #downloads .section-heading,
  .wallpaper-home #plans .section-heading{
    padding:21px 20px;
    border-radius:17px;
  }
  .wallpaper-page .page-hero{
    min-height:0;
    padding:64px 20px 74px;
    background-image:
      linear-gradient(90deg,rgba(247,250,246,.95),rgba(247,250,246,.79)),
      var(--page-wallpaper);
    background-position:center,66% center;
  }
  .wallpaper-page .page-hero h1{
    max-width:none;
    font-size:clamp(36px,9vw,48px);
  }
  .wallpaper-page .page-hero .lead{font-size:16px}
  .wallpaper-contact .contact-intro,
  .wallpaper-demo .demo-heading,
  .wallpaper-cashier .sample-head{
    padding:20px 19px;
    border-radius:17px;
  }
  .wallpaper-legal main.section-wrap{
    margin:18px 12px 28px;
    border-radius:16px;
  }
}

@media print{
  body[class*="wallpaper-"],
  .wallpaper-home .hero,
  .wallpaper-home #features,
  .wallpaper-home #business-hub,
  .wallpaper-home #downloads,
  .wallpaper-home #plans,
  .wallpaper-page .page-hero,
  .wallpaper-contact .contact-main,
  .wallpaper-demo .demo-main,
  .wallpaper-cashier .sample-shell{
    background:#fff!important;
    color:#000!important;
    box-shadow:none!important;
  }
}

/* Wide public-page layout: aligned margins and compact, readable introductions. */
body[class*="wallpaper-"]{--content:1600px}
body[class*="wallpaper-"] .site-header{padding-inline:max(24px,calc((100vw - 1600px)/2))}
body.wallpaper-home .hero.section-wrap{min-height:clamp(580px,45vw,690px);padding:clamp(32px,4vw,64px) clamp(24px,4vw,64px);grid-template-columns:minmax(0, .95fr) minmax(0, 1.05fr)}
.wallpaper-home .hero-copy{max-width:620px}
.wallpaper-home .hero h1{max-width:14ch;font-size:clamp(38px,4.2vw,68px)}
.wallpaper-home .hero-trust li{background:transparent;border:0;padding:4px 8px 4px 0}
body.wallpaper-page .page-hero.section-wrap{min-height:0;padding:clamp(45px,5vw,76px) clamp(24px,4vw,64px)}
.wallpaper-page .page-hero h1{font-size:clamp(38px,4vw,62px);margin-bottom:14px}
.wallpaper-page .page-hero .lead{max-width:59ch;line-height:1.55;margin-bottom:18px}
.wallpaper-page .page-hero>.button{margin:0 0 20px}
.wallpaper-page .page-hero .stat-strip{margin-top:26px}
.wallpaper-demo .demo-heading>div:first-child{flex:1;min-width:0}
.wallpaper-demo .demo-boundary{flex:0 1 310px}
@media(max-width:900px){
 body.wallpaper-home .hero.section-wrap{grid-template-columns:1fr;min-height:0;padding:48px 28px 55px}
 .wallpaper-home .hero-copy{max-width:600px}
 .wallpaper-page .page-hero h1{max-width:18ch}
}
@media(max-width:640px){
 body[class*="wallpaper-"] .site-header{padding-inline:16px}
 body.wallpaper-home .hero.section-wrap{padding:32px 16px 40px}
 .wallpaper-home .hero h1{max-width:none;font-size:clamp(34px,9vw,46px)}
 body.wallpaper-page .page-hero.section-wrap{padding:40px 20px 48px}
 .wallpaper-page .page-hero h1{max-width:none;font-size:clamp(34px,9vw,46px)}
 .wallpaper-demo .demo-boundary{min-width:0}
}

/* Keep narrow stat grids within the page. */
.wallpaper-page .stat-strip{width:100%;grid-template-columns:repeat(4,minmax(0,1fr))}
.wallpaper-page .stat{min-width:0;overflow-wrap:anywhere}
@media(max-width:960px){.wallpaper-page .stat-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* At tablet and phone sizes the register has its own space below the copy. */
@media(max-width:900px){
 body.wallpaper-home .hero.section-wrap{background:#f7faf6;gap:0}
 .wallpaper-home .hero::after{content:"";display:block;width:100%;height:auto;aspect-ratio:16/9;margin-top:28px;border:0;border-radius:12px;background:url("assets/landing-wallpapers/01-hero-retail-counter.jpg") center/cover;box-shadow:none}
}

/* Wider content with an intentional edge gutter at every size. */
body[class*="wallpaper-"] .section-wrap{width:min(1600px,calc(100% - clamp(32px,7vw,128px)));margin-inline:auto}
body[class*="wallpaper-"] .site-header{padding-inline:max(clamp(16px,3.5vw,64px),calc((100vw - 1600px)/2))}

.wide-highlights{padding-block:32px 44px}
.wide-highlights .eyebrow{margin-bottom:4px}
.wide-highlights h2{margin:0 0 20px;color:#12382d;font:800 clamp(25px,2.2vw,34px)/1.15 var(--display);letter-spacing:-.03em}
.wide-highlights-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,32px)}
.wide-highlights-grid>a{display:grid;grid-template-columns:minmax(110px,42%) minmax(0,1fr);align-items:start;gap:16px;border-radius:10px}
.wide-highlights-grid img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.wide-highlights-grid a>span{display:grid;gap:6px;color:#456456;font-size:15px;line-height:1.45}
.wide-highlights-grid strong{color:#12382d;font:800 19px/1.2 var(--display)}
.wide-highlights-grid a:focus-visible{outline:3px solid #258d63;outline-offset:4px}
@media(max-width:900px){.wide-highlights-grid{grid-template-columns:1fr;gap:18px}.wide-highlights-grid>a{grid-template-columns:minmax(110px,30%) minmax(0,1fr)}}
