:root { --guide-ink: #402644; --guide-plum: #63386c; --guide-rose: #f7e5e1; --guide-line: #dfd3df; --guide-muted: #6f6272; }
.guide-page { background: #fcfafb; color: var(--guide-ink); }.guide-header { align-items: center; background: #fff; border-bottom: 1px solid var(--guide-line); display: flex; gap: 1.2rem; justify-content: space-between; padding: 1rem max(5vw, 1.25rem); }.guide-header img { display: block; max-height: 58px; max-width: 210px; object-fit: contain; }.guide-nav { display: flex; flex-wrap: wrap; gap: 1rem; }.guide-nav a { color: var(--guide-ink); font-size: .84rem; font-weight: 750; text-decoration: none; }.guide-nav a:hover { color: var(--guide-plum); text-decoration: underline; text-underline-offset: 3px; }.guide-hero { background: linear-gradient(115deg, #f9e4e0, #f5f0f7); border-bottom: 1px solid var(--guide-line); padding: clamp(3.5rem, 9vw, 7rem) max(6vw, 1.4rem); }.guide-hero-inner, .guide-content, .guide-related { margin: 0 auto; max-width: 890px; }.guide-kicker { color: var(--guide-plum); font-size: .72rem; font-weight: 850; letter-spacing: .12em; margin: 0 0 .85rem; text-transform: uppercase; }.guide-hero h1 { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.45rem, 6vw, 5rem); font-weight: 500; letter-spacing: -.045em; line-height: 1; margin: 0; max-width: 780px; }.guide-lead { color: #5f5062; font-size: clamp(1.05rem, 2vw, 1.25rem); line-height: 1.65; margin: 1.3rem 0 0; max-width: 710px; }.guide-content { font-size: 1.03rem; line-height: 1.75; padding: clamp(3rem, 7vw, 5rem) max(6vw, 1.4rem); }.guide-content h2 { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.8rem, 4vw, 2.7rem); font-weight: 500; letter-spacing: -.03em; line-height: 1.1; margin: 3rem 0 .8rem; }.guide-content h2:first-child { margin-top: 0; }.guide-content h3 { font-size: 1.08rem; margin: 1.6rem 0 .25rem; }.guide-content p { margin: .6rem 0 1rem; }.guide-content ul { margin: .5rem 0 1.2rem; padding-left: 1.25rem; }.guide-callout { background: #fff; border-left: 4px solid var(--guide-plum); margin: 2.2rem 0; padding: 1.25rem 1.35rem; }.guide-callout strong { color: var(--guide-plum); }.guide-button { background: var(--guide-plum); color: #fff; display: inline-block; font-weight: 800; margin-top: .6rem; padding: .78rem 1rem; text-decoration: none; }.guide-related { border-top: 1px solid var(--guide-line); padding: 2.5rem max(6vw, 1.4rem) 4rem; }.guide-related h2 { font-family: Georgia, 'Times New Roman', serif; font-size: 2rem; font-weight: 500; margin: 0 0 1rem; }.guide-related-links { display: grid; gap: .7rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }.guide-related a { background: #fff; border: 1px solid var(--guide-line); color: var(--guide-ink); font-weight: 750; padding: .95rem 1rem; text-decoration: none; }.guide-related a:hover { border-color: var(--guide-plum); color: var(--guide-plum); }.guide-footer { background: #3c283f; color: #fff; padding: 1.6rem max(6vw, 1.4rem); text-align: center; }.guide-footer a { color: #fff; } @media (max-width: 620px) { .guide-header { align-items: flex-start; flex-direction: column; }.guide-related-links { grid-template-columns: 1fr; } }