/* ============================================================
   Résumé STRUCTURAL VARIANTS
   Makes every same-family colorway a genuinely different LAYOUT
   (not just a recolor): flips the side column, centers the header,
   restructures the masthead, or restyles section headings.
   Loaded LAST so it overrides the family stylesheets.
   ============================================================ */

/* ---- TWIST A: flip body columns (side column moves to the LEFT) ----
   Applied to the 2nd colorway of each stack family. */
.paper.tpl-nova-electric .rcols.arch-stack,
.paper.tpl-luxe-orchid .rcols.arch-stack,
.paper.tpl-pop-cyan .rcols.arch-stack,
.paper.tpl-brut-cobalt .rcols.arch-stack,
.paper.tpl-zine-ink .rcols.arch-stack,
.paper.tpl-neon-magenta .rcols.arch-stack,
.paper.tpl-horizon-plum .rcols.arch-stack,
.paper.tpl-margin-clay .rcols.arch-stack,
.paper.tpl-underscore-blue .rcols.arch-stack,
.paper.tpl-postcard-forest .rcols.arch-stack,
.paper.tpl-signal-amber .rcols.arch-stack,
.paper.tpl-split-forest .rcols.arch-stack,
.paper.tpl-blueprint-slate .rcols.arch-stack,
.paper.tpl-bento-teal .rcols.arch-stack,
.paper.tpl-gazette-oxblood .rcols.arch-stack,
.paper.tpl-crest-burgundy .rcols.arch-stack,
.paper.tpl-outline-cyan .rcols.arch-stack,
.paper.tpl-carbon-azure .rcols.arch-stack,
.paper.tpl-kraft-olive .rcols.arch-stack,
.paper.tpl-pastel-mint .rcols.arch-stack,
.paper.tpl-memphis-electric .rcols.arch-stack,
.paper.tpl-dossier-espresso .rcols.arch-stack,
.paper.tpl-aperture-azure .rcols.arch-stack,
.paper.tpl-ribbon-cobalt .rcols.arch-stack,
.paper.tpl-index-teal .rcols.arch-stack,
.paper.tpl-mesh-magma .rcols.arch-stack {
  grid-template-columns: 1fr 1.62fr;
}
.paper.tpl-nova-electric .rcols.arch-stack .rmain,
.paper.tpl-luxe-orchid .rcols.arch-stack .rmain,
.paper.tpl-pop-cyan .rcols.arch-stack .rmain,
.paper.tpl-brut-cobalt .rcols.arch-stack .rmain,
.paper.tpl-zine-ink .rcols.arch-stack .rmain,
.paper.tpl-neon-magenta .rcols.arch-stack .rmain,
.paper.tpl-horizon-plum .rcols.arch-stack .rmain,
.paper.tpl-margin-clay .rcols.arch-stack .rmain,
.paper.tpl-underscore-blue .rcols.arch-stack .rmain,
.paper.tpl-postcard-forest .rcols.arch-stack .rmain,
.paper.tpl-signal-amber .rcols.arch-stack .rmain,
.paper.tpl-split-forest .rcols.arch-stack .rmain,
.paper.tpl-blueprint-slate .rcols.arch-stack .rmain,
.paper.tpl-bento-teal .rcols.arch-stack .rmain,
.paper.tpl-gazette-oxblood .rcols.arch-stack .rmain,
.paper.tpl-crest-burgundy .rcols.arch-stack .rmain,
.paper.tpl-outline-cyan .rcols.arch-stack .rmain,
.paper.tpl-carbon-azure .rcols.arch-stack .rmain,
.paper.tpl-kraft-olive .rcols.arch-stack .rmain,
.paper.tpl-pastel-mint .rcols.arch-stack .rmain,
.paper.tpl-memphis-electric .rcols.arch-stack .rmain,
.paper.tpl-dossier-espresso .rcols.arch-stack .rmain,
.paper.tpl-aperture-azure .rcols.arch-stack .rmain,
.paper.tpl-ribbon-cobalt .rcols.arch-stack .rmain,
.paper.tpl-index-teal .rcols.arch-stack .rmain,
.paper.tpl-mesh-magma .rcols.arch-stack .rmain { order: 2; }
.paper.tpl-nova-electric .rcols.arch-stack .rside,
.paper.tpl-luxe-orchid .rcols.arch-stack .rside,
.paper.tpl-pop-cyan .rcols.arch-stack .rside,
.paper.tpl-brut-cobalt .rcols.arch-stack .rside,
.paper.tpl-zine-ink .rcols.arch-stack .rside,
.paper.tpl-neon-magenta .rcols.arch-stack .rside,
.paper.tpl-horizon-plum .rcols.arch-stack .rside,
.paper.tpl-margin-clay .rcols.arch-stack .rside,
.paper.tpl-underscore-blue .rcols.arch-stack .rside,
.paper.tpl-postcard-forest .rcols.arch-stack .rside,
.paper.tpl-signal-amber .rcols.arch-stack .rside,
.paper.tpl-split-forest .rcols.arch-stack .rside,
.paper.tpl-blueprint-slate .rcols.arch-stack .rside,
.paper.tpl-bento-teal .rcols.arch-stack .rside,
.paper.tpl-gazette-oxblood .rcols.arch-stack .rside,
.paper.tpl-crest-burgundy .rcols.arch-stack .rside,
.paper.tpl-outline-cyan .rcols.arch-stack .rside,
.paper.tpl-carbon-azure .rcols.arch-stack .rside,
.paper.tpl-kraft-olive .rcols.arch-stack .rside,
.paper.tpl-pastel-mint .rcols.arch-stack .rside,
.paper.tpl-memphis-electric .rcols.arch-stack .rside,
.paper.tpl-dossier-espresso .rcols.arch-stack .rside,
.paper.tpl-aperture-azure .rcols.arch-stack .rside,
.paper.tpl-ribbon-cobalt .rcols.arch-stack .rside,
.paper.tpl-index-teal .rcols.arch-stack .rside,
.paper.tpl-mesh-magma .rcols.arch-stack .rside { order: 1; }

/* ---- TWIST B: centered header + centered section headings ----
   Applied to the 3rd colorway of simple-header stack families. */
.paper.tpl-horizon-pine .rid-top,
.paper.tpl-margin-berry .rid-top,
.paper.tpl-underscore-rose .rid-top,
.paper.tpl-postcard-navy .rid-top,
.paper.tpl-signal-cyan .rid-top,
.paper.tpl-pastel-peach .rid-top {
  align-items: center; text-align: center;
}
.paper.tpl-horizon-pine .rid-top .rcontact,
.paper.tpl-margin-berry .rid-top .rcontact,
.paper.tpl-underscore-rose .rid-top .rcontact,
.paper.tpl-postcard-navy .rid-top .rcontact,
.paper.tpl-signal-cyan .rid-top .rcontact,
.paper.tpl-pastel-peach .rid-top .rcontact {
  justify-content: center;
}
.paper.tpl-horizon-pine .rmain > .rsec > .rsec-t,
.paper.tpl-margin-berry .rmain > .rsec > .rsec-t,
.paper.tpl-underscore-rose .rmain > .rsec > .rsec-t,
.paper.tpl-postcard-navy .rmain > .rsec > .rsec-t,
.paper.tpl-signal-cyan .rmain > .rsec > .rsec-t,
.paper.tpl-pastel-peach .rmain > .rsec > .rsec-t {
  text-align: center; justify-content: center;
}

/* underscore-rose, postcard-navy: single-column centering tweaks already cascade.
   Give these centered variants a small flourish under headings. */
.paper.tpl-horizon-pine .rmain > .rsec > .rsec-t::after,
.paper.tpl-postcard-navy .rmain > .rsec > .rsec-t::after,
.paper.tpl-pastel-peach .rmain > .rsec > .rsec-t::after {
  content: ""; display: block; width: 24px; height: 2px; margin: 7px auto 0;
  background: var(--pa); border-radius: 2px;
}

