/* VINKS — Interior pages (hero + editable prose). Tailwind (Play CDN) layered on top per-page. */

/* ---- hero ---- */
.vk-ihero { position: relative; min-height: 70svh; display: flex; align-items: flex-end; overflow: hidden; background-color: var(--vk-bg-photo); background-size: cover; background-position: center; }
.vk-ihero.is-plain { min-height: 44svh; background-color: var(--vk-bg); }
.vk-ihero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(8,8,9,0.96) 8%, rgba(8,8,9,0.2) 55%, rgba(8,8,9,0.55)); }
.vk-ihero.is-plain::after { display: none; }
.vk-ihero__in { position: relative; z-index: 2; width: 100%; padding: 0 var(--vk-gutter) clamp(40px,8vw,90px); }
.vk-ihero.is-plain .vk-ihero__in { padding-top: clamp(80px,14vw,150px); }
.vk-ihero__title { font-family: var(--vk-serif); font-weight: 500; text-transform: uppercase; color: var(--vk-white); font-size: clamp(44px,12vw,140px); line-height: 0.86; letter-spacing: -0.01em; margin: 14px 0 0; }

/* ---- prose (readable defaults; founder adds Tailwind for custom layouts) ---- */
.vk-prose { padding: clamp(48px,8vw,96px) 0; }
.vk-prose h2 { font-family: var(--vk-serif); font-weight: 500; text-transform: uppercase; color: var(--vk-white); font-size: clamp(26px,5vw,44px); line-height: 1.02; margin: 1.6em 0 0.5em; }
.vk-prose h3 { font-family: var(--vk-serif); font-weight: 500; color: var(--vk-white); font-size: clamp(20px,3.5vw,28px); margin: 1.4em 0 0.4em; }
.vk-prose p, .vk-prose li { color: var(--vk-text); font-weight: 300; font-size: 16px; line-height: 1.85; }
.vk-prose p { margin: 0 0 1.1em; }
.vk-prose a { color: var(--vk-white); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--vk-line-strong); }
.vk-prose a:hover { text-decoration-color: var(--vk-silver); }
.vk-prose ul, .vk-prose ol { padding-left: 1.2em; margin: 1em 0; }
.vk-prose li { margin: 0.4em 0; }
.vk-prose strong { color: var(--vk-white); font-weight: 500; }
.vk-prose img { width: 100%; height: auto; margin: 1.6em 0; }
.vk-prose hr { border: 0; border-top: 1px solid var(--vk-line); margin: 2.6em 0; }
.vk-prose table { width: 100%; border-collapse: collapse; margin: 1.6em 0; }
.vk-prose th, .vk-prose td { text-align: left; padding: 12px 10px; border-bottom: 1px solid var(--vk-line); color: var(--vk-text); }
.vk-prose th { color: var(--vk-text-dim); text-transform: uppercase; font-size: 11px; letter-spacing: 0.12em; font-weight: 500; }
.vk-prose details { border-top: 1px solid var(--vk-line); padding: 16px 0; }
.vk-prose summary { cursor: pointer; color: var(--vk-white); font-family: var(--vk-sans); font-weight: 500; letter-spacing: 0.04em; list-style: none; }
.vk-prose summary::-webkit-details-marker { display: none; }
.vk-prose details[open] summary { margin-bottom: 10px; }
/* readable column helper (used by legal pages) */
.vk-prose .vk-readable { max-width: 760px; margin-inline: auto; }

/* ============ BRAND / ABOUT PAGE (editorial, gold accent) ============ */
.vk-brand { --gold:var(--vk-gold); --gold-soft:rgba(194,160,99,.45); color:var(--vk-text); }
.vk-brand h1, .vk-brand h2, .vk-brand h3, .vk-brand p { margin:0; }
.vk-brand .kicker { font-family:var(--vk-sans); font-weight:500; font-size:11px; letter-spacing:.34em; text-transform:uppercase; color:var(--vk-accent); display:inline-flex; align-items:center; gap:14px; }
.vk-brand .kicker.is-center { justify-content:center; }
.vk-brand .kicker::before { content:""; width:34px; height:1px; background:var(--vk-accent); opacity:.8; }
/* limited-edition contexts stay gold regardless of drop phase */
.vk-brand .gold .kicker { color:var(--gold); }
.vk-brand .gold .kicker::before { background:var(--gold); }

/* brand page: replace shared template hero with a type-only cinematic hero */
.page-id-13 .vk-ihero { display:none; }
.page-id-13 .vk-prose { padding-top:0; }

/* opening statement = hero */
.vk-brand .lead { min-height:84svh; display:flex; flex-direction:column; justify-content:center; padding:clamp(100px,15vh,190px) 0 clamp(44px,7vw,84px); border-bottom:1px solid var(--vk-line); }
.vk-brand .lead h1 { font-family:var(--vk-serif); color:var(--vk-white); font-weight:500; font-style:italic; font-size:clamp(38px,8.2vw,104px); line-height:1.02; letter-spacing:-.015em; max-width:17ch; margin-top:30px; }
.vk-brand .lead h1 em { font-style:normal; color:var(--vk-accent); }
@keyframes vkbUp { from{opacity:0; transform:translateY(22px);} to{opacity:1; transform:none;} }
.vk-brand .lead .kicker { animation:vkbUp .9s cubic-bezier(.2,.7,.2,1) both; }
.vk-brand .lead h1 { animation:vkbUp 1.05s cubic-bezier(.2,.7,.2,1) .12s both; }

