/* =====================================================================
   HOVS — styles.css   (hand-written; edit freely)
   Root: 1rem = 18px.  Breakpoints: xs <544 · sm 544–767 · md 768–991 · lg 992–1169 · xl ≥1170
   Fonts are declared in fonts.css.
   ===================================================================== */

:root {
  --black: #000;  --white: #fff;  --red: #ee1c25;  --red-dark: #e00808;  --red-badge: #d10202;
  --grey: #818181;  --grey-2: #7c7c7c;  --grey-3: #636363;  --grey-4: #777;  --line: #484848;  --thanks: #585c65;
  --sage: #93ab89;
  --ease-out-expo: cubic-bezier(.19, 1, .22, 1);
  --container-max: 1540px;  --container-pad: 50px;  --gutter: 15px;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 18px; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--white); color: var(--black); font-family: Inter, sans-serif; /* 'Inter' is never loaded — the original site inherits this fallback on <p>, real fonts sit on inner <span>s (keeps identical line metrics) */ line-height: 1.66667; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
p, h1, h2, h3 { margin: 0; font-weight: normal; }
ul { list-style: none; margin: 0; padding: 0; }
button { font: inherit; background: none; border: 0; padding: 0; cursor: pointer; color: inherit; }
[hidden] { display: none !important; }

/* ---------- page sheet (max 1440, soft shadow on wide screens) ---------- */
.sheet { position: relative; max-width: 1440px; width: 100%; margin: 0 auto; background: var(--white); box-shadow: 0 0 120px rgba(0, 0, 0, .15); }
@media (min-width: 1440px) { .sheet { margin-top: calc((100vw - 1440px) / 2); border-radius: 20px 20px 0 0; } .sheet > main { border-radius: 20px 20px 0 0; overflow: hidden; } }
@media (min-width: 1620px) { .sheet { margin-top: 90px; } }

/* ---------- grid ---------- */
.container { max-width: var(--container-max); width: 100%; margin: 0 auto; padding: 0 var(--container-pad); }
.row { display: flex; flex-wrap: wrap; margin: 0 calc(var(--gutter) * -1); }
.row--center { justify-content: center; }
.col { flex: 0 0 100%; max-width: 100%; padding: 0 var(--gutter); position: relative; overflow-wrap: break-word; }
@media (max-width: 1169.98px) { :root { --container-pad: 30px; } }
@media (max-width: 991.98px)  { :root { --gutter: 8px; } }
@media (max-width: 575.98px)  { :root { --container-pad: 20px; } }

/* ---------- reveal initial states (animated in by main.js) ---------- */
[data-reveal] { opacity: 0; }
[data-reveal="blur"] { filter: blur(6px); }
[data-reveal="title"] { filter: blur(20px); }
[data-reveal="clip"] { opacity: 1; clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
[data-reveal="wipe-right"] { opacity: 1; clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); }

/* =====================================================================
   CHROME — banner, 3-column nav, navbar, menu overlay, INDEX button
   ===================================================================== */

/* HOVS badge (top-left). <1620px: compact red pill hugging the sheet's left edge; ≥1620px: tall grey column outside the sheet
   (red 670px panel, vertical logo mark + copy, Semplice icon below), slid in by JS (.is-in). Markup: tools/db/chrome/hovs-banner.html */
