/* =============================================================================
   gp-ecom.webflow.css — VENDORED. FROZEN. DO NOT HAND-EDIT.

   Roughly 7,800 lines of machine output from the original Webflow project.
   Nobody authors this file. The line count is deliberately approximate: an
   exact figure here went stale the moment this header was added to the file
   it counts, and three different exact figures were live in the repo at once.
   Same reason as the anchor rule below -- do not cite this file by number. It is treated exactly as js/webflow.js is treated:
   vendored, frozen, documented, pruned only where a rule is provably dead.

   WHY IT IS NOT BEING SPLIT OR TIDIED

   An earlier version of the cleanup plan proposed splitting it into per-layer
   files. That was dropped, because freezing the JS monolith while restructuring
   the CSS monolith is an asymmetry with no defence: both are machine output,
   neither is hand-written, and the split carried the highest risk in the plan
   for a stated benefit of "maintainability" of a file we have decided never to
   open.

   Its media-query order is also load-bearing in a way that is not locally
   obvious. Measured: min- and max-width blocks interleave and revisit 479, 991,
   1280 and 1440 twice. At equal specificity the last match wins, so a split
   would have had to preserve that order exactly across files.

   WHERE THE AUTHORED STYLES LIVE

   src/css/site.css      — everything written by hand for this site
   src/css/tokens.css    — GENERATED from design/tokens.json
   docs/CASCADE.md       — the load order, and why it is what it is

   IF THIS FILE EVER HAS TO CHANGE

   An edit is permitted only if it was produced by a command recorded in the
   commit message and re-runnable by a reviewer — a `sed` path rewrite
   qualifies, a hand tweak never does, however mechanical it felt. Anything
   beyond that needs a new argument in docs/DELIBERATE.md, not an appeal to a
   previous exception.

   Never delete from it by raw line range: a line-range splice yields
   syntactically valid CSS that has silently lost declarations. Parsed rule
   boundaries only — scripts/tools/prune-css.js.

   Cite blocks in it by ANCHOR, never by line number. It carries
   ANCHOR: phone-gate, ANCHOR: apply-wrapper, ANCHOR: showmethemoney. Every
   line range the docs used to quote was wrong by ~5,900 lines after a prune,
   and one sat in CLAUDE.md for a year.
   ============================================================================= */
@font-face {
  font-family: MNM;
  src: url('../fonts/MNM-REG.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: MNM;
  src: url('../fonts/MNM-B.woff2') format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: MNM;
  src: url('../fonts/MNM-ITA.woff2') format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: MNM;
  src: url('../fonts/MNM-BITA.woff2') format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: SUI;
  src: url('../fonts/SI-REG.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: SUI;
  src: url('../fonts/SI-B.woff2') format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: SUI;
  src: url('../fonts/SI-ITA.woff2') format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: SUI;
  src: url('../fonts/SI-BI.woff2') format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: GAR;
  src: url('../fonts/ITCGaramondStd-BkCond.woff2') format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: GAR;
  src: url('../fonts/ITCGaramondStd-BkCondIta.woff2') format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: SUI;
  src: url('../fonts/SUI-MED.woff2') format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: SUI;
  src: url('../fonts/SUI-MEDITA.woff2') format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: FRANK;
  src: url('../fonts/FranklinGothic-Heavy.woff2') format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: FRANK;
  src: url('../fonts/FranklinGothic-Book.woff2') format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: FRANK;
  src: url('../fonts/FranklinGothic-Medium.woff2') format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: FELT;
  src: url('../fonts/Felt-Tip-Senior-Regular.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: CF;
  src: url('../fonts/ClearfaceStd-Italic.woff2') format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: FUTPTXBOLD;
  src: url('../fonts/FuturaPTCondExtraBold.woff2') format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: FRANK;
  src: url('../fonts/Franklin-Gothic-Condensed.woff2') format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: FUTPTCOND;
  src: url('../fonts/FuturaPTCondExtraBoldOblique.woff2') format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: GAR;
  src: url('../fonts/ITCGaramondStd-LtCond.woff2') format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: SYS;
  src: url('../fonts/sysfont.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --vellum: #fff8ee;
  --brown: #827461;
  --hover-vellum: #fef4e6;
  --charcoal: #555;
  --navy: #1a1f39;
  --light-brown: #aca397;
  --red: #9c4141;
  --dark-vellum: #fbf3e8;
  --section-bg-2: #f8f0e5;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

body {
  background-color: var(--vellum);
  color: #000;
  font-family: SUI, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
}

h1 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1.2;
}

h2 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.2;
}

h3 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.2;
}

h4 {
  text-align: center;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.3;
}

h5 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.4;
}

h6 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
}

p {
  margin-bottom: 0;
  font-family: SUI, sans-serif;
  font-size: .9rem;
  position: static;
}

a {
  color: #000;
  border-color: #000;
  text-decoration: underline;
}

ul {
  margin-top: .5rem;
  margin-bottom: 1rem;
  padding-left: 1.25rem;
}

ol {
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding-left: 1.5rem;
}

li {
  margin-top: .25rem;
  margin-bottom: .25rem;
  padding-left: .5rem;
}

img {
  max-width: 100%;
  display: inline-block;
  position: relative;
}

label {
  margin-bottom: .25rem;
  font-weight: 500;
}

strong {
  font-weight: bold;
}

blockquote {
  border-left: .1875rem solid #000;
  margin-bottom: 0;
  padding: .75rem 1.25rem;
  font-size: 1.25rem;
  line-height: 1.5;
}

