/* ============================================================
   Résumé templates — batch 4 (distinct layout systems)
   Kraft · Pastel · Memphis · Dossier · Aperture · Ribbon · Index · Mesh
   All token-driven (--pa / --pa2). Each head is a unique structure.
   ============================================================ */

/* ===================== KRAFT — warm paper, stamped heads ===================== */
.paper.head-kraft { background: #efe7d6; color: #2f2a20; }
.head-kraft .rhead { padding: 42px 48px 26px; border-bottom: 2px solid color-mix(in oklab, var(--pa) 60%, #2f2a20); }
.head-kraft .rid-top .rname { font-family: var(--font-serif), Georgia, serif; font-weight: 700; font-size: 46px; line-height: 0.98; color: #2f2a20; }
.head-kraft .rid-top .rname-2 { color: var(--pa); }
.head-kraft .rid-top .rtitle {
  display: inline-block; margin-top: 13px; padding: 5px 13px; font-size: 11px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--pa);
  border: 1.5px solid var(--pa); border-radius: 3px;
}
.head-kraft .rid-top .rcontact { margin-top: 13px; gap: 6px 16px; color: #6a6047; }
.head-kraft .rid-top .rcontact-i svg { color: var(--pa); }
.head-kraft .rcols.arch-stack, .head-kraft .rbody { padding-top: 24px; }
.head-kraft .rsec-t { color: var(--pa); letter-spacing: 0.16em; display: flex; align-items: center; gap: 10px; }
.head-kraft .rsec-t::after { content: ""; flex: 1; height: 1px; background: color-mix(in oklab, var(--pa) 40%, transparent); }
.head-kraft .rjob-c { color: var(--pa); font-style: italic; }
.head-kraft .r-bullets li::before { background: var(--pa); }
.head-kraft .rside > .rsec { background: color-mix(in oklab, var(--pa) 7%, #efe7d6); border: 1px solid color-mix(in oklab, var(--pa) 28%, transparent); border-radius: 6px; padding: 16px 18px; }
.head-kraft .rtags span { background: color-mix(in oklab, var(--pa) 10%, #efe7d6); border-color: color-mix(in oklab, var(--pa) 32%, transparent); border-radius: 3px; }
.head-kraft .sseg i.on, .head-kraft .sdots i.on { background: var(--pa); }

/* ===================== PASTEL — soft rounded cards ===================== */
.paper.head-pastel { background: color-mix(in oklab, var(--pa) 6%, #fff); color: #353042; }
.head-pastel .rhead { padding: 30px 30px 8px; }
.head-pastel .rid-top { background: color-mix(in oklab, var(--pa) 16%, #fff); border-radius: 24px; padding: 32px 36px; }
.head-pastel .rid-top .rname { font-family: var(--font-display); font-weight: 700; font-size: 40px; line-height: 0.98; color: #2c2838; }
.head-pastel .rid-top .rname-2 { color: var(--pa); }
.head-pastel .rid-top .rtitle { color: color-mix(in oklab, var(--pa) 70%, #2c2838); font-weight: 700; margin-top: 9px; }
.head-pastel .rid-top .rcontact { margin-top: 13px; gap: 7px 9px; }
.head-pastel .rid-top .rcontact-i { background: rgba(255,255,255,0.7); border-radius: 999px; padding: 4px 11px; color: #4a4458; font-weight: 600; }
.head-pastel .rid-top .rcontact-i svg { color: var(--pa); }
.head-pastel .rcols.arch-stack { padding: 18px 30px 0; }
.head-pastel .rbody { padding: 18px 30px 0; }
.head-pastel .rsec { background: #fff; border-radius: 20px; padding: 20px 24px; margin-bottom: 4px; box-shadow: 0 1px 0 color-mix(in oklab, var(--pa) 10%, transparent); }
.head-pastel .rside .rsec { background: color-mix(in oklab, var(--pa) 11%, #fff); }
.head-pastel .rsec-t { color: var(--pa); }
.head-pastel .rjob-c { color: var(--pa); }
.head-pastel .r-bullets li::before { background: var(--pa2); }
.head-pastel .rtags span { background: color-mix(in oklab, var(--pa) 12%, #fff); border-color: transparent; border-radius: 999px; color: color-mix(in oklab, var(--pa) 65%, #2c2838); }
.head-pastel .sseg i.on, .head-pastel .sdots i.on { background: var(--pa); }

/* ===================== MEMPHIS — 80s geometric confetti ===================== */
.paper.head-memphis { background: #fffdf5; color: #211f2b; }
.head-memphis .rhead {
  padding: 44px 48px 30px; position: relative; overflow: hidden;
  border-bottom: 4px solid var(--pa);
}
.head-memphis .rhead::before {
  content: ""; position: absolute; right: 34px; top: 26px; width: 54px; height: 54px;
  border-radius: 50%; background: var(--pa2);
}
.head-memphis .rhead::after {
  content: ""; position: absolute; right: 96px; top: 56px; width: 30px; height: 30px;
  background: var(--pa); transform: rotate(20deg);
}
.head-memphis .rid-top { position: relative; z-index: 1; }
.head-memphis .rid-top .rname { font-family: var(--font-display); font-weight: 800; font-size: 46px; line-height: 0.94; text-transform: uppercase; color: #211f2b; }
.head-memphis .rid-top .rname-2 { color: var(--pa); }
.head-memphis .rid-top .rtitle { display: inline-block; margin-top: 12px; padding: 5px 14px; background: var(--pa); color: #fff; border-radius: 999px; font-weight: 800; }
.head-memphis .rid-top .rcontact { margin-top: 13px; gap: 6px 16px; color: #4d4960; }
.head-memphis .rid-top .rcontact-i svg { color: var(--pa); }
.head-memphis .rcols.arch-stack, .head-memphis .rbody { padding-top: 24px; }
.head-memphis .rsec-t { color: var(--pa); display: inline-flex; align-items: center; gap: 9px; }
.head-memphis .rsec-t::before { content: ""; width: 12px; height: 12px; background: var(--pa2); transform: rotate(45deg); }
.head-memphis .rjob-c { color: var(--pa); }
.head-memphis .r-bullets li::before { background: var(--pa2); border-radius: 0; transform: rotate(45deg); width: 6px; height: 6px; top: 0.55em; }
.head-memphis .rside > .rsec { background: #fff; border: 2px solid var(--pa); border-radius: 16px; padding: 17px 19px; }
.head-memphis .rtags span { background: color-mix(in oklab, var(--pa2) 18%, #fff); border-color: transparent; border-radius: 999px; }
.head-memphis .sseg i.on, .head-memphis .sdots i.on { background: var(--pa); }

/* ===================== DOSSIER — file-folder tab ===================== */
.paper.head-dossier { background: #f6f5f1; color: #26251f; }
.head-dossier .rhead { padding: 30px 46px 0; }
.head-dossier .rid-top { background: #fff; border: 1px solid #ddd9cf; border-bottom: none; border-radius: 10px 10px 0 0; padding: 30px 34px 26px; position: relative; }
.head-dossier .rid-top::before {
  content: "CV"; position: absolute; top: -22px; left: 34px; background: var(--pa); color: #fff;
  font-family: var(--font-ui); font-size: 11px; font-weight: 800; letter-spacing: 0.16em;
  padding: 6px 16px; border-radius: 8px 8px 0 0;
}
.head-dossier .rid-top .rname { font-family: var(--font-display); font-weight: 700; font-size: 40px; line-height: 0.98; }
.head-dossier .rid-top .rname-2 { color: var(--pa); }
.head-dossier .rid-top .rtitle { color: var(--pa); font-weight: 700; margin-top: 9px; }
.head-dossier .rid-top .rcontact { margin-top: 12px; gap: 6px 16px; color: #6a675c; }
.head-dossier .rid-top .rcontact-i svg { color: var(--pa); }
.head-dossier .rcols.arch-stack { padding: 0 46px; background: #fff; border: 1px solid #ddd9cf; border-top: none; }
.head-dossier .rbody { padding: 22px 46px; background: #fff; border: 1px solid #ddd9cf; border-top: none; }
.head-dossier .rcols.arch-stack { padding-top: 22px; }
.head-dossier .rsec-t { color: var(--pa); border-bottom: 1px solid #e6e2d8; padding-bottom: 6px; }
.head-dossier .rjob-c { color: var(--pa); }
.head-dossier .r-bullets li::before { background: var(--pa); }
.head-dossier .rtags span { background: #f6f5f1; border-color: #ddd9cf; }
.head-dossier .sseg i.on, .head-dossier .sdots i.on { background: var(--pa); }

/* ===================== APERTURE — full-width photo banner ===================== */
.paper.head-aperture { background: #fff; color: #1f1f25; }
.head-aperture .rhead { padding: 0; position: relative; }
.head-aperture .rid-top { display: grid; grid-template-columns: 200px 1fr; align-items: stretch; min-height: 200px; }
.head-aperture .rid-top .rphoto-id { width: 100%; height: 100%; border-radius: 0; border: none; font-size: 48px; }
.head-aperture .rid-top .rid-txt { background: linear-gradient(120deg, var(--pa), var(--pa2)); padding: 40px 44px; display: flex; flex-direction: column; justify-content: center; }
.head-aperture .rid-top .rname { font-family: var(--font-display); font-weight: 700; font-size: 46px; line-height: 0.96; color: #fff; }
.head-aperture .rid-top .rname-2 { color: rgba(255,255,255,0.78); }
.head-aperture .rid-top .rtitle { color: rgba(255,255,255,0.95); font-weight: 700; margin-top: 10px; }
.head-aperture .rid-top .rcontact { margin-top: 13px; gap: 6px 16px; color: rgba(255,255,255,0.95); }
.head-aperture .rid-top .rcontact-i svg { color: #fff; }
.head-aperture .rcols.arch-stack, .head-aperture .rbody { padding-top: 26px; }
.head-aperture .rsec-t { color: var(--pa); position: relative; padding-bottom: 8px; }
.head-aperture .rsec-t::after { content: ""; position: absolute; left: 0; bottom: 0; width: 26px; height: 3px; border-radius: 2px; background: linear-gradient(90deg, var(--pa), var(--pa2)); }
.head-aperture .rjob-c { color: var(--pa); }
.head-aperture .r-bullets li::before { background: var(--pa2); }
.head-aperture .rside > .rsec { background: color-mix(in oklab, var(--pa) 6%, #fff); border-radius: 14px; padding: 17px 19px; }
.head-aperture .rtags span { background: color-mix(in oklab, var(--pa) 10%, #fff); border-color: color-mix(in oklab, var(--pa) 20%, #fff); }
.head-aperture .sseg i.on, .head-aperture .sdots i.on { background: var(--pa); }

/* ===================== RIBBON — diagonal ribbon accent ===================== */
.paper.head-ribbon { background: #fff; color: #1e1e24; }
.head-ribbon .rhead { padding: 44px 48px 28px; position: relative; overflow: hidden; }
.head-ribbon .rhead::before {
  content: ""; position: absolute; top: -60px; left: -10%; width: 120%; height: 150px;
  background: linear-gradient(100deg, var(--pa), var(--pa2)); transform: rotate(-4deg);
}
.head-ribbon .rid-top { position: relative; z-index: 1; padding-top: 56px; }
.head-ribbon .rid-top .rname { font-family: var(--font-display); font-weight: 700; font-size: 44px; line-height: 0.96; }
.head-ribbon .rid-top .rname-2 { color: var(--pa); }
.head-ribbon .rid-top .rtitle { color: var(--pa); font-weight: 700; margin-top: 9px; }
.head-ribbon .rid-top .rcontact { margin-top: 12px; gap: 6px 16px; color: #5a5a64; }
.head-ribbon .rid-top .rcontact-i svg { color: var(--pa); }
.head-ribbon .rcols.arch-stack, .head-ribbon .rbody { padding-top: 24px; }
.head-ribbon .rsec-t { color: var(--pa); display: flex; align-items: center; gap: 9px; }
.head-ribbon .rsec-t::before { content: ""; width: 18px; height: 10px; background: linear-gradient(90deg, var(--pa), var(--pa2)); clip-path: polygon(0 0, 100% 0, 85% 50%, 100% 100%, 0 100%); }
.head-ribbon .rjob-c { color: var(--pa); }
.head-ribbon .r-bullets li::before { background: var(--pa2); }
.head-ribbon .rside > .rsec { background: color-mix(in oklab, var(--pa) 5%, #fff); border-radius: 12px; padding: 16px 18px; }
.head-ribbon .rtags span { background: color-mix(in oklab, var(--pa) 9%, #fff); border-color: color-mix(in oklab, var(--pa) 18%, #fff); }
.head-ribbon .sseg i.on, .head-ribbon .sdots i.on { background: var(--pa); }

/* ===================== INDEX — ruled index-card minimal ===================== */
.paper.head-index { background: #fff; color: #23262b; }
.head-index .rhead {
  padding: 40px 48px 22px; border-top: 6px solid var(--pa);
  background: repeating-linear-gradient(180deg, transparent 0 31px, color-mix(in oklab, var(--pa) 8%, transparent) 31px 32px);
}
.head-index .rid-top { border-left: 2px solid color-mix(in oklab, var(--pa) 40%, transparent); padding-left: 18px; }
.head-index .rid-top .rname { font-family: var(--font-ui); font-weight: 800; font-size: 36px; line-height: 1.0; letter-spacing: -0.01em; }
.head-index .rid-top .rname-2 { color: var(--pa); font-weight: 400; }
.head-index .rid-top .rtitle { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--pa); margin-top: 10px; }
.head-index .rid-top .rcontact { margin-top: 11px; gap: 5px 16px; color: #5b606a; font-size: 12px; }
.head-index .rid-top .rcontact-i svg { color: var(--pa); }
.head-index .rcols.arch-stack, .head-index .rbody { padding-top: 22px; }
.head-index .rsec-t { color: var(--pa); font-size: 11px; letter-spacing: 0.2em; border-bottom: 2px solid color-mix(in oklab, var(--pa) 30%, transparent); padding-bottom: 5px; }
.head-index .rjob-c { color: var(--pa); }
.head-index .r-bullets li::before { background: var(--pa); }
.head-index .rtags span { background: transparent; border: 1px solid color-mix(in oklab, var(--pa) 30%, transparent); border-radius: 4px; }
.head-index .sseg i.on, .head-index .sdots i.on { background: var(--pa); }

/* ===================== MESH — soft gradient-mesh card ===================== */
.paper.head-mesh { background: #0f1117; color: #d6dae4; }
.head-mesh .rhead {
  padding: 46px 48px 30px; position: relative; overflow: hidden;
  background:
    radial-gradient(50% 80% at 12% 0%, color-mix(in oklab, var(--pa) 65%, transparent), transparent 60%),
    radial-gradient(55% 90% at 95% 12%, color-mix(in oklab, var(--pa2) 60%, transparent), transparent 62%),
    radial-gradient(60% 100% at 60% 120%, color-mix(in oklab, var(--pa) 40%, transparent), transparent 60%);
}
.head-mesh .rid-top .rname { font-family: var(--font-display); font-weight: 700; font-size: 48px; line-height: 0.94; color: #fff; }
.head-mesh .rid-top .rname-2 { color: rgba(255,255,255,0.8); }
.head-mesh .rid-top .rtitle { color: #fff; font-weight: 700; opacity: 0.95; margin-top: 10px; }
.head-mesh .rid-top .rcontact { margin-top: 13px; gap: 7px 8px; }
.head-mesh .rid-top .rcontact-i { background: rgba(255,255,255,0.16); color: #fff; padding: 4px 11px; border-radius: 999px; font-weight: 600; }
.head-mesh .rid-top .rcontact-i svg { color: #fff; }
.head-mesh .rcols.arch-stack, .head-mesh .rbody { padding-top: 26px; }
.head-mesh .rsec-t { color: var(--pa2); letter-spacing: 0.14em; }
.head-mesh .rjob-r, .head-mesh .redu-h b, .head-mesh .rproj b, .head-mesh .rnamed-i b, .head-mesh .rlang-n, .head-mesh .rref b { color: #fff; }
.head-mesh .rsum, .head-mesh .r-bullets, .head-mesh .rproj { color: #a4aab6; }
.head-mesh .rjob-w, .head-mesh .redu-w { color: #757d8a; }
.head-mesh .redu-d, .head-mesh .rnamed-m, .head-mesh .rlang-l { color: #99a0ac; }
.head-mesh .rjob-c { color: var(--pa2); }
.head-mesh .r-bullets li::before { background: var(--pa2); }
.head-mesh .rside > .rsec { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.09); border-radius: 14px; padding: 17px 19px; }
.head-mesh .rtags span { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.13); color: #d6dae4; }
.head-mesh .sseg i, .head-mesh .sdots i { background: rgba(255,255,255,0.15); }
.head-mesh .sseg i.on, .head-mesh .sdots i.on { background: var(--pa2); }
.head-mesh .sring-bg { stroke: rgba(255,255,255,0.12); } .head-mesh .sring-fg { stroke: var(--pa2); } .head-mesh .sring-t { fill: #fff; }