/* ==========================================================================
   Valley IR — theme styles
   Colours: orange #C0362C · cream #F4EEE3 · ink #1B1A17 · ballpoint #2A45A3
   ========================================================================== */

:root {
	--vir-orange: #C0362C;
	--vir-cream: #F4EEE3;
	--vir-ink: #1B1A17;
	--vir-blue: #2A45A3;
	--vir-muted: #5E584F;
	--vir-label: 'Inter', system-ui, sans-serif;
	--vir-title: 'Baloo 2', system-ui, sans-serif;
	--vir-serif: 'Newsreader', Georgia, serif;
	--vir-display: 'Instrument Serif', Georgia, serif;
}

body { margin: 0; -webkit-font-smoothing: antialiased; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-site-blocks { padding: 0 !important; }
img, video { max-width: 100%; }

/* Layout helpers */
.vir-wrap { max-width: 1240px; margin-left: auto !important; margin-right: auto !important; padding-left: 24px; padding-right: 24px; box-sizing: border-box; }
.vir-flow0 > * { margin-block-start: 0 !important; margin-block-end: 0 !important; }
.vir-label, .vir-tag a, .vir-tag, .vir-card-kicker { font-family: var(--vir-label); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; font-weight: 700; line-height: 1.3; }
.vir-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
a:focus-visible { outline: 2px solid var(--vir-orange); outline-offset: 3px; }

/* --------------------------------------------------------------------------
   Utility strip, top bar, masthead
   -------------------------------------------------------------------------- */
.vir-strip { background: var(--vir-ink); color: var(--vir-cream); font-family: var(--vir-label); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.vir-strip p { margin: 0; padding-top: 10px; padding-bottom: 10px; }

.vir-header { position: relative; padding-top: 20px; }
.vir-topbar { display: flex; flex-wrap: wrap; gap: 8px 32px; justify-content: space-between; align-items: center; font-family: var(--vir-label); font-size: 14px; font-weight: 500; }
.vir-topbar > * { margin: 0 !important; }
.vir-nav { display: flex; flex-wrap: wrap; gap: 0 24px; }
.vir-nav a, .vir-contact a { text-decoration: none; padding: 12px 0; display: inline-block; }
.vir-nav a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--vir-orange); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.vir-contact a { padding: 12px 18px; border: 1.5px solid var(--vir-ink); }
.vir-ticker { flex: 0 1 520px; min-width: 0; }
.vir-ticker .wp-block-post-template { margin: 0; padding: 0; list-style: none; }
.vir-ticker .wp-block-post-title { margin: 0; font-family: var(--vir-label); font-size: 14px; font-weight: 400; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; color: var(--vir-muted); }
.vir-ticker .wp-block-post-title a { display: inline; text-decoration: none; color: var(--vir-muted); }
.vir-ticker .wp-block-post-title::before { content: 'New'; font-weight: 600; color: var(--vir-ink); margin-right: 8px; }

.vir-masthead { position: relative; text-align: center; padding-top: 36px; }
.vir-mast { margin: 0; line-height: 0; position: relative; }
.vir-mast a.vir-home { display: inline-block; width: min(560px, 80vw); }
.vir-mast img { display: block; width: 100%; height: auto; }
.vir-rule { border-top: 1.5px solid var(--vir-ink); border-bottom: 1px solid var(--vir-ink); height: 4px; margin-top: 36px; }

/* peeling sticker */
.vir-sticker { position: absolute; z-index: 3; top: 45px; left: calc(50% + 278px); width: 92px; height: 92px; transform: rotate(-14deg); pointer-events: none; opacity: .71; }
.vir-sticker svg { width: 100%; height: 100%; display: block; overflow: visible; }

/* tiny Golden Gate with Karl the fog, and its hover note */
.vir-bridge-tip { position: absolute; top: 7px; left: 4px; width: 120px; display: block; color: inherit; text-decoration: none; line-height: 1; }
.vir-bridge-mini { position: relative; width: 100%; height: auto; display: block; overflow: visible; }
.vir-bridge-mini path { vector-effect: non-scaling-stroke; stroke-width: 1.6px; }
.vir-fog { animation: vir-drift 16s ease-in-out infinite alternate; }
@keyframes vir-drift { from { transform: translateX(10px); } to { transform: translateX(-18px); } }
.vir-tip { position: absolute; left: 0; top: calc(100% + 10px); display: flex; align-items: center; gap: 8px; white-space: nowrap; font-family: var(--vir-display); font-size: 18px; font-style: italic; line-height: 1; rotate: -2.5deg; transform-origin: left center; color: var(--vir-ink); opacity: 0; transform: translateY(-4px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; z-index: 5; }
.vir-tip-swatch { width: 7px; height: 7px; border-radius: 50%; background: var(--vir-orange); }
.vir-bridge-tip:hover .vir-tip, .vir-bridge-tip:focus-visible .vir-tip { opacity: 1; transform: none; }

/* compact header (inner pages) */
.vir-compact { padding-top: 16px; }
.vir-compact .vir-topbar { align-items: center; }
.vir-compact .vir-home-small img { display: block; width: 150px; height: auto; }
.vir-compact .vir-rule { margin-top: 16px; }

/* --------------------------------------------------------------------------
   Lead story
   -------------------------------------------------------------------------- */
.vir-lead { padding-top: 40px; }
.vir-lead .wp-block-post-template { margin: 0; padding: 0; list-style: none; }
.vir-lead .wp-block-post { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.vir-lead-media { margin: 0 !important; position: relative; min-height: 580px; background: #6E6A64; overflow: hidden; }
.vir-lead-media img, .vir-lead-media video, .vir-lead-media a { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; object-position: 45% center; filter: grayscale(1) contrast(1.12) brightness(.96); }
.vir-lead-media::after { content: ''; position: absolute; inset: 0; box-shadow: inset 0 0 160px rgba(0,0,0,.45); background: linear-gradient(to top, rgba(0,0,0,.45), rgba(0,0,0,0) 45%); pointer-events: none; }
.vir-leadart { background: var(--vir-orange); color: var(--vir-cream); padding: 44px 44px 40px; display: flex; flex-direction: column; gap: 40px; min-height: 580px; box-sizing: border-box; margin: 0 !important; }
.vir-leadart > * { margin: 0 !important; }
.vir-leadart .vir-tag, .vir-leadart .vir-tag a { color: var(--vir-ink); text-decoration: none; }
.vir-leadart .wp-block-post-title { margin: auto 0 !important; padding-bottom: 28px; max-width: 18ch; font-size: clamp(30px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -.015em; }
.vir-leadart .wp-block-post-title a { color: var(--vir-ink); text-decoration: none; }
.vir-leadart .wp-block-post-title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }

/* the dropped ballpoint pen (optional pattern) */
.vir-pen-wrap { position: relative; height: 0; }
.vir-pen { position: absolute; z-index: 4; left: calc(50% + 5px); top: -17px; width: 300px; pointer-events: none; transform: rotate(-21deg); filter: drop-shadow(3px 7px 5px rgba(27,26,23,.28)); }
.vir-pencap { position: absolute; z-index: 4; left: calc(50% - 96px); top: 26px; width: 62px; pointer-events: none; transform: rotate(-58deg); filter: drop-shadow(2px 5px 4px rgba(27,26,23,.3)); }

/* --------------------------------------------------------------------------
   Section headings: startup title + orange rule + SF icon
   -------------------------------------------------------------------------- */
.vir-sec-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 20px; }
.vir-sec-head > * { margin: 0 !important; }
.vir-sec-title { flex: 0 1 auto; color: var(--vir-orange); font-family: var(--vir-title); font-weight: 500; font-size: clamp(36px, 4.6vw, 56px); line-height: 1; letter-spacing: -.01em; }
.vir-sec-title strong, .vir-big-title strong { font-weight: 800; }
.vir-sec-rule { flex: 1 1 24px; min-width: 24px; height: 1.5px; background: var(--vir-orange); }
.vir-sec-icon { flex: none; display: flex; }
.vir-sec-icon svg { width: 34px; height: 26px; margin-bottom: -2px; overflow: visible; }
.vir-more { text-align: right; font-family: var(--vir-label); font-size: 14px; font-weight: 500; }
.vir-more a { padding: 12px 0; display: inline-block; }

/* icon animations */
.vir-ic-cable { animation: vir-trundle 14s ease-in-out infinite; }
@keyframes vir-trundle { 0%,12% { transform: translateX(0); } 48%,62% { transform: translateX(-150px); } 98%,100% { transform: translateX(0); } }
.vir-ic-cable .vir-wheel { transform-box: fill-box; transform-origin: center; animation: vir-wheel 14s ease-in-out infinite; }
@keyframes vir-wheel { 0%,12% { transform: rotate(0); } 48%,62% { transform: rotate(-720deg); } 98%,100% { transform: rotate(0); } }
.vir-beacon { animation: vir-blink 2.4s steps(1,end) infinite; }
.vir-beacon.b2 { animation-delay: .8s; } .vir-beacon.b3 { animation-delay: 1.6s; }
@keyframes vir-blink { 0% { opacity: 1; } 35%,100% { opacity: .15; } }
.vir-steam { stroke-dasharray: 14; stroke-dashoffset: 14; opacity: 0; animation: vir-steam 6s ease-in-out infinite; }
.vir-steam.s2 { animation-delay: .9s; }
@keyframes vir-steam { 0% { stroke-dashoffset: 14; opacity: 0; transform: translateY(2px); } 20% { opacity: .9; } 55% { stroke-dashoffset: 0; opacity: .6; } 75%,100% { stroke-dashoffset: 0; opacity: 0; transform: translateY(-4px); } }

/* --------------------------------------------------------------------------
   Just Shipped: tossed, staggered cards
   -------------------------------------------------------------------------- */
.vir-recent { padding-top: 104px; }
.vir-recent .vir-more { margin: 0 0 36px; }
.vir-stag { display: flex; gap: 32px; align-items: flex-start; margin: 0; padding: 0; list-style: none; }
.vir-stag > li { min-width: 0; display: flex; flex-direction: column; gap: 22px; position: relative; transition: transform .3s ease; margin: 0 !important; }
.vir-stag > li > * { margin: 0 !important; }
.vir-stag > li:nth-child(1) { order: 2; flex: 0 0 calc(36% - 24px); transform: rotate(-1.2deg); }
.vir-stag > li:nth-child(2) { order: 1; flex: 0 0 calc(21.33% - 24px); margin-top: 150px !important; transform: rotate(1.8deg); }
.vir-stag > li:nth-child(3) { order: 3; flex: 0 0 calc(21.33% - 24px); margin-top: 56px !important; transform: rotate(-2deg); }
.vir-stag > li:nth-child(4) { order: 4; flex: 0 0 calc(21.33% - 24px); margin-top: 210px !important; transform: rotate(1.4deg); }
.vir-stag > li:hover { transform: rotate(0deg); }
.vir-thumb { position: relative; margin: 0; overflow: hidden; background: #E2DACB; aspect-ratio: 1 / 1; }
.vir-stag > li:nth-child(1) .vir-thumb { aspect-ratio: 4 / 5; }
.vir-thumb a, .vir-thumb img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; }
.vir-stag .vir-tag { position: absolute; top: 16px; left: 16px; z-index: 1; background: rgba(244,238,227,.94); padding: 6px 9px; }
.vir-stag .vir-tag a { text-decoration: none; color: var(--vir-ink); }
.vir-card-title { margin: 0; font-family: var(--vir-serif); font-weight: 400; font-size: 22px; line-height: 1.15; letter-spacing: -.01em; }
.vir-stag > li:nth-child(1) .vir-card-title { font-size: 28px; line-height: 1.14; }
.vir-card-title a { text-decoration: none; }
.vir-card-title a:hover, .vir-row:hover .wp-block-post-title a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }

/* --------------------------------------------------------------------------
   Reporter's notebook (steno pad)
   -------------------------------------------------------------------------- */
.vir-notebook { margin-top: 104px; background: #EAE3D6; }
.vir-notebook-inner { padding-top: 88px; padding-bottom: 96px; display: flex; flex-wrap: wrap; gap: 24px 40px; align-items: flex-start; }
.vir-notebook-inner > * { margin: 0 !important; }
.vir-nb-intro { flex: 1 1 220px; }
.vir-nb-intro > * { margin: 0; }
.vir-big-title { font-family: var(--vir-title); font-weight: 500; font-size: 52px; line-height: 1; letter-spacing: -.01em; margin: 0; }
.vir-nb-intro p { margin-top: 14px; font-family: var(--vir-label); font-size: 14px; line-height: 1.5; color: var(--vir-muted); max-width: 26ch; }
.vir-steno { flex: 999 1 640px; min-width: 0; position: relative; background-color: #FBF8EF; background-image: linear-gradient(to right, transparent 55px, rgba(192,54,44,.5) 55px, rgba(192,54,44,.5) 56px, transparent 56px), repeating-linear-gradient(to bottom, transparent 0, transparent 31px, rgba(42,69,163,.16) 31px, rgba(42,69,163,.16) 32px); background-position: 0 0, 0 24px; padding: 24px 32px 0 80px; box-shadow: 0 1px 2px rgba(27,26,23,.08), 0 10px 28px rgba(27,26,23,.08); box-sizing: border-box; }
.vir-steno .wp-block-post-template { margin: 0; padding: 0; list-style: none; }
.vir-steno .wp-block-post { margin: 0 0 32px !important; }
.vir-steno .wp-block-post > * { margin: 0 !important; }
.vir-steno .wp-block-post-date { font-family: var(--vir-label); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; font-weight: 700; color: var(--vir-blue); line-height: 32px; }
.vir-steno .wp-block-post-title { margin: 0 0 32px !important; font-size: 26px; line-height: 32px; letter-spacing: -.01em; }
.vir-steno .wp-block-post-title a { text-decoration: none; }
.vir-steno .wp-block-post-content, .vir-steno .wp-block-post-content p { font-size: 19px; line-height: 32px; margin: 0; }
.vir-steno .wp-block-post-content a { color: var(--vir-blue); }
.vir-steno .vir-more { text-align: left; margin: 0 0 32px; line-height: 32px; }
.vir-steno .vir-more a { padding: 0; }

/* --------------------------------------------------------------------------
   The Garage: Founders Issue (black band)
   -------------------------------------------------------------------------- */
.vir-garage { background: var(--vir-ink); color: var(--vir-cream); }
.vir-garage a { color: var(--vir-cream); }
.vir-garage-inner { padding-top: 88px; padding-bottom: 96px; }
.vir-garage-head { display: flex; flex-wrap: wrap; gap: 24px 64px; align-items: flex-end; padding-bottom: 40px; border-bottom: 1px solid rgba(244,238,227,.3); margin-bottom: 44px; }
.vir-garage-head > * { margin: 0 !important; }
.vir-garage-title { flex: 2 1 460px; min-width: 0; font-family: var(--vir-title); font-weight: 500; font-size: clamp(64px, 9vw, 120px); line-height: .9; letter-spacing: -.02em; color: var(--vir-cream); }
.vir-garage-title strong { font-weight: 800; }
.vir-garage-title small { display: block; margin-top: 14px; font-size: clamp(24px, 2.6vw, 34px); font-weight: 500; line-height: 1; letter-spacing: 0; color: #E9B8A8; }
.vir-garage-dek { flex: 1 1 260px; min-width: 0; font-size: 19px; line-height: 1.5; color: #D9D2C6; max-width: 34ch; }
.vir-garage .wp-block-post-template { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 40px 28px; margin: 0; padding: 0; list-style: none; counter-reset: vir-issue; }
.vir-garage .wp-block-post { display: flex; flex-direction: column; gap: 18px; min-width: 0; position: relative; counter-increment: vir-issue; margin: 0 !important; }
.vir-garage .wp-block-post > * { margin: 0 !important; }
.vir-garage .vir-thumb { aspect-ratio: 4 / 3; background: #2A2723; }
.vir-garage .wp-block-post::before { content: counter(vir-issue, decimal-leading-zero); position: absolute; top: 14px; left: 16px; z-index: 1; font-family: var(--vir-label); font-size: 11px; letter-spacing: .07em; font-weight: 700; color: var(--vir-cream); }
.vir-card-name { margin: 0; font-family: var(--vir-serif); font-weight: 400; font-size: 24px; line-height: 1.15; }
.vir-card-name a { text-decoration: none; color: inherit; }
.vir-card-name a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.vir-card-kicker, .vir-card-kicker a { color: inherit; text-decoration: none; }
.vir-garage .vir-card-kicker, .vir-garage .vir-card-kicker a { color: #E8806F; }
.vir-garage p { margin: 0; }
@media (min-width: 900px) {
	.vir-garage .wp-block-post + .wp-block-post { border-left: 1px solid rgba(244,238,227,.25); padding-left: 24px; }
	.vir-garage .wp-block-post + .wp-block-post::before { left: 40px; }
}

/* --------------------------------------------------------------------------
   Early Stage: From the Archives
   -------------------------------------------------------------------------- */
.vir-archive { padding-top: 112px; }
.vir-archive .vir-sec-head { margin-bottom: 40px; }
.vir-archive .wp-block-post-template { display: grid; grid-template-columns: 3fr 2fr; grid-template-rows: auto auto; gap: 20px; margin: 0; padding: 0; list-style: none; }
.vir-archive .wp-block-post { display: flex; flex-direction: column; min-width: 0; margin: 0 !important; background: var(--vir-ink); color: var(--vir-cream); }
.vir-archive .wp-block-post > * { margin: 0 !important; }
.vir-archive .wp-block-post:nth-child(1) { grid-row: span 2; min-height: 640px; }
.vir-archive .wp-block-post:nth-child(2) { background: #EFD27A; color: var(--vir-ink); }
.vir-archive .wp-block-post:nth-child(3) { background: #3F4A2E; }
.vir-archive .wp-block-post:nth-child(n+4) { display: none; }
.vir-archive .vir-thumb { flex: 1 1 auto; aspect-ratio: auto; min-height: 170px; background: #2A2723; }
.vir-archive .wp-block-post:nth-child(1) .vir-thumb { min-height: 340px; }
.vir-archive .vir-thumb a, .vir-archive .vir-thumb img { position: absolute; inset: 0; }
.vir-arch-text { display: flex; flex-direction: column; gap: 10px; padding: 20px 24px 24px; }
.vir-archive .wp-block-post:nth-child(1) .vir-arch-text { padding: 28px 32px 32px; }
.vir-arch-text > *, .vir-arch-text p { margin: 0 !important; }
.vir-archive a { color: inherit; }
.vir-archive .vir-card-name { font-family: var(--vir-display); font-size: 40px; line-height: .95; letter-spacing: -.015em; }
.vir-archive .wp-block-post:nth-child(1) .vir-card-name { font-size: 56px; }
.vir-archive .vir-card-title { font-size: 17px; line-height: 1.35; }
.vir-archive .wp-block-post:nth-child(1) .vir-card-title { font-size: 21px; }

/* --------------------------------------------------------------------------
   The napkin band
   -------------------------------------------------------------------------- */
.vir-napkin-band { margin-top: 120px; background: var(--vir-orange); color: var(--vir-cream); overflow: hidden; }
.vir-napkin-inner { padding-top: 120px; padding-bottom: 128px; display: flex; flex-wrap: wrap; gap: 72px 64px; align-items: center; }
.vir-napkin { flex: 3 1 560px; min-width: 0; position: relative; background: #F5EADB; color: var(--vir-ink); padding: clamp(40px, 6vw, 72px) clamp(24px, 5vw, 60px) clamp(52px, 7vw, 88px); transform: rotate(-3deg); border-radius: 3px; box-shadow: 0 1px 2px rgba(110,45,15,.18), 0 18px 40px rgba(110,45,15,.22); box-sizing: border-box; }
.vir-napkin-link { flex: 1 1 240px; align-self: flex-end; padding-bottom: 8px; }
.vir-napkin-link a { color: var(--vir-cream); font-family: var(--vir-display); font-size: 44px; line-height: 1.1; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 10px; display: inline-block; padding: 8px 0; }
.vir-napkin-link a:hover { color: #FFFFFF; }

/* --------------------------------------------------------------------------
   SF desk (fog band)
   -------------------------------------------------------------------------- */
.vir-sf { margin-top: 112px; background: #E5E2DB; }
.vir-sf-inner { padding-top: 80px; padding-bottom: 88px; }
.vir-sf .vir-sec-head { margin-bottom: 40px; }
.vir-sf .wp-block-post-template { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 40px 36px; margin: 0; padding: 0; list-style: none; }
.vir-sf .wp-block-post { border-top: 2px solid var(--vir-ink); padding-top: 18px; display: flex; flex-direction: column; gap: 12px; min-width: 0; margin: 0 !important; }
.vir-sf .wp-block-post > * { margin: 0 !important; }
.vir-sf-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; color: #3A3732; }
.vir-sf-meta > * { margin: 0 !important; }
.vir-sf-meta::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--vir-orange); flex: none; }
.vir-sf-meta .wp-block-post-terms a { text-decoration: none; color: #3A3732; }
.vir-sf-meta .wp-block-post-terms:not(:empty)::after { content: '·'; margin-left: 8px; }
.vir-sf-meta .wp-block-post-date { font-family: var(--vir-label); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; font-weight: 700; }
.vir-sf .wp-block-post-title { font-size: 23px; line-height: 1.18; }
.vir-sf .wp-block-post-title a { text-decoration: none; }
.vir-sf .wp-block-post-content, .vir-sf .wp-block-post-content p { font-size: 18px; line-height: 1.5; margin: 0; }
.vir-sf .wp-block-post-content a { color: var(--vir-blue); }
.vir-sf .vir-more { margin-top: 40px; }
@media (min-width: 900px) { .vir-sf .wp-block-post + .wp-block-post { position: relative; } }

/* --------------------------------------------------------------------------
   Posts: full list
   -------------------------------------------------------------------------- */
.vir-posts { padding-top: 96px; }
.vir-posts-inner { display: flex; flex-wrap: wrap; gap: 24px 40px; }
.vir-posts-inner > * { margin: 0 !important; }
.vir-posts-side { flex: 1 1 220px; }
.vir-posts-list { flex: 999 1 640px; min-width: 0; }
.vir-posts-list .wp-block-post-template { margin: 0; padding: 0; list-style: none; border-top: 1.5px solid var(--vir-ink); }
.vir-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 24px; padding: 22px 0; border-bottom: 1px solid #CFC5B3; align-items: baseline; margin: 0 !important; }
.vir-row > * { margin: 0 !important; }
.vir-row .vir-tag { grid-column: 1; }
.vir-row .vir-tag a { color: var(--vir-muted); text-decoration: none; }
.vir-row .wp-block-post-title { grid-column: 1; font-size: 24px; line-height: 1.2; letter-spacing: -.005em; }
.vir-row .wp-block-post-title a { text-decoration: none; }
.vir-row .wp-block-post-date { grid-column: 2; grid-row: 1 / span 2; font-family: var(--vir-label); font-size: 13px; color: var(--vir-muted); white-space: nowrap; align-self: center; }
.vir-pagination { margin-top: 32px; font-family: var(--vir-label); font-size: 14px; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.vir-footer { margin-top: 128px; background: var(--vir-ink); color: var(--vir-cream); }
.vir-footer a { color: var(--vir-cream); }
.vir-footer-top { padding-top: 64px; padding-bottom: 36px; display: flex; flex-wrap: wrap; gap: 32px; justify-content: space-between; align-items: end; }
.vir-footer-top > * { margin: 0 !important; }
.vir-footer-mark { display: block; width: clamp(220px, 30vw, 340px); }
.vir-footer-mark img { display: block; width: 100%; height: auto; }
.vir-footer-nav { display: flex; flex-wrap: wrap; gap: 4px 24px; font-family: var(--vir-label); font-size: 14px; }
.vir-footer-nav a { padding: 12px 0; display: inline-block; }
.vir-credit { padding-bottom: 40px; font-family: var(--vir-label); font-size: 13px; color: #BDB5A6; margin: 0; }

/* --------------------------------------------------------------------------
   Article pages
   -------------------------------------------------------------------------- */
.vir-article { padding-top: 72px; }
.vir-article-head { max-width: 860px; margin: 0 auto; text-align: left; }
.vir-article-head > * { margin: 0 !important; }
.vir-article-head .vir-tag a { color: var(--vir-orange); text-decoration: none; }
.vir-article-head .wp-block-post-title { margin-top: 18px !important; font-size: clamp(36px, 5vw, 60px); line-height: 1.08; letter-spacing: -.015em; }
.vir-article-head .wp-block-post-date { margin-top: 20px !important; font-family: var(--vir-label); font-size: 14px; color: var(--vir-muted); }
.vir-article-image { max-width: 1240px; margin: 48px auto 0 !important; }
.vir-article-image img { width: 100%; height: auto; display: block; }
.vir-article-body { margin-top: 56px !important; }
.vir-article-body > * { max-width: 680px; margin-left: auto !important; margin-right: auto !important; }
.vir-article-body > .alignwide { max-width: 1240px; }
.vir-article-body > .alignfull { max-width: none; }
.vir-article-body p, .vir-article-body li { font-size: 20px; line-height: 1.65; }
.vir-article-body a { color: var(--vir-blue); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.vir-article-body h2 { font-size: 32px; margin-top: 56px; }
.vir-article-body h3 { font-size: 24px; margin-top: 40px; }
.vir-article-body figcaption { font-family: var(--vir-label); font-size: 13px; color: var(--vir-muted); }
.vir-article-body blockquote { margin-left: auto; margin-right: auto; }
.vir-related { padding-top: 104px; }
.vir-related .wp-block-post-template { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 32px; margin: 0; padding: 0; list-style: none; }
.vir-related .wp-block-post { display: flex; flex-direction: column; gap: 16px; margin: 0 !important; }
.vir-related .wp-block-post > * { margin: 0 !important; }
.vir-related .vir-thumb { aspect-ratio: 4 / 3; }
.vir-related .vir-tag a { color: var(--vir-muted); text-decoration: none; }

/* page + about */
.vir-page { max-width: 860px; margin: 0 auto; padding-top: 96px; }
.vir-page > * { margin-left: 0; margin-right: 0; }
.vir-page .wp-block-post-title { font-family: var(--vir-title); font-weight: 800; font-size: 56px; line-height: 1; margin: 0 0 32px; }
.vir-page p { font-size: 21px; line-height: 1.6; }
.vir-kicker { font-family: var(--vir-label); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--vir-muted); }
.vir-3am { margin-top: 96px; background: var(--vir-ink); color: var(--vir-cream); }
.vir-3am-inner { padding-top: 96px; padding-bottom: 104px; display: flex; flex-wrap: wrap; gap: 24px 56px; align-items: flex-end; }
.vir-3am-inner > * { margin: 0 !important; }
.vir-3am-big { flex: 3 1 520px; min-width: 0; font-family: var(--vir-display); font-style: italic; font-size: clamp(64px, 17vw, 184px); line-height: .88; letter-spacing: -.02em; }
.vir-3am-big span { font-style: normal; }
.vir-3am-note { flex: 1 1 260px; min-width: 0; font-family: var(--vir-label); font-size: 14px; line-height: 1.5; color: #BDB5A6; padding-bottom: 14px; }
.vir-years { padding-top: 104px; }
.vir-years-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 20px; font-family: var(--vir-display); font-size: clamp(30px, 5.4vw, 76px); line-height: 1.05; letter-spacing: -.01em; margin: 0; }
.vir-years-note { margin: 24px 0 0; font-family: var(--vir-label); font-size: 14px; line-height: 1.5; color: var(--vir-muted); max-width: 52ch; }
.vir-lookin { margin-top: 104px; background: #E5E2DB; }
.vir-lookin-inner { padding-top: 88px; padding-bottom: 96px; display: flex; flex-wrap: wrap; gap: 48px 64px; align-items: center; }
.vir-lookin-inner > * { margin: 0 !important; flex: 1 1 320px; min-width: 0; }
.vir-lookin-title { font-family: var(--vir-display); font-size: 48px; line-height: 1.05; margin: 0 0 16px; }
.vir-beats { background: var(--vir-orange); color: var(--vir-cream); }
.vir-beats-inner { padding-top: 28px; padding-bottom: 28px; display: flex; flex-wrap: wrap; gap: 8px 40px; align-items: center; justify-content: center; }
.vir-beats-inner > * { margin: 0 !important; }
.vir-beats h2 { font-family: var(--vir-label); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; }
.vir-beats-list { display: flex; flex-wrap: wrap; gap: 0 28px; font-family: var(--vir-display); font-size: clamp(24px, 3vw, 32px); line-height: 1.2; }
.vir-beats-list a { color: var(--vir-cream); text-decoration: none; padding: 8px 0; }
.vir-beats-list a:nth-child(even) { font-style: italic; }
.vir-contact-block { max-width: 860px; margin: 0 auto; padding-top: 64px; font-family: var(--vir-label); font-size: 15px; line-height: 1.7; color: #3A3732; }
.vir-contact-block p { margin: 0; }

/* archive headers + 404 */
.vir-archive-head { padding-top: 88px; }
.vir-archive-head .wp-block-query-title, .vir-archive-head h1 { font-family: var(--vir-title); font-weight: 800; font-size: clamp(40px, 6vw, 72px); line-height: 1; margin: 0; color: var(--vir-orange); }
.vir-archive-head p { font-family: var(--vir-label); font-size: 14px; color: var(--vir-muted); }
.vir-404 { padding-top: 120px; text-align: left; }
.vir-404 h1 { font-family: var(--vir-title); font-weight: 800; font-size: clamp(56px, 10vw, 140px); line-height: .9; color: var(--vir-orange); margin: 0 0 24px; }

/* --------------------------------------------------------------------------
   Phones and tablets
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
	.vir-sticker { width: 68px; height: 68px; top: -2px; left: auto; right: 6px; }
	.vir-bridge-tip { position: relative; top: auto; left: auto; width: 96px; margin: 14px auto 0; }
	.vir-tip { left: 50%; transform: translate(-50%, -4px); }
	.vir-bridge-tip:hover .vir-tip { transform: translateX(-50%); }
	.vir-mast { display: flex; flex-direction: column-reverse; align-items: center; }
	.vir-stag { flex-wrap: wrap; gap: 48px; }
	.vir-stag > li:nth-child(n) { order: 0; flex: 1 1 100%; margin-top: 0 !important; }
	.vir-stag .vir-thumb, .vir-stag > li:nth-child(1) .vir-thumb { aspect-ratio: 4 / 3; }
	.vir-archive .wp-block-post-template { grid-template-columns: 1fr; }
	.vir-archive .wp-block-post:nth-child(1) { grid-row: auto; min-height: 0; }
}
@media (max-width: 720px) {
	.vir-hide-sm, .vir-ticker { display: none !important; }
	.vir-lead-media { min-height: 300px; }
	.vir-leadart { min-height: 0; padding: 32px 24px 28px; gap: 28px; }
	.vir-pen { width: 190px; left: auto; right: 8px; top: -22px; }
	.vir-pencap { display: none; }
	.vir-row { grid-template-columns: 1fr; }
	.vir-row .wp-block-post-date { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.vir-fog, .vir-ic-cable, .vir-ic-cable .vir-wheel, .vir-beacon, .vir-steam { animation: none !important; }
	.vir-steam { opacity: 0; }
	.vir-stag > li, .vir-tip { transition: none; }
}

/* Hide empty labels, and hide whole sections until they have something in them */
.vir-tag:empty, .vir-card-kicker:empty { display: none !important; }
.vir-notebook:not(:has(.wp-block-post)),
.vir-garage:not(:has(.wp-block-post)),
.vir-archive:not(:has(.wp-block-post)),
.vir-sf:not(:has(.wp-block-post)),
.vir-recent:not(:has(.wp-block-post)) { display: none; }
