/* Fixed homepage promotion slots. Independent of the Tailwind build. */
.voss-snuptoo-banner-link { display: block; border-radius: 12px; overflow: hidden; }
.voss-snuptoo-banner-link img { display: block; width: 100%; height: auto; max-height: none; }
.voss-snuptoo-banner-link:focus-visible { outline: 3px solid #12c7c9; outline-offset: 5px; }
.voss-snuptoo-mobile-info { display: none; }
@media (max-width: 600px) {
  .voss-snuptoo-mobile-info { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; padding-top: .85rem; }
  .voss-snuptoo-mobile-info p { margin: 0; font: 600 .875rem/1.5 Arial, sans-serif; }
  .voss-snuptoo-mobile-info a { display: inline-flex; align-items: center; gap: .75rem; min-height: 48px; padding: .75rem 1rem; border-radius: 999px; background: #ff625f; color: #0a2035; font: 700 .9375rem/1.4 Arial, sans-serif; text-decoration: none; }
  .voss-snuptoo-mobile-info a:focus-visible { outline: 3px solid #12c7c9; outline-offset: 4px; }
}
.voss-promo { margin: 0 0 2.5rem; color: var(--color-content); }
.voss-promo-heading { border-top: 1px solid var(--color-content); padding-top: .65rem; margin-bottom: 1.25rem; font-size: .875rem; font-weight: 700; }
.voss-promo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.voss-promo-item { display: grid; grid-template-columns: minmax(100px, .7fr) minmax(0, 1.3fr); align-items: center; gap: 1.5rem; padding: 1.5rem; border: 1px solid var(--color-stroke); background: var(--color-page-alt, var(--color-page)); min-width: 0; }
.voss-promo-item:not(:has(.voss-promo-media)) { grid-template-columns: minmax(0, 1fr); }
.voss-promo-item-banner { grid-template-columns: minmax(120px, 1fr) minmax(0, 3fr); border-top: 3px solid var(--color-accent); }
.voss-promo-media { min-width: 0; }
.voss-promo-media img { display: block; width: 100%; max-height: 220px; object-fit: contain; }
.voss-promo-copy { min-width: 0; }
.voss-promo-label { margin: 0 0 .6rem; font-size: .625rem; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; color: var(--color-content-muted); }
.voss-promo-copy h2 { margin: 0 0 .75rem; font-family: var(--font-heading); font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.2; overflow-wrap: anywhere; }
.voss-promo-content { font-size: .875rem; line-height: 1.6; overflow-wrap: anywhere; }
.voss-promo-content > * { margin: 0 0 .75rem; }
.voss-promo-content > :last-child { margin-bottom: 0; }
.voss-promo-content a { text-decoration: underline; text-underline-offset: .15em; }
.voss-promo-content a:focus-visible { outline: 2px solid var(--color-content); outline-offset: 4px; }
.voss-promo-content img, .voss-promo-content video, .voss-promo-content iframe { max-width: 100%; }
.voss-promo-content .kg-button-card { display: flex; position: static; width: auto; margin-top: 1rem; }
.voss-promo-content .kg-align-center { justify-content: center; }
.voss-promo-content .kg-align-right { justify-content: flex-end; }
.voss-promo-content .kg-btn { display: inline-flex; align-items: center; justify-content: center; padding: .7rem 1rem; min-height: 44px; max-width: 100%; white-space: normal; text-align: center; border: 1px solid currentColor; font-family: var(--font-body); font-size: .8125rem; font-weight: 700; line-height: 1.4; text-decoration: none; color: var(--color-content); background: var(--color-page); height: auto; }
.voss-promo-content .kg-btn:hover { text-decoration: underline; }
.voss-promo-books .voss-promo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.voss-promo-item-books { grid-template-columns: minmax(0, 1fr); align-content: start; }
.voss-promo-item-books .voss-promo-media img { height: 220px; }
@media (max-width: 900px) {
  .voss-promo-grid { grid-template-columns: minmax(0, 1fr); }
  .voss-promo-books .voss-promo-grid { grid-template-columns: minmax(0, 1fr); }
  .voss-promo-item-books { grid-template-columns: minmax(100px, .7fr) minmax(0, 1.3fr); }
}
@media (max-width: 480px) {
  .voss-promo-item, .voss-promo-item-banner, .voss-promo-item-books { grid-template-columns: minmax(0, 1fr); padding: 1.25rem; gap: 1rem; }
  .voss-promo-media img { max-height: 180px; }
  .voss-promo-item-books .voss-promo-media img { height: 180px; }
}

/* Homepage hierarchy: compact lead, distinct news and category sections. */
.voss-home-title { border-top: 3px solid var(--color-content); padding-top: .65rem; margin: 0 0 1.5rem; font-family: var(--font-body); font-size: .875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.voss-home-ressorts { display: flex; flex-direction: column; gap: 3rem; margin: 3rem 0; }
.voss-home-section-title { border-top: 1px solid var(--color-content); padding-top: .65rem; margin-bottom: 1.5rem; font-family: var(--font-body); font-size: 1rem; font-weight: 700; }
.voss-home-section-title a:hover { text-decoration: underline; }

@media (min-width: 1200px) {
  .voss-home-ressorts-dual { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3rem 2rem; }
}

.voss-promo-item-sidebar { grid-template-columns: minmax(0, 1fr); border-top: 3px solid var(--color-accent); }
.voss-promo-sidebar { margin: 0; }
.voss-home-ressorts section { min-width: 0; }

.voss-campaign { display: grid; grid-template-columns: 1.1fr 1fr; overflow: hidden; border: 1px solid var(--color-stroke); }
.voss-campaign-art { min-width: 0; }
.voss-campaign-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.voss-campaign-copy { padding: clamp(1.5rem, 3vw, 3rem); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.voss-campaign-brand { font-size: clamp(1.5rem, 2.8vw, 2.5rem); font-weight: 800; margin-bottom: 1rem; letter-spacing: -.04em; }
.voss-campaign-copy h2 { font-family: var(--font-heading); font-size: clamp(1.6rem, 3vw, 2.6rem); line-height: 1.12; margin: 0 0 1rem; }
.voss-campaign-copy > p:not(.voss-promo-label):not(.voss-campaign-brand):not(.voss-campaign-address) { font-size: .95rem; line-height: 1.65; margin-bottom: 1.5rem; }
.voss-campaign-snuptoo { background: #102827; color: #f7f8ef; }
.voss-campaign-snuptoo .voss-campaign-brand { color: #d6f478; }
.voss-campaign .voss-promo-label { color: inherit; opacity: .7; }
.voss-campaign .voss-campaign-button { display: inline-flex; gap: .75rem; justify-content: space-between; padding: .9rem 1.1rem; font-size: .875rem; line-height: 1.4; font-weight: 700; min-height: 48px; max-width: 100%; text-decoration: none; }
.voss-campaign-button:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
.voss-campaign-button:hover { text-decoration: underline; }
.voss-campaign-snuptoo .voss-campaign-button { background: #d6f478; color: #102827; }
.voss-campaign-thevoss { background: #211819; color: #f5e9d8; }
.voss-campaign-thevoss .voss-campaign-brand { font-family: Georgia, serif; letter-spacing: .08em; }
.voss-campaign-thevoss .voss-campaign-button { background: #f5e9d8; color: #521c25; }
.voss-campaign-address { margin-top: 1rem; font-size: .75rem; opacity: .75; }
.voss-fixed { margin: 0 0 2.5rem; border-top: 2px solid var(--color-content); padding-top: .75rem; }
.voss-fixed-heading { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; margin-bottom: 1rem; }
.voss-fixed-heading h2 { font-family: var(--font-heading); font-size: 1.5rem; line-height: 1.2; margin: 0; }
.voss-fixed-heading span { font-size: .75rem; color: var(--color-content-muted); }
.voss-comic-image { display: block; }
.voss-comic-image img { width: 100%; height: auto; display: block; object-fit: contain; }
.voss-fixed-enlarge { display: inline-block; font-size: .75rem; text-decoration: underline; margin-top: .6rem; padding-block: .4rem; }
.voss-fixed-caption { font-size: .875rem; line-height: 1.6; margin-top: .75rem; }
.voss-fixed-caption img { max-width: 100%; height: auto; }
.voss-fixed-cartoon figure { max-width: 900px; margin: 0 auto 1rem; }
.voss-fixed-cartoon figure img { display: block; max-width: 100%; width: auto; height: auto; max-height: 680px; object-fit: contain; margin: auto; }
.voss-fixed-cartoon h3 { font-size: 1.1rem; }
.voss-cartoon-placeholder { border: 1px solid var(--color-stroke); padding: 1.5rem; background: var(--color-page-alt); }
.voss-cartoon-placeholder p { font: 1.2rem var(--font-heading); margin-bottom: .5rem; }
.voss-cartoon-placeholder span { color: var(--color-content-muted); font-size: .875rem; }
@media (max-width: 767px) {
  .voss-campaign { grid-template-columns: minmax(0, 1fr); }
  .voss-campaign-art img { height: auto; aspect-ratio: 3/2; }
  .voss-fixed-heading { flex-wrap: wrap; gap: .35rem; }
}

/* Snuptoo: contemporary typographic campaign, readable at phone sizes. */
.voss-snuptoo-social { display: grid; grid-template-columns: .8fr 1.2fr; background: #f7f7f2; color: #141414; border: 1px solid #e1e1dc; border-radius: 20px; overflow: hidden; }
.voss-snuptoo-visual { min-height: 410px; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #d9f589; isolation: isolate; }
.voss-snuptoo-visual > span { position: relative; z-index: 1; font: 850 clamp(240px, 28vw, 390px)/.95 Arial, Helvetica, sans-serif; letter-spacing: -.08em; transform: rotate(-9deg); padding-right: .05em; }
.voss-snuptoo-orbit { position: absolute; width: 90%; height: 46%; border: 2px solid #141414; border-radius: 50%; transform: rotate(-35deg); }
.voss-snuptoo-dot { position: absolute; width: 62px; height: 62px; border-radius: 50%; background: #bba4ee; right: 9%; bottom: 12%; }
.voss-snuptoo-copy { padding: clamp(1.5rem, 3.5vw, 3rem); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.voss-snuptoo-topline { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; margin-bottom: 1.5rem; }
.voss-snuptoo-wordmark { font: 800 1.5rem/1 Arial, Helvetica, sans-serif; letter-spacing: -.065em; }
.voss-snuptoo-adlabel { color: #555; font: 500 .65rem/1.3 Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: .09em; }
.voss-snuptoo-copy h2 { color: #141414; font-family: Arial, Helvetica, sans-serif; font-size: clamp(1.8rem, 3.2vw, 3rem); font-weight: 800; line-height: 1.08; letter-spacing: -.045em; margin: 0 0 1.2rem; max-width: 18ch; }
.voss-snuptoo-welcome { color: #333; font: 500 clamp(1rem, 1.8vw, 1.25rem)/1.5 Arial, Helvetica, sans-serif; margin-bottom: 1.5rem; }
.voss-snuptoo-copy .voss-snuptoo-cta { display: inline-flex; align-items: center; gap: 2rem; background: #141414; color: #fff; padding: .9rem 1.3rem; border-radius: 999px; min-height: 48px; font: 700 .95rem/1.4 Arial, Helvetica, sans-serif; text-decoration: none; }
.voss-snuptoo-copy .voss-snuptoo-cta:hover { background: #353535; }
.voss-snuptoo-copy a:focus-visible { outline: 3px solid #141414; outline-offset: 5px; }
.voss-snuptoo-invite { margin-top: 1.1rem; color: #333; font: 500 .875rem/1.65 Arial, Helvetica, sans-serif; }
.voss-snuptoo-invite a { color: #141414; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) {
  .voss-snuptoo-social { grid-template-columns: minmax(0, 1fr); border-radius: 16px; }
  .voss-snuptoo-visual { min-height: 220px; height: 220px; }
  .voss-snuptoo-visual > span { font-size: 235px; }
  .voss-snuptoo-dot { width: 38px; height: 38px; bottom: 9%; right: 20%; }
  .voss-snuptoo-orbit { width: 65%; height: 60%; }
  .voss-snuptoo-copy h2 { max-width: 19ch; font-size: clamp(1.8rem, 7vw, 2.5rem); }
  .voss-snuptoo-copy { padding: 1.5rem; }
}