.hovs-banner, .hovs-banner * { box-sizing: border-box; }
.hovs-banner { position: fixed; top: 60px; left: 0; z-index: 100; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; transition: all .6s cubic-bezier(.67, 0, .2, 1); }
.hovs-banner .banner-main-container { background: var(--red-badge); border-radius: 0 14px 14px 0; padding: 14px 28px 14px 16px; display: flex; flex-direction: row; gap: 20px; align-items: center; justify-content: flex-start; flex-shrink: 0; position: relative; overflow: hidden; transition: all .3s ease; }
.hovs-banner:hover .banner-main-container { padding: 14px 28px 14px 30px; }
.hovs-banner .logo { display: flex; flex-direction: row; gap: 16px; align-items: center; justify-content: flex-start; flex-shrink: 0; position: relative; }
.hovs-banner .logo .logo-inner { flex-shrink: 0; width: 40px; height: 41.32px; position: relative; mix-blend-mode: screen; }
.hovs-banner .logo .vector, .hovs-banner .banner-copy, .hovs-banner .semplice-icon { display: none; }
.hovs-banner .logo .vector-mobile { display: block; flex-shrink: 0; }
@media (min-width: 1620px) {
  /* fixed from the first paint (user request: stays on screen while scrolling; the original's .fixed rule was never applied).
     Being fixed in CSS — not via a JS class — matters: toggling position later would transition `left` and make the badge fly in from the viewport edge.
     Start 100px to the right (under the sheet), then .is-in eases margin-left to 0 → it slides out from underneath the sheet. */
  .hovs-banner { position: fixed; top: 90px; left: calc(50% - 720px); z-index: 0; background: #515151; border-radius: 20px 0 0 20px; flex-direction: column; transform: translateX(calc(-100% + 40px)); margin-left: 100px; transition: margin-left .6s cubic-bezier(.67, 0, .2, 1), transform .6s cubic-bezier(.67, 0, .2, 1); }
  .hovs-banner.is-in { margin-left: 0; }
  .hovs-banner:hover { transform: translateX(calc(-100% + 20px)); }
  .hovs-banner .banner-main-container { background: #d10202; border-radius: 20px 0 0 20px; padding: 20px 54px 27px 14px; flex-direction: column; height: 670px; }
  .hovs-banner:hover .banner-main-container { padding: 20px 54px 27px 14px; }
  .hovs-banner .logo { flex-direction: column; }
  .hovs-banner .logo .vector { display: block; flex-shrink: 0; width: 27px; height: 124px; position: relative; }
  .hovs-banner .logo .vector-mobile { display: none; }
  .hovs-banner .banner-copy { display: block; color: #000; text-align: left; position: relative; writing-mode: vertical-rl; }
  .hovs-banner .banner-copy div:nth-child(1) { color: #000; font-family: 'MaisonNeue-Demi', sans-serif; font-size: 15px; font-weight: 400; line-height: normal; }
  .hovs-banner .banner-copy div:nth-child(2) { color: #000; font-family: 'MaisonNeue-Medium', sans-serif; font-size: 13px; font-weight: 400; line-height: normal; }
  .hovs-banner .semplice-icon { width: 68px; height: 68px; display: flex; justify-content: center; align-items: center; flex-shrink: 0; position: relative; line-height: 0; padding: 14px; margin-right: auto; }
  .hovs-banner .semplice-icon svg { width: 36px; height: 36px; }
  .hovs-banner .semplice-icon svg path { transition: all .3s ease; }
  .hovs-banner .semplice-icon:hover svg path { fill: #a3a3a3; }
  .sheet > main { position: relative; z-index: 1; }  /* the sheet's content paints over the badge's right edge */
}
@media (max-width: 991.98px) { .hovs-banner { display: none; } }

/* 3-column navigation (top-right, hides on scroll) */
.fixed-navigation { position: absolute; top: 60px; right: calc(60px + var(--container-pad)); z-index: 40; display: flex; gap: 70px; }  /* the original sits inside the padded container: 60px + container padding */
.fixed-navigation .navigation-column { font-family: 'EngraversGothic-Bold', sans-serif; font-size: 16px; line-height: 1rem; letter-spacing: 1.4px; text-transform: uppercase; color: var(--sage); }
.fixed-navigation .navigation-column > div { transition: opacity .5s ease; }
.fixed-navigation.hidden .navigation-column > div { opacity: 0; }
.fixed-navigation ul.navigation-column-contents { margin: 10px 0 0 10px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; font-family: 'MaisonNeue-Medium', sans-serif; font-size: 21px; letter-spacing: -.21px; line-height: normal; text-transform: none; color: var(--white); }
.fixed-navigation ul.navigation-column-contents li { position: relative; transition: all .3s ease; cursor: pointer; }
.fixed-navigation ul.navigation-column-contents li:hover { transform: translateX(10px) !important; }
.fixed-navigation ul.navigation-column-contents li::before { content: '\2723'; display: inline-block; font-size: 18px; margin-right: 4px; }
.fixed-navigation ul.navigation-column-contents li:nth-child(2) { padding-left: 10px; }
.fixed-navigation ul.navigation-column-contents li:nth-child(3) { padding-left: 20px; }
.fixed-navigation .navigation-column:nth-child(1) ul li:nth-child(2)::after { content: 'DESK'; position: absolute; display: inline-block; font-size: 12px; letter-spacing: .2px; line-height: normal; color: #686868; margin-left: 4px; }
@media (max-width: 991.98px) { .fixed-navigation { display: none; } }

/* Navbar (white bar). Desktop: hidden until INDEX is clicked. Mobile: always visible. */
.navbar { position: fixed; top: 0; left: 50%; transform: translateX(-50%); width: min(calc(100% - 40px), 1400px); padding: 20px 0; z-index: 253; visibility: hidden; opacity: 0; transition: all .2s ease-out; }
.navbar.is-open { visibility: visible; opacity: 1; }
.navbar-bar { background: var(--white); border-radius: 8px 8px 0 0; box-shadow: 0 0 10px rgba(0, 0, 0, .2); padding: 14px 0; display: grid; grid-template-columns: auto 1fr auto; align-items: center; }
.navbar-back { grid-column: 1; padding-left: 20px; font-family: 'MaisonNeue-Demi', sans-serif; font-size: 14px; line-height: 1.5; letter-spacing: 1px; color: var(--grey-4); transition: color .2s ease-out; }
.navbar-back:hover { color: var(--black); }
.navbar-logo { display: none; padding-left: 20px; }
.navbar-logo img { width: 140px; }
.navbar-cta { grid-column: 3; justify-self: end; margin-right: 20px; background: var(--black); color: var(--white); font-family: 'MaisonNeue-Demi', sans-serif; font-size: 14px; line-height: 1.2; letter-spacing: 1px; padding: 14px 30px; border-radius: 8px; transition: all .2s ease-out; white-space: nowrap; }
.navbar-cta:hover { background: #222; }
.hamburger { display: none; grid-column: 3; justify-self: end; margin-right: 20px; width: 24px; height: 14px; position: relative; }
.hamburger span, .hamburger span::before, .hamburger span::after { content: ''; position: absolute; left: 0; width: 100%; height: 2px; background: var(--black); transition: all .15s ease-out; }
.hamburger span { top: 50%; transform: translateY(-50%); }
.hamburger span::before { top: -6px; } .hamburger span::after { top: 6px; }
.hamburger:hover span::after { top: 8px; }
.hamburger::after { content: ''; position: absolute; inset: -20px; }
body.overlay-active { overflow: hidden; }
.overlay-dim { position: fixed; inset: 0; z-index: 251; background: #000; opacity: 0; display: none; }  /* 50% black behind the open menu (created by main.js) */  /* scroll lock while the menu is open (original fixes the body) */
body.overlay-active .hamburger span { background: transparent; }
body.overlay-active .hamburger span::before { top: 0; transform: rotate(45deg); }
body.overlay-active .hamburger span::after { top: 0; transform: rotate(-45deg); }
@media (max-width: 991.98px) {
  .navbar { visibility: visible; opacity: 1; }
  .navbar-bar { grid-template-columns: 1fr auto; }
  .navbar-back, .navbar-cta { display: none; }
  .navbar-logo { display: block; grid-column: 1; }
  .hamburger { display: block; grid-column: 2; }
}

/* Menu overlay (red panel) */
.menu { position: fixed; top: 93px; left: 50%; transform: translateX(-50%); width: min(calc(100% - 40px), 1400px); z-index: 252; background: var(--red); border-radius: 0 0 8px 8px; padding: 0; }  /* padding lives on the inner blocks so the panel can collapse to 0 height */
.menu-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; padding: 69px 60px 60px; }  /* +9px: the panel starts 9px behind the bar, as in the original (overlay top 84px) */
.menu a span { position: relative; display: inline-block; padding-left: 20px; }
.menu-main { display: flex; flex-direction: column; gap: 40px; }
.menu-main a { font-family: 'Tobias-Regular', sans-serif; font-size: 47px; line-height: normal; letter-spacing: -1px; color: var(--black); }
.menu-main a span { text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 3px; text-underline-offset: 4px; transition: text-decoration-color .2s ease-out; }
.menu-main a:hover span { text-decoration-color: var(--black); }
.menu-main sup { position: absolute; left: 0; top: 17px; font-family: 'MaisonNeue-Book', sans-serif; font-size: 15px; line-height: 0; padding-right: 5px; vertical-align: baseline; }
.menu-main--divider { border-right: 1px solid var(--black); }
.menu-more { padding-left: 60px; align-self: start; }
.menu-more-label { font-family: 'MaisonNeue-Demi', sans-serif; font-size: 18px; letter-spacing: 2px; color: var(--black); padding-bottom: 40px; }
.menu-more ul { display: flex; flex-direction: column; gap: 15px; }
.menu-more a span { font-family: 'MaisonNeue-Book', sans-serif; font-size: 23px; line-height: normal; color: var(--black); text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 2px; transition: text-decoration-color .2s ease-out; }
.menu-more a:hover span { text-decoration-color: var(--black); }
.menu-more a span::after { content: '\2192'; position: absolute; left: -10px; top: 0; }
.menu-mobile { display: none; }
.menu-close { display: none; }
@media (max-width: 991.98px) {
  .menu { top: 50px !important; }
  .menu-grid { display: none; }
  .menu-mobile { display: grid; grid-template-columns: max-content; justify-content: center; gap: 17px; padding: 70px 60px 60px; text-align: center; }
  .menu-mobile a { display: flex; justify-content: center; font-family: Inter, sans-serif; font-size: 32px; line-height: normal; color: var(--black); }
}

/* INDEX button (appears after scrolling; opens the menu). Stacking: navbar 253 > menu 252 > dim 251 > INDEX 250 > page; PhotoSwipe (1500) covers all of them, as in the original. */
.hovs-index { position: fixed; top: 50px; right: max(36px, calc(50% - 684px)); z-index: 250; cursor: pointer; opacity: 0; pointer-events: none; margin: -30px 0; transition: all .3s ease; }
.hovs-index svg { display: block; }
.hovs-index.visible { opacity: 1; margin: 0; pointer-events: auto; }
.hovs-index.disabled { pointer-events: none; }
.hovs-index .index-button-icon, .hovs-index .index-button-font { transition: all .2s ease-out; }
.hovs-index:hover .index-button-icon { fill: var(--black); }
.hovs-index:hover .index-button-font { fill: var(--white); }
@media (min-width: 1440px) and (max-width: 1619.98px) { .hovs-index { top: calc((100vw - 1440px) / 2 + 50px); } .hovs-banner { top: calc((100vw - 1440px) / 2 + 60px); left: calc(50% - 720px); } }  /* follow the sheet offset, like the original; the compact badge is fixed on scroll (user request) */
@media (max-width: 991.98px) { .hovs-index { display: none; } }

/* =====================================================================
   PAGE HEADER
   ===================================================================== */
.page-header { background: var(--black); padding: 21.11111rem 0 15.55556rem; }
.page-sub { font-size: 1.33333rem; line-height: 1.77778rem; color: var(--grey); }
.page-sub > span { font-family: 'MaisonNeue-Book', sans-serif; }
.page-title { padding-top: 4.44444rem; font-size: 11.11111rem; line-height: 8.22222rem; letter-spacing: -.66667rem; color: var(--white); }
.page-title > span { font-family: 'Tobias-Regular', sans-serif; }
@media (min-width: 768px) and (max-width: 991.98px) { .page-header { padding: 11.11111rem 0; } }
@media (max-width: 767.98px) {
  .page-header { padding: 10rem 0 8.33333rem; }
  .page-sub { font-size: 1rem; line-height: 1.33333rem; }
  .page-title { padding-top: 2.22222rem; font-size: 8.33333rem; line-height: 8.33333rem; }
}
@media (max-width: 543.98px) { .page-title { font-size: 4.44444rem; line-height: 3.94444rem; letter-spacing: -.19444rem; } }

/* =====================================================================
   QUOTES
   ===================================================================== */
.quote { background: var(--black); filter: brightness(40%); }
.quotes .quote + .quote { padding-top: 4.44444rem; }
.quotes .quote:last-child { padding-bottom: 5.55556rem; }
.quote-attr { font-size: 1rem; line-height: 1.33333rem; }
.quote-attr > span { font-family: 'MaisonNeue-Book', sans-serif; }
.quote-author { color: var(--white); }
.quote-sep, .quote-source { color: var(--grey-2); }
.quote-body { border-left: 1px solid var(--line); padding-left: calc(var(--gutter) + 12px); }
.quote-text { font-size: 1.77778rem; line-height: 2.33333rem; letter-spacing: -.01667rem; color: var(--white); }
.quote-text > span { font-family: 'Tobias-Regular', sans-serif; }
.btn-mymind { display: flex; width: max-content; align-items: center; margin-top: 1.11111rem; font-family: 'MaisonNeue-Medium', sans-serif; font-size: .88889rem; line-height: 1; letter-spacing: -.01111rem; color: var(--grey-3); transition: color .7s var(--ease-out-expo); }
.btn-mymind img { height: 1.33333rem; width: auto; margin-right: .55556rem; }
.btn-mymind:hover { color: var(--grey-4); }
@media (min-width: 768px) {
  .quote-meta { flex-basis: 41.66667%; max-width: 41.66667%; }
  .quote-body { flex-basis: 58.33333%; max-width: 58.33333%; }
}
@media (min-width: 768px) and (max-width: 991.98px) { .quote-text { font-size: 1.66667rem; line-height: 2.11111rem; } }
@media (max-width: 767.98px) {
  .quote-meta { padding-bottom: 1.11111rem; }
  .quote-text { font-size: 1.55556rem; line-height: 2rem; }
}


/* =====================================================================
   LIGHT THEME (white pages: Books, …) — page-level overrides
   ===================================================================== */
.theme-light .page-header { background: var(--white); }
.theme-light .page-title { color: var(--black); }
.theme-light .fixed-navigation ul.navigation-column-contents { color: var(--black); }

/* =====================================================================
   BOOKS — 3-column staggered grid of covers
   ===================================================================== */
.theme-light .page-header { padding-bottom: 11.11111rem; }
@media (min-width: 768px) { .page-books .page-title { line-height: 8.88889rem; } }
.page-books .page-sub > span { letter-spacing: -.03333rem; }
.books-row { background: var(--white); padding: 0 2.77778rem; }
.books-row .container { max-width: none; padding: 0; }
.books-row .row { margin: 0; }
.book { flex: 0 0 33.33333%; max-width: 33.33333%; padding: 0 0 40px; }
.book:nth-child(2) { padding-top: 3.88889rem; }
.book:nth-child(3) { padding-top: 7.77778rem; }
.book-inner { padding: 3.88889rem 3.55556rem 0; }
.book:first-child .book-inner { border-left: 1px solid #a5a5a5; }
.book:nth-child(2), .book:nth-child(3) { border-left: 1px solid #a5a5a5; }
.book:nth-child(3) .book-inner { border-right: 1px solid #a5a5a5; }
.book-cover { display: block; border-radius: .44444rem; overflow: hidden; }
.book-cover img { width: 100%; height: auto; display: block; }
.book-text { padding: .77778rem 10% 0; text-align: center; font-size: 1rem; line-height: 1.22222rem; }
.book-text > span { font-family: 'MaisonNeue-Book', sans-serif; letter-spacing: -.01111rem; }
.book-title { color: #8e8e8e; }
.book-author { color: #aaa; }
.book .btn-mymind { margin: .88889rem auto 0; color: var(--black); }
.book .btn-mymind:hover { color: var(--grey-4); }
@media (min-width: 992px) and (max-width: 1169.98px) { .book-inner { padding-left: 2.22222rem; padding-right: 2.22222rem; } .book-text { padding: 1.77778rem 0 0; } }
@media (min-width: 768px) and (max-width: 991.98px) { .theme-light .page-header { padding: 11.11111rem 0; } .book-inner { padding-left: 1.33333rem; padding-right: 1.33333rem; } .book-text { padding: 1.66667rem 0 0; } }
@media (max-width: 767.98px) {
  .theme-light .page-header { padding: 10rem 0 6.66667rem; }
  .book { flex-basis: 100%; max-width: 100%; padding: 3.88889rem 0 40px; }
  .book:nth-child(2), .book:nth-child(3) { padding-top: 3.88889rem; }
  .book { border: 0 !important; }
  .book-inner { padding: 0 1.33333rem; border: 0 !important; }
  .book-text { padding: 1.11111rem 0 0; }
  .book-empty { display: none; }
}


/* =====================================================================
   MIXTAPES — dark grey page, featured cards + 2-col archive
   ===================================================================== */
body.page-mixtapes { background: #adadad; }
.page-mixtapes { background: #adadad; }  /* around the sheet on wide screens */
.page-mixtapes .sheet { background: #1a1c20; }
@media (min-width: 1440px) { .page-mixtapes .sheet { border-radius: 20px; margin-top: calc((100vw - 1440px) / 2); } }
@media (min-width: 1620px) { .page-mixtapes .sheet { margin-top: 90px; } }
.page-mixtapes .page-header { background: #1a1c20; padding-bottom: 11.11111rem; }
.page-mixtapes .page-sub > span { color: var(--grey-4); letter-spacing: -.02222rem; }
.page-mixtapes .page-title { line-height: 8.88889rem; }
.mix-label { font-size: 1.33333rem; line-height: 1.77778rem; padding-bottom: .77778rem; }
.mix-label > span { font-family: 'MaisonNeue-Book', sans-serif; color: #5c5c5c; letter-spacing: -.02222rem; }
.mix-section { background: #1a1c20; padding: 0 1.66667rem; }
.mix-card { padding: 3.11111rem; background: var(--card-bg, #101113); }
.mix-card .mix-cover { display: block; padding-bottom: 3.88889rem; }
.mix-card .mix-cover img { width: 100%; height: auto; display: block; }
.mix-title { font-size: 1.44444rem; line-height: 1.77778rem; }
.mix-title > span { font-family: 'MaisonNeue-Demi', sans-serif; letter-spacing: -.01111rem; color: var(--t, #fff); }
.mix-desc { padding-top: .22222rem; font-size: 1rem; line-height: 1.16667rem; }
.mix-desc > span { font-family: 'MaisonNeue-Book', sans-serif; letter-spacing: -.01111rem; color: var(--d, #7b7b7b); }
.mix-link { padding-top: 2.77778rem; font-size: 1rem; line-height: 1.16667rem; position: relative; }
.mix-link a { color: var(--l, #fff); }
.mix-link a > span { display: inline-block; position: relative; transition: all .5s var(--ease-out-expo); }
.mix-link a > span > span { font-family: 'MaisonNeue-Book', sans-serif; display: inline-block; position: relative; transition: all .5s var(--ease-out-expo); }
.mix-link a > span > span::before { content: '\2192'; position: absolute; left: 0; margin-right: 8px; opacity: 0; transform: translateX(-18px); transition: all .5s var(--ease-out-expo); }
.mix-link a > span > span:hover { padding-left: 20px; }
.mix-link a > span > span:hover::before { opacity: 1; transform: translateX(0); }
/* featured (desktop): cover as background, text bottom-left */
.mix-hero { padding: 48% 0 2.77778rem 2.77778rem; background: #101113 center / cover no-repeat; }
.mix-hero .mix-title { line-height: var(--title-lh, 1.77778rem); }
.mix-featured--second { padding-top: 2.11111rem; }
.mix-featured-m { display: none; }
.mix-featured-m--second { padding-top: 3.61111rem; }
/* archive */
.mix-archive { padding: 8.88889rem 1.66667rem 11.11111rem; background: linear-gradient(180deg, #1a1c20 70%, #000 100%); }
.mix-archive .col { flex-basis: 50%; max-width: 50%; display: flex; }
.mix-archive .mix-card { flex: 1 1 auto; width: 100%; }
.mix-archive .row + .row .col { padding-top: 1.66667rem; }
@media (max-width: 991.98px) {
  .mix-featured { display: none; }
  .mix-featured-m { display: block; }
  .mix-card { padding: 1.33333rem; }
  .mix-card .mix-cover { padding-bottom: 2.22222rem; }
  .mix-hero { padding: 48% 0 1.33333rem 1.33333rem; }
}
@media (min-width: 768px) and (max-width: 991.98px) { .mix-archive .row + .row .col { padding-top: 1.11111rem; } .page-mixtapes .page-header { padding-top: 11.11111rem; } .page-mixtapes .page-title { font-size: 8.88889rem; line-height: 7.55556rem; letter-spacing: -.52222rem; } }
@media (max-width: 767.98px) {
  .page-mixtapes .page-header { padding: 10rem 0 8.33333rem; }
  .page-mixtapes .page-sub > span { letter-spacing: -.03333rem; }
  .page-mixtapes .page-title { font-size: 6.66667rem; line-height: 5.77778rem; letter-spacing: -.35556rem; }
  .mix-label { font-size: 1rem; line-height: 1.33333rem; }
  .mix-label > span { letter-spacing: -.03333rem; }
  .mix-section { padding-left: 1.11111rem; padding-right: 1.11111rem; }
  .mix-featured-m--second { padding-top: 3.61111rem; }
  .mix-hero { padding-top: 56%; padding-bottom: 1.11111rem; padding-left: 1.11111rem; }
  .mix-archive { padding: 5.55556rem 1.11111rem 11.11111rem; }
  .mix-archive .col { flex-basis: 100%; max-width: 100%; }
  .mix-archive .row + .row .col, .mix-archive .col + .col { padding-top: 2.22222rem; }
}
@media (max-width: 543.98px) {
  .page-mixtapes .page-title { font-size: 4.44444rem; line-height: 3.94444rem; letter-spacing: -.19444rem; }
  .mix-section { padding-left: .66667rem; padding-right: .66667rem; }
  .mix-archive { padding-left: .66667rem; padding-right: .66667rem; }
}


/* =====================================================================
   PHOTOS — full-width photos with a narrow right-aligned caption
   ===================================================================== */
body.page-photos { background: #1e1e1e; }
.page-photos { background: #1e1e1e; }  /* around the sheet on wide screens */
.page-photos .sheet { background: #000; }
.page-photos .page-header { padding-bottom: 7.22222rem; }
.page-photos .page-title { line-height: 8.88889rem; letter-spacing: -.88889rem; }
.photo { background: var(--black); padding-bottom: 2.77778rem; }
.photo-img { padding-bottom: 2.77778rem; }
.photo-img a { display: block; cursor: zoom-in; }
.photo-img img { width: 100%; height: auto; display: block; }
.photo .row--end { justify-content: flex-end; }
.photo-cap { flex-basis: 25%; max-width: 25%; border-left: 1px solid var(--line); padding-left: calc(var(--gutter) + .22222rem); padding-bottom: 5.55556rem; }
.photo-cap p { font-size: 1.11111rem; line-height: 1.33333rem; }
.photo-cap p > span { font-family: 'MaisonNeue-Book', sans-serif; }
.photo-cap .cap-title { color: var(--white); }
.photo-cap .cap-meta { color: var(--grey-2); letter-spacing: -.01111rem; }
@media (min-width: 992px) and (max-width: 1169.98px) { .page-photos .page-title { font-size: 9.44444rem; line-height: 8rem; letter-spacing: -.71111rem; } .photo-cap { flex-basis: 33.33333%; max-width: 33.33333%; } }
@media (min-width: 768px) and (max-width: 991.98px) { .page-photos .page-header { padding: 11.11111rem 0 7.22222rem; } .page-photos .page-title { padding-top: 3.33333rem; font-size: 7.77778rem; line-height: 7.22222rem; letter-spacing: -.5rem; } .photo-cap { flex-basis: 41.66667%; max-width: 41.66667%; } }
@media (max-width: 767.98px) {
  .page-photos .page-header { padding: 10rem 0 8.33333rem; }
  .page-photos .page-title { font-size: 5rem; line-height: 4.77778rem; letter-spacing: -.31111rem; }
  .photo-img { padding-bottom: 1.11111rem; }
  .photo-cap { flex-basis: 100%; max-width: 100%; padding-bottom: 3.33333rem; }
  .photo-cap p { font-size: 1rem; line-height: 1.22222rem; }
}
@media (max-width: 543.98px) { .page-photos .page-title { font-size: 4.44444rem; line-height: 3.94444rem; letter-spacing: -.19444rem; } }


/* =====================================================================
   ESSENTIALS — off-white page, 3-column grid of white product cards
   ===================================================================== */
.page-essentials .sheet { background: #f4f2ee; }
@media (min-width: 1440px) { .page-essentials .sheet { border-radius: 20px; margin-top: calc((100vw - 1440px) / 2); } }
@media (min-width: 1620px) { .page-essentials .sheet { margin-top: 90px; } }
.page-essentials .page-header { background: #f4f2ee; padding-bottom: 11.11111rem; }
.page-essentials .page-sub { line-height: 1.44444rem; }
.page-essentials .page-sub > span { color: var(--grey-4); }
.page-essentials .page-title { line-height: 8.88889rem; }
.ess-row { background: #f4f2ee; padding: 0 2.22222rem; }
.ess-row .container { max-width: none; padding: 0; }
.ess-row .row { margin: 0; }
.ess-row.gradient-background { background: linear-gradient(180deg, rgba(79, 93, 138, 0) 10.54%, #4f5d8a 49.39%, #010101 79.91%), linear-gradient(180deg, rgba(167, 189, 181, 0) 0%, #a7bdb5 37.36%); background-color: #f4f2ee; }
.ess-card { flex: 0 0 33.33333%; max-width: 33.33333%; padding: 0; border: .38889rem solid transparent; display: flex; }
.ess-inner { width: 100%; padding: 3.22222rem 0 1.66667rem; border: 1px solid var(--card-border, #e0dfdb); border-radius: .22222rem; background: var(--card-bg, #fff); text-align: center; }
.ess-cat { font-size: 1.111rem; line-height: 1.444rem; }
.ess-cat > span { font-family: 'MaisonNeue-Book', sans-serif; letter-spacing: -.02222rem; color: var(--cat, #000); }
.ess-prod { font-size: 1rem; line-height: 1.444rem; }
.ess-prod > span { font-family: 'MaisonNeue-Medium', sans-serif; letter-spacing: -.02222rem; color: var(--prod, #969696); }
.ess-img { display: block; padding: 2.77778rem 0; }
.ess-img img { width: 100%; height: auto; display: block; }
/* product buttons (styles carried over from the original code modules) */
.product-buttons { display: flex; flex-direction: row; gap: 8px; align-items: center; justify-content: center; position: relative; }
.mymind-button { width: 30px; height: 30px; background: #ff5c00; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; transition: all .3s cubic-bezier(.59, 0, 0, 1); }
.mymind-button:hover { transform: scale(1.2); }
.plus-icon { flex-shrink: 0; width: 14px; height: 14px; position: relative; overflow: visible; }
.store-button, .learn-more-button { background: #f4f2ee; border-radius: 15px; padding: 5px 5px 5px 18px; display: flex; flex-direction: row; gap: 12px; align-items: center; justify-content: flex-start; flex-shrink: 0; height: 30px; position: relative; transition: all .5s ease; }
.learn-more-button.mymind { background: #000; }
.learn-more-button.semplice { background: #fff; }
.learn-more-button.carbonmade { background: #000; }
.store-link, .learn-more-link { color: #000; text-align: center; font-family: EngraversGothicBT, sans-serif; font-size: 20px; font-weight: 400; line-height: normal; letter-spacing: -.4px; text-transform: lowercase; position: relative; margin-bottom: 2px; transition: all .5s ease; }
.learn-more-button.mymind .learn-more-link, .learn-more-button.carbonmade .learn-more-link { color: #fff; }
.learn-more-button.semplice .learn-more-link { color: #000; }
.arrow-icon-container { display: flex; align-items: center; justify-content: center; align-self: stretch; flex-shrink: 0; height: auto; position: relative; overflow: visible; background-color: #fff; border-radius: 15px; padding: 6px 10px; transition: all .5s ease; }
.learn-more-button.semplice .arrow-icon-container { background-color: #000; }
.learn-more-button.semplice .arrow-icon-container svg path { stroke: #fff !important; }
.store-button:hover .arrow-icon, .learn-more-button:hover .arrow-icon { animation: slideOutInRight .25s linear; }
.store-button:hover .arrow-icon-container, .learn-more-button:hover .arrow-icon-container { padding: 6px 14px; }
.store-button:hover, .learn-more-button:hover { transform: scale(1.03); }
@keyframes slideOutInRight { 0% { transform: translate(0, 0); } 50% { transform: translate(10px, 0); opacity: 0; } 51% { transform: translate(-5px, 0); opacity: 1; } 100% { transform: translate(0, 0); } }
@media (min-width: 768px) and (max-width: 991.98px) { .page-essentials .page-header { padding-top: 11.11111rem; } .page-essentials .page-title { font-size: 8.88889rem; line-height: 7.55556rem; letter-spacing: -.52222rem; } }
@media (max-width: 991.98px) { .ess-row { padding-left: .66667rem; padding-right: .66667rem; } }
@media (max-width: 767.98px) {
  .page-essentials .page-header { padding: 10rem 0 8.33333rem; }
  .page-essentials .page-sub { line-height: 1.33333rem; }
  .page-essentials .page-title { font-size: 6.66667rem; line-height: 5.77778rem; letter-spacing: -.35556rem; }
  .ess-card { flex-basis: 100%; max-width: 100%; }
}
@media (max-width: 543.98px) { .page-essentials .page-title { font-size: 4.44444rem; line-height: 3.94444rem; letter-spacing: -.19444rem; } }


/* =====================================================================
   PRAXIS — white fullscreen hero, black press/speaking/jury sections
   ===================================================================== */
.page-praxis .sheet { background: var(--white); }
.prx-hero { background: var(--white); padding: 21.11111rem 0 4.44444rem; }
.prx-hero .container { min-height: 100svh; display: flex; flex-wrap: wrap; align-content: stretch; } /* Semplice fullscreen section: rows stretch to fill the viewport */
.prx-hero .container > .row { flex: 1 1 auto; width: 100%; align-content: flex-start; }
.prx-hero .col-10 { flex-basis: 83.33333%; max-width: 83.33333%; }
.prx-title { font-size: 11.111rem; line-height: 8.889rem; }
.prx-title > span { font-family: 'Tobias-Regular', sans-serif; letter-spacing: -.667rem; color: var(--black); }
.prx-intro { padding-top: 4.44444rem; font-size: 2.667rem; line-height: 3.111rem; }
.prx-intro > span { font-family: 'MaisonNeue-Light', sans-serif; letter-spacing: -.161rem; color: var(--black); }
.prx-intro .muted { color: #8c8c8c; }
.prx-portrait { padding-top: 5rem; padding-bottom: 3.33333rem; }
.prx-portrait img { width: 100%; height: auto; display: block; }
.prx-bio { flex-basis: 33.33333%; max-width: 33.33333%; padding-left: calc(var(--gutter) + .27778rem); padding-right: calc(var(--gutter) + .27778rem); }
.prx-credits { font-size: .833rem; line-height: .944rem; padding-bottom: 1.33333rem; }
.prx-credits > span { font-family: 'MaisonNeue-Book', sans-serif; color: #8c8c8c; }
.prx-text { font-size: 1.278rem; line-height: 1.556rem; }
.prx-text > span { font-family: 'MaisonNeue-Book', sans-serif; letter-spacing: -.022rem; color: var(--black); }
.prx-bio .prx-text { margin-bottom: 1.66667rem; }
.prx-bio .prx-text:last-child { margin-bottom: 0; }
.prx-text a { color: #1573dd; }
.prx-text a > span { color: #ffd300; }
.prx-dark { background: var(--black); }
.prx-h2 { font-size: 4.444rem; line-height: 3.889rem; }
.prx-h2 > span { font-family: 'Tobias-Regular', sans-serif; letter-spacing: -.111rem; color: var(--white); }
.prx-press-title { padding: 6.66667rem 0 3.33333rem; }
.prx-press { padding: 0 2.5rem; }
.prx-press .container { max-width: none; padding: 0; }
.prx-press .row { margin: 0; }
.prx-press .col { flex-basis: 25%; max-width: 25%; padding: 0; }
.prx-logo { padding: .27778rem; }
.prx-logo img { width: 100%; height: auto; display: block; }
.prx-speaking { padding-top: 10rem; }
.prx-speaking .prx-h2 { padding-bottom: 4.44444rem; }
.prx-lottie { width: 100%; aspect-ratio: 100 / 63; } /* Semplice rounds the ratio to 2 decimals */
.prx-lottie svg { display: block; width: 100% !important; height: auto !important; max-width: 100%; }
.prx-jury { padding: 10rem 0 11.11111rem; }
.prx-jury-text { padding-top: 2.22222rem; font-size: 4.111rem; line-height: 4.667rem; }
.prx-jury-text > span { font-family: 'MaisonNeue-Light', sans-serif; letter-spacing: -.189rem; color: #aaa; }
@media (min-width: 992px) and (max-width: 1169.98px) { .prx-title { font-size: 9.111rem; } .prx-title > span { letter-spacing: -.7rem; } .prx-intro { font-size: 2.556rem; line-height: 2.944rem; } .prx-text { font-size: 1.333rem; line-height: 1.778rem; } .prx-jury-text { font-size: 2.556rem; line-height: 2.944rem; } }
@media (max-width: 1169.98px) { .prx-press { padding: 0 1.11111rem; } }
@media (min-width: 768px) and (max-width: 991.98px) { .prx-hero { padding-top: 11.11111rem; } .prx-title { font-size: 7.222rem; line-height: 7.222rem; } .prx-title > span { letter-spacing: -.533rem; } .prx-intro { font-size: 2.556rem; line-height: 2.944rem; } .prx-text { font-size: 1rem; line-height: 1.333rem; } .prx-jury-text { font-size: 2.556rem; line-height: 2.944rem; } }
@media (max-width: 767.98px) {
  .prx-hero { padding-top: 10rem; }
  .prx-hero .col-10, .prx-bio { flex-basis: 100%; max-width: 100%; }
  .prx-title { font-size: 5.556rem; line-height: 6.111rem; } .prx-title > span { letter-spacing: -.333rem; }
  .prx-intro { padding-top: 2.55556rem; font-size: 2rem; line-height: 2.444rem; }
  .prx-text { font-size: 1rem; line-height: 1.333rem; } .prx-bio { padding-bottom: 1.11111rem; } .prx-bio:last-child { padding-bottom: 0; }
  .prx-press-title { padding-bottom: 2.22222rem; }
  .prx-h2 { font-size: 3.333rem; line-height: 3.333rem; }
  .prx-speaking { padding-top: 7.77778rem; } .prx-speaking .prx-h2 { padding-bottom: 3.33333rem; }
  .prx-jury { padding-top: 7.77778rem; } .prx-jury-text { padding-top: 1.11111rem; font-size: 2rem; line-height: 2.444rem; }
}
@media (max-width: 543.98px) {
  .prx-hero .container { min-height: 0; }
  .prx-title { font-size: 3.611rem; line-height: 3.889rem; } .prx-title > span { letter-spacing: -.2rem; }
  .prx-intro { padding-top: 2.22222rem; font-size: 1.556rem; line-height: 1.889rem; } .prx-intro > span { letter-spacing: -.083rem; }
  .prx-h2 { font-size: 2.556rem; line-height: 2.556rem; }
  .prx-speaking, .prx-jury { padding-top: 5.55556rem; }
  .prx-jury-text { padding-top: 1.05556rem; font-size: 1.556rem; line-height: 1.889rem; } .prx-jury-text > span { letter-spacing: -.083rem; }
}


/* =====================================================================
   ARTIFACTS — black page, masonry archive with lightbox
   ===================================================================== */
.page-artifacts .page-header { padding-bottom: 11.11111rem; }
.page-artifacts .page-sub > span { color: var(--grey-4); letter-spacing: -.396px; }
.page-artifacts .page-title { line-height: 8.88889rem; }
.art-link { padding-top: 2.66667rem; font-size: 1rem; line-height: 1.66667rem; }
.art-link > span { font-family: 'MaisonNeue-Light', sans-serif; color: #999; }
.art-link a { color: #ff5924; }
.art-grid { background: var(--black); padding: 0 2.77778rem 11.11111rem; }
.masonry { display: flex; flex-direction: row; position: relative; margin: 0 -2.22222rem; }
.masonry .masonry-item-width { width: 8.33333%; }
.masonry-item { width: 33.33333%; padding: 0 2.22222rem 4.44444rem; box-sizing: border-box; font-size: 0; line-height: 0; opacity: 0; transition: opacity .6s ease; }
.masonry-item.is-loaded { opacity: 1; }
.art-thumb { display: block; position: relative; cursor: zoom-in; }
.art-thumb img { width: 100%; max-width: 100%; height: auto; display: block; border-radius: 0; }
.gg-hover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); opacity: 0; transition: all .25s ease-out; cursor: zoom-in; }
.art-thumb:hover .gg-hover { opacity: 1; }
.art-caption { padding-top: .55556rem; font-family: 'MaisonNeue-Mono', sans-serif; font-size: .77778rem; line-height: 100%; color: #424242; text-transform: uppercase; text-align: left; }
@media (min-width: 768px) and (max-width: 991.98px) { .page-artifacts .page-header { padding-top: 11.11111rem; } .page-artifacts .page-title { font-size: 8.88889rem; line-height: 7.55556rem; letter-spacing: -.52222rem; } .art-grid { padding-left: 1.11111rem; padding-right: 1.11111rem; } .masonry { margin: 0 -1.38889rem; } .masonry-item { padding-left: 1.38889rem; padding-right: 1.38889rem; } }
@media (max-width: 767.98px) {
  .page-artifacts .page-header { padding: 10rem 0 8.33333rem; }
  .page-artifacts .page-title { font-size: 6.66667rem; line-height: 5.77778rem; letter-spacing: -.35556rem; }
  .art-grid { padding-left: 0; padding-right: 0; }
  .masonry { margin: 0 -.55556rem; }
  .masonry-item { width: 50%; padding-left: .55556rem; padding-right: .55556rem; }
}
@media (max-width: 543.98px) {
  .page-artifacts .page-title { font-size: 4.44444rem; line-height: 3.94444rem; letter-spacing: -.19444rem; }
  .masonry { margin: 0 -.22222rem; }
  .masonry-item { padding-left: .22222rem; padding-right: .22222rem; }
}


/* mymind artifacts: same archive, 2 columns with tighter gutters, smaller title */
.page-mymind-artifacts .page-header { padding-bottom: 11.11111rem; }
.page-mymind-artifacts .page-sub > span { color: var(--grey-4); }
.page-mymind-artifacts .page-title { font-size: 10.111rem; line-height: 8rem; }
.masonry--2col { margin: 0 -1.66667rem; }
.masonry--2col .masonry-item { width: 50%; padding: 0 1.66667rem 3.33333rem; }
@media (min-width: 768px) and (max-width: 991.98px) { .page-mymind-artifacts .page-header { padding-top: 11.11111rem; } .page-mymind-artifacts .page-title { font-size: 8.88889rem; line-height: 7.55556rem; letter-spacing: -.52222rem; } .masonry--2col { margin: 0 -1.38889rem; } .masonry--2col .masonry-item { padding-left: 1.38889rem; padding-right: 1.38889rem; } }
@media (max-width: 767.98px) { .page-mymind-artifacts .page-header { padding: 10rem 0 8.33333rem; } .page-mymind-artifacts .page-title { font-size: 6.66667rem; line-height: 5.77778rem; letter-spacing: -.35556rem; } .masonry--2col { margin: 0 -.55556rem; } .masonry--2col .masonry-item { padding-left: .55556rem; padding-right: .55556rem; } }
@media (max-width: 543.98px) { .page-mymind-artifacts .page-title { font-size: 4.44444rem; line-height: 3.94444rem; letter-spacing: -.19444rem; } .masonry--2col { margin: 0 -.22222rem; } .masonry--2col .masonry-item { padding-left: .22222rem; padding-right: .22222rem; } }


/* =====================================================================
   SIGNUP (newsletter): hero with backdrop video, Ghost form, testimonials
   ===================================================================== */
.page-signup { background: #212121; }  /* around the sheet on wide screens */
.page-signup .col-1  { flex: 0 0 calc(100%/12*1);  max-width: calc(100%/12*1); }
.page-signup .col-3  { flex: 0 0 calc(100%/12*3);  max-width: calc(100%/12*3); }
.page-signup .col-4  { flex: 0 0 calc(100%/12*4);  max-width: calc(100%/12*4); }
.page-signup .col-5  { flex: 0 0 calc(100%/12*5);  max-width: calc(100%/12*5); }
.page-signup .col-6  { flex: 0 0 calc(100%/12*6);  max-width: calc(100%/12*6); }
@media (min-width: 992px) and (max-width: 1169.98px) {
  .page-signup .col-lg-1 { flex: 0 0 calc(100%/12*1); max-width: calc(100%/12*1); }
  .page-signup .col-lg-2 { flex: 0 0 calc(100%/12*2); max-width: calc(100%/12*2); }
  .page-signup .col-lg-3 { flex: 0 0 calc(100%/12*3); max-width: calc(100%/12*3); }
  .page-signup .col-lg-4 { flex: 0 0 calc(100%/12*4); max-width: calc(100%/12*4); }
  .page-signup .col-lg-6 { flex: 0 0 calc(100%/12*6); max-width: calc(100%/12*6); }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .page-signup .col-md-2 { flex: 0 0 calc(100%/12*2); max-width: calc(100%/12*2); }
  .page-signup .col-md-4 { flex: 0 0 calc(100%/12*4); max-width: calc(100%/12*4); }
  .page-signup .col-md-8 { flex: 0 0 calc(100%/12*8); max-width: calc(100%/12*8); }
}
@media (max-width: 767.98px) { .page-signup [class*="col-"] { flex: 0 0 100%; max-width: 100%; } }

.su-hero { position: relative; overflow: hidden; background: var(--black); padding: 12.222rem 0 6.667rem; }
.su-hero .container { position: relative; }
.su-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; }
.su-bg video { display: block; width: 100%; height: 100%; object-fit: cover; }
.su-ornament { mix-blend-mode: screen; }
.su-ornament video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; }
.su-logo img { display: block; width: 100%; height: auto; }
.su-form-wrap { padding-top: 30px; }
.su-note { padding-top: 1.111rem; padding-bottom: 7.222rem; }
.su-note p { text-align: center; font-size: .889rem; line-height: 1.333rem; }
.su-note span { font-family: 'MaisonNeue-Book', sans-serif; color: #818181; letter-spacing: -.006rem; }
.su-note a { color: #ee1c25; text-decoration: none; }
.su-trio-in { padding: 0 10%; }
.su-stars img { display: block; width: 120px; height: 20px; margin: 0 auto; }
.su-review { padding-top: .556rem; text-align: center; font-size: 1.111rem; line-height: 1.444rem; }
.su-review span { font-family: 'Tobias-Regular', serif; color: #fff; }
.su-divider { background: var(--black); padding-bottom: 8.333rem; }
.su-divider img { display: block; width: 100%; height: auto; }

/* Ghost Portal form (rules from the original code module) */
.subscribe-form { display: flex; flex-direction: column; align-items: center; } /* the 30px above/below the fields are NBSP text nodes from the original markup */
.subscribe-form-fields { /* NB: the markup indents fields with non-breaking spaces (as in the original); those text nodes are flex items that space the fields */
  display: inline-flex; justify-content: center; align-items: center; gap: 8px; margin-top: 48px; }
.subscribe-form-fields input { display: flex; height: auto; width: 300px; padding: 16px 20px; align-items: center; gap: 10px; border-radius: 16px; background: #232323; color: #fff; font-family: 'MaisonNeue-Light', sans-serif; font-size: 22px; font-style: normal; font-weight: 400; line-height: 140%; letter-spacing: -.44px; border: 0; transition: all .2s linear; box-shadow: inset 0 0 0 0 #424242; }
.subscribe-form-fields input::placeholder { color: #929292; }
.subscribe-form-fields input:hover, .subscribe-form-fields input:focus { box-shadow: inset 0 0 0 1px #424242; outline: none; }
.subscribe-form-fields input:hover::placeholder { color: #fff; }
.subscribe-form-fields button { display: flex; padding: 16px 35px; justify-content: center; align-items: center; border-radius: 16px; background: #e00808; color: #fff; text-align: center; font-family: 'MaisonNeue-Book', sans-serif; font-size: 22px; font-style: normal; font-weight: 400; line-height: 140%; letter-spacing: -.44px; border: 0; transition: all .2s linear; cursor: pointer; }
.subscribe-form-fields button:hover { color: #eac6c6; background-color: #840c0c; }
.subscribe-form .message-success, .subscribe-form .message-error { display: none; margin-top: 20px; text-align: center; font-family: 'MaisonNeue-Medium', sans-serif; font-size: 16px; font-weight: 400; line-height: 140%; letter-spacing: -.48px; }
.subscribe-form .message-error { color: #818181; }
.subscribe-form .message-success { color: #a0d29e; }
.subscribe-form.success .message-success { display: block; }
.subscribe-form.success .subscribe-form-fields { display: none; }
.subscribe-form.error .message-error { display: block; }
.subscribe-form.loading button { pointer-events: none; background: #232323; color: #929292; }
@media (min-width: 768px) and (max-width: 991.98px) {
  .subscribe-form-fields button { padding: 16px 24px; }
  .subscribe-form-fields input { flex: 1; width: auto; }
}
@media (max-width: 767.98px) {
  .subscribe-form-fields { flex-direction: column; width: 100%; max-width: 400px; }
  .subscribe-form-fields input { width: 100%; }
  .subscribe-form-fields button { padding: 16px 0; width: 100%; }
}

/* testimonials */
.su-t { background: var(--black); padding: 3.333rem 8% 0 4%; filter: brightness(.4); }
.su-t--head { padding-top: 0; }
.su-t--head-md { display: none; padding-top: 0; }
.su-t--last { padding-bottom: 11.111rem; }
.su-t-title { font-size: 2rem; line-height: 2.111rem; }
.su-t-title span { font-family: 'MaisonNeue-Book', sans-serif; color: #727272; letter-spacing: -.056rem; }
.su-t-name { padding-right: calc(var(--gutter) + .667rem); }
.su-t-name p { line-height: 1.333rem; text-align: right; }
.su-t-name span { font-family: 'MaisonNeue-Book', sans-serif; color: #fff; }
.su-t-quote { padding-left: calc(var(--gutter) + .667rem); border-left: 1px solid #484848; }
.su-t-quote p { font-size: 1.778rem; line-height: 2.222rem; }
.su-t-quote span { font-family: 'Tobias-Regular', serif; color: #fff; letter-spacing: -.011rem; }
@media (min-width: 992px) and (max-width: 1169.98px) { .su-t-title { font-size: 1.222rem; line-height: 1.556rem; } }
@media (min-width: 768px) and (max-width: 991.98px) {
  .su-t--head { display: none; } .su-t--head-md { display: block; }
  .su-t-intro--md { padding-bottom: 4.444rem; }
}
@media (max-width: 767.98px) {
  .su-logo { padding-bottom: 3.333rem; }
  .su-logo-in { padding-right: 10vw; padding-left: 11vw; }
  .su-note { padding-bottom: 8.889rem; }
  .su-trio-col + .su-trio-col { padding-top: 2.222rem; }
  .su-t-intro { padding-bottom: 2.778rem; }
  .su-t-name { padding-bottom: .667rem; }
  .su-t-name p { text-align: left; }
}
@media (max-width: 543.98px) {
  .su-hero { padding-bottom: 4.444rem; }
  .su-logo-in { padding-right: .667rem; padding-left: .667rem; }
  .su-note { padding-bottom: 7.778rem; }
  .su-divider { padding-bottom: 4.444rem; }
  .su-t-title { font-size: 1.556rem; line-height: 1.889rem; }
  .su-t-quote p { font-size: 1.333rem; line-height: 1.778rem; }
}


/* =====================================================================
   HOMEPAGE (/homepage): the empty 2014 WordPress page, as rendered
   ===================================================================== */
.page-homepage { background: #fff; }
.page-homepage .sheet { background: #fff; min-height: 100vh; }
.hp-main { box-shadow: 0 0 120px rgba(0, 0, 0, .15); }
.hp-post { padding: 60px 0; }
.hp-title { padding: 25px 0; margin: 0; font-family: Inter, Arial, sans-serif; font-weight: 700; font-size: 72px; line-height: 82px; color: #000; text-align: center; overflow-wrap: break-word; }
.hp-meta { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 10px 0 40px; font-family: Inter, sans-serif; font-size: 16px; line-height: 26px; color: #777; }
.hp-gravatar { margin-right: 10px; }
.hp-sep { display: block; padding: 0 6px; }
.hp-gravatar img { display: block; width: 32px; height: 32px; }
.hp-author a { color: #000; text-decoration: none; }
.hp-body { width: calc(100%/12*8); margin: 0 auto; padding: 40px 0 10px; }
.hp-tags { width: calc(100%/12*8); margin: 0 auto; padding: 10px 0; }
.hp-comments { background: #f7f7f7; }
@media (max-width: 1169.98px) { .hp-body, .hp-tags { width: 100%; } }


/* =====================================================================
   CASE STUDIES (Mars 2020, Europa Clipper) + generic .slider
   ===================================================================== */
.cs-page .col-1  { flex: 0 0 calc(100%/12*1);  max-width: calc(100%/12*1); }
.cs-page .col-4  { flex: 0 0 calc(100%/12*4);  max-width: calc(100%/12*4); }
.cs-page .col-5  { flex: 0 0 calc(100%/12*5);  max-width: calc(100%/12*5); }
.cs-page .col-7  { flex: 0 0 calc(100%/12*7);  max-width: calc(100%/12*7); }
.cs-page .col-8  { flex: 0 0 calc(100%/12*8);  max-width: calc(100%/12*8); }
.cs-page .col-10 { flex: 0 0 calc(100%/12*10); max-width: calc(100%/12*10); }
@media (max-width: 767.98px) { .cs-page [class*="col-"] { flex: 0 0 100%; max-width: 100%; } }
.cs-page { background: #fff; }
.cs-copy p + p, .cs-closing p + p { margin-top: 1.667rem; }
.cs-logo { background: #fff; padding-top: 22.222rem; }
.cs-logo img { display: block; margin: 0 auto; }
.cs-logo .col img { width: 100%; max-width: 100%; height: auto; }
.cs-intro { background: #fff; }
.cs-intro .col { padding-top: 13.167rem; }
.cs-intro-p { font-size: 3.333rem; line-height: 3.556rem; }
.cs-intro-p span { font-family: 'MaisonNeue-Light', sans-serif; letter-spacing: -.156rem; color: #000; }
.cs-rocket { background: #fff; }
.cs-rocket img { display: block; width: 100%; height: auto; }
.cs-black { background: #020202; padding: 6.667rem 0 6.333rem; }
.cs-credits { padding-top: .5rem; }
.cs-credits p { font-size: 1rem; line-height: 1.667rem; }
.cs-credits span { font-family: 'MaisonNeue-Book', sans-serif; color: #606060; }
.cs-credits b { font-family: 'MaisonNeue-Bold', sans-serif; font-weight: normal; }
.cs-copy-p { font-size: 1.556rem; line-height: 2.333rem; }
.cs-copy-p > span { font-family: 'MaisonNeue-Book', sans-serif; color: #999; letter-spacing: -.022rem; }
.cs-copy-p .red { color: #ee1c25; } .cs-copy-p .white { color: #fff; } .cs-copy-p a { color: inherit; text-decoration: none; }
.cs-spacer { background: #020202; }
.cs-spacer-in { padding: 1.111rem 0 3.889rem; }
.cs-line { height: .056rem; background: #3a3a3a; }
.cs-gallery { background: #020202; }
.cs-photos { background: #020202; padding-bottom: 8.333rem; }
.cs-photo { padding-top: 1.667rem; }
.cs-photo img { display: block; width: 100%; max-width: 100%; height: auto; }
.cs-closing { background: #fff; padding: 6.667rem 0; }
.cs-close-p { text-align: center; font-size: 1.5rem; line-height: 1.667; }
.cs-close-p > span { font-family: 'MaisonNeue-Book', sans-serif; color: #000; }
.cs-close-p:nth-child(2) { font-size: .778rem; line-height: 2.611rem; }
.cs-close-p:nth-child(2) > span { font-family: 'MaisonNeue-Demi', sans-serif; letter-spacing: .267rem; }
.cs-close-p:nth-child(3) { line-height: .333rem; }
@media (max-width: 543.98px) {
  .cs-logo { padding-top: 8.5rem; }
  .cs-intro .col { padding-top: 9.944rem; }
  .cs-intro-p { font-size: 1.944rem; line-height: 2.611rem; }
  .page-mars2020 .cs-intro-p span { font-family: 'MaisonNeue-Book', sans-serif; letter-spacing: -.072rem; }
  .cs-rocket { padding-top: 1.778rem; }
  .page-mars2020 .cs-black { padding: 3.167rem 0 3.444rem; }
  .page-mars2020 .cs-credits { padding-top: 0; padding-bottom: 3.056rem; }
  .page-mars2020 .cs-copy-p { font-size: 1.222rem; line-height: 1.889rem; }
  .cs-photos { padding-bottom: 2.056rem; }
  .page-mars2020 .cs-closing { padding: 4.444rem 0 6.667rem; }
  .cs-close-p, .cs-close-p:nth-child(2) { font-size: 1rem; }
}

/* Europa Clipper differences */
.page-europaclipper .cs-intro-p { font-size: 2.889rem; }
.page-europaclipper .cs-intro p + p { margin-top: 1.667rem; }
.page-europaclipper .cs-rocket { padding-top: 10rem; }
.page-europaclipper .cs-closing { background: #020202; padding: 2.333rem 0 6.667rem; }
.page-europaclipper .cs-close-p > span { color: #545454; }
@media (max-width: 543.98px) { /* Europa mobile overrides — must come after the desktop overrides above */
  .page-europaclipper .cs-intro .col { padding-top: 7.333rem; }
  .page-europaclipper .cs-intro-p { font-size: 1.5rem; line-height: 1.611rem; }
  .page-europaclipper .cs-intro-p span { letter-spacing: -.106rem; }
  .page-europaclipper .cs-rocket { padding-top: 1.778rem; }
  .page-europaclipper .cs-copy-p { font-size: 1.056rem; line-height: 1.278rem; }
  .page-europaclipper .cs-copy-p > span { letter-spacing: -.017rem; }
  .page-europaclipper .cs-closing { padding-top: 4.444rem; }
  .page-europaclipper .cs-close-p > span { color: #000; } /* the original renders black-on-black here (Semplice xs variant lost the colour) */
}

/* generic slider (Semplice gallery / Flickity look-alike): click = next, drag, thin page dots, wraps around */
.slider { position: relative; }
.slider-viewport { position: relative; overflow: hidden; cursor: grab; user-select: none; -webkit-user-select: none; touch-action: pan-y; }
.slider-viewport.is-dragging { cursor: grabbing; }
.slider-track { position: relative; width: 100%; }
.slider-slide { position: absolute; top: 0; left: 0; width: 100%; will-change: transform; }
.slider-slide:first-child { position: relative; }
.slider-slide img { display: block; width: 100%; max-width: 100%; height: auto; pointer-events: none; }
.slider-prev { position: absolute; left: 15px; top: 50%; width: 44px; height: 44px; margin-top: -22px; padding: 0; border: 0; background: transparent; cursor: default; z-index: 2; }
.slider-meta { padding: 8px 0 12px; }
.slider-dots { font-size: 0; line-height: 1; text-align: left; }
.slider-dot { display: inline-block; position: relative; width: 30px; height: 2px; margin: 0 2px; padding: 0; border: 0; border-radius: 0; background: #919191; opacity: .25; cursor: pointer; }
.slider-dot::after { content: ""; position: absolute; left: 0; top: -13px; width: 100%; height: 30px; }
.slider-dot.is-selected { opacity: 1; }


/* =====================================================================
   ESCAPE MACHINE (structure; per-module sizes/paddings are GENERATED into css/escapemachine.css)
   ===================================================================== */
.page-escapemachine { background: #fff; }  /* around the sheet on wide screens; the sections themselves are black */
.em-sec { background: #020202; }
.row--end { justify-content: flex-end; }
.row--bottom { align-items: flex-end; }
.em-text { line-height: 1.667; } /* inherited default; generated .em-pN rules must outrank it */
.em-text p + p { margin-top: 1.667rem; }
.em-text a { text-decoration: none; color: inherit; }
.em-img img { display: block; max-width: 100%; height: auto; }
.em-img--full img { width: 100%; }
.em-img--center img { margin: 0 auto; }
.em-img[data-lightbox] img { cursor: zoom-in; }
.em-masonry { display: flex; flex-direction: row; position: relative; margin: 0 -15px; }
.em-masonry .masonry-item-width { width: 8.33333%; }
.em-masonry .masonry-item { padding: 0 15px 30px; box-sizing: border-box; font-size: 0; line-height: 0; opacity: 0; transition: opacity .6s ease; }
.em-masonry .masonry-item.is-loaded { opacity: 1; }
.em-gg { display: block; position: relative; cursor: zoom-in; }
.em-gg img { display: block; width: 100%; height: auto; }
.gg-tint { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .25s ease-out; }
.em-gg:hover .gg-tint { opacity: 1; }
/* before/after comparison */
.beforeafter { position: relative; overflow: hidden; user-select: none; -webkit-user-select: none; touch-action: pan-y; }
.beforeafter img { display: block; width: 100%; height: auto; pointer-events: none; }
.beforeafter .ba-after { position: absolute; top: 0; left: 0; }
.ba-handle { position: absolute; top: 0; left: 50%; height: 100%; width: 85px; transform: translateX(-50%); display: flex; cursor: pointer; z-index: 40; }
.ba-arrow { height: 100%; width: 19px; display: flex; align-items: center; justify-content: center; }
.ba-arrow svg { width: 19px; height: auto; display: block; }
.ba-arrow svg path { stroke: #ff0000; stroke-width: 2px; }
.ba-arrow--left { margin-right: 23px; }
.ba-arrow--left svg { transform: rotate(180deg); }
.ba-arrow--right { margin-left: 23px; }
.ba-bar { width: 1px; height: 100%; background: #ff0000; }


/* =====================================================================
   HOMEPAGE (/): structure + class rules ported from Semplice's page CSS.
   Per-module sizes/paddings are GENERATED into css/home.css by tools/compose_semplice.py
   ===================================================================== */
.page-home { background: #afafaf; overflow-x: hidden; }  /* colour around the sheet on wide screens (Semplice .transition-wrap) */
.page-home .sheet > main { overflow-x: hidden; }  /* clips the hero pattern rows; NOT on .sheet, which would clip the badge outside it */
.container--fluid { max-width: none; padding: 0; }
.container--fluid > .row { margin: 0; }
.container--fluid > .row > .col { padding-left: 0; padding-right: 0; }
.em-wrap { width: 100%; }
.em-video video { display: block; width: 100%; height: auto; }
.em-code { position: relative; }
.em-lottie { display: flex; }
.em-lottie--right { justify-content: flex-end; }
.em-lottie--center { justify-content: center; }
.em-lottie-box { display: block; }
.em-lottie-box svg { display: block; width: 100%; height: auto; }
.em-link { display: block; }
.em-inline-img { display: inline-block; vertical-align: middle; }
/* header pattern */
.pattern-container { opacity: .3; margin-top: -130px; }
.pattern-row { display: flex; align-items: flex-start; flex-direction: row; justify-content: center; position: absolute; min-width: 100%; }
.pattern-row:nth-child(1) { left: -2873px; }
.pattern-row:nth-child(2) { top: 170px; left: -110px; }
.pattern-row:nth-child(3) { top: 340px; left: -2873px; }
.shape svg { display: block; }
/* about divider */
.about-divider .em-wrap, .about-divider .em-c, .about-divider .em-code, .about-divider .vertical-divider-container { height: 100%; }
.about-divider .vertical-divider-container { display: flex; flex-direction: column; align-items: center; }
.about-divider .vertical-divider-line { flex: 1; width: 1px; background-color: #383838; }
.about-divider .vertical-divider-container svg { margin: 20px 0; }
/* project sections */
.column-align-height img, .column-align-height video { width: 100%; max-height: 600px; object-fit: cover; object-position: 50% 50%; }
@media (min-width: 768px) { .column-align-height { padding: 0 !important; } .column-align-height img, .column-align-height video { height: calc(600 * (100vw / 1440)) !important; } }
.column-align-height .em-code video { width: auto; max-width: none; display: inline; }  /* the original's code-module video keeps its natural aspect (inline, with the 9px baseline gap) */
.slider--lines .slider-dot { width: 50px; background: #fff; }
.slider--fade .slider-viewport { position: relative; }
.slider--fade .slider-track { position: relative; width: 100%; padding-top: calc(var(--slide-ratio, .6) * 100%); }
.slider--fade .slider-slide { position: absolute; top: 0; left: 0; width: 100%; }
.slider--fade .slider-slide:first-child { position: absolute; }
.slider--fade .slider-slide video { display: block; width: 100%; height: auto; pointer-events: none; }
/* featured essays: Semplice's hover rules target .content-wrapper/.column classes that never exist in the rendered DOM — dead in the original, so not ported */
/* artifact grids */
.artifacts-section, .artifacts-section-mobile { background: linear-gradient(180deg, #000 30.21%, #3C444E 69.79%, #CCCDC4 100%); }
.artifacts-section.last, .artifacts-section-mobile.last { background: linear-gradient(0deg, #000 30.21%, #3C444E 74.24%); }

/* =====================================================================
   FOOTER
   ===================================================================== */
.site-footer { background: var(--black); padding-top: 11.11111rem; overflow: hidden; }
.site-footer .container { max-width: 100%; padding: 0; }
.site-footer .row { margin: 0; }
.site-footer .col { padding-left: 0; padding-right: 0; }
.footer-thanks-col { flex-basis: 33.33333%; max-width: 33.33333%; }
.thanks { color: var(--thanks); text-align: center; font-size: clamp(2.44444rem, 4.2vw, 3.44444rem); line-height: 48%; letter-spacing: -.03333rem; margin-bottom: calc(4.2vw * .48); }
.thanks > span { font-family: 'Tobias-Regular', sans-serif; }
.thanks:last-child { margin-bottom: 0; }
.footer-line { padding-top: 1.66667rem; display: flex; justify-content: center; }
.footer-line img { width: 1px; height: 133px; }
.footer-logo { padding: 1.33333rem 38% 0; display: flex; justify-content: center; }
.footer-logo img { width: auto; max-width: 100%; }
@media (min-width: 992px) and (max-width: 1169.98px) { .footer-thanks-col { flex-basis: 50%; max-width: 50%; } .footer-logo { padding-left: 36%; padding-right: 36%; } }
@media (min-width: 768px) and (max-width: 991.98px) { .footer-thanks-col { flex-basis: 66.66667%; max-width: 66.66667%; } .thanks { line-height: 54%; margin-bottom: calc(4.2vw * .54); } .footer-logo { padding-left: 36%; padding-right: 37%; } }
@media (max-width: 767.98px) { .footer-thanks-col { flex-basis: 100%; max-width: 100%; padding-bottom: 5rem; } .thanks { line-height: 60%; margin-bottom: calc(4.2vw * .6); } }
@media (max-width: 543.98px) { .footer-thanks-col { padding-bottom: 4.44444rem; } .thanks { line-height: 84%; margin-bottom: calc(4.2vw * .84); } .footer-logo { padding-left: 32%; padding-right: 32%; } }

/* ---- arch footer (styles carried over from the original code module) ---- */
.footer {
	display: flex;
	flex-direction: row;
	gap: 32px;
	align-items: flex-end;
	justify-content: center;
	margin: 0 32px;
  }
  .footer .column-vector {
	width: 130px;
	height: auto;
	position: relative;
	overflow: visible;
	transform: translateY(60px);
  }
  .footer .arch {
	padding: 64px 0px 24px 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	max-width: 564px;
	width: -webkit-fill-available;
	height: 916px;
	position: relative;
  }
  .footer .arch .background {
	flex-shrink: 0;
	width: 100%;
	height: auto;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	overflow: visible;
  }
  .footer .arch .background rect {
	width: 100%;
    height: 100%;
    Y: 0;
    X: 0;
  }
  .footer .arch .inner-outline {
	flex-shrink: 0;
	width: calc(100% - 20px);
	height: auto;
	position: absolute;
	left: 50%;
	top: 20px;
	transform: translateX(-50%);
	overflow: visible;
  }
  .footer .arch .middle-outline {
	flex-shrink: 0;
	width: 100%;
	height: auto;
	position: absolute;
	left: 50%;
	top: 0px;
	transform: translateX(-50%);
	overflow: visible;
  }
  .footer .arch .outer-outline {
	flex-shrink: 0;
	width: calc(100% + 48px);;
	height: auto;
	position: absolute;
	left: 50%;
	top: -20px;
	transform: translateX(-50%);
	overflow: visible;
  }
  .footer .arch .logo {
	flex-shrink: 0;
	width: 42.64px;
	height: 44.76px;
	position: relative;
	overflow: visible;
  }
  .footer .arch .menu-container {
	padding: 90px 0px 0px 0px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	position: relative;
  }
  .footer .arch .menu-container .menu-item {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
  }
  .footer .arch .menu-container .menu-item.mobile {
	display: none;
  }
  .footer .arch .menu-container .menu-item a {
	color: #ffffff;
	text-align: center;
	font-family: "Tobias-Regular", sans-serif;
	font-size: 28px;
	font-weight: 400;
	transition: all 0.3s ease;
  }
  .footer .arch .menu-container .menu-item:hover a {
	opacity: 0.5;
  }
  .footer .arch .menu-container .menu-item a::after {
    content: '';
    position: relative;
    display: block;
    width: 0%;
	height: 1px;
	margin: auto;
    background-color: #ffffff;
    transition: width 0.5s cubic-bezier(0.08, 0.67, 0.12, 0.99);
  }
  .footer .arch .menu-container .menu-item:hover a::after {
	  width: 100%;
  }
  .footer .arch .menu-container .ellipse {
	background: #2e343c;
	border-radius: 50%;
	flex-shrink: 0;
	width: 8px;
	height: 8px;
	position: relative;
  }
  .footer .arch .menu-container .ellipse.mobile {
	display: none;
  }
  .footer .arch .lines {
	width: 90%;
	position: relative;
	overflow: visible;
  }
  @media screen and (max-width: 1169px) {
	.footer .column-vector {
	  display: none;
	}
  }
  @media screen and (max-width: 767px) {
	.footer .arch:nth-child(3) {
	  display: none;
	}
	.footer .arch .menu-container .menu-item.mobile {
	  display: flex;
	}
	.footer .arch .menu-container .ellipse.mobile {
	  display: block;
	}
  }
  @media screen and (max-width: 543px) {
	.footer {
	  margin: 0 16px;
	}
	.footer .arch {
	  height: 750px;
	}
	.footer .arch .menu-container {
	  padding: 50px 0px 0px 0px;
	}
	.footer .arch .menu-container .menu-item a {
	  font-size: 22px;
	}
  }

/* ---------- light footer (inverted): white pages get the same footer with white ground, cool light-grey arches, dark text ---------- */
.theme-light .site-footer { background: #fff; }
.theme-light .thanks { color: #9aa1aa; }
.theme-light .footer-line img { filter: invert(1); opacity: .25; }        /* the white 1px line → subtle dark */
/* the white angels-logo PNG painted in a cool light grey through a CSS mask (exact colour, no filter guessing) */
.theme-light .footer-logo img { object-position: -9999px 0; background-color: #c6ccd4; -webkit-mask: url(/assets/img/House-of-van-Schneider-angels-logo.png) center / contain no-repeat; mask: url(/assets/img/House-of-van-Schneider-angels-logo.png) center / contain no-repeat; }  /* same box as the image; its white pixels are shifted out, the tint shows through the mask */
.theme-light .footer .arch .menu-container .menu-item a { color: #8b929b; }
.theme-light .footer .arch .menu-container .menu-item a::after { background-color: #8b929b; }
.theme-light .footer .arch .menu-container .ellipse { background: #d6dbe1; }
/* SVG parts: CSS presentation properties override the inline fill/stroke/stop-color attributes */
.theme-light .footer .background stop { stop-color: #fff; }  /* arch interior fully white; the arches read through their outlines */
.theme-light .footer .inner-outline stop, .theme-light .footer .middle-outline stop, .theme-light .footer .outer-outline stop { stop-color: #d3d8de; }
.theme-light .footer .inner-outline stop:last-child, .theme-light .footer .middle-outline stop:last-child, .theme-light .footer .outer-outline stop:last-child { stop-color: #c3c9d1; }
.theme-light .footer .column-vector path, .theme-light .footer .column-vector rect { fill: #e3e7ec; }
.theme-light .footer .logo path { fill: #d0d5dc; }
.theme-light .footer .lines path, .theme-light .footer .lines line { stroke: #d6dbe1; }