figure {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

figcaption {
  text-align: center;
  margin-top: .25rem;
}

.global-styles {
  display: block;
  position: fixed;
  inset: 0% auto auto 0%;
}

.max-width-xlarge {
  width: 100%;
  max-width: 64rem;
}

.page-wrapper {
  position: relative;
  overflow: visible;
}

.container-large {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.main-wrapper {
  display: block;
  position: relative;
  overflow: visible;
}

.padding-small {
  padding: 1.5rem;
}

.padding-bottom, .padding-bottom.padding-xlarge, .padding-bottom.padding-small, .padding-bottom.padding-xxhuge, .padding-bottom.padding-large, .padding-bottom.padding-xhuge, .padding-bottom.padding-custom2, .padding-bottom.padding-xxsmall {
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.icon-1x1-xsmall {
  width: 1.5rem;
  height: 1.5rem;
  display: block;
}

.icon-1x1-xsmall.aboutpage {
  display: none;
}

.heading-style-h1 {
  color: var(--light-brown);
  letter-spacing: -.05em;
  font-family: GAR, sans-serif;
  font-size: 4.8rem;
  font-weight: 500;
  line-height: 1.2;
  position: relative;
  top: 6vh;
  left: 28%;
  transform: rotate(-90deg);
}

.heading-style-h1.lifestyle.aboutpage, .heading-style-h1.mobile.aboutpage {
  color: var(--charcoal);
}

.footer_headings {
  color: var(--vellum);
  text-align: left;
  text-transform: uppercase;
  white-space: normal;
  padding-bottom: .4rem;
  font-family: MNM, sans-serif;
  font-size: .8rem;
  font-weight: 700;
}

.padding-section-small {
  padding-top: 1.5rem;
  padding-bottom: 1.2rem;
  display: block;
  position: relative;
}

.padding-global {
  text-align: center;
  background-color: #0000;
  flex: 1;
  padding-left: 5%;
  padding-right: 5%;
  display: flex;
  position: relative;
}

.padding-section-medium {
  padding-top: 5rem;
}

.padding-section-medium.mobile {
  padding-top: 4rem;
}

.navbar_component {
  z-index: 9999;
  background-color: var(--vellum);
  box-shadow: none;
  align-items: center;
  min-height: 4rem;
  margin-bottom: 0;
  padding-top: 1.5rem;
  padding-bottom: 0;
  display: flex;
  position: sticky;
  /* Was 25px, which left room for the announcement bar that used to sit above
     it. With that bar gone the offset just showed as a gap. */
  top: 0;
  transition: transform .35s ease;
}

/* Hide-on-scroll-down, reveal-on-scroll-up. Driven by js/nav-scroll.js. */
.navbar_component.nav-hidden {
  transform: translateY(-100%);
}

.navbar_component.aboutus {
  z-index: 9990;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: #0000;
  width: 100%;
  padding-top: 2rem;
  position: absolute;
  top: auto;
}

.navbar_desktop {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 80rem;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.navbar_desktop.max-width-xlarge {
  grid-column-gap: 0px;
  grid-row-gap: 0rem;
  grid-template-rows: 2rem 2rem;
  grid-template-columns: 1fr 2.25fr minmax(20%, .5fr) max-content auto .75fr .75fr .75fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: row;
  display: grid;
}

.navbar_desktop.max-width-xlarge.grid {
  border-bottom: 1px solid var(--light-brown);
  grid-template-rows: 2rem 2rem auto;
  grid-template-columns: 6vw 6vw 20vw 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr .5fr 1fr;
  max-width: none;
}

.navbar_desktop.max-width-xlarge.grid.hide-tablet {
  grid-template-columns: 6vw 6vw 20vw 6.8vw 1fr 1fr 1fr 1fr 1fr 1fr 1fr .5fr 5vw;
}

.navbar_desktop.max-width-xlarge.grid.hide-tablet.aboutus {
  border-bottom-color: var(--charcoal);
  grid-template-columns: 6vw 6vw 20vw 6.8vw 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}

.navbar_logo-link {
  justify-content: flex-start;
  padding-left: 0;
  display: flex;
}

.navbar_logo {
  flex: 0 auto;
  width: 100%;
  height: 2.2rem;
}

.navbar_link {
  border: 1px solid var(--light-brown);
  color: var(--brown);
  text-transform: uppercase;
  width: auto;
  min-width: 100%;
  height: 2.75rem;
  padding: .5rem 1rem;
  font-family: MNM, sans-serif;
}

.navbar_link.w--current {
  color: #0000;
}

.navbar_link.bottomrowlines {
  color: var(--brown);
  border-width: 0 1px 0 0;
  height: 2.1rem;
  padding-top: .65rem;
  padding-bottom: .9rem;
  font-size: .8rem;
  line-height: 1.1;
  text-decoration: none;
}

.navbar_link.bottomrowlines.end {
  border-right-width: 0;
  text-decoration: none;
}

.navbar_link.bottomrowlines.end.aboutus {
  border-top: 0px none var(--charcoal);
  border-left: 1px solid var(--charcoal);
  color: var(--charcoal);
}

.navbar_link.bottomrowlines.beginning {
  color: var(--brown);
  border-bottom-width: 0;
  border-left-width: 1px;
  height: 2.1rem;
  padding-top: .65rem;
  padding-bottom: 1rem;
  font-size: .8rem;
  font-weight: 400;
  line-height: 1.1;
}

.navbar_link.bottomrowlines.beginning.hide-tablet {
  color: var(--brown);
}

.navbar_link.bottomrowlines.aboutpage {
  color: var(--charcoal);
  border-right-style: none;
  margin-top: 1px;
  text-decoration: none;
}

.navbar_usericonwrapper {
  /* Borders removed: the icon now sits inline with the nav links rather than in
     its own boxed cell on the row above. */
  object-fit: contain;
  justify-content: center;
  align-items: center;
  height: 2rem;
  padding-left: 4px;
  padding-right: 4px;
  display: flex;
}

.navbar_usericonwrapper.aboutus {
  /* Was display: none. On the live Shopify site this wrapper holds a hidden
     account icon; with e-commerce gone it carries the Instagram link instead,
     matching the other four pages. The charcoal borders were already here for
     this variant, which sits over the light hero image. */
  display: flex;
}

.navbar_link-wrapper {
  color: var(--charcoal);
  justify-content: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.navbar_usericon {
  line-height: 0;
}

.navbar_usericon.icon-1x1-xsmall {
  flex: 0 auto;
  height: 1.25rem;
}

.signup-form_form-block {
  color: var(--red);
  flex: 1;
  align-self: auto;
  max-width: 30rem;
  margin-bottom: 0;
}

.success-message {
  color: var(--vellum);
  background-color: #0000;
  padding-top: 0;
  padding-bottom: 0;
  font-family: MNM, sans-serif;
}

.error-message {
  text-transform: uppercase;
  background-color: #0000;
  width: 12rem;
  margin-top: 0;
  padding: .875rem 1rem;
  font-size: .6rem;
  position: absolute;
  top: 20px;
}

.newsletter-button {
  background-color: var(--light-brown);
  color: var(--vellum);
  text-align: center;
  text-transform: uppercase;
  height: 1.7rem;
  padding: .3rem .7rem .2rem .5rem;
  font-family: MNM, sans-serif;
  font-size: .8rem;
  line-height: 1.3;
}

.newsletter-button.footer {
  background-color: var(--vellum);
  color: var(--light-brown);
  align-self: stretch;
  align-items: center;
  height: auto;
  font-size: .68rem;
  display: flex;
}

.newsletter-input {
  background-color: var(--dark-vellum);
  text-transform: none;
  border: 1px #000;
  height: 1.7rem;
  margin-bottom: 0;
  padding: .55rem .75rem .5rem;
  font-family: MNM, sans-serif;
  font-size: .7rem;
  font-style: normal;
}

.newsletter-input:focus {
  border: 1px none var(--light-brown);
}

.newsletter-input::placeholder {
  color: var(--light-brown);
  font-style: normal;
}

.newsletter-input.footer {
  color: var(--vellum);
  background-color: #0000;
  height: auto;
  padding-left: .7rem;
  padding-right: .5rem;
  font-size: .7rem;
}

.newsletter-input.footer::placeholder {
  color: var(--dark-vellum);
  font-size: .7rem;
}

.ticker-left_text {
  color: var(--brown);
  letter-spacing: -.05em;
  flex: none;
  padding-top: 5px;
  font-size: 2.5vw;
  font-weight: 400;
  display: inline-block;
}

.ticker-left_text.aboutpage {
  color: #303030;
  letter-spacing: -.02em;
  text-transform: uppercase;
  font-family: FUTPTCOND, sans-serif;
  font-size: 8vw;
}

.text-span {
  font-style: italic;
  font-weight: 700;
}

.navbar_link-underline {
  z-index: 10;
  background-color: var(--red);
  height: 2px;
  position: absolute;
  inset: auto 0% 0%;
}

.navbar_link-underline.bottomrow {
  bottom: -.3%;
}

.navmenu_mainmenu {
  z-index: 9999;
  background-color: var(--vellum);
  box-shadow: 1px 1px 2px 0 var(--light-brown);
  flex-direction: column;
  width: 100vw;
  max-width: 37vw;
  height: 100vh;
  display: flex;
  position: absolute;
}

.navmenu_mainmenu.aboutpage {
  z-index: 9999999;
  border-right: .5px solid var(--charcoal);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  color: #0000;
  background-color: #0000;
  height: 90vh;
  display: none;
  top: 2.25px;
  box-shadow: 1px 1px 2px #55555578;
}

.fadetogrey {
  z-index: 9000;
  background-color: var(--charcoal);
  opacity: .57;
  width: 100vw;
  height: 100%;
  display: none;
  position: fixed;
  inset: 0 0% 0%;
}

.navmenu_top-wrapper {
  border-bottom: .5px solid var(--light-brown);
  justify-content: flex-end;
  align-self: auto;
  height: 5rem;
  display: flex;
}

.navmenu_top-wrapper.aboutpage {
  border-bottom-color: var(--charcoal);
  display: block;
}

.navmenu_bottom-wrapper {
  height: 100%;
  display: flex;
}

.navmenu_bottom-wrapper.aboutpage {
  display: flex;
}

.navmenu_bottom-title {
  border-right: .5px solid var(--light-brown);
  width: 30%;
}

.navmenu_bottom-title.aboutpage {
  border-right-color: var(--charcoal);
}

.navmenu_bottom-menu {
  flex-direction: column;
  width: 70%;
  display: flex;
}

.navmenu_cultgroceries {
  margin-left: auto;
  margin-right: auto;
  display: block;
  top: 300px;
  left: 27%;
}

.navmenu_menu-item {
  z-index: 1;
  border-bottom: .5px solid var(--light-brown);
  justify-content: space-between;
  align-self: stretch;
  align-items: center;
  height: 3.5rem;
  padding-right: 15%;
  display: flex;
  position: relative;
}

.navmenu_menu-item.cult {
  flex: none;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  padding-right: 0%;
}

.navmenu_menu-item.cult.aboutpage {
  color: var(--charcoal);
}

.navmenu_menu-item.cult.aboutpage:hover {
  color: #000;
}

.navmenu_menu-item.aboutpage {
  border-color: var(--charcoal);
  border-top-style: none;
  border-top-width: 1px;
  border-left-style: none;
  border-left-width: 1px;
  border-right-style: none;
  border-right-width: 1px;
}

.navmenu_item-link {
  color: var(--light-brown);
  text-transform: uppercase;
  flex: 1;
  align-self: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 5%;
  font-family: MNM, sans-serif;
  font-size: .8rem;
  font-weight: 400;
  transition: color .2s;
  display: flex;
}

.navmenu_item-link:hover {
  color: var(--brown);
}

.navmenu_item-link.aboutpage {
  color: var(--charcoal);
}

.navmenu_item-link.aboutpage:hover {
  color: #000;
}

.navmenu_wrapper {
  z-index: 9998;
  display: none;
  position: sticky;
  top: 109px;
}

.navmenu_wrapper.aboutpage {
  background-color: #0000;
  display: block;
  position: relative;
  top: 96px;
  overflow: visible;
}

.section_footer {
  background-color: var(--light-brown);
  color: var(--charcoal);
  height: 87vh;
  display: block;
  overflow: hidden;
  box-shadow: inset 1px 1px 3px #000;
}

.footer_top-wrapper {
  grid-column-gap: 4vw;
  grid-row-gap: 1vw;
  border-top: 1px solid var(--vellum);
  grid-template-rows: auto auto;
  grid-template-columns: .75fr 1fr;
  align-items: start;
  padding-top: 22px;
}

.footer_right-wrapper {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  grid-template-rows: auto;
  grid-template-columns: .75fr .75fr .75fr .75fr;
  align-items: start;
  padding-top: 2px;
}

.footer_link-list {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-direction: column;
  grid-template-rows: auto;
  grid-template-columns: 100%;
  grid-auto-columns: 100%;
  place-items: flex-start start;
  display: flex;
}

.footer_links {
  color: var(--vellum);
  text-transform: uppercase;
  padding-bottom: .3rem;
  font-family: MNM, sans-serif;
  font-size: .8rem;
  text-decoration: none;
}

.footer_left-wrapper {
  grid-column-gap: 7px;
  grid-row-gap: 7px;
  flex-direction: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.footer_giantcopy {
  color: var(--vellum);
  text-align: left;
  letter-spacing: -.05em;
  text-transform: none;
  font-family: SUI, sans-serif;
  font-size: 2rem;
  font-weight: 400;
  line-height: .9;
}

.footer_giantcopy.just-in-case {
  text-align: right;
  padding-top: 20px;
  font-family: CF, sans-serif;
  font-size: 2rem;
}

.italic-text-2 {
  font-weight: 700;
}

.footer_emailsignup {
  border: 1px solid var(--vellum);
  color: var(--vellum);
  align-items: stretch;
  display: flex;
}

.footer_giantlogo {
  justify-content: center;
  height: 35vw;
  display: flex;
  position: relative;
  top: 67px;
}

.footer_biglogo {
  display: none;
}

.footer_socialswrapper {
  margin-top: 10px;
  display: flex;
}

.footer_socialbuttons-wrapper {
  align-items: center;
  padding-right: 5px;
  display: flex;
}

.footer_social-button {
  width: 2.2rem;
  height: 1.5rem;
  padding-right: 12px;
  display: flex;
}

.footer_social-buttonimage {
  margin-left: 1px;
}

.footer_credits-wrapper {
  flex-direction: column;
  align-items: flex-end;
  display: flex;
}

.footer_cultgroceries {
  width: 10rem;
}

.grocerypostlimited {
  color: var(--vellum);
  align-self: flex-end;
  padding-top: 2px;
  font-size: .6rem;
  font-weight: 500;
}

.footer_designedbywrapper {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  display: flex;
  position: relative;
  top: -1px;
  right: 1px;
}

.footer_designdevtext {
  color: var(--vellum);
  align-self: center;
  padding-bottom: 2px;
  font-size: .5rem;
}

.footer_spacefoodimage {
  width: 4rem;
  top: -4px;
}

.fadetogrey-cart {
  z-index: 9000;
  background-color: var(--charcoal);
  opacity: .57;
  width: 100%;
  height: 100%;
  display: none;
  position: fixed;
  inset: 0%;
}

.fadetogrey-cart.aboutpage {
  background-color: #ffe5b6;
  display: none;
}

.cult-t {
  margin-left: -25px;
}

.transition {
  z-index: 999998;
  border: 1px solid var(--light-brown);
  background-color: #0000;
  border-radius: 1px;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: none;
  position: fixed;
  inset: 0%;
}

.transition-logo {
  z-index: 1;
  max-width: 17rem;
  margin-bottom: .3rem;
}

.transition-content {
  box-shadow: -1px 0 3px 0 var(--charcoal);
  background-color: #0000;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: absolute;
}

.transition-bg {
  background-color: var(--vellum);
  width: 100%;
  height: 100vh;
  position: absolute;
  inset: 0%;
}

.transition-trigger {
  display: none;
}

.transition-colourbar {
  justify-content: center;
  width: 17rem;
  display: flex;
  position: relative;
  left: 1px;
}

.transition-colourblock {
  opacity: .67;
  max-width: 2.47rem;
  height: .75rem;
  margin-left: -1px;
}

.transition-copyright {
  text-align: right;
  width: 17rem;
  line-height: 0;
}

.transition-version1 {
  max-width: 100%;
  margin-top: 6px;
}

.footer_followercopy {
  margin-bottom: 10px;
}

.navbar_mobile {
  display: none;
}

.mobileblock {
  display: none;
}

.marquee {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  margin-top: 10px;
  margin-bottom: 10px;
  display: flex;
  overflow: hidden;
}

.marquee.aboutpage {
  background-color: #fff;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 20px;
}

.marquee-content {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex: none;
  justify-content: space-around;
  min-width: 100%;
  display: flex;
}

.caffeine-bg {
  width: 54vw;
  max-width: 115%;
  height: 153%;
  position: absolute;
}

.caffeine-bg.magnify {
  z-index: 0;
  width: 38vw;
  max-width: none;
  height: 153%;
  display: block;
  position: absolute;
  top: -4.6vw;
  left: -5.2vw;
}

.caffeine-body {
  z-index: 900;
  position: absolute;
  transform: rotate(-6deg);
}

.caffeine-body.body5 {
  z-index: 905;
  width: 40%;
  top: 59px;
  left: -162px;
}

.caffeine-body.body7 {
  z-index: 907;
  width: 40%;
  top: 51px;
  left: -130px;
}

.caffeine-body.body14 {
  z-index: 914;
  width: 40%;
  top: 14px;
  left: -22px;
}

.caffeine-body.body10 {
  z-index: 910;
  width: 40%;
  top: 35px;
  left: -82px;
}

.caffeine-body.body6 {
  z-index: 906;
  width: 40%;
  top: 54px;
  left: -145px;
}

.caffeine-body.body9 {
  z-index: 909;
  width: 40%;
  top: 41px;
  left: -99px;
}

.caffeine-body.body13 {
  z-index: 913;
  width: 40%;
  top: 19px;
  left: -35px;
}

.caffeine-body.body2 {
  z-index: 902;
  width: 40%;
  top: 71px;
  left: -209px;
}

.caffeine-body.body8 {
  z-index: 908;
  width: 40%;
  top: 46px;
  left: -115px;
}

.caffeine-body.body12 {
  z-index: 912;
  width: 40%;
  top: 25px;
  left: -50px;
}

.caffeine-body.body4 {
  z-index: 904;
  width: 40%;
  top: 63px;
  left: -178px;
}

.caffeine-body.body3 {
  z-index: 903;
  width: 40%;
  top: 67px;
  left: -195px;
}

.caffeine-body.body11 {
  z-index: 911;
  width: 40%;
  top: 30px;
  left: -66px;
}

.section-story {
  z-index: 9999;
  -webkit-text-fill-color: inherit;
  background-color: #fff7ef;
  background-clip: border-box;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: auto;
  display: flex;
  position: relative;
  overflow: visible;
}

.stickywrapper {
  z-index: 2;
  flex: 0 auto;
  justify-content: center;
  width: 80vw;
  height: 800vh;
  display: flex;
  position: relative;
  overflow: visible;
}

.triggergroup {
  flex-direction: column;
  justify-content: center;
  align-self: flex-start;
  align-items: center;
  width: 1px;
  height: auto;
  display: flex;
  position: absolute;
  inset: 0 auto 0 0;
}

.stickytrigger {
  z-index: 999;
  width: 1px;
  height: 1px;
  position: absolute;
  top: 20%;
  bottom: auto;
}

.stickytrigger.polaroids {
  top: 80%;
}

.storygridwrapper {
  flex: 0 auto;
  max-width: 80vw;
  height: 100vh;
  position: sticky;
  inset: 30vh 0 0;
}

.storygridwrapper.cult {
  height: auto;
  padding-bottom: 150px;
}

.story-grid {
  grid-column-gap: 16px;
  grid-row-gap: 0px;
  flex: none;
  grid-template: "." 459px
  / 1.75fr .75fr;
  grid-auto-columns: 1fr;
  align-self: stretch;
  place-items: start center;
  width: 80vw;
  display: grid;
}

.story-grid.right {
  grid-template-rows: 459px auto;
  grid-template-columns: .75fr 1fr;
  height: 1200px;
  padding-top: 40px;
  position: relative;
  top: -416px;
}

.storytxtblock {
  z-index: 5;
  color: #303030;
  text-align: left;
  letter-spacing: 0;
  min-width: 400px;
  max-width: 500px;
  font-weight: 400;
  line-height: 57px;
  position: relative;
  top: 67px;
}

.storytxtblock.weremember {
  flex-direction: column;
  display: block;
}

.storytxtblock.slushpuppie {
  text-align: right;
  top: -84px;
  left: 209px;
}

.storytxtblock.right {
  text-align: right;
  max-width: 100%;
  padding-top: 35px;
  position: sticky;
  top: 40vh;
}

.storytxtblock.neighbourhood {
  z-index: 99;
  background-color: #0000;
  width: 65vw;
  min-width: auto;
  max-width: none;
  line-height: 50px;
  position: absolute;
  inset: auto 0% 10% 7%;
}

.sui-medium {
  color: var(--charcoal);
  letter-spacing: -.05em;
  font-size: 2.5rem;
  font-weight: 500;
  line-height: 0;
}

.sui-medium.cult {
  color: #303030;
}

.sui-regular {
  color: var(--charcoal);
  letter-spacing: -.05em;
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 0;
}

.sui-regular.cult {
  color: #303030;
}

.garamond-italic {
  direction: ltr;
  color: var(--charcoal);
  text-align: left;
  letter-spacing: -.05em;
  font-family: GAR, sans-serif;
  font-size: 3rem;
  font-style: italic;
  font-weight: 500;
  line-height: 0;
}

.garamond-italic.corner-shop {
  color: var(--charcoal);
  font-size: 3.2rem;
  font-weight: 500;
  top: -1px;
  left: -3px;
}

.garamond-italic.cult {
  color: #303030;
}

.slushpuppywrapper {
  mix-blend-mode: normal;
  padding-bottom: 0;
  position: relative;
  top: 101px;
  transform: rotate(10deg);
}

.slushpuppieanimation {
  border: 3px solid #303030;
  border-radius: 1px;
  width: 288px;
  min-width: 150px;
  height: 225px;
  padding-top: 0;
  padding-right: 0;
  box-shadow: 3px 3px 3px #7c736ac2;
}

.polaroidwrapper {
  min-width: 385px;
  display: flex;
  position: relative;
}

.jbpolaroid {
  flex: none;
  min-width: 373px;
  max-width: 448px;
  position: relative;
  bottom: 50px;
  left: -57px;
}

.jcpolaroid {
  min-width: 270px;
  max-width: 345px;
  position: absolute;
  top: -142px;
  left: 111px;
}

.stickytxtwrapper {
  height: 205vh;
  position: relative;
}

.section-outside {
  z-index: 50;
  position: relative;
}

.outsidestickylength {
  height: 400vh;
  display: block;
}

.outsidewrapper {
  z-index: 98;
  object-fit: none;
  background-color: #0000;
  align-self: stretch;
  width: auto;
  height: 150vh;
  padding-bottom: 28px;
  display: block;
  position: sticky;
  top: -340.5px;
}

.outside {
  object-fit: cover;
  object-position: 50% 50%;
  background-color: #0000;
  width: 100%;
  max-width: none;
  height: 119%;
  padding-top: 0;
  padding-bottom: 0;
  position: relative;
}

.founders-semibold {
  letter-spacing: -2px;
  font-size: 55px;
  font-weight: 500;
  line-height: 0;
}

.clearface-italic {
  direction: ltr;
  letter-spacing: -1px;
  font-size: 50px;
  font-weight: 400;
  line-height: 0;
}

.section-hero {
  z-index: 40;
  object-fit: fill;
  align-items: center;
  height: 135vh;
  display: block;
  position: relative;
  overflow: hidden;
}

.platformbg {
  min-width: 100vw;
  max-width: 100vw;
  display: none;
  position: absolute;
}

.platformbg.solo {
  z-index: 20;
  object-fit: cover;
  object-position: 50% 100%;
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.skybg {
  z-index: 1;
  filter: saturate(200%);
  mix-blend-mode: normal;
  object-fit: fill;
  width: 100%;
  height: 105%;
  display: block;
  position: absolute;
  top: 0;
}

.container-hero {
  z-index: 25;
  flex-direction: column;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  max-width: 500px;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 100px;
}

.container-hero.nirvana {
  z-index: 15;
  position: absolute;
  top: -18.5vw;
  left: 80px;
}

.nirvana {
  z-index: 1;
  width: 45vw;
  min-width: 30vw;
  max-width: 39vw;
  position: relative;
  top: -67px;
}

.welcometo {
  width: 220px;
  position: relative;
  top: -55px;
}

.grocerynirvana {
  position: relative;
  top: -100px;
}

.cult-stjohn {
  width: 59%;
  position: relative;
  top: -21px;
  transform: rotate(-11deg);
}

.cult-pattybun {
  position: relative;
  top: 35px;
}

.wrapper-body-2 {
  position: relative;
  top: 2.2vw;
  left: -1.6vw;
}

.caffeine-performance-2 {
  z-index: 1002;
  color: #2d5e99;
  letter-spacing: -1px;
  font-family: FUTPTXBOLD, sans-serif;
  font-size: 2.4vw;
  font-style: italic;
  font-weight: 700;
  position: absolute;
  top: 25.3vw;
  left: 5.1vw;
  transform: rotate(-11deg);
}

.cult-daylesford {
  max-width: none;
  position: relative;
  top: 58px;
  left: 13px;
}

.cult-dots {
  position: relative;
  left: -63px;
}

.wrapper-performance {
  width: auto;
  display: block;
  position: relative;
  top: -306px;
  left: -33px;
  transform: rotate(.5deg);
}

.cult-otto {
  width: 308px;
  position: relative;
  top: 18px;
}

.cult-lafrom {
  width: 174px;
  max-width: none;
  position: relative;
  top: 110px;
  left: -18px;
  transform: rotate(-16deg);
}

.cult-deyacrock {
  position: relative;
  top: -42px;
  left: -27px;
}

.section-cult {
  z-index: 1000;
  mix-blend-mode: normal;
  background-color: #0000;
  background-image: url('../images/grid.svg');
  background-position: 0 -103px;
  background-repeat: no-repeat;
  background-size: 159%;
  background-attachment: scroll;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: auto;
  display: flex;
  position: relative;
}

.caffeine-youbut-2 {
  z-index: 1000;
  color: #c86d66;
  text-align: right;
  letter-spacing: -1px;
  white-space: nowrap;
  font-family: FRANK, sans-serif;
  font-size: 3.8rem;
  font-weight: 700;
  line-height: .8em;
  position: absolute;
  top: 18.3vw;
  left: 5.1vw;
  transform: rotate(-11deg);
}

.caffeine-youbut-2.aboutus {
  font-size: 5vw;
}

.cult-melrose {
  width: 22vw;
  position: relative;
  top: 0;
  bottom: -35px;
  left: 73px;
  transform: rotate(0);
}

.cult-greenswiggle {
  width: 33%;
  position: relative;
  top: 48px;
  left: 26px;
}

.cult-greenswiggle._80sdec {
  top: -6.1vw;
  left: 77px;
}

.cult-letter {
  width: 131px;
  position: relative;
  top: 44px;
  left: -22px;
}

.cult-linedot {
  position: relative;
  top: -20px;
}

.cult-coffeecup {
  width: 90%;
  position: relative;
  top: -224px;
  left: 101px;
}

.cult-triangles {
  position: relative;
  left: -39px;
}

.cult-pinkcross {
  position: relative;
  top: -17px;
}

.cult-neals {
  width: 39%;
  position: relative;
  top: 12px;
  transform: rotate(80deg);
}

.cult-arrows {
  position: relative;
  top: -31px;
  left: -67px;
  transform: rotate(-100deg);
}

.cult-deya {
  position: relative;
  top: -70px;
  transform: rotate(-11deg);
}

.cult-happy {
  position: relative;
  top: -38px;
  left: 40px;
}

.cult-lacroix {
  position: relative;
  top: -10px;
}

.cult-squarecircle {
  position: relative;
  bottom: 21px;
  left: 60px;
}

.cult-triangleorange {
  position: relative;
}

.caffeine-ingredients {
  z-index: 1;
  width: 250px;
  position: absolute;
  top: 138px;
  left: 36px;
  transform: rotate(-10deg);
}

.cult-yellowtriangle {
  position: relative;
  top: 0;
}

.cult-greenbox {
  position: relative;
  top: 74px;
  left: -19px;
}

.cult-brand {
  position: relative;
  top: 69px;
  left: 35px;
  transform: rotate(-17deg);
}

.cultgrid {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: 200px 200px 200px 200px 200px 0 auto auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: row;
  width: 80vw;
  height: auto;
  margin-bottom: -192px;
  padding-bottom: 7px;
  display: grid;
  position: relative;
}

.cult-zigzag {
  position: relative;
  top: 48px;
  left: 38px;
}

.cult-purpletriangle {
  position: relative;
  top: -51px;
  left: 97px;
}

.cult-baolondon {
  width: 127px;
  position: relative;
  top: 54px;
  transform: rotate(-11deg);
}

.jumpers {
  z-index: 21;
  object-fit: cover;
  width: 100%;
  min-width: 100vw;
  max-width: 100vw;
  height: 100%;
  display: block;
  position: absolute;
}

.nav_progressbar {
  z-index: 99999;
  border: 1px none var(--charcoal);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  border-radius: 5px;
  justify-content: space-around;
  align-items: center;
  width: 90vw;
  height: 3rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 47px;
  padding-right: 47px;
  display: flex;
  position: fixed;
  inset: -1% 0% auto;
  overflow: hidden;
}

.nav_progressbar.bg {
  z-index: 900;
  box-shadow: none;
  background-color: #fff8eea1;
  border-color: #fff;
  overflow: visible;
}

.progressbar_link {
  z-index: 2147483647;
  color: var(--charcoal);
  text-transform: uppercase;
  font-family: MNM, sans-serif;
  font-size: .8rem;
  font-weight: 400;
  position: relative;
  top: 4px;
}

.buttonoverlay {
  color: #f6debb;
  background-color: #0000;
  width: 243px;
  height: 0;
  padding: 24px 19px 27px 57px;
  position: relative;
  top: -6px;
  left: -490px;
}

.slant-indoor {
  z-index: 9999;
  background-color: #0000;
  background-image: url('../images/inside-copy-large.jpeg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 120vw;
  border: 1px solid #303030;
  align-items: flex-end;
  width: 120vw;
  height: 70vh;
  display: flex;
  position: relative;
  top: -31px;
  left: -90px;
  transform: translate(0, -30px)rotate(-10.3deg);
  box-shadow: inset 1px 1px 3px #000;
}

.slant-indoor.deluxe {
  z-index: 100;
  background-color: #303030;
  background-image: none;
  align-items: flex-start;
  height: 396px;
  box-shadow: 4px 4px 8px 7px #0f0f0f;
}

.buttontext {
  letter-spacing: 1px;
  font-size: 28px;
  font-weight: 700;
  position: relative;
  top: -4px;
  left: 488px;
}

.buttontext.delivery {
  color: #04cdbe;
  letter-spacing: -.05em;
  font-size: 24px;
  top: -20px;
  left: 43px;
}

.buttontext.directions {
  letter-spacing: -.05em;
  font-size: 24px;
  top: -21px;
  left: 27px;
}

.address {
  font-size: 40px;
  font-weight: 700;
  position: relative;
  top: 5px;
  right: 7px;
}

.openingwrapper {
  justify-content: flex-end;
  display: flex;
  position: relative;
  top: 117px;
  left: -202px;
}

.cornershop {
  letter-spacing: -2px;
  text-shadow: 0 -2px 1px #303030, 2px 0 1px #303030, -2px 0 1px #303030, 0 2px 1px #303030;
  font-size: 120px;
}

.cornershop.cs {
  position: relative;
}

.cornershop.deluxe {
  color: #303030;
  text-shadow: 0 -2px 1px #f6debb, 2px 0 1px #f6debb, -2px 0 1px #f6debb, 0 2px 1px #f6debb;
  position: static;
}

.deluxetext {
  position: relative;
  left: 3.9vw;
}

.deluxe-button {
  flex: 0 auto;
  position: relative;
  inset: 184px auto 0% -21%;
}

.deluxe-button.blue {
  justify-content: flex-start;
  display: flex;
  position: absolute;
  top: 264px;
  bottom: auto;
  left: 149px;
}

.deluxe-button.beige {
  display: flex;
  position: absolute;
  top: 181px;
  bottom: auto;
  left: 165px;
}

.corner-shop {
  color: #f6ddbb;
  font-size: 132px;
  font-style: italic;
  font-weight: 700;
  position: relative;
  top: -37px;
  left: 117px;
}

.corner-shop.cs {
  top: 50px;
}

.corner-shop.deluxe {
  top: 57px;
  left: 140px;
}

.corner-shop.deluxe._2 {
  position: absolute;
  top: -34px;
  left: 143px;
}

.corner-shop.deluxe._1 {
  top: -27px;
  left: 136px;
}

.corner-shop.deluxe._4 {
  top: -445px;
  left: 159px;
}

.corner-shop.deluxe._3 {
  top: -240px;
  left: 151px;
}

.deluxe-container {
  width: 85vw;
  margin-left: auto;
  margin-right: auto;
}

._7-7 {
  letter-spacing: -.05em;
  font-size: 40px;
  font-weight: 700;
  position: relative;
  left: -5px;
}

.overflow-deluxe {
  z-index: 999;
  height: auto;
  margin-top: -234px;
  padding-top: 240px;
  position: relative;
  overflow: hidden;
}

.beigebutton {
  min-width: 260px;
  transform: rotate(-.2deg);
}

.beigebutton._1 {
  min-width: 220px;
}

.beigebutton._2 {
  min-width: 220px;
  position: relative;
  top: -10px;
  left: -208px;
}

.section-deluxe {
  z-index: 90;
  background-color: #0000;
  height: 1004px;
  margin-bottom: 50px;
  padding-top: 0;
  position: relative;
}

.openinghours {
  color: #f6dfbb;
  font-size: 46px;
  position: absolute;
  right: -14px;
}

.openinghours.address {
  position: absolute;
  top: 143px;
  right: 9px;
}

.openinghours._7am-9pm {
  top: 48px;
  right: -5px;
}

.openinghours._8am-9pm {
  top: 98px;
  right: 5px;
}

.googlelogo {
  position: relative;
  top: -10px;
  left: -416px;
  transform: rotate(8.9deg);
}

.deliveroologo {
  position: relative;
  top: -11px;
  left: -412px;
  transform: rotate(6deg);
}

.hours {
  font-size: 40px;
  font-weight: 700;
}

.hours.days {
  color: #303030;
  text-shadow: 0 -1px #f6dfbb, -1px 0 #f6debb, 1px 0 #f6dfbb, 0 1px #f6debb;
}

.postcard-address {
  margin-top: -62px;
  margin-left: 2px;
  margin-right: auto;
  font-family: GAR, sans-serif;
  font-size: 17px;
  font-style: italic;
  font-weight: 300;
}

.postcard-button-wrapper {
  z-index: 9999;
  flex-direction: column;
  flex: none;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  margin-top: -16px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  position: relative;
}

.heading-7 {
  color: #fff;
  text-align: center;
  letter-spacing: -3px;
  font-size: 117px;
  font-weight: 500;
  line-height: 87px;
  position: absolute;
  top: 285px;
}

.heading-7.goldstandard {
  font-family: GAR, sans-serif;
  font-weight: 300;
}

.column {
  flex-direction: column;
  align-items: flex-end;
  display: flex;
}

.button {
  color: #fff;
  background-color: #272727;
  border: 1px solid #000;
  border-radius: 4px;
  justify-content: flex-end;
  width: 160px;
  font-size: .85rem;
  font-weight: 400;
  display: flex;
  position: relative;
  top: -5px;
  box-shadow: 1px 1px 1px #000;
}

.button:hover {
  box-shadow: inset 1px 1px 3px #000;
}

.postcardtextwrapper {
  background-color: #0000;
  flex: 0 auto;
  width: 85vw;
  height: 410px;
  padding-top: 20px;
}

.apply-button {
  z-index: 999;
  position: relative;
}

.marble {
  object-fit: contain;
  width: 100vw;
  height: auto;
  margin-top: -50px;
}

.section-postcard {
  z-index: 10;
  background-color: #fffbf4;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 1500px;
  margin-top: -215px;
  margin-bottom: 10px;
  padding-bottom: 9px;
  display: flex;
  position: relative;
  overflow: visible;
}

.postcardlogo {
  padding-top: 8px;
  position: relative;
  top: 10px;
}

.postcard-copy {
  position: relative;
  top: 41px;
}

.whiteglobe {
  position: absolute;
  top: 3px;
  left: 7px;
}

.column-text {
  text-align: justify;
  padding-left: 10px;
  padding-right: 10px;
  font-family: Palatino Linotype, Book Antiqua, Palatino, serif;
  font-size: 19px;
  font-weight: 400;
  line-height: 33px;
}

.postcard {
  width: 70vw;
  position: absolute;
  top: 514px;
}

.pinklady-wrapper {
  display: none;
}

.athleisure-pinklady {
  width: 240px;
  max-width: none;
  display: block;
  position: absolute;
  inset: auto 0% -14% auto;
}

.productcopytxt {
  color: #fff;
  text-align: left;
  letter-spacing: -.05em;
  font-family: FRANK, sans-serif;
  font-size: 1.4vw;
  font-style: italic;
  font-weight: 500;
  line-height: 1.2vw;
}

.productcopytxt.blue {
  color: #01326d;
  letter-spacing: -.05em;
  font-size: 1.5vw;
  font-weight: 500;
}

.productcopy {
  color: #fff;
  text-align: justify;
  font-weight: 400;
}

.productcopy.youbutfaster {
  max-width: 76%;
  margin-top: 9px;
  display: block;
}

.productcopy.cap {
  width: 90%;
  line-height: 2vw;
  position: relative;
  top: -88px;
  left: -19px;
}

.productcopy.socks {
  margin-top: 1px;
  margin-bottom: 6px;
  line-height: 1.3;
}

.productcopy.teamusa {
  margin-bottom: 6px;
  line-height: 1.3;
}

.price {
  color: #01326d;
  font-family: FRANK, sans-serif;
  font-size: 1.4vw;
  font-weight: 900;
}

.athleisure-grid {
  grid-column-gap: 24px;
  grid-row-gap: 16px;
  flex: none;
  grid-template-rows: .25fr 1fr auto auto auto auto auto;
  grid-template-columns: .75fr .75fr .5fr .75fr 1fr 1fr .25fr .75fr;
  grid-auto-columns: 1fr;
  width: 85vw;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 181px;
  padding-bottom: 20px;
  display: grid;
  position: absolute;
  inset: 0%;
}

.springsummer {
  color: #fff;
  margin: 0 auto 0 0;
  font-size: 30px;
  font-weight: 700;
  line-height: 4vh;
  display: block;
  position: relative;
}

.grocerypostlogo {
  width: 15vh;
  position: relative;
  top: -29%;
  left: -11%;
}

.productinfo {
  color: #01326d;
  font-family: FRANK, sans-serif;
  font-size: 1.4vw;
  font-weight: 300;
  line-height: 1.6vh;
}

.sockswrapper {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.section-athleisure {
  z-index: 9;
  background-color: #fff;
  background-image: url('../images/athleisure-bgink3-large.jpeg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 86%;
  justify-content: space-between;
  width: auto;
  height: 1500px;
  display: flex;
  position: relative;
  overflow: visible;
}

.athleisure-blueicon {
  margin-top: 20px;
}

.productname {
  color: #01326d;
  letter-spacing: -.5px;
  font-family: FRANK, sans-serif;
  font-size: 1.5vw;
  font-weight: 900;
}

.athleisure-background {
  background-color: #0000;
  background-image: url('../images/jazz-1-large.webp');
  background-repeat: no-repeat;
  background-size: 121%;
  flex: 1;
  justify-content: flex-end;
  height: 100%;
  display: flex;
  position: relative;
  inset: 0%;
  overflow: visible;
}

.pricetext {
  color: #fff;
  font-size: 16px;
  line-height: 1.9vh;
  display: inline-block;
  position: relative;
  top: -4px;
}

.sidebysideprices {
  width: auto;
  margin-top: 45px;
  display: flex;
  position: relative;
  top: 18px;
}

.merchandise {
  color: #e9e9e9;
  letter-spacing: -3px;
  font-family: FRANK, sans-serif;
  font-size: 122px;
  font-weight: 700;
  position: absolute;
  top: 55px;
}

.youbutfastericon {
  width: 12vw;
  display: block;
  position: absolute;
  inset: 58% 0% auto 5%;
  box-shadow: 1px 1px 5px 2px #1b1b1bd6;
}

.gofasterwrapper {
  flex-direction: column;
  width: auto;
  display: block;
  position: relative;
  top: 0;
}

.athleisure-greenicon {
  margin-top: 20px;
}

.teamusawrapper {
  flex-direction: column;
  margin-top: -46px;
  display: flex;
  position: relative;
  top: 3px;
}

.athleisure-manwoman {
  width: 20vw;
  min-width: 508px;
  max-width: 510px;
  display: block;
  position: relative;
}

.pricewrapper {
  align-items: flex-start;
  display: flex;
  position: relative;
  top: -40px;
}

.pricewrapper.socks {
  flex: 0 auto;
  width: 100%;
  display: flex;
  position: relative;
  top: 8px;
}

.pricewrapper.cap {
  top: -56px;
}

.pricewrapper.teamusa {
  margin-bottom: 15px;
  top: 14px;
}

.pricewrapper.teamusa.youbutfaster {
  margin-bottom: 0;
  margin-right: 14px;
  top: -21px;
}

.productinfowrapper {
  font-weight: 400;
  line-height: 1.6vh;
}

.athleisurelogo {
  width: 35px;
  padding-left: 7px;
  position: relative;
  top: 128px;
  left: 3px;
}

.athleisure-sock {
  border: 2px solid #2e5e99;
  width: 100%;
}

.athelsiure-cap {
  border: 3px #2d5e99;
  width: 100%;
}

.right-block {
  background-color: #0000;
  background-image: url('../images/athleisure-bluebarINK.jpg'), linear-gradient(210deg, #2d5e99 57%, #0000 93%);
  background-position: 0 0, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: cover, auto;
  width: 15vw;
  height: 100%;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.athleisure-stars {
  width: 252px;
  max-width: none;
  display: none;
  position: absolute;
  top: -54px;
  left: -30px;
}

.priceletter {
  color: #fff;
  background-color: #2d5e99;
  margin-right: 11px;
  padding: 2px 7px;
  font-size: 1vw;
  font-weight: 500;
  line-height: 15px;
  display: inline-block;
}

.athleisureteamusa {
  width: 450px;
  max-width: none;
  position: absolute;
  top: 131px;
  right: .9vw;
}

.athleisureteamusa.magnify {
  top: 155px;
}

.capwrapper {
  flex-flow: column;
  place-content: space-between flex-start;
  align-items: flex-start;
  display: flex;
}

.iconwrapper {
  flex-direction: column;
  align-items: center;
  max-width: 10vw;
  display: flex;
}

.marquee-liveitup {
  background-color: #fff;
  width: 100%;
  margin-bottom: -20px;
  display: none;
  overflow: hidden;
}

.marquee-inner {
  background-color: #0000;
  flex-direction: row;
  align-items: center;
  padding-top: 15px;
  padding-bottom: 22px;
  display: flex;
}

.marqueetext {
  white-space: nowrap;
  margin-left: 35px;
  margin-right: 10vw;
  font-size: 10vw;
  font-weight: 700;
}

.liveitup {
  color: #303030;
  letter-spacing: -3px;
  font-family: FUTPTCOND, sans-serif;
  font-size: 110px;
}

.sbtb {
  object-fit: fill;
  width: 105%;
  max-width: none;
  height: 100%;
  left: -28px;
}

.fieldwrapper {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  display: flex;
}

.macwindow {
  background-color: var(--vellum);
  box-shadow: 4px 4px 6px #463f3f;
}

.speechbubble {
  width: 44px;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  top: 128px;
  left: 207px;
}

.tellyourparents {
  text-align: left;
  letter-spacing: -3px;
  white-space: nowrap;
  font-family: FUTPTCOND, sans-serif;
  font-style: italic;
  line-height: 40px;
  position: relative;
  top: 36px;
  left: 83px;
}

.tellusabit {
  z-index: 10;
  text-align: left;
  width: 200px;
  margin-left: auto;
  margin-right: auto;
  font-family: SYS, sans-serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 20px;
  position: absolute;
  top: 53%;
  bottom: 0%;
  left: 69px;
}

.formbutton {
  color: #333;
  background-color: #0000;
  border: 1px solid #000;
  border-radius: 4px;
  font-family: SYS, sans-serif;
  font-size: 20px;
}

.formbutton:hover {
  color: #fefcf9;
  background-color: #252525;
}

.arrow {
  width: 80%;
  position: relative;
  top: -19px;
  left: -20px;
}

/* ===== ANCHOR: showmethemoney ================================================
   DELIBERATE. NOT misaligned. Sized to fill the left panel of
   joinus-macwindow.svg edge to edge; "aligning" it with the copy below opens a
   gap. Cite by this anchor, never by line number — CLAUDE.md and DELIBERATE.md
   said :8661-8664 for a year, in a file whose rule is at 2781.
   ========================================================================== */
.showmethemoney {
  color: #fff;
  background-color: #303030;
  width: 168px;
  padding: 3px 7px;
  font-family: SYS, sans-serif;
  font-size: 18px;
  position: absolute;
  top: 45.656px;
  /* Do not "align" this with the copy below it. The badge is sized to fill the
     left panel of joinus-macwindow.svg edge to edge: at this size the panel is
     x=17.1 width=167.5, and the badge is left:17 width:168, sitting on the
     panel's internal divider line. Nudging it right just opens a gap. */
  left: 17px;
}

.gplogoapply {
  z-index: 10;
  width: 115px;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  top: 62px;
  left: 43px;
}

.sbtbwrapper {
  width: 100vw;
  display: flex;
  position: relative;
}

.freebumbag {
  color: #c70000;
  font-family: FELT, sans-serif;
  font-size: 25px;
  font-weight: 400;
  line-height: 20px;
  position: relative;
  top: -36px;
  left: 68px;
  transform: rotate(-11deg);
}

/* Deliberately left static. The absolutely positioned children below
   (.showmethemoney, .livingwage, .gplogoapply, .tellusabit) have offsets tuned
   against .formgrid, which is the containing block while this stays static.
   Making it position: relative re-anchors all of them and garbles the desktop
   layout. The tablet rule at <=991px sets its own position: relative, which is
   fine because that breakpoint has its own offsets. */
/* ===== ANCHOR: apply-wrapper =================================================
   DELIBERATE. position:static ON PURPOSE. Its absolutely-positioned children
   resolve their offsets against .formgrid; making this relative re-anchors all
   of them and garbles the desktop apply form. Reverted twice.
   Cite by this anchor — the docs said :8696-8701 and the rule is at 2831.
   ========================================================================== */
.apply-wrapper {
  width: 549px;
}

.joinusheading {
  z-index: 99;
  color: #fff;
  letter-spacing: -3px;
  font-family: FUTPTXBOLD, sans-serif;
  font-size: 110px;
  font-weight: 700;
  position: absolute;
  top: 39px;
  left: 36px;
}

.livingwage {
  text-align: justify;
  width: 133px;
  font-family: SYS, sans-serif;
  font-size: 14px;
  line-height: 15px;
  position: absolute;
  top: 288px;
  left: 32px;
}

.apply-today {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  font-family: SYS, sans-serif;
  font-size: 24px;
  font-weight: 400;
  position: relative;
  top: -365px;
}

.joinusform {
  flex-direction: column;
  align-items: stretch;
  width: 294px;
  height: 205px;
  margin-top: 13px;
  display: flex;
  position: relative;
  top: 199px;
  left: 193px;
}

.bumbag {
  width: 369px;
  max-width: none;
  position: absolute;
  top: -108px;
  left: -72px;
}

.joinusformblock {
  position: absolute;
  inset: -6% 0% 0% 14px;
}

.formfield {
  background-color: #0000;
  border: 1px solid #3d3d3d;
  border-radius: 6px;
  flex: 0 auto;
  font-size: 15px;
  display: block;
}

.formfield.name {
  border: 1px solid #272727;
  flex: 0 auto;
  margin-left: -3px;
}

.formfield.bio {
  padding-top: 3px;
  font-family: SYS, sans-serif;
}

.section-joinus {
  background-color: #fff;
  width: 100%;
  overflow: hidden;
}

.formgrid {
  grid-column-gap: 16px;
  grid-row-gap: 0px;
  grid-template-rows: auto 43px 139px 100px 110px auto auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 2.75fr .5fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 90vw;
  height: 500px;
  margin-left: auto;
  margin-right: auto;
  display: grid;
  position: relative;
}

.convenience-business {
  color: #3f969c;
  text-align: right;
  letter-spacing: -3px;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(165deg, #e29608 16%, #e204b6 52%, #04f);
  -webkit-background-clip: text;
  background-clip: text;
  margin-top: 0;
  margin-bottom: 0;
  font-family: FUTPTCOND, sans-serif;
  font-style: italic;
  line-height: 40px;
  position: relative;
  top: 42px;
}

.formlabel {
  flex: 1;
  margin-right: 20px;
  font-family: SYS, sans-serif;
  font-size: 20px;
  display: block;
}

.formlabel.name {
  font-family: SYS, sans-serif;
}

.anchor-target-about {
  height: 5px;
  position: absolute;
  inset: auto 0% 0%;
}

.anchor-target-about.cult {
  inset: -32.5% 0% auto;
}

.anchor-target-about.deluxe {
  bottom: auto;
  left: 0%;
  right: 0%;
}

.progressbar {
  z-index: 99999;
  background-color: var(--red);
  width: 100%;
  height: 4px;
  position: absolute;
  inset: auto 0% 0%;
}

.mobile-fadetogrey {
  z-index: 9000;
  background-color: var(--charcoal);
  opacity: .57;
  width: 100vw;
  height: 100%;
  display: none;
  position: fixed;
  inset: 0 0% 0%;
}

.mobile-fadetogrey.aboutpage {
  opacity: .6;
  background-color: #ffe5b6;
  display: none;
}

.section_jobs-board {
  overflow: hidden;
}

.jobs-board_component {
  margin-bottom: 3rem;
}

.jobs-board_heroimage {
  background-image: url('../images/joinus-sbtb-1.jpg');
  background-position: 50%;
  background-size: cover;
  border-radius: 20px;
  align-items: center;
  height: 40vw;
  margin-bottom: 2rem;
  display: flex;
  position: relative;
}

.jobs-board_herotext {
  color: var(--dark-vellum);
  letter-spacing: -.05em;
  border-radius: 0;
  flex: 0 auto;
  justify-content: center;
  align-self: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  font-family: FUTPTXBOLD, sans-serif;
  font-size: 6.5rem;
  font-style: normal;
  font-weight: 700;
  display: flex;
  position: absolute;
  inset: 5% auto auto 3%;
}

.jobs-board_info-block {
  border: 1px solid var(--light-brown);
  background-color: var(--hover-vellum);
  border-radius: 11px;
  margin-bottom: 3rem;
  padding: 20px;
  display: block;
}

.jobs-board_info-block.assistant, .jobs-board_info-block.storemanager, .jobs-board_info-block.ea {
  display: none;
}

.info-block_job-title {
  border-bottom: 1px none var(--light-brown);
  color: var(--red);
  text-align: left;
  letter-spacing: -.05em;
  font-family: MNM, sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
}

.jobs-board_rich-textblock {
  text-align: left;
  font-family: SUI, sans-serif;
  font-size: .7rem;
}

.jobs-board_rich-textblock p {
  color: var(--brown);
  margin-bottom: .5rem;
}

.jobs-board_rich-textblock h3 {
  color: var(--red);
  margin-bottom: .5rem;
  font-size: 1rem;
}

.jobs-board_rich-textblock h4 {
  color: var(--brown);
  text-align: left;
  text-transform: capitalize;
  font-size: .9rem;
}

.jobs-board_rich-textblock li {
  color: var(--brown);
  margin-bottom: .5rem;
  font-size: .9rem;
}

.jobs-board_rich-textblock h5 {
  color: var(--red);
  text-align: center;
  text-transform: uppercase;
  font-family: MNM, sans-serif;
  font-size: .9rem;
}

.info-block_title-wrapper {
  border-bottom: 1px solid var(--light-brown);
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
  display: flex;
}

.info-block_salary-offer {
  color: var(--red);
  font-family: SUI, sans-serif;
  font-size: 1rem;
}

.jobs-board_apply-button {
  background-color: var(--red);
  color: var(--vellum);
  border-radius: 3px;
  padding-top: 10px;
  font-family: MNM, sans-serif;
  font-size: .8rem;
}

.info-block_button-wrapper {
  grid-column-gap: 1rem;
  justify-content: flex-end;
  display: flex;
  position: relative;
}

.jobs-board_lean-more {
  border: 1px solid var(--light-brown);
  color: var(--brown);
  background-color: #0000;
  border-radius: 3px;
  padding-top: 10px;
  font-family: MNM, sans-serif;
  font-size: .8rem;
}

.jobs-board_availableroles {
  color: var(--red);
  letter-spacing: -.05em;
  text-transform: uppercase;
  margin-bottom: 2rem;
  font-family: MNM, sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  text-decoration: none;
}

.success-message-2 {
  background-color: #0000;
}

.text-block-9 {
  border: 1px solid var(--red);
  color: var(--red);
  width: 10rem;
  padding: 13px 16px;
  font-family: SYS, sans-serif;
  position: absolute;
  top: 261px;
  left: 257px;
}

@media screen and (min-width: 1280px) {
  .heading-style-h1 {
    top: 5vh;
    left: 29%;
  }

  .navbar_component {
    max-width: 90rem;
  }

  .navbar_desktop.max-width-xlarge.grid {
    grid-template-columns: 6vw 6vw 20vw 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr .5fr .75fr;
  }

  .navbar_logo {
    flex: 0 auto;
    width: 100%;
  }

  .navbar_usericon.icon-1x1-xsmall {
    height: 1.3rem;
  }

  .newsletter-button {
    height: 1.7rem;
    font-size: .8rem;
    line-height: 1.2;
  }

  .newsletter-button.footer {
    font-size: .9rem;
  }

  .newsletter-input {
    height: 1.7rem;
  }

  .newsletter-input.footer {
    flex: 0 auto;
  }

  .ticker-left_text {
    font-size: 2rem;
  }

  .ticker-left_text.aboutpage {
    font-style: italic;
  }

  .navmenu_mainmenu {
    max-width: 36.95vw;
  }

  .fadetogrey {
    padding-left: 5%;
  }

  .navmenu_bottom-title {
    flex-direction: column;
    display: flex;
  }

  .navmenu_cultgroceries {
    width: 2rem;
    top: 300px;
    left: 28%;
  }

  .navmenu_wrapper {
    display: none;
  }

  .section_footer {
    background-color: var(--light-brown);
  }

  .footer_top-wrapper {
    grid-row-gap: 0vw;
    grid-template-rows: auto auto;
  }

  .footer_credits-wrapper {
    grid-column-gap: .1rem;
    grid-row-gap: .1rem;
    flex-direction: column;
    justify-content: flex-end;
    align-items: stretch;
    display: flex;
  }

  .footer_cultgroceries, .grocerypostlimited {
    align-self: flex-end;
  }

  .footer_designedbywrapper {
    align-self: flex-end;
    display: flex;
  }

  .footer_designdevtext {
    padding-right: 5px;
  }

  .footer_spacefoodimage {
    padding-top: 0;
    top: -2px;
  }

  .marquee.aboutpage {
    padding-top: 50px;
  }

  .caffeine-bg.magnify {
    width: 43vw;
  }

  .section-story {
    background-color: #fff7ef;
    padding-bottom: 0;
  }

  .story-grid.right {
    grid-template-columns: .25fr 1fr;
  }

  .storytxtblock.neighbourhood {
    bottom: 11%;
  }

  .polaroidwrapper {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    width: 457px;
    display: flex;
    position: relative;
  }

  .jbpolaroid {
    position: relative;
  }

  .jcpolaroid {
    width: 350px;
    max-width: 350px;
    position: absolute;
    top: -130px;
    left: 150px;
  }

  .outside {
    max-width: none;
  }

  .section-hero {
    padding-bottom: 0;
  }

  .platformbg {
    max-width: 100vw;
  }

  .platformbg.solo {
    object-fit: cover;
    object-position: 30% 80%;
  }

  .skybg {
    object-fit: cover;
    object-position: 50% 80%;
  }

  .container-hero.nirvana {
    top: -15.5vw;
  }

  .nirvana {
    max-width: 555px;
  }

  .slant-indoor {
    left: -114px;
  }

  .overflow-deluxe {
    padding-bottom: 142px;
  }

  .postcard-address {
    margin-top: -74px;
    font-size: 20px;
  }

  .postcard-button-wrapper {
    padding-top: 29px;
  }

  .heading-7 {
    color: #fffbf4;
  }

  .heading-7.goldstandard {
    font-size: 150px;
    line-height: 121px;
    top: 191px;
  }

  .marble {
    margin-top: -83px;
  }

  .section-postcard {
    height: 1469px;
    margin-top: -263px;
    margin-bottom: 0;
    padding-bottom: 0;
  }

  .postcard-copy {
    top: auto;
  }

  .column-text {
    font-size: 23px;
  }

  .postcard {
    width: 55vw;
    top: 513px;
  }

  .grocerypostlogo {
    margin-left: -129px;
    position: relative;
  }

  .section-athleisure {
    background-position: 50% 100%;
    background-size: cover;
  }

  .athleisure-background {
    background-size: auto;
    flex: 1;
  }

  .gofasterwrapper {
    top: 2.7vh;
  }

  .athleisure-manwoman {
    width: 480px;
    max-width: 480px;
  }

  .freebumbag {
    top: -23px;
    left: 57px;
  }

  .mobile-fadetogrey {
    padding-left: 5%;
  }
}

@media screen and (min-width: 1440px) {

  .heading-style-h1 {
    top: 3.5vh;
    right: -30%;
  }

  .padding-section-small.mobile {
    padding-top: 2rem;
    padding-bottom: 2rem;
    overflow: hidden;
  }

  .navbar_component {
    max-width: 100%;
  }

  .navbar_logo {
    flex: none;
    width: 200px;
    height: 2.4rem;
  }

  .navbar_usericon.icon-1x1-xsmall {
    width: 1.3rem;
  }

  .ticker-left_text.aboutpage {
    font-style: italic;
    font-weight: 700;
  }

  .navmenu_mainmenu {
    max-width: 37vw;
    display: flex;
  }

  .navmenu_cultgroceries {
    left: 28%;
  }

  .footer_giantcopy.just-in-case {
    justify-content: flex-end;
    padding-bottom: 0;
    display: flex;
  }

  .footer_giantlogo {
    width: 105%;
    left: -27px;
  }

  .footer_credits-wrapper {
    grid-column-gap: .2rem;
    grid-row-gap: .2rem;
  }

  .marquee.aboutpage {
    padding-top: 152px;
  }

  .caffeine-bg.magnify {
    width: 34vw;
  }

  .storytxtblock.weremember {
    left: 110px;
  }

  .storytxtblock.slushpuppie {
    left: 293px;
  }

  .storytxtblock.right {
    max-width: 508px;
  }

  .storytxtblock.neighbourhood {
    width: 52vw;
  }

  .slushpuppywrapper {
    left: -146px;
  }

  .polaroidwrapper {
    left: 143px;
  }

  .section-outside {
    margin-bottom: 213px;
  }

  .outside {
    object-fit: cover;
    object-position: 50% 0%;
  }

  .section-hero {
    height: 150vh;
  }

  .platformbg.solo {
    object-fit: cover;
    object-position: 50% 50%;
    display: block;
  }

  .skybg {
    object-fit: fill;
    object-position: 50% 0%;
    min-width: 100vw;
  }

  .container-hero.nirvana {
    top: -12.5vw;
  }

  .nirvana {
    width: 45vw;
    max-width: 570px;
    top: -140px;
    left: 45px;
  }

  .wrapper-body-2 {
    top: 3.6vw;
  }

  .caffeine-performance-2 {
    font-size: 2.25vw;
    top: 22.4vw;
    left: 3.9vw;
  }

  .wrapper-performance {
    top: -333px;
  }

  .section-cult {
    background-color: #0000;
    margin-top: -112px;
  }

  .caffeine-youbut-2 {
    font-size: 4.5vw;
    top: 15vw;
    left: 3.2vw;
  }

  .cult-coffeecup {
    width: 93%;
    left: 10px;
  }

  .caffeine-ingredients {
    width: 273px;
    left: 18px;
  }

  .postcardtextwrapper {
    height: auto;
    padding-top: 0;
  }

  .section-postcard {
    height: 1580px;
  }

  .postcard-copy {
    top: -89px;
  }

  .postcard {
    width: 61vw;
    top: 547px;
  }

  .productcopytxt {
    position: relative;
    left: -2px;
  }

  .productcopy.cap {
    top: -94px;
  }

  .pricetext {
    line-height: 2.1vh;
  }

  .gofasterwrapper {
    top: 9.1vh;
  }

  .pricewrapper.cap {
    top: -67px;
  }

  .body-3 {
    background-color: var(--vellum);
  }
}

@media screen and (min-width: 1920px) {
  .heading-style-h1 {
    top: .5vh;
    right: -35%;
  }

  .navbar_desktop.max-width-xlarge.grid {
    max-width: none;
  }

  .navmenu_cultgroceries {
    left: 30%;
  }

  .caffeine-bg.magnify {
    width: 25vw;
  }

  .storytxtblock.right {
    width: 710px;
  }

  .polaroidwrapper {
    left: 159px;
  }

  .outside {
    object-position: 50% 100%;
  }

  .platformbg {
    min-width: 100vw;
  }

  .platformbg.solo {
    object-fit: contain;
  }

  .container-hero {
    top: 13px;
    bottom: 0%;
    left: 165px;
  }

  .nirvana {
    width: 700px;
    max-width: 700px;
    left: 107px;
  }

  .welcometo {
    top: -40px;
  }

  .gofasterwrapper {
    top: 23.2vh;
  }

  .tellusabit {
    left: -39px;
  }
}

@media screen and (max-width: 991px) {
  h1 {
    font-size: 3.25rem;
  }

  h2 {
    font-size: 2.75rem;
  }

  h3 {
    font-size: 2.25rem;
  }

  h4 {
    font-size: .95rem;
  }

  .hide-tablet {
    display: none;
  }

  .padding-bottom {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .heading-style-h1 {
    font-size: 3.25rem;
  }

  .padding-section-small {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .padding-section-small.mobile {
    height: 100%;
  }

  .padding-section-medium {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .padding-section-medium.mobile {
    padding-bottom: 0;
  }

  .navbar_component {
    padding-top: 1.5rem;
  }

  .navbar_desktop.max-width-xlarge.grid {
    grid-template-rows: 2rem;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .navbar_desktop.max-width-xlarge.grid.hide-tablet {
    display: none;
  }

  .navbar_logo-link.w--current {
    justify-content: center;
  }

  .navbar_logo {
    flex: 0 auto;
    height: 2rem;
    margin-left: 50px;
    padding-top: 0;
  }

  .navbar_logo.aboutpage {
    height: 2rem;
    margin-top: 0;
  }

  .navbar_link {
    width: auto;
    padding: .75rem 0;
    font-size: 1.125rem;
  }

  .navbar_usericon.icon-1x1-xsmall {
    flex: 1;
  }

  .ticker-left_text {
    color: var(--brown);
    flex: none;
    margin-left: 11px;
    font-family: SUI, sans-serif;
    font-size: 1.3rem;
    font-style: normal;
  }

  .ticker-left_text.aboutpage {
    font-style: italic;
    font-weight: 700;
  }

  .navmenu_mainmenu {
    max-width: 50vw;
  }

  .navmenu_mainmenu.aboutpage {
    display: none;
    top: -20.8px;
  }

  .navmenu_cultgroceries.aboutpage {
    top: 272px;
  }

  .navmenu_menu-item.cult.aboutpage {
    width: 100%;
  }

  .navmenu_wrapper {
    display: none;
    top: 88px;
  }

  .navmenu_wrapper.aboutpage {
    display: block;
  }

  .section_footer {
    height: 34.2rem;
  }

  .footer_top-wrapper {
    grid-column-gap: 4vw;
    grid-row-gap: 3.25rem;
    grid-template-columns: 1fr 1fr;
  }

  .footer_right-wrapper {
    grid-row-gap: 3rem;
    grid-template-columns: 1fr 1fr 1fr;
  }

  .footer_links {
    text-align: left;
    font-size: .7rem;
  }

  .footer_giantcopy {
    font-size: 1.5rem;
  }

  .footer_giantcopy.just-in-case {
    text-align: right;
    padding-top: 10px;
    font-size: 1.6rem;
  }

  .footer_giantlogo {
    justify-content: center;
    height: 24vw;
    top: 55px;
  }

  .footer_socialswrapper {
    grid-row-gap: .5rem;
    flex-direction: column;
    justify-content: flex-start;
    margin-top: 0;
  }

  .footer_socialbuttons-wrapper {
    grid-column-gap: 5px;
    justify-content: flex-start;
  }

  .footer_social-button {
    justify-content: flex-start;
    width: auto;
    height: 1.52rem;
    padding-right: 0;
  }

  .footer_followercopy {
    margin-bottom: 0;
  }

  .navbar_mobile {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    border-bottom: 1px solid var(--light-brown);
    flex: 1;
    grid-template-rows: auto;
    grid-template-columns: .25fr 3fr .25fr .25fr;
    grid-auto-columns: 1fr;
    margin-top: 3px;
    display: grid;
  }

  .navbar_mobile.aboutpage {
    border-bottom-color: var(--charcoal);
  }

  .mobile_logowrapper {
    padding-top: 0;
    padding-bottom: 0;
  }

  .mobile_menuburger {
    border-right: 1px solid var(--light-brown);
    justify-content: center;
    display: flex;
  }

  .mobile_menuburger.aboutpage {
    border-right-color: var(--charcoal);
  }

  .menuburger_lottie {
    cursor: pointer;
    width: 1.25rem;
  }

  .mobileblock {
    z-index: 999999999;
    background-color: var(--vellum);
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 100vh;
    display: none;
    position: fixed;
  }

  .flip-phone-lottie {
    display: none;
  }

  .marquee {
    grid-column-gap: 0rem;
    grid-row-gap: 0rem;
  }

  .marquee.aboutpage {
    padding-top: 0;
  }

  .marquee-content.scroll {
    flex: none;
    font-family: FUTPTCOND, sans-serif;
    font-style: italic;
    font-weight: 700;
    display: flex;
  }

  .caffeine-body.body2 {
    top: -36px;
    left: -133px;
  }

  .storygridwrapper {
    top: 18vh;
  }

  .story-grid {
    grid-column-gap: 16px;
    grid-row-gap: 0px;
    grid-template-rows: 459px;
    grid-template-columns: .75fr .75fr;
    grid-auto-columns: 1fr;
    display: grid;
    position: relative;
  }

  .story-grid.right {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: 459px auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .storytxtblock {
    width: 498px;
    min-width: auto;
    max-width: none;
    position: absolute;
  }

  .storytxtblock.weremember {
    width: 440px;
    line-height: 37.5px;
    display: block;
  }

  .storytxtblock.slushpuppie {
    text-align: left;
    width: 376px;
    line-height: 37.5px;
    display: block;
    inset: auto -8.3vw -95px auto;
  }

  .storytxtblock.right {
    text-align: left;
    letter-spacing: -.05em;
    width: 337px;
    padding-top: 0;
    line-height: 37.5px;
    top: 25.5vh;
  }

  .storytxtblock.neighbourhood {
    line-height: 37.5px;
    bottom: 20%;
  }

  .text-span-7 {
    font-size: 2.2rem;
  }

  .sui-medium, .sui-regular {
    font-size: 2rem;
  }

  .garamond-italic {
    letter-spacing: -.05em;
    font-size: 2.4rem;
    position: relative;
    left: -3px;
  }

  .garamond-italic.corner-shop {
    font-size: 2.4rem;
  }

  .slushpuppywrapper {
    position: absolute;
    inset: 231px 0% 0% 32%;
  }

  .slushpuppieanimation {
    width: 239px;
    height: 187px;
  }

  .polaroidwrapper {
    z-index: 4;
    position: absolute;
    top: 115px;
    left: 26.7vw;
  }

  .jbpolaroid {
    max-width: 437px;
    bottom: -11px;
    left: -83px;
  }

  .jcpolaroid {
    max-width: 326px;
    top: -136px;
    left: 73px;
  }

  .stickytxtwrapper {
    z-index: 2;
    line-height: 37.5px;
  }

  .outsidestickylength {
    height: 345vh;
  }

  .outside {
    height: 100%;
  }

  .founders-semibold {
    font-size: 50px;
  }

  .clearface-italic {
    letter-spacing: -1px;
    font-size: 45px;
    position: relative;
    left: -3px;
  }

  .section-hero {
    object-fit: fill;
    height: 100vh;
    min-height: 100vw;
  }

  .platformbg.solo {
    object-fit: cover;
    object-position: 50% 100%;
    min-width: 0;
    max-width: none;
  }

  .skybg {
    object-fit: cover;
    object-position: 50% 100%;
    height: 100%;
  }

  .container-hero {
    position: relative;
    top: 180px;
    left: -165px;
  }

  .container-hero.nirvana {
    justify-content: center;
    inset: -1vw 0% 0%;
  }

  .nirvana {
    width: auto;
    max-width: 47vw;
    top: -119px;
    left: -16vw;
  }

  .welcometo {
    top: -62px;
  }

  .cult-stjohn {
    width: 70%;
    top: -16px;
    left: 87px;
  }

  .cult-pattybun {
    width: 70%;
  }

  .cult-daylesford {
    width: 90%;
    top: 228px;
  }

  .cult-otto {
    width: 80%;
  }

  .cult-lafrom {
    width: 80%;
    top: 39px;
    left: -45px;
  }

  .section-cult {
    background-image: url('../images/gridMOBILE.svg');
    background-position: 50% 0;
    background-size: auto;
  }

  .cult-melrose {
    width: 80%;
    max-width: 113%;
    top: 10px;
    bottom: auto;
    left: -51px;
  }

  .cult-greenswiggle._80sdec {
    width: 25%;
    top: 101px;
  }

  .cult-letter.red {
    width: 100px;
    top: 43px;
    left: 11px;
  }

  .cult-letter.green {
    width: 127px;
  }

  .cult-letter.blue, .cult-letter.yellow {
    width: 100px;
  }

  .cult-linedot._80sdec {
    top: -45px;
  }

  .cult-coffeecup {
    width: 95%;
    position: relative;
    top: -235px;
    left: 77px;
    right: 85px;
  }

  .cult-neals {
    top: 2px;
    left: -14px;
  }

  .cult-arrows {
    width: 21px;
  }

  .cult-squarecircle._80sdec {
    top: -162px;
    left: auto;
  }

  .cult-greenbox._80sdec {
    width: 58%;
  }

  .cult-brand {
    width: 80%;
    top: -9px;
  }

  .cult-zigzag._80sdec {
    top: 109px;
    left: 3px;
  }

  .cult-purpletriangle {
    left: 65px;
  }

  .cult-baolondon {
    top: 92px;
    left: -41px;
  }

  .jumpers {
    object-fit: cover;
    object-position: 50% 30%;
  }

  .nav_progressbar, .nav_progressbar.bg {
    padding-left: 0;
    padding-right: 0;
  }

  .progressbar_link {
    flex: 0 auto;
    font-size: .7rem;
  }

  .buttonoverlay {
    z-index: 4;
    background-color: #0000;
    width: 243px;
    height: 60px;
  }

  .slant-indoor {
    object-fit: fill;
    /* W1.1 — phones were served the LARGER file: 725,920 B here against
       470,476 B on desktop, 1.54x bigger for a smaller screen. Same artwork at
       a lower resolution (1828x1573 -> 1280x1101, aspect ratio 1.162 vs 1.163),
       so this is a pure pointer swap.
       NOTE: the plan pairs this with swapping gridMOBILE.svg for grid.svg.
       Do not do that — they are different artwork, not two sizes of one.
       gridMOBILE is portrait (1751x3342, 228 lines); grid.svg is landscape
       (2822x2231, 71 lines). See PROGRESS.md under W1. */
    background-image: url('../images/inside-copy-large.jpeg');
    background-repeat: no-repeat;
    background-size: 123%;
    width: 140vw;
    margin-top: -13px;
    margin-bottom: -10px;
    display: flex;
    top: -32px;
  }

  .slant-indoor.deluxe {
    width: 120vw;
    margin-bottom: 0;
    top: -10px;
  }

  .buttontext.delivery {
    font-size: 23px;
    top: -16px;
    left: 41px;
  }

  .buttontext.directions {
    font-size: 20px;
    top: -14px;
    left: 33px;
  }

  .address {
    font-size: 30px;
    position: static;
  }

  .seethrough {
    color: #303030;
    text-shadow: 0 -1px #f6dfbb, -1px 0 #f6dfbb, 1px 0 #f6dfbb, 0 1px #f6dfbb;
  }

  .openingwrapper {
    top: 162px;
    left: 6vw;
    right: 0;
  }

  .cornershop {
    letter-spacing: -3px;
    font-size: 103px;
  }

  .cornershop.cs {
    font-size: 90px;
    left: 34px;
  }

  .cornershop.deluxe {
    font-size: 85px;
    position: relative;
  }

  .deluxetext {
    top: -15px;
    left: 23px;
  }

  .deluxe-button.blue {
    top: 279px;
    left: 12px;
  }

  .deluxe-button.beige {
    top: 194px;
    left: 30px;
  }

  .corner-shop {
    top: -29px;
    left: 104px;
  }

  .corner-shop.cs {
    left: 54px;
  }

  .deluxe-container {
    flex: none;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    position: relative;
    left: -174px;
  }

  ._7-7 {
    font-size: 30px;
  }

  .overflow-deluxe {
    width: 100%;
    height: 155vh;
    margin-top: -139px;
    padding-top: 242px;
  }

  .section-deluxe {
    height: 1000px;
    margin-top: 0;
    margin-bottom: 0;
  }

  .openinghours {
    left: auto;
    right: 34vw;
  }

  .openinghours.address {
    width: auto;
    position: absolute;
    top: 138px;
    left: auto;
    right: 37.1vw;
  }

  .openinghours._7am-9pm {
    top: 40px;
    left: auto;
    right: 35vw;
  }

  .openinghours._8am-9pm {
    font-size: 30px;
    left: auto;
    right: 36.2vw;
  }

  .googlelogo {
    left: -413px;
  }

  .deliveroologo {
    left: -409px;
    transform: rotate(11deg);
  }

  .hours {
    font-size: 30px;
  }

  .postcard-address {
    display: none;
  }

  .postcard-button-wrapper {
    order: 0;
    margin-top: 15px;
    padding-left: 0;
    padding-right: 0;
    display: flex;
    top: -3.7vw;
  }

  .heading-7 {
    font-size: 12.5vw;
    top: 198px;
    bottom: auto;
  }

  .heading-7.goldstandard {
    font-size: 10vw;
    line-height: 1em;
    top: 10.1rem;
  }

  .column {
    padding-left: 15px;
  }

  .button {
    width: 136px;
    padding-top: 8px;
    font-size: .7rem;
    top: 0;
  }

  .postcardtextwrapper {
    height: auto;
    padding-top: 0;
    position: relative;
  }

  .apply-button {
    top: 5.4vw;
  }

  .marble {
    object-fit: cover;
    width: 100vw;
    height: 40rem;
    margin-top: 0;
    overflow: hidden;
  }

  .section-postcard {
    height: auto;
    margin-top: -500px;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
  }

  .postcardlogo {
    width: 60%;
    padding-top: 0;
    top: 66px;
  }

  .postcard-copy {
    padding-top: 75px;
    padding-bottom: 40px;
    top: auto;
  }

  .whiteglobe {
    width: 2rem;
    top: 9px;
    left: 8px;
  }

  .column-text {
    margin-bottom: 8px;
    padding-left: 0;
    padding-right: 0;
    font-size: 16px;
    line-height: 30px;
  }

  .postcard {
    width: 55vw;
    margin-left: auto;
    margin-right: auto;
    display: block;
    top: 23.1rem;
  }

  .pinklady-wrapper {
    height: 0;
    display: block;
    position: relative;
  }

  .athleisure-pinklady {
    z-index: 100;
    width: 202px;
    display: block;
    inset: -372px 2% 0% auto;
  }

  .athleisure-pinklady.top {
    display: none;
  }

  .productcopytxt {
    font-size: 1.7vw;
    font-weight: 400;
    line-height: 1vw;
  }

  .productcopytxt.blue {
    width: auto;
    font-size: 1.7vw;
    line-height: 1vw;
    position: relative;
    top: 2px;
  }

  .productcopy {
    line-height: 1.8vw;
  }

  .productcopy.youbutfaster {
    width: 111%;
    max-width: 111%;
  }

  .productcopy.cap {
    line-height: 1.9vw;
    top: -8.4vw;
    left: 9px;
  }

  .productcopy.socks {
    line-height: 2vw;
  }

  .productcopy.teamusa {
    margin-top: 21px;
    line-height: 1;
  }

  .price {
    font-size: 1.6vw;
  }

  .athleisure-grid {
    grid-column-gap: 19px;
    grid-row-gap: 53px;
    grid-template-rows: auto auto auto auto auto;
    grid-template-columns: 1.25fr 1.25fr 1.25fr 1.25fr 1.25fr .75fr 1.75fr .25fr;
    grid-auto-flow: row;
    margin-bottom: 2px;
    padding-top: 20vw;
    padding-bottom: 0;
  }

  .springsummer {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 2.8vw;
    bottom: auto;
  }

  .grocerypostlogo {
    width: 10vw;
    position: absolute;
    top: 140px;
    left: auto;
    right: 85px;
  }

  .productinfo {
    font-size: 1.7vw;
  }

  .section-athleisure {
    z-index: 5;
    background-color: #fff;
    background-position: 0 0;
    background-size: contain;
    height: 155vw;
    overflow: hidden;
  }

  .athleisure-blueicon {
    width: 10vw;
  }

  .productname {
    font-size: 1.8vw;
  }

  .athleisure-background {
    height: auto;
    padding-bottom: 0;
    position: relative;
  }

  .pricetext {
    position: relative;
    top: -2px;
  }

  .sidebysideprices {
    width: 111%;
    margin-top: 14px;
  }

  .merchandise {
    margin-top: 10px;
    margin-bottom: 0;
    font-size: 13vw;
    top: 15px;
  }

  .gofasterwrapper {
    flex-direction: column;
    display: block;
    top: -.4vw;
  }

  .athleisure-greenicon {
    width: 10vw;
  }

  .teamusawrapper {
    justify-content: center;
    bottom: 3.2vw;
    overflow: visible;
  }

  .athleisure-redicon {
    width: 10vw;
    max-width: 12vw;
  }

  .athleisure-manwoman {
    width: 111%;
    min-width: auto;
  }

  .pricewrapper.socks {
    margin-top: auto;
    line-height: 1.8vw;
    display: flex;
    top: 20px;
  }

  .pricewrapper.cap {
    margin-top: -9px;
    top: -41px;
  }

  .pricewrapper.teamusa.youbutfaster {
    top: auto;
  }

  .pricewrapper.teamusa.youbutfaster._2 {
    left: auto;
  }

  .productinfowrapper {
    font-size: 1.7vw;
    line-height: 0;
  }

  .athleisurelogo {
    width: 3vw;
    top: 164px;
    left: 0;
  }

  .athleisure-sock {
    flex: 0 auto;
    position: relative;
  }

  .athelsiure-cap {
    width: 100%;
    position: relative;
  }

  .right-block {
    background-image: linear-gradient(210deg, #2d5e99 57%, #0000 93%);
    width: 15vw;
  }

  .athleisure-stars {
    width: 208px;
    display: block;
  }

  .priceletter {
    margin-right: 5px;
    padding: 0 4px;
    font-size: 1.4vw;
  }

  .athleisureteamusa {
    width: 44vw;
    position: absolute;
    top: 132px;
    right: 0;
  }

  .capwrapper {
    display: block;
    position: relative;
    overflow: visible;
  }

  .marquee-liveitup {
    z-index: 4;
    position: relative;
  }

  .macwindow {
    width: 433px;
    max-width: none;
    position: relative;
  }

  .speechbubble {
    display: none;
    position: relative;
  }

  .tellyourparents {
    margin-top: 10px;
    font-family: FUTPTCOND, sans-serif;
    font-size: 3rem;
    font-style: italic;
    line-height: 45px;
    top: -7px;
    left: auto;
  }

  .tellusabit {
    display: none;
  }

  .formbutton {
    font-size: 15px;
    position: relative;
    top: 4px;
  }

  .arrow {
    width: 79px;
    max-width: none;
    top: -142px;
    left: 27px;
    transform: rotate(-71deg);
  }

  .showmethemoney {
    text-align: center;
    width: 132px;
    padding-left: 8px;
    padding-right: 6px;
    font-size: 12px;
    font-weight: 400;
    /* 🔴 FIXED 10 Sep 2026, on James's instruction. Was:
           position: relative; top: -170.344px; left: 14px;
       which landed the badge ON TOP of the message box from 800px to 991px.

       The bug is the position keyword, and the comment below is the proof of
       it. That comment describes an ABSOLUTE placement — "the panel is x=13.5
       width=132.1, and the badge is left:14" — but under position:relative,
       left:14px is a nudge from wherever the badge lands in FLOW, which is the
       form column at x=152, not the panel at x=13.5. The offsets were authored
       for absolute and shipped as relative.

       James: "it should always be 'stuck' to that top bar under the GP globe
       to the left, just as it is in the larger viewport." Desktop stacks the
       left panel globe -> badge -> wage text; this now does the same.

       .apply-wrapper is position:relative at THIS breakpoint and static on
       desktop — see the apply-wrapper anchor, that asymmetry is deliberate —
       so these offsets resolve against it. Measured in that box: the globe
       ends at y=136 and the wage text starts at y=181, so top:147px sits the
       24px badge in the gap with ~11px clear above and below. */
    position: absolute;
    top: 147px;
    /* Same as the base rule: fills the panel edge to edge. At this size the
       panel is x=13.5 width=132.1, and the badge is left:14 width:132. */
    left: 14px;
  }


  .gplogoapply {
    z-index: 5;
    width: 100px;
    top: 44px;
    left: 29px;
  }

  .freebumbag {
    width: 224px;
    top: -34px;
    left: 52px;
    transform: rotate(9deg);
  }

  .apply-wrapper {
    width: auto;
    display: block;
    position: relative;
    top: 33px;
    left: -13px;
  }

  .joinusheading {
    font-size: 90px;
    top: 14px;
  }

  .livingwage {
    text-align: left;
    width: 113px;
    font-size: .7rem;
    font-weight: 400;
    line-height: 11px;
    position: relative;
    /* -135px, not -159px. FIXED 10 Sep 2026 with the .showmethemoney
       change above: that badge used to sit in FLOW here and this text
       started 24px — its exact height — below it. Making the badge
       absolute freed that 24px and pulled this copy up into it, so the
       two overlapped. Giving the 24px back restores the original
       rendered position: the badge moved, this did not. */
    top: -135px;
    left: 24px;
  }

  .apply-today {
    z-index: 10;
    font-size: 1rem;
    top: -285px;
    left: -2px;
  }

  .joinusform {
    width: 241px;
    top: -15px;
    left: -4px;
  }

  .bumbag {
    width: 398px;
    top: -106px;
    left: 119px;
  }

  .joinusformblock {
    position: relative;
    top: -359px;
    left: 164px;
  }

  .formfield.bio {
    padding-top: 5px;
    font-size: 14px;
  }

  .section-joinus {
    height: auto;
    padding-bottom: 20px;
    position: relative;
    overflow: hidden;
  }

  .formgrid {
    grid-column-gap: 16px;
    grid-row-gap: 28px;
    grid-template-rows: 354px auto auto;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 2.75fr .5fr 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    width: 80vw;
    height: auto;
    font-family: FUTPTCOND, sans-serif;
    font-weight: 700;
    display: grid;
  }

  .convenience-business {
    text-align: right;
    width: 670px;
    padding-right: 12px;
    font-style: italic;
    font-weight: 700;
    line-height: 45px;
    top: -23px;
    left: auto;
  }

  .formlabel {
    font-size: 1rem;
    font-weight: 400;
  }

  .formlabel.name {
    font-size: 1rem;
  }

  .anchor-target-about.cult {
    top: -402px;
  }

  .anchor-target-about.deluxe {
    top: 34px;
  }

  .anchor-target-about.postcard {
    height: 55px;
    top: 0;
  }

  .column-2 {
    padding-right: 15px;
  }

  .jobs-board_heroimage {
    border: 1px solid var(--light-brown);
    background-position: 50%;
    height: 22.5rem;
  }

  .jobs-board_herotext {
    font-size: 5.3rem;
  }

  .jobs-board_rich-textblock p {
    font-size: .9rem;
  }

  .jobs-board_apply-button, .jobs-board_lean-more {
    font-size: .7rem;
  }

  .jobs-board_availableroles {
    letter-spacing: -.05em;
    font-family: MNM, sans-serif;
    font-size: 1.2rem;
    font-weight: 500;
    text-decoration: none;
  }

  .text-block-9 {
    top: 35px;
    left: 33px;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    font-size: 2.5rem;
  }

  h2 {
    font-size: 2.25rem;
  }

  h3 {
    font-size: 2rem;
  }

  h4 {
    font-size: 1.5rem;
    line-height: 1.4;
  }

  h5 {
    font-size: 1.25rem;
  }

  h6 {
    font-size: 1.125rem;
  }

  /* .page-wrapper is hidden here on purpose: 480-767px is treated as mobile
     landscape, where .mobileblock shows the "turn your phone" Lottie instead.
     The pair is restored at <=479px (see .page-wrapper / .mobileblock below). */
  .hide-mobile-landscape, .page-wrapper {
    display: none;
  }

  .padding-small {
    padding: 1.25rem;
  }

  .padding-bottom {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .heading-style-h1 {
    font-size: 2.5rem;
  }

  .padding-section-small {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .padding-section-medium {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .navbar_component {
    height: auto;
    min-height: 4rem;
  }

  .navbar_logo-link {
    padding-left: 0;
  }

  .ticker-left_text {
    font-size: 1.125rem;
  }

  .footer_top-wrapper {
    grid-row-gap: 3rem;
  }

  .footer_right-wrapper {
    grid-column-gap: 1.5rem;
  }

  .mobileblock {
    z-index: 9999999;
    background-color: var(--vellum);
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 50vh;
    display: flex;
    position: fixed;
    inset: 0% 0% auto;
  }

  .flip-phone-lottie {
    color: var(--brown);
    width: 40vw;
    max-height: 50vh;
    padding-top: 50px;
    display: block;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    font-size: 2.5rem;
  }

  h4 {
    font-size: .95rem;
  }

  .global-styles {
    color: #0000;
  }

  .page-wrapper {
    display: block;
  }

  .container-large {
    position: relative;
  }

  .padding-bottom {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .heading-style-h1.mobile {
    font-size: 3rem;
    top: 4.6vh;
  }

  .padding-section-small {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .padding-section-small.mobile {
    padding-top: .5rem;
    padding-bottom: 1rem;
  }

  .padding-global {
    align-items: flex-end;
    height: auto;
  }

  .padding-section-medium.mobile {
    padding-top: 2rem;
    padding-bottom: 0;
  }

  .navbar_component {
    align-items: stretch;
    min-height: 3.5rem;
    padding-top: 0;
    padding-bottom: 0;
  }

  .navbar_logo-link {
    position: absolute;
  }

  .navbar_logo-link.w--current {
    justify-content: center;
    align-items: stretch;
  }

  .navbar_logo {
    flex: 0 auto;
    max-width: none;
    height: 1.7rem;
    margin-top: 0;
    padding-top: 1px;
  }

  .navbar_logo.aboutpage {
    height: 1.5rem;
    margin-left: 0;
    left: 19px;
  }

  .navbar_usericon.icon-1x1-xsmall {
    flex: 0 auto;
    width: 1.25rem;
  }

  .ticker-left_text {
    margin-left: 0;
    font-size: 1.15rem;
  }

  .navmenu_mainmenu {
    max-width: none;
    height: 100%;
    display: block;
  }

  .navmenu_mainmenu.aboutpage {
    display: none;
  }

  .navmenu_bottom-wrapper, .navmenu_bottom-title {
    height: 100%;
  }

  .navmenu_cultgroceries {
    top: 28vh;
    left: 20%;
  }

  .navmenu_menu-item.cult {
    flex: none;
    padding-right: 0%;
  }

  .navmenu_menu-item.aboutpage {
    display: flex;
  }

  .navmenu_item-link {
    flex: none;
    height: 100%;
  }

  .navmenu_wrapper {
    width: 100vw;
    height: 100%;
    display: none;
    position: fixed;
    top: 80px;
    overflow: hidden;
  }

  .footer_top-wrapper {
    grid-row-gap: 2.5rem;
    flex-direction: column;
    grid-template-rows: auto auto auto;
    align-items: center;
    display: flex;
  }

  .footer_right-wrapper {
    grid-column-gap: 1rem;
    grid-row-gap: 14px;
    flex-direction: column;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    width: 100%;
    padding-top: 0;
    display: grid;
    position: relative;
    bottom: 1vh;
  }

  .footer_link-list {
    align-items: center;
    width: 100%;
    padding-left: 0;
  }

  .footer_links {
    text-align: left;
    padding-top: 0;
    padding-left: 10px;
    padding-right: 10px;
  }

  .footer_left-wrapper {
    grid-row-gap: 0px;
    width: 100%;
  }

  .footer_giantcopy {
    font-size: 1.5rem;
  }

  .footer_giantcopy.just-in-case {
    text-align: left;
    padding-left: 15px;
    font-size: 1.6rem;
  }

  .footer_giantlogo {
    justify-content: center;
    height: 25vw;
    margin-top: 2rem;
    top: 0;
  }

  .footer_socialswrapper {
    grid-row-gap: 5px;
    flex-direction: column;
    margin-top: 0;
  }

  .footer_socialbuttons-wrapper {
    grid-column-gap: .4rem;
    grid-row-gap: .4rem;
    justify-content: flex-end;
    align-self: flex-end;
    align-items: center;
    padding-right: 0;
  }

  .footer_social-button {
    flex-direction: row;
    width: auto;
    height: 1.2rem;
    margin-bottom: 8px;
    padding-right: 0;
  }

  .footer_credits-wrapper {
    margin-top: -28px;
  }

  .footer_designedbywrapper {
    position: relative;
    top: -4px;
  }

  .transition {
    border-top-style: none;
    border-bottom-style: none;
    display: none;
  }

  .transition-logo {
    max-width: 10rem;
    margin-bottom: 0;
  }

  .transition-colourbar {
    width: 10rem;
    left: 0;
    overflow: hidden;
  }

  .transition-colourblock {
    max-width: 14.9%;
  }

  .transition-copyright {
    justify-content: flex-end;
    align-items: center;
    width: 10rem;
    display: flex;
  }

  .transition-version1 {
    max-width: 65%;
    margin-top: .2rem;
  }

  .navbar_mobile {
    grid-template-columns: .3fr 1.25fr .25fr .25fr;
    align-self: auto;
  }

  .mobile_logowrapper {
    justify-content: center;
    width: 100%;
    height: 100%;
    padding-top: 5px;
    display: flex;
    position: relative;
  }

  .menuburger_lottie {
    width: 1.2rem;
  }

  .mobileblock {
    height: 100vh;
    display: none;
  }

  .flip-phone-lottie {
    display: none;
  }

  .marquee {
    border-top: 1px none var(--light-brown);
    border-bottom: 1px none var(--light-brown);
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .marquee.aboutpage {
    padding-bottom: 0;
  }

  .marquee-content.scroll {
    grid-column-gap: 1rem;
    grid-row-gap: 0rem;
  }

  .caffeine-bg.magnify {
    width: 100%;
    display: none;
    left: -8.2vw;
  }

  .caffeine-body.body14 {
    position: relative;
    top: 15px;
    left: -110px;
  }

  .caffeine-body.body2 {
    top: 39px;
    left: -76px;
  }

  .caffeine-body.body5 {
    top: 33px;
    left: -60px;
  }

  .caffeine-body.body7 {
    top: 29px;
    left: -51px;
  }

  .caffeine-body.body14 {
    display: inline-block;
    position: relative;
    left: -23px;
  }

  .caffeine-body.body10 {
    top: 24px;
    left: -38px;
  }

  .caffeine-body.body6 {
    top: 31px;
    left: -55px;
  }

  .caffeine-body.body9 {
    top: 25px;
    left: -42px;
  }

  .caffeine-body.body13 {
    top: 18px;
    left: -26px;
  }

  .caffeine-body.body2 {
    top: 39px;
  }

  .caffeine-body.body8 {
    top: 28px;
    left: -47px;
  }

  .caffeine-body.body12 {
    top: 20px;
    left: -30px;
  }

  .caffeine-body.body4 {
    top: 35px;
    left: -65px;
  }

  .caffeine-body.body3 {
    top: 37px;
    left: -70px;
  }

  .caffeine-body.body11 {
    top: 22px;
    left: -34px;
  }

  .stickytrigger {
    top: 10%;
  }

  .storygridwrapper.cult {
    width: 100%;
    max-width: 100%;
    padding-bottom: 95px;
    overflow: visible;
  }

  .story-grid.right {
    top: -516px;
  }

  .storytxtblock.weremember {
    width: auto;
    line-height: 1em;
    top: -25px;
  }

  .storytxtblock.slushpuppie {
    text-align: right;
    width: auto;
    line-height: 1em;
    bottom: 50px;
  }

  .storytxtblock.right {
    text-align: left;
    width: auto;
    line-height: 1em;
    top: 486px;
  }

  .storytxtblock.neighbourhood {
    width: 80vw;
    line-height: 1.25rem;
    bottom: 14%;
  }

  .text-span-7 {
    font-size: 1px;
    line-height: 1em;
  }

  .sui-medium {
    letter-spacing: -1.5px;
    font-size: 1.6rem;
    line-height: 1em;
  }

  .sui-medium.cult {
    line-height: 1.25rem;
  }

  .sui-regular {
    letter-spacing: -1px;
    font-size: 1.6rem;
    line-height: 1.2rem;
  }

  .sui-regular.cult {
    line-height: 1.25rem;
  }

  .garamond-italic {
    letter-spacing: -1px;
    font-size: 1.95rem;
    line-height: 1em;
    left: 0;
  }

  .garamond-italic.corner-shop {
    font-size: 1.9rem;
    font-weight: 500;
    line-height: 2.1rem;
  }

  .garamond-italic.cult {
    line-height: 1.8rem;
  }

  .slushpuppywrapper {
    inset: 33% 0% 0%;
  }

  .slushpuppieanimation {
    width: 216px;
    height: 170px;
    margin-left: auto;
    margin-right: auto;
  }

  .polaroidwrapper {
    min-width: auto;
    top: 65px;
    left: auto;
  }

  .jbpolaroid {
    min-width: auto;
    max-width: 100%;
    bottom: 14px;
    left: -22px;
  }

  .jcpolaroid {
    min-width: auto;
    max-width: 70%;
    top: -36px;
    left: 90px;
  }

  .italic-text-8 {
    line-height: 1.4em;
  }

  .outsidewrapper {
    top: -260.5px;
  }

  .outside {
    object-position: 39% 50%;
  }

  .founders-semibold {
    letter-spacing: -1.5px;
    font-size: 30px;
    line-height: 1.25rem;
  }

  .clearface-italic {
    letter-spacing: -1px;
    font-size: 29px;
    line-height: 1rem;
    display: none;
    left: 0;
  }

  .section-hero {
    background-color: var(--vellum);
    margin-bottom: 78px;
    padding-bottom: 0;
    overflow: hidden;
  }

  .platformbg.solo {
    object-fit: cover;
    object-position: 53% 53%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }

  .skybg {
    height: 105%;
    position: absolute;
  }

  .container-hero.nirvana {
    justify-content: center;
    max-width: 100%;
  }

  .nirvana {
    flex-direction: column;
    flex: 1;
    justify-content: flex-start;
    width: auto;
    min-width: auto;
    max-width: none;
    margin-left: 32px;
    margin-right: auto;
    padding-top: 53px;
    display: flex;
    top: auto;
    left: -30px;
  }

  .welcometo {
    width: 40vw;
    max-width: 8rem;
    padding-bottom: 0;
    top: 5.8vw;
  }

  .grocerynirvana {
    width: 70vw;
    max-width: 16rem;
    top: auto;
  }

  .cult-stjohn {
    width: 80%;
    top: -13px;
    left: -1px;
  }

  .cult-pattybun {
    width: 80%;
    top: 23px;
  }

  .wrapper-body-2 {
    top: 1.7vw;
    left: 1.4vw;
  }

  .caffeine-performance-2 {
    font-size: 3.4vw;
    line-height: .2em;
    top: 38.1vw;
    left: 7.4vw;
  }

  .cult-daylesford {
    width: 100%;
    top: 55px;
    left: 19px;
  }

  .cult-dots {
    left: -40px;
  }

  .wrapper-performance {
    top: -85px;
    left: auto;
  }

  .cult-otto {
    width: 90%;
    top: -24px;
  }

  .cult-lafrom {
    width: 100%;
    top: -27px;
    left: 31px;
  }

  .cult-deyacrock {
    top: -12px;
    left: -12px;
  }

  .section-cult {
    background-color: #fff9f1;
    background-image: url('../images/gridMOBILE.svg');
    background-position: 0 -261px;
    background-size: 835px;
    margin-bottom: -2px;
  }

  .caffeine-youbut-2 {
    font-size: 7vw;
    top: 25.5vw;
    left: 6.2vw;
  }

  .caffeine-youbut-2.aboutus {
    font-size: 7vw;
    left: 6.7vw;
  }

  .cult-melrose {
    width: 90%;
    top: 31px;
    left: 17px;
  }

  .cult-greenswiggle {
    width: 70%;
    top: 51px;
    left: 14px;
  }

  .cult-letter {
    width: 80%;
    top: auto;
    left: -27px;
  }

  .cult-letter.red {
    width: 90%;
    top: -46px;
  }

  .cult-letter.green {
    width: 100%;
    top: 14px;
    left: 6px;
  }

  .cult-letter.blue {
    width: 90%;
    top: -2px;
    left: -24px;
  }

  .cult-letter.yellow {
    width: 90%;
    top: 0;
    left: -50px;
  }

  .cult-linedot {
    width: 70%;
    top: -73px;
  }

  .cult-coffeecup {
    width: 100%;
    max-width: 200px;
    top: -153px;
    left: 29px;
    right: auto;
  }

  .cult-pinkcross {
    width: 50%;
    top: 48px;
    left: -5px;
  }

  .cult-neals {
    width: 32%;
    position: relative;
    top: -13px;
    left: 36px;
  }

  .cult-arrows {
    width: 15%;
    top: -86px;
  }

  .cult-deya {
    width: 80%;
    top: auto;
  }

  .cult-happy {
    max-width: 155%;
    top: -42px;
    left: 5px;
  }

  .cult-lacroix {
    width: 95%;
    top: -39px;
  }

  .cult-squarecircle {
    width: 70%;
    top: -2px;
    left: auto;
  }

  .cult-squarecircle._80sdec {
    top: 15px;
  }

  .caffeine-ingredients {
    width: 100%;
    top: 83px;
    left: 10px;
  }

  .cult-yellowtriangle {
    width: 70%;
  }

  .cult-greenbox {
    left: auto;
  }

  .cult-brand {
    width: 110%;
    max-width: 1200%;
    margin-left: auto;
    margin-right: auto;
    top: -6px;
    left: -11px;
  }

  .cultgrid {
    margin-left: auto;
    margin-right: auto;
  }

  .cult-zigzag {
    left: auto;
  }

  .cult-purpletriangle {
    top: 102px;
    left: auto;
  }

  .cult-baolondon {
    width: 72%;
    max-width: none;
    top: 40px;
    left: 11px;
  }

  .nav_progressbar {
    height: 1rem;
    top: -9px;
  }

  .nav_progressbar.bg {
    top: 0%;
  }

  .progressbar_link {
    font-size: .3rem;
    display: none;
  }

  .buttonoverlay {
    width: 226px;
    /* 🔴 FIXED 10 Sep 2026, found by scripts/harness/overlap.js.
       The base rule puts this anchor at left:-490px and nothing below 480px
       overrode it, so at 375px the CLICKABLE LINK sat at x=-182 — off the left
       edge of the screen — while the button it belongs to was drawn at x=21.
       Only 27px of a 143px button answered a tap, and a hit test at the
       button's centre returned an unrelated element. Both of About's main
       calls to action looked perfect on a phone and did nothing.
       Measured at 375px: the pill spans x=21..164, centre 92. This anchor is
       226px wide, so its left edge wants 92-113 = -21 — which is 161px to the
       right of where -490px lands it. */
    left: -329px;
  }

  .slant-indoor {
    background-position: 105% 44%;
    background-size: 143%;
    width: 208vw;
    min-width: 208vw;
    height: 500px;
    top: -32px;
  }

  .slant-indoor.deluxe {
    width: 167vw;
    min-width: 0;
    height: 254px;
    padding-top: 5vw;
  }

  .buttontext.delivery {
    font-size: 13px;
    top: -11px;
    left: 192px;
  }

  .buttontext.directions {
    font-size: 13px;
    top: -11px;
    left: 191px;
  }

  .address, .seethrough {
    font-size: 5vw;
  }

  .openingwrapper {
    width: 130vw;
    display: block;
    top: 154px;
    left: 19px;
  }

  .cornershop.cs {
    text-shadow: 0 -1px 1px #303030, 1px 0 1px #303030, -1px 0 1px #303030, 0 1px 1px #303030;
    font-size: 14vw;
    line-height: .3em;
    position: relative;
    left: 1px;
  }

  .cornershop.deluxe {
    letter-spacing: -1px;
    text-shadow: 1px 1px 6px #f6debb, 0 -1px #f6debb, 1px 0 #f6debb, -1px 0 #f6debb, 0 1px #f6debb;
    font-size: 14vw;
    line-height: 20px;
    top: auto;
    bottom: auto;
    left: auto;
  }

  .deluxetext {
    flex: 1;
    align-self: flex-start;
    font-size: 1em;
    top: -8px;
    left: 122px;
  }

  .deluxe-button.blue {
    top: 141px;
    left: 104px;
  }

  .deluxe-button.beige {
    top: 82px;
    left: 116px;
  }

  .corner-shop {
    margin-left: auto;
    margin-right: auto;
    top: -3.1vw;
    left: auto;
  }

  .corner-shop.cs {
    flex: 1;
    left: 67px;
  }

  .corner-shop.deluxe._2 {
    width: 100%;
    padding-top: 5px;
    padding-left: 5px;
    font-size: 130px;
    line-height: 0;
    display: block;
    position: absolute;
    top: auto;
    left: auto;
  }

  .corner-shop.deluxe._1 {
    width: 100%;
    padding-top: 7px;
    padding-left: 2px;
    font-size: 130px;
    line-height: 0;
    position: absolute;
    top: auto;
    left: auto;
  }

  .corner-shop.deluxe._4 {
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 11px;
    font-size: 130px;
    line-height: 0;
    display: block;
    position: absolute;
    top: auto;
    left: auto;
  }

  .corner-shop.deluxe._3 {
    width: 100%;
    padding-top: 2px;
    padding-left: 8px;
    font-size: 130px;
    line-height: 0;
    display: block;
    position: absolute;
    top: auto;
    left: auto;
  }

  .deluxe-container {
    margin-left: 0;
    margin-right: 0;
    left: -5px;
  }

  ._7-7 {
    font-size: 5vw;
  }

  .overflow-deluxe {
    height: 110vh;
    margin-top: auto;
    padding-top: 90px;
  }

  .beigebutton._1 {
    min-width: 135px;
  }

  .beigebutton._2 {
    min-width: 135px;
    left: -127px;
  }

  .section-deluxe {
    height: 734px;
  }

  .openinghours {
    font-size: 0;
    line-height: 0;
    top: -62px;
    right: 15.1vw;
  }

  .openinghours.address {
    top: 15px;
    right: 18.8vw;
  }

  .openinghours._7am-9pm {
    top: -35px;
    right: 16.2vw;
  }

  .openinghours._8am-9pm {
    top: -14px;
    right: 17.7vw;
  }

  .googlelogo {
    width: 15px;
    left: -251px;
  }

  .deliveroologo {
    width: 15px;
    top: -11px;
    left: -252px;
  }

  .hours {
    font-size: 5vw;
  }

  .postcard-button-wrapper {
    flex-direction: row;
    align-self: stretch;
    margin-top: 18px;
    top: .3vw;
  }

  .heading-7.goldstandard {
    font-size: 15vw;
    line-height: 12vw;
    top: 22%;
  }

  .button {
    width: 128px;
    padding: 5px 11px 5px 30px;
    font-size: 11px;
    top: auto;
  }

  .postcardtextwrapper {
    height: auto;
    padding-top: 22px;
  }

  .apply-button {
    font-size: 15px;
    top: auto;
  }

  .marble {
    height: 31.9rem;
    margin-top: 8px;
  }

  .section-postcard {
    margin-top: -159px;
    padding-bottom: 28px;
    overflow: hidden;
  }

  .postcardlogo {
    width: 40%;
    max-width: 50%;
    top: 3px;
  }

  .postcard-copy {
    padding-top: 35px;
    top: auto;
  }

  .whiteglobe {
    width: 20%;
    top: 7px;
    left: 8px;
  }

  .column-text {
    font-size: 3.5vw;
    line-height: 6vw;
  }

  .postcard {
    width: 70%;
    min-width: 14rem;
    max-width: 18rem;
    top: 372px;
  }

  .athleisure-pinklady {
    width: 88px;
    top: -156px;
  }

  .productcopytxt {
    letter-spacing: 0;
    line-height: .01rem;
  }

  .productcopytxt.blue {
    line-height: .1rem;
  }

  .productcopy.cap {
    width: 93%;
    top: -11.1vw;
    left: 5px;
  }

  .productcopy.socks {
    margin-top: 3px;
  }

  .productcopy.teamusa {
    line-height: .5;
  }

  .athleisure-grid {
    margin-bottom: 0;
    padding-top: 19%;
  }

  .grocerypostlogo {
    width: 6vh;
    top: 48px;
    right: 29px;
  }

  .productinfo {
    line-height: 1vh;
  }

  .section-athleisure {
    height: 164vw;
  }

  .productname {
    line-height: 1vh;
  }

  .pricetext {
    line-height: 0;
  }

  .sidebysideprices {
    top: 0;
  }

  .merchandise {
    top: 11px;
  }

  .gofasterwrapper {
    top: -6.4vw;
  }

  .pricewrapper.cap {
    margin-top: 27px;
  }

  .athleisurelogo {
    width: 2vh;
    top: 64px;
    left: -.9vw;
  }

  .right-block {
    width: 6vh;
  }

  .athleisure-stars {
    width: 120px;
    top: -38px;
    left: -2vw;
  }

  .athleisureteamusa.magnify {
    top: 109px;
  }

  .iconwrapper {
    position: relative;
    left: 6px;
  }

  .marquee-liveitup, .marquee-inner {
    padding-top: 0;
    padding-bottom: 0;
  }

  .marqueetext {
    margin-top: 10px;
  }

  .liveitup {
    font-size: 47px;
  }

  .fieldwrapper {
    flex-direction: row;
    flex: 0 auto;
    justify-content: flex-start;
    align-items: center;
    width: 192px;
    display: flex;
    position: relative;
    top: 9px;
  }

  .macwindow {
    box-shadow: none;
    width: 310px;
    margin-left: auto;
    margin-right: auto;
  }

  .tellyourparents {
    width: 76vw;
    font-size: 2.5rem;
    line-height: 2.7rem;
    top: -21px;
    left: -7px;
  }

  .formbutton {
    width: 174px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: .8rem;
    position: relative;
    top: 6px;
  }

  .arrow {
    top: 4px;
    left: 103px;
    transform: rotate(-23deg);
  }

  .showmethemoney {
    text-align: center;
    width: 130px;
    font-size: 10px;
    display: none;
    top: -226.344px;
    left: 13px;
  }

  .gplogoapply {
    z-index: 99;
    flex: 0 auto;
    width: 62px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    top: 62px;
    left: -150px;
    right: 54px;
  }

  .freebumbag {
    width: 207px;
    top: -96px;
    left: -13px;
    transform: rotate(-6deg);
  }

  .apply-wrapper {
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    top: auto;
    left: auto;
  }

  .joinusheading {
    font-size: 40px;
    top: 13px;
    left: 18px;
  }

  .livingwage {
    text-align: left;
    letter-spacing: 0;
    flex: none;
    width: 84px;
    margin-left: auto;
    margin-right: auto;
    font-size: 10px;
    line-height: 10px;
    position: absolute;
    top: 138px;
    left: -49px;
    right: 146.797px;
  }

  .apply-today {
    text-align: center;
    width: 302px;
    font-size: 15px;
    position: absolute;
    top: 29px;
    left: auto;
  }

  .joinusform {
    width: 100%;
    position: relative;
    top: -2px;
    left: 26px;
  }

  .bumbag {
    width: 11.6rem;
    position: relative;
    top: -40px;
    left: 191px;
  }

  .joinusformblock {
    width: 130px;
    position: absolute;
    top: 39px;
    left: auto;
    right: auto;
  }

  .formfield {
    width: 140px;
    height: 25px;
    position: relative;
    left: 22px;
  }

  .formfield.name {
    width: 129px;
    height: 25px;
    margin-left: 0;
    position: relative;
    top: 5px;
    left: -19px;
  }

  .formfield.bio {
    width: 173px;
    height: 44px;
    padding-top: 6px;
    padding-bottom: 0;
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    top: 5px;
    left: auto;
  }

  .formfield.email {
    width: 129px;
    top: 0;
    left: -19px;
  }

  .section-joinus {
    height: auto;
  }

  .formgrid {
    grid-row-gap: 26px;
    grid-template-rows: 260px auto auto auto;
    grid-template-columns: 100%;
    width: 80vw;
  }

  .convenience-business {
    text-align: right;
    letter-spacing: -2px;
    width: 85vw;
    padding-right: 5px;
    font-size: 2.5rem;
    line-height: 11vw;
    top: -32px;
    left: 5px;
  }

  .formlabel {
    margin-bottom: 0;
    margin-right: 0;
    font-size: 15px;
    position: relative;
    top: -4px;
  }

  .formlabel.name {
    top: 1px;
  }

  .formlabel.name.joinus, .formlabel.joinus {
    text-align: left;
  }

  .progressbar {
    height: 8px;
    bottom: -4%;
  }

  .jobs-board_component {
    margin-bottom: 0;
  }

  .jobs-board_heroimage {
    background-size: cover;
  }

  .jobs-board_herotext {
    font-size: 3rem;
  }

  .info-block_job-title {
    font-size: .9rem;
  }

  .jobs-board_rich-textblock p {
    text-align: justify;
    font-size: .8rem;
  }

  .jobs-board_rich-textblock li {
    font-size: .8rem;
  }

  .jobs-board_rich-textblock h5 {
    text-align: center;
    margin-bottom: .3rem;
    font-size: .7rem;
  }

  .info-block_salary-offer {
    text-align: right;
    font-size: .8rem;
  }

  .jobs-board_apply-button {
    font-size: .6rem;
  }

  .info-block_button-wrapper {
    grid-column-gap: .7rem;
  }

  .jobs-board_lean-more {
    font-size: .6rem;
  }

  .jobs-board_availableroles {
    font-size: 1rem;
  }

  .jobs-board_availableroles.allother-roles {
    margin-bottom: 0;
  }

  .text-block-9 {
    font-size: .7rem;
    top: 48px;
  }
}

#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf59-1b71bf26 {
  grid-area: 1 / 12 / 2 / 13;
  place-self: auto;
}

#w-node-e235ef2d-bef3-1d30-53c5-35f24b315e45-1b71bf26 {
  grid-area: 1 / 12 / 2 / 14;
}

#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf29-1b71bf26 {
  grid-area: span 2 / span 2 / span 2 / span 2;
}

#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf37-1b71bf26 {
  grid-area: 2 / 6 / 3 / 8;
}

#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf39-1b71bf26 {
  grid-area: 2 / 6 / 3 / 8;
}

#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf46-1b71bf26, #w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf47-1b71bf26 {
  grid-area: 2 / 8 / 3 / 11;
}

#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf55-1b71bf26, #w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf56-1b71bf26 {
  grid-area: 2 / 11 / 3 / 14;
}

#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c54497-6043382a {
  /* Placement is set with the other navbar icon rules near the end of this file. */
  grid-area: 1 / 12 / 2 / 13;
  place-self: auto;
}

#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544d3-6043382a {
  grid-area: span 2 / span 2 / span 2 / span 2;
}

#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544e1-6043382a {
  grid-area: 2 / 6 / 3 / 8;
}

#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544e3-6043382a {
  grid-area: 2 / 6 / 3 / 8;
}

#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544fb-6043382a {
  grid-area: 2 / 8 / 3 / 11;
}

#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544ff-6043382a {
  grid-area: 2 / 11 / 3 / 14;
}

#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c54500-6043382a {
  grid-area: 2 / 11 / 3 / 14;
}

#w-node-_4695d165-02a1-11b2-b400-c0659512f71b-6043382a {
  grid-area: 1 / 1 / 2 / 2;
  place-self: start;
}

#w-node-_4695d165-02a1-11b2-b400-c0659512f727-6043382a {
  grid-area: 1 / 1 / 2 / 2;
  place-self: end start;
}

#w-node-_4695d165-02a1-11b2-b400-c0659512f72e-6043382a {
  grid-area: span 1 / span 1 / span 1 / span 1;
  align-self: start;
}

#w-node-_4695d165-02a1-11b2-b400-c0659512f72f-6043382a {
  grid-area: 2 / 1 / 3 / 2;
}

#w-node-_4695d165-02a1-11b2-b400-c0659512f731-6043382a {
  justify-self: start;
}

#w-node-_4695d165-02a1-11b2-b400-c0659512f734-6043382a {
  grid-area: 1 / 2 / 2 / 3;
}

#w-node-_4695d165-02a1-11b2-b400-c0659512f735-6043382a {
  grid-area: 1 / 2 / 2 / 3;
  place-self: start end;
}

#w-node-f2f0589a-3a9f-c61d-3e44-cbfc65c94b9e-6043382a {
  grid-area: span 1 / span 2 / span 1 / span 2;
  place-self: end start;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c3d-6043382a {
  grid-area: 4 / 3 / 5 / 4;
  place-self: center start;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c3e-6043382a {
  grid-area: 3 / 3 / 4 / 4;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c3f-6043382a {
  grid-area: 3 / 1 / 4 / 2;
  place-self: center;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c40-6043382a {
  grid-area: 8 / 3 / 10 / 5;
  align-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c41-6043382a {
  grid-area: 1 / 4 / 3 / 7;
  justify-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c42-6043382a {
  grid-area: 5 / 2 / 6 / 3;
  align-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c43-6043382a {
  grid-area: 7 / 6 / 8 / 7;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c44-6043382a {
  grid-area: 8 / 1 / 9 / 2;
  align-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c45-6043382a {
  grid-area: 2 / 1 / 3 / 2;
  place-self: start;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c46-6043382a {
  grid-area: 4 / 1 / 5 / 2;
  place-self: center start;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c47-6043382a {
  grid-area: 4 / 6 / 5 / 7;
  place-self: center end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c48-6043382a {
  grid-area: 5 / 4 / 6 / 7;
  align-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c49-6043382a {
  grid-area: 4 / 2 / 5 / 3;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4a-6043382a {
  grid-area: 4 / 5 / 5 / 6;
  align-self: center;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4b-6043382a {
  grid-area: 4 / 4 / 5 / 6;
  place-self: center;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4c-6043382a {
  grid-area: 8 / 1 / 9 / 2;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4d-6043382a {
  grid-area: 3 / 3 / 4 / 5;
  place-self: center;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4e-6043382a {
  grid-area: 1 / 1 / 2 / 2;
  align-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4f-6043382a {
  grid-area: 2 / 2 / 3 / 3;
  place-self: end start;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c50-6043382a {
  grid-area: 5 / 1 / 6 / 3;
  place-self: center start;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c51-6043382a {
  grid-area: 5 / 3 / 6 / 5;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c52-6043382a {
  grid-area: 3 / 5 / 4 / 7;
  place-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c53-6043382a {
  grid-area: 2 / 6 / 3 / 7;
  justify-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c54-6043382a {
  grid-area: 5 / 5 / 6 / 6;
  place-self: center;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c55-6043382a {
  grid-area: 3 / 4 / 4 / 5;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c56-6043382a {
  grid-area: 5 / 6 / 6 / 7;
  place-self: center end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c57-6043382a {
  grid-area: 4 / 1 / 5 / 3;
  align-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c58-6043382a {
  grid-area: 4 / 6 / 5 / 7;
  place-self: center end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c59-6043382a {
  grid-area: 7 / 3 / 8 / 5;
  align-self: end;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c5a-6043382a {
  grid-area: 1 / 5 / 2 / 6;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c5b-6043382a {
  grid-area: 2 / 3 / 3 / 6;
  align-self: center;
}

#w-node-_7b061097-4bfb-3b04-3232-5a85eac65c71-6043382a {
  grid-area: 2 / 5 / 4 / 7;
  align-self: center;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee47-6043382a {
  grid-area: 2 / 4 / 8 / 9;
  align-self: end;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee48-6043382a {
  grid-area: 1 / 4 / 2 / 7;
  align-self: end;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee4a-6043382a {
  grid-area: 2 / 4 / 6 / 8;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee4b-6043382a {
  grid-area: 3 / 4 / 4 / 7;
  align-self: center;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee4c-6043382a {
  grid-area: 3 / 4 / 4 / 8;
  place-self: end start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee50-6043382a, #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee60-6043382a {
  grid-area: 3 / 4 / 4 / 7;
  place-self: end start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee71-6043382a {
  grid-area: 1 / 6 / 2 / 7;
  justify-self: center;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee73-6043382a {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee75-6043382a {
  grid-area: 2 / 7 / 3 / 8;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee76-6043382a {
  grid-area: 1 / 4 / 2 / 6;
  place-self: start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee77-6043382a {
  grid-area: 1 / 4 / 2 / 6;
  justify-self: center;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee78-6043382a {
  grid-area: 1 / 4 / 2 / 6;
  place-self: center;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee7b-6043382a {
  grid-area: 1 / 4 / 2 / 6;
  place-self: end start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee8c-6043382a {
  grid-area: 1 / 1 / 2 / 4;
  place-self: start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee8d-6043382a {
  grid-area: 1 / 1 / 2 / 4;
  place-self: start end;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee8e-6043382a {
  grid-area: 1 / 1 / 3 / 4;
  place-self: end center;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee91-6043382a {
  grid-area: 2 / 1 / 3 / 4;
  place-self: start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eeea0-6043382a {
  grid-area: 2 / 1 / 6 / 4;
  align-self: start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eeea1-6043382a {
  grid-area: 2 / 1 / 3 / 4;
  place-self: center;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eeea4-6043382a {
  grid-area: 2 / 1 / 3 / 4;
  place-self: start;
}

#w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eeeb4-6043382a {
  grid-area: span 2 / span 3 / span 2 / span 3;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f51d8-6043382a {
  grid-area: 3 / 1 / 7 / 7;
  place-self: start;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f51d9-6043382a {
  grid-area: 3 / 1 / 5 / 3;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f51da-6043382a {
  grid-area: 3 / 3 / 4 / 4;
  place-self: end;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f51dc-6043382a {
  grid-area: 2 / 2 / 7 / 7;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f51e0-6043382a {
  grid-area: 4 / 1 / 5 / 3;
  justify-self: center;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f51f9-6043382a {
  grid-area: 4 / 6 / 5 / 11;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f5200-6043382a {
  grid-area: 5 / 6 / 7 / 11;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f5204-6043382a {
  grid-area: 3 / 7 / 4 / 9;
  align-self: center;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f5205-6043382a {
  grid-area: 1 / 9 / 2 / 11;
}

#w-node-_080c3784-be23-7aba-8235-93817b6f5206-6043382a {
  grid-area: 3 / 6 / 4 / 8;
}

#w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d32-f7ea8d24, #w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d34-f7ea8d24 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d3d-f7ea8d24 {
  grid-area: 1 / 2 / 2 / 3;
}

#w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d3e-f7ea8d24 {
  grid-area: 2 / 1 / 3 / 2;
}

#w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d49-f7ea8d24 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d62-f7ea8d24 {
  grid-area: 1 / 2 / 2 / 3;
  justify-self: end;
}

#w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d6f-f7ea8d24 {
  grid-area: 1 / 3 / 2 / 4;
  justify-self: end;
}

#w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d78-f7ea8d24 {
  grid-area: 2 / 2 / 3 / 3;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115b1-c00f7c64 {
  grid-area: 3 / 1 / 7 / 7;
  place-self: start;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115b2-c00f7c64 {
  grid-area: 3 / 1 / 5 / 3;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115b3-c00f7c64 {
  grid-area: 3 / 3 / 4 / 4;
  place-self: end;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115b5-c00f7c64 {
  grid-area: 2 / 2 / 7 / 7;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115b9-c00f7c64 {
  grid-area: 4 / 1 / 5 / 3;
  justify-self: center;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115d2-c00f7c64 {
  grid-area: 4 / 6 / 5 / 11;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115d6-c00f7c64 {
  grid-area: 5 / 6 / 7 / 11;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115da-c00f7c64 {
  grid-area: 3 / 7 / 4 / 9;
  align-self: center;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115db-c00f7c64 {
  grid-area: 1 / 9 / 2 / 11;
}

#w-node-_7b0d3656-d9dc-51e5-d955-993f227115dc-c00f7c64 {
  grid-area: 3 / 6 / 4 / 8;
}

@media screen and (min-width: 1440px) {
  #w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf39-1b71bf26 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf56-1b71bf26 {
    grid-area: 2 / 10 / 3 / 14;
  }

  #w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544e3-6043382a {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c54500-6043382a {
    grid-area: 2 / 10 / 3 / 14;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f71b-6043382a {
    grid-area: 1 / 1 / 2 / 2;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c41-6043382a {
    grid-area: 1 / 6 / 3 / 9;
    justify-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c47-6043382a {
    grid-area: 5 / 8 / 6 / 9;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c52-6043382a {
    grid-area: 3 / 7 / 4 / 9;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c58-6043382a {
    grid-area: 5 / 8 / 6 / 9;
  }
}

@media screen and (min-width: 1280px) {

  #w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf29-1b71bf26, #w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544d3-6043382a {
    justify-self: start;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f731-6043382a {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f732-6043382a {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f733-6043382a {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d78-f7ea8d24 {
    grid-area: 2 / 2 / 3 / 3;
  }
}

@media screen and (max-width: 991px) {
  /* "SHOW ME THE MONEY" badge. Its base rule sets justify-self: center, which
     Chrome now honours on block-level boxes, pushing the badge into the form
     column on top of the message field. Align left so it stacks above
     .livingwage, as it does at desktop widths. */
  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115b9-c00f7c64 {
    justify-self: start;
  }

  #w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf37-1b71bf26 {
    grid-area: 1 / 5 / 2 / 10;
  }

  #w-node-_8855f4bd-2d1f-88a3-02bb-1c7dccf559c8-1b71bf26 {
    grid-area: 1 / 2 / 2 / 3;
    justify-self: center;
  }

  #w-node-bae9e2e1-9e28-a80c-5b8d-30d5fbb0623f-1b71bf26 {
    grid-area: span 1 / span 1 / span 1 / span 1;
    place-self: stretch stretch;
  }

  #w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544e1-6043382a {
    grid-area: 1 / 5 / 2 / 10;
  }

  #w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c54541-6043382a {
    grid-area: 1 / 2 / 2 / 3;
    justify-self: center;
  }

  #w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c54544-6043382a {
    grid-area: span 1 / span 1 / span 1 / span 1;
    place-self: stretch stretch;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f727-6043382a {
    grid-area: 1 / 2 / 2 / 3;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f731-6043382a {
    grid-area: span 1 / span 2 / span 1 / span 2;
    justify-self: start;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f734-6043382a {
    grid-area: 1 / 1 / 2 / 2;
    place-self: start;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c3e-6043382a {
    grid-area: 3 / 3 / 4 / 5;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c40-6043382a {
    grid-area: 7 / 3 / 10 / 5;
    align-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4a-6043382a {
    grid-area: 4 / 4 / 5 / 5;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4b-6043382a {
    grid-area: 5 / 3 / 6 / 5;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4e-6043382a {
    grid-area: 1 / 1 / 2 / 2;
    align-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4f-6043382a {
    grid-area: 2 / 2 / 3 / 4;
    place-self: end start;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c51-6043382a {
    grid-area: 2 / 5 / 3 / 7;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c55-6043382a {
    grid-area: 2 / 4 / 3 / 5;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c71-6043382a {
    grid-area: 1 / 5 / 2 / 7;
    align-self: center;
  }

  #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee47-6043382a {
    grid-area: 2 / 4 / 7 / 8;
    align-self: start;
  }

  #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee71-6043382a {
    grid-area: 1 / 6 / 2 / 7;
    justify-self: center;
  }

  #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee76-6043382a {
    grid-area: 1 / 4 / 3 / 6;
    place-self: start;
  }

  #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee8c-6043382a {
    grid-area: 1 / 1 / 6 / 4;
    place-self: start;
  }

  #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eeea0-6043382a {
    grid-area: 3 / 1 / 4 / 4;
    align-self: start;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f51d8-6043382a {
    grid-area: 1 / 1 / 2 / 6;
    place-self: start;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f51f9-6043382a {
    grid-area: 2 / 1 / 3 / 6;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5200-6043382a {
    grid-area: 3 / 1 / 4 / 11;
    justify-self: end;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5204-6043382a {
    grid-area: 2 / 7 / 4 / 10;
    align-self: center;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5205-6043382a {
    grid-area: 1 / 6 / 2 / 11;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5206-6043382a {
    grid-area: 2 / 6 / 3 / 11;
    align-self: end;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115b1-c00f7c64 {
    grid-area: 1 / 1 / 2 / 6;
    place-self: start;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115d2-c00f7c64 {
    grid-area: 2 / 1 / 3 / 6;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115d6-c00f7c64 {
    grid-area: 3 / 1 / 4 / 11;
    justify-self: end;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115da-c00f7c64 {
    grid-area: 2 / 7 / 4 / 10;
    align-self: center;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115db-c00f7c64 {
    grid-area: 1 / 6 / 2 / 11;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115dc-c00f7c64 {
    grid-area: 2 / 6 / 3 / 11;
    align-self: end;
  }
}

@media screen and (max-width: 479px) {

  #w-node-_8855f4bd-2d1f-88a3-02bb-1c7dccf559c8-1b71bf26 {
    align-self: center;
  }

  #w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c54541-6043382a {
    align-self: center;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f71b-6043382a {
    grid-area: 1 / 1 / 2 / 3;
    place-self: start;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f727-6043382a {
    grid-area: 1 / 1 / 2 / 3;
    place-self: end start;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f72e-6043382a {
    justify-self: auto;
  }

  #w-node-_4695d165-02a1-11b2-b400-c0659512f734-6043382a {
    grid-area: 1 / 1 / 2 / 3;
    place-self: start;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c3d-6043382a {
    grid-area: 4 / 3 / 5 / 5;
    place-self: center start;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c3f-6043382a {
    grid-area: 3 / 1 / 4 / 3;
    place-self: center;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c40-6043382a {
    grid-area: 9 / 3 / 10 / 5;
    align-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c41-6043382a {
    grid-area: 1 / 3 / 2 / 7;
    justify-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c42-6043382a {
    grid-area: 5 / 2 / 6 / 4;
    align-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c43-6043382a {
    grid-area: 5 / 6 / 6 / 7;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c44-6043382a {
    grid-area: 8 / 1 / 9 / 3;
    align-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c47-6043382a {
    grid-area: 5 / 5 / 6 / 7;
    place-self: center end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c48-6043382a {
    grid-area: 5 / 3 / 6 / 7;
    place-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c49-6043382a {
    grid-area: 3 / 1 / 4 / 3;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4a-6043382a {
    grid-area: 4 / 1 / 5 / 3;
    align-self: center;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4b-6043382a {
    grid-area: 3 / 3 / 4 / 5;
    place-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4c-6043382a {
    grid-area: 7 / 1 / 8 / 3;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4e-6043382a {
    grid-area: 7 / 4 / 8 / 5;
    align-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c4f-6043382a {
    grid-area: 2 / 1 / 3 / 3;
    place-self: start;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c50-6043382a {
    grid-area: 5 / 1 / 8 / 4;
    place-self: center start;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c51-6043382a {
    grid-area: 4 / 4 / 5 / 7;
    justify-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c52-6043382a {
    grid-area: 2 / 4 / 3 / 7;
    place-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c53-6043382a {
    grid-area: 2 / 6 / 3 / 7;
    justify-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c54-6043382a {
    grid-area: 4 / 6 / 5 / 7;
    place-self: center;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c55-6043382a {
    grid-area: 2 / 3 / 3 / 5;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c56-6043382a {
    grid-area: 3 / 6 / 4 / 7;
    place-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c57-6043382a {
    grid-area: 4 / 1 / 5 / 4;
    align-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c58-6043382a {
    grid-area: 5 / 5 / 6 / 7;
    place-self: auto;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c59-6043382a {
    grid-area: 8 / 4 / 9 / 7;
    place-self: end;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c5a-6043382a {
    grid-area: 1 / 4 / 2 / 5;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c5b-6043382a {
    grid-area: 1 / 1 / 2 / 5;
    align-self: center;
  }

  #w-node-_7b061097-4bfb-3b04-3232-5a85eac65c71-6043382a {
    grid-area: 1 / 4 / 2 / 7;
    align-self: center;
  }

  #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee47-6043382a {
    grid-area: 2 / 4 / 7 / 8;
    align-self: start;
  }

  #w-node-fcff2ea8-7d66-a2b0-bc09-d7503d1eee71-6043382a {
    grid-area: 1 / 6 / 2 / 7;
    justify-self: center;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f51d8-6043382a {
    grid-area: 1 / 1 / 2 / 2;
    place-self: auto center;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f51f9-6043382a {
    grid-area: 2 / 1 / 3 / 2;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5200-6043382a {
    grid-area: 3 / 1 / 4 / 2;
    justify-self: end;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5204-6043382a {
    grid-area: 4 / 1 / 5 / 2;
    align-self: center;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5205-6043382a {
    grid-area: 4 / 1 / 5 / 2;
  }

  #w-node-_080c3784-be23-7aba-8235-93817b6f5206-6043382a {
    grid-area: 4 / 1 / 5 / 2;
    align-self: end;
  }

  #w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d62-f7ea8d24 {
    grid-area: 1 / 2 / 2 / 2;
    justify-self: end;
  }

  #w-node-a761240a-3cb4-81a9-cb21-b4a4f7ea8d6f-f7ea8d24 {
    grid-column: 1 / 2;
    grid-row-start: 2;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115b1-c00f7c64 {
    grid-area: 1 / 1 / 2 / 2;
    place-self: auto center;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115d2-c00f7c64 {
    grid-area: 2 / 1 / 3 / 2;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115d6-c00f7c64 {
    grid-area: 3 / 1 / 4 / 2;
    justify-self: end;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115da-c00f7c64 {
    grid-area: 4 / 1 / 5 / 2;
    align-self: center;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115db-c00f7c64 {
    grid-area: 4 / 1 / 5 / 2;
  }

  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115dc-c00f7c64 {
    grid-area: 4 / 1 / 5 / 2;
    align-self: end;
  }
}

/* ---------------------------------------------------------------------------
   Instagram icon in the navbar.

   It sat on row 1 in its own bordered cell, floating above the menu. Moved onto
   row 2 so it reads as the last item in the menu, flush right after CONTACT.
   CONTACT spanned to the grid's final column, so it gives up one column to make
   room. Borders removed on .navbar_usericonwrapper above.
   --------------------------------------------------------------------------- */

/* CONTACT link wrappers: previously spanned columns 11-14. Give up the last
   column so the icon has somewhere to sit without overlapping the link.
   First id is jobs/contact/privacy/terms, second is index. */
#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf55-1b71bf26,
#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c544ff-6043382a {
  grid-area: 2 / 11 / 3 / 13;
}

/* Icon wrappers: were on row 1, above the links. */
#w-node-ecf315d4-164c-10d5-76a4-a4c01b71bf59-1b71bf26,
#w-node-_834bbaea-f4f8-f838-3cb6-d4e5e0c54497-6043382a {
  grid-area: 2 / 13 / 3 / 14;
  justify-self: end;
  align-self: center;
}

/* ---------------------------------------------------------------------------
   Apply-form caption ("Tell us a bit about yourself.") — desktop only.

   The caption is placed by grid-area 3/3, so its position tracks .formgrid,
   which is width: 90vw. The form fields beside it sit in .joinusformblock,
   which is pinned at a fixed left: 14px. The two therefore drift apart as the
   window resizes: at 1280px the caption sat 37px right of the Name field, at
   1439px 11px right, and only lined up by coincidence near 1512px.

   It also had top and bottom both set, which stretched the box and pushed it
   26px down onto the Name field.

   Dropping the grid placement moves its containing block to .formgrid itself,
   so these fixed offsets hold at every desktop width: left matches the form
   boxes at 272px, top sits it beside .speechbubble, the other half of the
   callout. Below 992px the caption is display: none, so this is desktop-only.
   --------------------------------------------------------------------------- */
@media screen and (min-width: 992px) {
  /* Both pages carry this component; Webflow gave each copy its own node id. */
  #w-node-_7b0d3656-d9dc-51e5-d955-993f227115b3-c00f7c64,
  #w-node-_080c3784-be23-7aba-8235-93817b6f51da-6043382a {
    grid-area: auto;
  }

  .tellusabit {
    top: 130px;
    bottom: auto;
    left: 272px;
  }
}

/* ---------------------------------------------------------------------------
   Simple content pages: contact, privacy, terms.

   These were built during the static extraction and reuse Webflow classes whose
   positioning belongs to other layouts:
     - .heading-style-h1 carries transform: rotate(-90deg) plus top/left offsets,
       drawn for the vertical heading on the old cult-brands page.
     - .joinusform is nudged with top/left to sit inside the mac-window graphic
       on the jobs page.
   Both are reset to normal document flow here, scoped to .simple-page so the
   pages that legitimately use them are untouched.
   --------------------------------------------------------------------------- */
.simple-page {
  max-width: 46rem;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

.simple-page h2,
.simple-page h3 {
  margin-top: 2.5rem;
  margin-bottom: .5rem;
  font-size: 1.75rem;
  line-height: 1.2;
}

.simple-page .heading-style-h1 {
  transform: none;
  position: static;
  margin-bottom: 1.5rem;
  font-size: 3.2rem;
  line-height: 1.1;
}

.simple-page p {
  margin-bottom: 1rem;
  font-size: 1.0625rem;
  line-height: 1.6;
}

/* .joinusformblock is absolutely positioned on the jobs page so it can sit inside
   the mac-window graphic. Here that took the form out of flow, so the section
   never grew around it and the footer rode up over the top. */
.simple-page .joinusformblock {
  position: static;
  width: 100%;
  margin: 2rem 0;
}

.simple-page .joinusform {
  width: 100%;
  height: auto;
  position: static;
  gap: 1rem;
}

.simple-page .fieldwrapper,
.simple-page .formfield {
  width: 100%;
}

/* .formfield.name is nudged left: -19px to line up inside the jobs mac-window. */
.simple-page .formfield {
  top: 0;
  left: 0;
}

.simple-page .formfield.bio {
  min-height: 9rem;
}

.simple-page .formbutton {
  align-self: flex-start;
}

/* Stop the label being squeezed by the 100%-wide input next to it. */
.simple-page .formlabel {
  flex: none;
}

@media screen and (max-width: 767px) {
  .simple-page .heading-style-h1 {
    font-size: 2.25rem;
  }

  /* Not enough room for label and field side by side; stack them. */
  .simple-page .fieldwrapper {
    flex-direction: column;
    align-items: stretch;
  }

  .simple-page .formlabel {
    margin-bottom: .25rem;
  }
}

/* ---------------------------------------------------------------------------
   "Turn your phone" gate — scoped to phones held sideways.

   It used to key off viewport width alone (<= 767px), which was wrong in both
   directions: it fired on narrow desktop windows and on small tablets held in
   portrait, and it MISSED modern phones in landscape (an iPhone 14 on its side
   is 852px wide, well past the 767px cutoff).

   Now it keys off what actually describes a phone on its side: a touch device,
   in landscape, with a short viewport. Anything else sees the site normally.
   --------------------------------------------------------------------------- */

/* Undo the old width-only gate for the 480-767px band. */
@media screen and (min-width: 480px) and (max-width: 767px) {
  .page-wrapper {
    display: block;
  }

  .mobileblock,
  .flip-phone-lottie {
    display: none;
  }
}

/* ─────────────────────────────────────────────────────────────────────────
   W5.3 — the menu burger is now a <button>, not a <div>.

   It had to become focusable: at 991px and below the desktop navbar is
   display:none and the drawer is closed, so tabbing through index.html
   reached exactly nine elements — the logo, three external links, the four
   form fields and a footer social button pointing at "#". Contact, Jobs and
   About were unreachable from the keyboard entirely. WCAG 2.1.1 Level A.

   A <button> brings user-agent styling with it (background, border, padding,
   font, text-align, appearance). This resets those to what the <div> had, so
   the change is invisible. The border-right and the grid placement come from
   .mobile_menuburger and the #w-node rule and are deliberately NOT reset here.
   ───────────────────────────────────────────────────────────────────────── */
button.mobile_menuburger {
  -webkit-appearance: none;
  appearance: none;
  background: none;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  text-align: inherit;
  cursor: pointer;

  /* A <div> defaults to display:block; a <button> to inline-block. Without
     this the burger's computed display changed, which the oracle caught as the
     single genuine difference among 1,248 otherwise-identical elements.

     It cannot simply be `display: block` here: .mobile_menuburger sets
     display:flex inside @media (max-width: 991px), and `button.mobile_menuburger`
     (0,1,1) outranks `.mobile_menuburger` (0,1,0) whatever the source order —
     so a bare block would win at mobile too and flatten the burger. The media
     query below restores flex at the same specificity. */
  display: block;
}

@media screen and (max-width: 991px) {
  button.mobile_menuburger {
    display: flex;

    /* Same specificity trap as display: the `border: 0` above is (0,1,1) and
       beats `.mobile_menuburger { border-right: 1px solid var(--light-brown) }`
       at (0,1,0), so the divider between the burger and the logo vanished at
       mobile. The plan flags this exact declaration as one to preserve. */
    border-right: 1px solid var(--light-brown);
  }

  button.mobile_menuburger.aboutpage {
    border-right-color: var(--charcoal);
  }
}

button.mobile_menuburger:focus-visible {
  outline: 2px solid var(--charcoal);
  outline-offset: -2px;
}

/* ===== ANCHOR: phone-gate =====================================================
   DELIBERATE. Cite this block by the anchor above, never by line number — a
   line range here was wrong in CLAUDE.md and DELIBERATE.md for over a year
   (:18657-18679, in a file less than half that long) after the W3/W4 prune
   moved it.

   Hides .page-wrapper and shows .mobileblock on a touch device held in
   landscape with a short viewport: the "turn your phone" feature, NOT dead
   code. It works only because it is LAST in source order. Do not merge,
   reorder or relocate it. Harness: 72/72, proven to fail 16/72 when broken.
   ============================================================================ */
/* Re-apply it for a touch device in landscape with a short viewport. */
@media screen and (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
  .page-wrapper {
    display: none;
  }

  .mobileblock {
    z-index: 9999999;
    background-color: var(--vellum);
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100vh;
    display: flex;
    position: fixed;
    inset: 0;
  }

  .flip-phone-lottie {
    color: var(--brown);
    width: 40vw;
    max-height: 60vh;
    display: block;
  }
}