/* Hallmark · editorial guides · existing HELPER site palette */
body.noodle-guides { margin: 0; }
.ng { --ng-ink: #222c32; --ng-muted: #4d5558; --ng-paper: #faf6eb; --ng-line: #dfd4ba; --ng-gold: #73501f; color: var(--ng-ink); }
.ng-wrap { width: min(100% - 2.5rem, 72rem); margin-inline: auto; }
.ng-crumb { padding-block: 1.1rem; font-size: 0.9rem; }
.ng-hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(1.75rem, 6vw, 6rem); align-items: center; padding: clamp(2rem, 6vw, 5.5rem) 0; border-bottom: 1px solid var(--ng-line); }
.ng h1, .ng h2, .ng h3 { font-family: var(--font-display, Georgia, serif); line-height: 1.13; color: inherit; }
.ng h1 { font-size: clamp(2.75rem, 6.8vw, 5.4rem); letter-spacing: -0.045em; margin: 0.25rem 0 1.25rem; }
.ng h2 { font-size: clamp(1.65rem, 3.7vw, 2.6rem); margin: 0 0 1.4rem; }
.ng h3 { font-size: 1.33rem; margin: 0 0 0.6rem; }
.ng p, .ng dd, .ng li { line-height: 1.65; }
.ng-kicker { color: var(--ng-gold); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.ng-deck { max-width: 48ch; font-size: clamp(1.05rem, 2vw, 1.25rem); color: var(--ng-muted); }
.ng-section { padding: clamp(2rem, 4vw, 3.75rem) 0; border-bottom: 1px solid var(--ng-line); }
.ng-flow, .ng-index { background: var(--ng-paper); margin: 0; padding: clamp(1.1rem, 3.5vw, 2.5rem); border-top: 3px solid #a47c42; }
.ng-flow figcaption, .ng-index strong { font: 1.35rem var(--font-display, Georgia, serif); }
.ng-flow ol { padding-inline-start: 1.5rem; margin-block: 0.85rem 0; }
.ng-flow li { padding: 0.35rem 0.25rem; border-bottom: 1px solid var(--ng-line); }
.ng-flow li::marker { color: var(--ng-gold); font-weight: 700; }
.ng-index ul { padding-inline-start: 1.15rem; margin-block: 0.75rem 0; }
.ng-profiles { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 2.75rem; }
.ng-profiles article { border-top: 1px solid var(--ng-line); padding-block: 1.15rem; scroll-margin-top: 9rem; }
.ng-profiles p { margin: 0; max-width: 56ch; }
.ng-steps { max-width: 58rem; }
.ng-steps div { display: grid; grid-template-columns: minmax(7rem, 0.36fr) 1fr; gap: 1rem; border-top: 1px solid var(--ng-line); padding: 1.1rem 0; }
.ng dt { font-weight: 700; }
.ng dd { margin: 0; color: var(--ng-muted); }
.ng-compare dl { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,16rem),1fr)); gap: 1rem; margin: 0; }
.ng-compare dl div { padding: 1.15rem; background: var(--ng-paper); }
.ng-compare dt { margin-bottom: 0.4rem; }
.ng-trial { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: 1.5rem; align-items: center; }
.ng-trial p { max-width: 60ch; }
.ng-related { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; }
.ng a { color: #674717; text-decoration: underline; text-underline-offset: 0.2em; }
.ng a:focus-visible, .noodle-skip:focus-visible { outline: 2px solid #674717; outline-offset: 3px; }
.noodle-skip { position: fixed; left: 1rem; top: -8rem; z-index: 9999; background: white; color: #222c32; padding: 0.65rem; }
.noodle-skip:focus { top: 1rem; }
@media (max-width: 700px) {
  .ng-hero, .ng-profiles, .ng-trial, .ng-steps div { grid-template-columns: minmax(0,1fr); }
  .ng-steps div { gap: 0.25rem; }
}