/* ---- TWIST C: split-crimson → full-width color band masthead ---- */
.paper.tpl-split-crimson .rid-top { grid-template-columns: 1fr; }
.paper.tpl-split-crimson .rid-top .rid-txt {
  grid-column: 1; width: 100%; align-items: center; text-align: center;
  background: linear-gradient(120deg, var(--pa), color-mix(in oklab, var(--pa) 60%, var(--pa2)));
}
.paper.tpl-split-crimson .rid-top .rid-txt .rcontact {
  position: static; width: auto; height: auto; padding: 0; margin-top: 13px;
  flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 7px 16px;
}
.paper.tpl-split-crimson .rid-top .rcontact-i { color: rgba(255,255,255,0.95); }
.paper.tpl-split-crimson .rid-top .rcontact-i svg { color: #fff; }

/* ---- SIDEBAR families: each colorway gets a DIFFERENT rail treatment ---- */
/* 2nd colorway: rail on the RIGHT (otherwise same tinted/gradient rail) */
.paper.tpl-tabbed-teal .rcols.arch-sidebar,
.paper.tpl-gradrail-ocean .rcols.arch-sidebar,
.paper.tpl-bauhaus-blue .rcols.arch-sidebar {
  grid-template-columns: 1fr 280px;
}
.paper.tpl-tabbed-teal .rcols.arch-sidebar .rside,
.paper.tpl-gradrail-ocean .rcols.arch-sidebar .rside,
.paper.tpl-bauhaus-blue .rcols.arch-sidebar .rside { order: 2; }
.paper.tpl-tabbed-teal .rcols.arch-sidebar .rmain,
.paper.tpl-gradrail-ocean .rcols.arch-sidebar .rmain,
.paper.tpl-bauhaus-blue .rcols.arch-sidebar .rmain { order: 1; }
.paper.tpl-bauhaus-blue .rcols.arch-sidebar { grid-template-columns: 1fr 270px; }
.paper.tpl-gradrail-ocean .rcols.arch-sidebar { grid-template-columns: 1fr 264px; }

/* 3rd colorway: rail stays on the LEFT but becomes a SOLID dark rail with a
   centered identity — a clearly different silhouette from both siblings. */
.paper.tpl-tabbed-graphite .rcols.arch-sidebar .rside {
  background: #23262d !important; color: #e7e9ed;
}
.paper.tpl-tabbed-graphite .rside .rid-side { align-items: center; text-align: center; }
.paper.tpl-tabbed-graphite .rside .rid-side .rname { color: #fff; }
.paper.tpl-tabbed-graphite .rside .rid-side .rname-2 { color: color-mix(in oklab, var(--pa2) 70%, #fff); }
.paper.tpl-tabbed-graphite .rside .rid-side .rtitle { color: #aeb3bc; }
.paper.tpl-tabbed-graphite .rside .rid-side .rcontact { color: #c2c6cd; align-items: center; text-align: center; }
.paper.tpl-tabbed-graphite .rside .rid-side .rcontact-i svg { color: #fff; }
.paper.tpl-tabbed-graphite .rside .rsec-t { color: #fff; opacity: 0.78; }
.paper.tpl-tabbed-graphite .rside .rtags span { background: rgba(255,255,255,0.12); color: #e7e9ed; border-color: rgba(255,255,255,0.16); }
.paper.tpl-tabbed-graphite .rside .sdots i { background: rgba(255,255,255,0.22); }
.paper.tpl-tabbed-graphite .rside .sdots i.on { background: #fff; }
.paper.tpl-tabbed-graphite .rside .redu-h b, .paper.tpl-tabbed-graphite .rside .rlang-n,
.paper.tpl-tabbed-graphite .rside .rnamed-i b { color: #fff; }
.paper.tpl-tabbed-graphite .rside .redu-d, .paper.tpl-tabbed-graphite .rside .redu-w,
.paper.tpl-tabbed-graphite .rside .rlang-l { color: #aeb3bc; }
.paper.tpl-tabbed-graphite .rphoto-id { border-color: rgba(255,255,255,0.5); }

/* gradrail-violet (3rd): rail stays left but identity centered + a vertical
   divider accent and pill main-headings — distinct from sunset (base, left). */
.paper.tpl-gradrail-violet .rid-side { align-items: center; text-align: center; }
.paper.tpl-gradrail-violet .rid-side .rcontact { align-items: center; text-align: center; }
.paper.tpl-gradrail-violet .rid-side .rphoto-id { width: 116px; height: 116px; border-radius: 50%; }
.paper.tpl-gradrail-violet .rmain .rsec-t {
  display: inline-block; background: color-mix(in oklab, var(--pa) 12%, #fff);
  color: var(--pa); padding: 4px 12px; border-radius: 7px; padding-bottom: 4px;
}
.paper.tpl-gradrail-violet .rmain .rsec-t::after { display: none; }

/* ---- Heading-style differentiators (so flipped variants don't read as mere mirrors) ----
   Give a handful of 2nd colorways a distinct section-heading treatment. */
.paper.tpl-horizon-plum .rsec-t,
.paper.tpl-carbon-azure .rsec-t,
.paper.tpl-mesh-magma .rsec-t {
  border-bottom: 2px solid color-mix(in oklab, var(--pa) 40%, transparent); padding-bottom: 6px;
}
.paper.tpl-margin-clay .rmain .rsec-t,
.paper.tpl-index-teal .rsec-t {
  display: inline-block; background: color-mix(in oklab, var(--pa) 12%, #fff);
  color: var(--pa); padding: 3px 11px; border-radius: 6px; border: none;
}
.paper.tpl-ribbon-cobalt .rsec-t::before { display: none; }
.paper.tpl-ribbon-cobalt .rsec-t {
  border-left: 3px solid var(--pa); padding-left: 11px;
}