/* intro */
.vk-brand .intro { display:grid; gap:clamp(18px,3.5vw,56px); grid-template-columns:1fr; padding:clamp(48px,8vw,96px) 0; }
@media (min-width:880px) { .vk-brand .intro { grid-template-columns:.62fr 1.38fr; align-items:start; } }
.vk-brand .intro p { font-family:var(--vk-serif); font-weight:400; font-size:clamp(21px,2.9vw,33px); line-height:1.45; color:var(--vk-text); }
.vk-brand .intro p b { color:var(--vk-white); font-weight:500; }

/* chapters */
.vk-brand .chapter { display:grid; gap:clamp(24px,5vw,72px); grid-template-columns:1fr; align-items:center; padding:clamp(40px,7vw,84px) 0; }
@media (min-width:880px) { .vk-brand .chapter { grid-template-columns:1.05fr 1fr; } .vk-brand .chapter.rev .fig { order:2; } }
.vk-brand .fig { position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--vk-bg-photo); }
.vk-brand .fig img { width:100%; height:100%; object-fit:cover; transition:transform 1.5s cubic-bezier(.2,.7,.2,1); }
.vk-brand .chapter:hover .fig img { transform:scale(1.05); }
.vk-brand .idx { font-family:var(--vk-serif); font-size:clamp(64px,9vw,128px); line-height:.8; color:transparent; -webkit-text-stroke:1px var(--vk-accent); display:block; margin-bottom:6px; }
.vk-brand .chapter h2 { font-family:var(--vk-serif); color:var(--vk-white); font-weight:500; text-transform:uppercase; line-height:.94; letter-spacing:-.01em; font-size:clamp(34px,6vw,62px); margin:14px 0 22px; }
.vk-brand .chapter .body { font-weight:300; font-size:16px; line-height:1.9; color:var(--vk-text); max-width:46ch; }
.vk-brand .ekick { font-family:var(--vk-sans); font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--vk-text-dim); }

/* exclusive / gold section */
.vk-brand .gold { position:relative; text-align:center; padding:clamp(56px,9vw,116px) clamp(22px,5vw,72px); margin:clamp(36px,6vw,72px) 0; border:1px solid var(--gold-soft); }
.vk-brand .gold .corner { position:absolute; width:12px; height:12px; border:1px solid var(--gold); }
.vk-brand .gold .corner.tl { top:-1px; left:-1px; border-right:0; border-bottom:0; }
.vk-brand .gold .corner.tr { top:-1px; right:-1px; border-left:0; border-bottom:0; }
.vk-brand .gold .corner.bl { bottom:-1px; left:-1px; border-right:0; border-top:0; }
.vk-brand .gold .corner.br { bottom:-1px; right:-1px; border-left:0; border-top:0; }
.vk-brand .gold .num { font-family:var(--vk-serif); color:var(--gold); font-size:clamp(56px,12vw,148px); line-height:1; letter-spacing:.02em; margin-top:22px; }
.vk-brand .gold h2 { font-family:var(--vk-serif); color:var(--vk-white); font-weight:500; text-transform:uppercase; line-height:.96; font-size:clamp(30px,6vw,56px); margin:18px 0 26px; }
.vk-brand .gold p { max-width:52ch; margin:0 auto; font-weight:300; font-size:16px; line-height:1.95; color:var(--vk-text); }
.vk-brand .gold p .hl { color:var(--gold); }
.vk-brand .gold p .sv { color:var(--vk-silver); }

/* pull quote */
.vk-brand .pull { text-align:center; padding:clamp(60px,10vw,140px) 0; }
.vk-brand .pull p { font-family:var(--vk-serif); font-style:italic; color:var(--vk-white); font-weight:500; font-size:clamp(30px,6vw,70px); line-height:1.12; max-width:15ch; margin:0 auto; }
.vk-brand .pull .mark { color:var(--vk-accent); font-style:normal; }

/* facts */
.vk-brand .facts { display:grid; grid-template-columns:1fr; border-top:1px solid var(--vk-line); border-bottom:1px solid var(--vk-line); }
@media (min-width:640px) { .vk-brand .facts { grid-template-columns:repeat(3,1fr); } }
.vk-brand .facts .f { text-align:center; padding:clamp(34px,5vw,60px) 20px; border-bottom:1px solid var(--vk-line); }
@media (min-width:640px) { .vk-brand .facts .f { border-bottom:0; border-right:1px solid var(--vk-line); } .vk-brand .facts .f:last-child { border-right:0; } }
.vk-brand .facts .v { font-family:var(--vk-serif); color:var(--vk-white); font-weight:500; font-size:clamp(40px,6vw,58px); line-height:1; }
.vk-brand .facts .f.gold-stat .v { color:var(--gold); }
.vk-brand .facts .l { font-family:var(--vk-sans); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--vk-text-dim); margin-top:14px; }

/* cta */
.vk-brand .cta { text-align:center; padding:clamp(72px,11vw,150px) 0 clamp(16px,3vw,32px); }
.vk-brand .cta h2 { font-family:var(--vk-serif); color:var(--vk-white); font-weight:500; text-transform:uppercase; line-height:.92; font-size:clamp(46px,9vw,92px); margin:18px 0 36px; }
/* button: beat .vk-prose a (white + underline) so the pill label stays dark */
.vk-brand .cta a.btn--primary { color:var(--vk-bg); text-decoration:none; }
.vk-brand .cta a.btn--primary:hover { color:var(--vk-bg); }
