.parents-page { --parents-green: #123c2e; --parents-muted: #52635b; --parents-pale: #eff3e9; --parents-line: #d5dfd1; background: var(--background); }
.parents-page p { line-height: 1.75; }
.parents-page [id] { scroll-margin-top: 110px; }
.parents-page h2 { font-size: clamp(1.9rem, 3vw, 2.7rem); line-height: 1.14; margin: 0; }
.parents-page h3 { line-height: 1.3; }
.parents-label { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; color: #315440; font-size: .875rem; font-weight: 700; }
.parents-label::before { content: ''; width: 26px; height: 4px; border-radius: 4px; background: var(--accent); flex-shrink: 0; }
.parents-hero { padding: 20px 0 44px; }
.parents-breadcrumb { display: flex; gap: 10px; align-items: center; margin-bottom: 28px; font-size: .8125rem; color: var(--parents-muted); }
.parents-breadcrumb a { color: inherit; text-underline-offset: 4px; }
.parents-hero-grid { display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; gap: clamp(32px, 6vw, 88px); }
.parents-hero h1 { font-size: clamp(2.25rem, 3.7vw, 3rem); line-height: 1.12; max-width: 22ch; text-wrap: balance; margin: 0; }
.parents-lead { font-size: 1rem; color: var(--parents-muted); max-width: 52ch; margin: 18px 0 0; }
.parents-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; margin-top: 22px; }
.parents-text-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--parents-green); font-weight: 700; font-size: .875rem; text-underline-offset: 5px; }
.parents-text-link:hover { text-decoration-thickness: 2px; }
.parents-overview { background: var(--parents-green); color: #fffefa; border-radius: 24px; padding: clamp(24px, 2.5vw, 32px); }
.parents-overview h2 { font-size: 1.6rem; max-width: 22ch; }
.parents-overview dl { margin: 18px 0 0; }
.parents-overview dl > div { padding: 12px 0; border-top: 1px solid #ffffff30; }
.parents-overview dt { color: #c9dbd0; font-size: .8125rem; margin-bottom: 4px; }
.parents-overview dd { margin: 0; font-size: 1rem; line-height: 1.6; }
.parents-overview-note { display: flex; gap: 12px; align-items: center; padding: 12px 14px; margin: 8px -4px -4px; background: #ffffff0d; border-radius: 12px; }
.parents-overview-note > span { color: #ffd24f; font-size: 1.3rem; }
.parents-overview-note p { margin: 0; font-size: .875rem; }
.parents-section { padding: 52px 0; }
.parents-process { border-top: 1px solid var(--parents-line); }
.parents-process-heading { margin-bottom: 28px; }
.parents-process-heading h2 { font-size: clamp(1.7rem, 2.6vw, 2.2rem); }
.parents-process-heading p { margin: 12px 0 0; color: var(--parents-muted); max-width: 65ch; }
.parents-process-panel { border: 1px solid var(--parents-line); border-top: 3px solid var(--parents-green); border-radius: 16px; overflow: hidden; background: #fff; }
.parents-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); padding: 32px 0; margin: 0; list-style: none; }
.parents-steps li { padding: 0 28px; }
.parents-steps li + li { border-left: 1px solid var(--parents-line); }
.parents-step-number { display: block; color: var(--parents-green); font-size: .875rem; font-weight: 700; font-variant-numeric: tabular-nums; margin-bottom: 20px; }
.parents-steps h3 { margin: 0 0 12px; font-family: var(--font-body); font-size: 1.0625rem; letter-spacing: 0; color: var(--parents-green); }
.parents-steps p { margin: 0; color: var(--parents-muted); font-size: .9375rem; }
.parents-safety { background: var(--parents-pale); }
.parents-safety-grid { display: grid; grid-template-columns: .85fr 1.3fr; gap: clamp(32px,6vw,88px); align-items: start; }
.parents-safety-copy { position: sticky; top: 116px; }
.parents-safety-copy > p:not(.parents-label) { color: var(--parents-muted); max-width: 40ch; margin: 22px 0 18px; }
.parents-principles { background: #fffefa; padding: 4px 28px; border: 1px solid var(--parents-line); border-radius: 18px; }
.parent-principle { padding: 24px 0; }
.parent-principle + .parent-principle { border-top: 1px solid var(--parents-line); }
.parent-principle h3 { margin: 0 0 10px; font-family: var(--font-body); font-size: 1rem; letter-spacing: 0; color: var(--parents-green); }
.parent-principle p { margin: 0; font-size: .9375rem; color: var(--parents-muted); }
.parents-support-note { display: grid; grid-template-columns: 220px 1fr; gap: 28px; padding: 24px 28px; background: var(--parents-pale); border-top: 1px solid var(--parents-line); }
.parents-support-note h3 { font-family: var(--font-body); font-size: 1rem; line-height: 1.5; margin: 0; letter-spacing: 0; color: var(--parents-green); }
.parents-support-note p { color: var(--parents-muted); font-size: .9375rem; margin: 0; max-width: 75ch; }
.parents-page :focus-visible { outline: 3px solid #3569b3; outline-offset: 5px; }
@media(max-width:950px) { .parents-hero-grid { gap: 32px; } .parents-steps { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0; } .parents-steps li { padding: 24px; } .parents-steps li:nth-child(3) { border-left: 0; } .parents-steps li:nth-child(n+3) { border-top: 1px solid var(--parents-line); } .parents-safety-grid { grid-template-columns: .8fr 1.2fr; gap: 32px; } }
@media(max-width:760px) { .parents-hero-grid, .parents-safety-grid { grid-template-columns: 1fr; } .parents-hero h1 { max-width: 19ch; } .parents-overview h2 { max-width: none; } .parents-safety-copy { position: static; } .parents-support-note { grid-template-columns: 1fr; gap: 8px; padding: 24px; } .parents-section { padding: 48px 0; } }
@media(max-width:480px) { .parents-hero { padding-top: 16px; padding-bottom: 32px; } .parents-breadcrumb { margin-bottom: 20px; } .parents-hero h1 { font-size: 2rem; } .parents-actions { gap: 8px 18px; } .parents-steps { grid-template-columns: 1fr; } .parents-steps li { position: relative; padding: 24px 20px 24px 60px; } .parents-steps li + li { border-left: 0; border-top: 1px solid var(--parents-line); } .parents-step-number { position: absolute; left: 20px; top: 24px; } .parents-support-note { padding: 20px; } .parents-principles { padding: 0 20px; } .parent-principle { padding: 20px 0; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } }