/* ==========================================================================
   Krignal — print edition
   A two-colour risograph treatment: warm charcoal paper, one vivid yellow
   doing all the work of light, near-black for weight. Layered over main.css,
   so every rule here is a deliberate departure from the painted edition.
   Colours are sampled from the generated poster art.
   ========================================================================== */

/* ---------- 1. Token flip ------------------------------------------------ */
.theme-riso {
  /* the press */
  --ground:     #33312b;
  --ground-2:   #3a3831;
  --ground-3:   #43413a;
  --ground-4:   #5f5c4f;   /* the sky in the artwork */

  /* the ink */
  --riso-black: #171a18;

  /* the light — the only saturated colour on the page */
  --yellow:     #ffc61e;
  --yellow-lt:  #ffd960;
  --yellow-dk:  #c9911a;
  --amber:      #e7a226;

  /* the paper stock */
  --cream:      #f2e7cf;

  /* --- remap every token main.css builds on --- */
  --canvas:     var(--ground);
  --canvas-2:   var(--ground-2);
  --paper:      var(--ground);
  --paper-2:    var(--ground-2);
  --paper-3:    var(--ground-3);

  --ink:        var(--cream);
  --ink-2:      rgba(242, 231, 207, .78);
  --ink-3:      rgba(242, 231, 207, .54);
  --ink-inv:    var(--cream);

  --night:      #26241f;
  --night-2:    #2d2b25;

  --line:       rgba(242, 231, 207, .16);
  --line-inv:   rgba(242, 231, 207, .16);

  /* gold becomes the yellow; gold-dk is used as a text accent, so on this
     ground it has to get brighter, not darker */
  --gold:       var(--yellow);
  --gold-lt:    var(--yellow-lt);
  --gold-dk:    var(--yellow);

  --cloud:      #f5cf9e;
  --sky-deep:   #26241f;

  /* print has hard edges, not soft ones */
  --r-sm: 2px;
  --r:    3px;
  --r-lg: 4px;
  --shadow-s: none;
  --shadow:   none;
  --shadow-l: none;
}

.theme-riso body { background: var(--ground); color: var(--cream); }

/* ---------- 2. Paper grain ----------------------------------------------- */
/* The whole page sits on stock, so the tooth runs over everything. */
.theme-riso body::after {
  content: "";
  position: fixed; inset: 0; z-index: 400; pointer-events: none;
  opacity: .32;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

/* ---------- 3. Header ---------------------------------------------------- */
.theme-riso .hdr.is-stuck {
  background: rgba(38, 36, 31, .9);
  backdrop-filter: saturate(120%) blur(12px);
  -webkit-backdrop-filter: saturate(120%) blur(12px);
  border-bottom-color: rgba(242, 231, 207, .18);
  box-shadow: none;
}
.theme-riso .hdr.is-stuck,
.theme-riso .hdr.is-stuck .logo__word { color: var(--cream); }
.theme-riso .hdr.is-stuck .nav a,
.theme-riso .hdr.is-stuck .hdr__login { color: rgba(242, 231, 207, .8); }
.theme-riso .hdr.is-stuck .nav a:hover,
.theme-riso .hdr.is-stuck .hdr__login:hover { color: var(--yellow); }
.theme-riso .hdr.is-stuck .burger { border-color: rgba(242, 231, 207, .3); }
.theme-riso .hdr.is-stuck .burger span,
.theme-riso .hdr.is-stuck .burger span::before,
.theme-riso .hdr.is-stuck .burger span::after { background: var(--cream); }

.theme-riso .mnav {
  background: rgba(38, 36, 31, .98);
  border-bottom-color: rgba(242, 231, 207, .18);
}
.theme-riso .mnav a { border-bottom-color: rgba(242, 231, 207, .12); color: var(--cream); }

/* Version switcher */
.verswitch {
  display: inline-flex; align-items: center; margin-left: auto; flex: none;
  font-size: .66rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  padding: 7px 13px; border-radius: 999px;
  border: 1px solid var(--line); color: inherit; opacity: .75;
  transition: opacity .25s, border-color .25s, color .25s;
}
.verswitch b { font-weight: 700; }
.verswitch:hover { opacity: 1; border-color: var(--gold); color: var(--gold-dk); }
.hdr__cta { margin-left: 14px; }
@media (max-width: 900px) { .verswitch { display: none; } }
.theme-riso .verswitch { border-radius: 2px; }

/* ---------- 4. Buttons --------------------------------------------------- */
/* Flat ink-on-yellow, the way a two-colour press would actually print it. */
.theme-riso .btn { border-radius: 2px; }
.theme-riso .btn--gold {
  background: var(--yellow); color: var(--riso-black);
  box-shadow: none; border-color: var(--yellow);
}
.theme-riso .btn--gold:hover { background: var(--yellow-lt); border-color: var(--yellow-lt); box-shadow: none; }

.theme-riso .btn--ghost {
  background: transparent; border-color: rgba(242, 231, 207, .34); color: var(--cream);
  backdrop-filter: none;
}
.theme-riso .btn--ghost:hover { background: rgba(242, 231, 207, .08); border-color: var(--yellow); color: var(--yellow); }
.theme-riso .hero .btn--ghost { background: transparent; border-color: rgba(242, 231, 207, .38); }
.theme-riso .hero .btn--ghost:hover { background: rgba(242, 231, 207, .1); border-color: var(--yellow); }

.theme-riso .btn--ghost-inv { border-color: rgba(242, 231, 207, .3); color: var(--cream); }
.theme-riso .btn--ghost-inv:hover { border-color: var(--yellow); color: var(--yellow); background: transparent; }

/* Components that were dark-ground + white-text: --ink is now cream, so they
   need their ground put back explicitly or they vanish. */
.theme-riso .skip,
.theme-riso .btn--ink { background: var(--riso-black); color: var(--cream); }
.theme-riso .btn--ink:hover { background: #232725; }
.theme-riso .step-a { background: var(--yellow); color: var(--riso-black); }
.theme-riso .qcard__av { background: var(--yellow); color: var(--riso-black); }
.theme-riso .qcard:nth-child(even) .qcard__av { background: var(--cream); color: var(--riso-black); }

/* ---------- 5. Hero ------------------------------------------------------ */
.theme-riso .hero { background: var(--ground); }
/* The art's left side is already flat charcoal, so the veil only has to
   settle it, not rescue it. */
.theme-riso .hero__veil {
  background:
    linear-gradient(101deg,
      rgba(28, 27, 23, .88) 0%, rgba(28, 27, 23, .66) 28%,
      rgba(28, 27, 23, .22) 54%, rgba(28, 27, 23, 0) 76%),
    linear-gradient(180deg, rgba(28, 27, 23, .55) 0%, rgba(28, 27, 23, 0) 24%),
    linear-gradient(0deg, rgba(28, 27, 23, .6) 0%, rgba(28, 27, 23, 0) 18%);
}
.theme-riso .hero__grain { opacity: .75; }

.theme-riso .hero__badge {
  background: transparent; border: 1px solid var(--yellow);
  color: var(--yellow); border-radius: 2px;
}
.theme-riso .hero__badge .dot { background: var(--yellow); }
.theme-riso .hero__word { color: var(--cream); text-shadow: none; }
.theme-riso .rot__line em,
.theme-riso .hero__tag em { color: var(--yellow); }
.theme-riso .hero__note svg { color: var(--yellow); }
.theme-riso .dots button[aria-current="true"] { background: var(--yellow); }

.theme-riso .cyc {
  background: rgba(23, 26, 24, .58); border: 1px solid rgba(242, 231, 207, .2);
  border-radius: 2px;
}
.theme-riso .cyc__k svg { color: var(--yellow); }

/* ---------- 6. Surfaces -------------------------------------------------- */
/* main.css hardcodes #fff on every card; each one gets the press ground. */
.theme-riso .qcard,
.theme-riso .panel { background: var(--ground-2); border-color: var(--line); }
.theme-riso .bcard,
.theme-riso .mini,
.theme-riso .chip,
.theme-riso .pill,
.theme-riso .tag,
.theme-riso .ecard { background: var(--ground-2); border-color: var(--line); }
.theme-riso .tagbox { background: var(--ground-2); border-color: var(--line); backdrop-filter: none; }
.theme-riso .seg--org .tagbox { background: rgba(242, 231, 207, .05); }

.theme-riso .qcard:hover,
.theme-riso .bcard:hover,
.theme-riso .ecard:hover { border-color: var(--yellow); }
.theme-riso .bcard::after { background: var(--yellow); }
.theme-riso .bcard__ico {
  background: rgba(255, 198, 30, .12); border-color: rgba(255, 198, 30, .38);
  color: var(--yellow); border-radius: 2px;
}
.theme-riso .pill--found { background: rgba(255, 198, 30, .14); border-color: rgba(255, 198, 30, .5); }
.theme-riso .chip__tag { background: rgba(242, 231, 207, .1); color: rgba(242, 231, 207, .7); }
.theme-riso .you {
  background: var(--ground-3); border-color: var(--yellow);
  box-shadow: 0 0 0 6px rgba(255, 198, 30, .08); color: var(--cream);
}
.theme-riso .you::after { border-color: rgba(255, 198, 30, .4); }
.theme-riso .chip__d { background: var(--yellow); }
.theme-riso .mini__badge { background: rgba(255, 198, 30, .14); color: var(--yellow); }
.theme-riso .mini__badge .d { background: var(--yellow); }
.theme-riso .caret { background: var(--yellow); }
.theme-riso .radar__dial {
  background: radial-gradient(circle, rgba(255, 198, 30, .1), rgba(255, 198, 30, .02) 70%);
  border-color: rgba(255, 198, 30, .28);
}
.theme-riso .radar__dial::before,
.theme-riso .radar__dial::after { border-color: rgba(255, 198, 30, .2); }
.theme-riso .radar__sweep { background: conic-gradient(from 0deg, rgba(255, 198, 30, .5), rgba(255, 198, 30, 0) 42%); }
.theme-riso .radar__pip { background: var(--yellow); box-shadow: 0 0 8px rgba(255, 198, 30, .8); }

.theme-riso .mark::after {
  background: var(--yellow); opacity: .22; border-radius: 0;
}
.theme-riso .eyebrow::before { background: var(--yellow); }

/* ---------- 7. Bands ----------------------------------------------------- */
.theme-riso .privacy { background: var(--night); }
.theme-riso .privacy::before {
  background:
    linear-gradient(95deg, rgba(28, 27, 23, .9) 0%, rgba(28, 27, 23, .68) 34%,
                           rgba(28, 27, 23, .3) 64%, rgba(28, 27, 23, .14) 100%);
}
.theme-riso .pchip {
  background: rgba(23, 26, 24, .6); border-color: rgba(242, 231, 207, .22); border-radius: 2px;
}
.theme-riso .pchip svg { color: var(--yellow); }

.theme-riso .closer { background: var(--night); }
.theme-riso .closer__veil {
  background:
    linear-gradient(180deg, rgba(28, 27, 23, .62) 0%, rgba(28, 27, 23, .3) 38%,
                            rgba(28, 27, 23, .46) 72%, rgba(28, 27, 23, .88) 100%),
    radial-gradient(56% 42% at 50% 32%, rgba(28, 27, 23, .78), rgba(28, 27, 23, 0) 74%);
}

.theme-riso .seg--ind { background: var(--ground); }
.theme-riso .seg--org { background: var(--night); }
.theme-riso .benefits { background: linear-gradient(180deg, var(--ground) 0%, var(--ground-2) 100%); }
.theme-riso .events { background: linear-gradient(180deg, var(--ground-2), var(--ground)); }
.theme-riso .tv { background: #1e1c18; }

/* ---------- 8. Photographs ----------------------------------------------- */
/* The event photos and the TV portrait are full-colour; a duotone drops them
   into the two-ink palette so they belong on the same press sheet. */
.theme-riso .ecard__art img,
.theme-riso .tvframe img {
  filter: grayscale(1) contrast(1.14) brightness(.86) sepia(.78) saturate(2.9) hue-rotate(-8deg);
}
.theme-riso .ecard__art { background: var(--riso-black); }
.theme-riso .ecard__tag {
  background: var(--yellow); color: var(--riso-black); backdrop-filter: none; border-radius: 2px;
}
.theme-riso .tvframe { border-color: rgba(242, 231, 207, .18); background: var(--riso-black); }
.theme-riso .tvframe__cap { background: linear-gradient(0deg, rgba(23, 26, 24, .94), transparent); }
.theme-riso .tv__mission h3 span { color: var(--yellow); }

/* ---------- 9. FAQ, footer, misc ----------------------------------------- */
.theme-riso .faq { background: var(--ground); }
.theme-riso .qa summary::after { border-color: rgba(242, 231, 207, .5); }
.theme-riso .qa[open] summary::after { border-color: var(--yellow); }
.theme-riso .qa summary:hover { color: var(--yellow); }

.theme-riso .ftr { background: #26241f; }
.theme-riso .ftr__col a:hover { color: var(--yellow); }

.theme-riso .totop {
  background: var(--yellow); border-color: var(--yellow); border-radius: 2px;
}
.theme-riso .totop svg { color: var(--riso-black); }
.theme-riso .totop:hover { background: var(--yellow-lt); }

.theme-riso .tlink { color: rgba(242, 231, 207, .8); border-bottom-color: rgba(242, 231, 207, .25); }
.theme-riso .tlink:hover { color: var(--yellow); border-bottom-color: var(--yellow); }

.theme-riso :focus-visible { outline-color: var(--yellow); }

/* Print stock has no gloss: kill the leftover soft shadows. */
.theme-riso .qcard,
.theme-riso .bcard,
.theme-riso .mini,
.theme-riso .chip,
.theme-riso .pill,
.theme-riso .panel,
.theme-riso .ecard,
.theme-riso .tagbox { box-shadow: none; }
