/* Family content follows the shared About/Contact reading surfaces.
   header1.php, header2.php and footer.php own the site's chrome. */
.family-page{box-sizing:border-box;width:100%;max-width:1080px;margin:0 auto;padding:clamp(24px,5vw,56px);font-family:'Nunito','Segoe UI',sans-serif;color:#16476a;font-size:1.15rem;line-height:1.75;border:1px solid rgba(255,255,255,.95);border-radius:30px;background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(231,249,255,.76));box-shadow:inset 0 1px 0 white,0 14px 40px rgba(29,119,159,.16),0 3px 8px rgba(29,119,159,.08);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow-wrap:break-word}
.family-page *{box-sizing:border-box}
.family-page h1,.family-page h2,.family-page h3,.family-page h4{font-family:inherit;font-weight:800;line-height:1.3;color:#0875ac;text-shadow:0 1px 0 white}
.family-page h1{margin:0 0 24px;font-size:clamp(2rem,4vw,2.8rem);letter-spacing:-.03em}
.family-page h2{margin:0 0 16px;font-size:clamp(1.45rem,3vw,1.9rem)}
.family-page h3{margin:26px 0 12px;font-size:1.35rem;color:#168365}
.family-page p{margin:0 0 20px}.family-page p:last-child{margin-bottom:0}
.family-page a{color:#086591;font-weight:700;text-underline-offset:4px}.family-page a:hover{color:#12694f}.family-page a:focus-visible{outline:3px solid #0875ac;outline-offset:4px;border-radius:3px}
.family-page .intro{text-align:center;margin:0 auto 32px;max-width:820px}.family-page .intro p{font-size:1.1rem;line-height:1.7}.family-page .intro .muted{font-size:.95rem}
.family-page .badges,.family-page .row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.family-page .badges{justify-content:center}
.family-page .badges span,.family-page .pill{padding:7px 14px;border:1px solid white;border-radius:999px;background:linear-gradient(155deg,#f8fffb,#daf1ea);font-size:.85rem;font-weight:800;color:#12694f;box-shadow:inset 0 1px 0 white}
.family-page .grid,.family-page .explainer{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:22px}
.family-page .card{padding:clamp(22px,3vw,32px);border:1px solid rgba(255,255,255,.95);border-radius:24px;background:linear-gradient(155deg,rgba(255,255,255,.98),rgba(210,241,251,.85));box-shadow:inset 0 1px 0 white,0 6px 16px rgba(27,110,151,.1);margin-bottom:22px;min-width:0}
.family-page form{display:grid;gap:16px}.family-page label{display:grid;gap:8px;color:#086591;font-weight:800;font-size:1rem}
.family-page input,.family-page select,.family-page button{font-family:inherit;font-size:1rem}
.family-page input,.family-page select{box-sizing:border-box;width:100%;padding:12px 14px;color:#16476a;border:1px solid #85bace;border-radius:12px;background:linear-gradient(#f0faff,#fff);box-shadow:inset 0 2px 4px rgba(27,110,151,.08)}
.family-page input:focus-visible,.family-page select:focus-visible{outline:3px solid #168ab9;outline-offset:2px}
.family-page .check{display:flex;align-items:flex-start;font-weight:600;line-height:1.6;color:#16476a}.family-page .check input{width:18px;height:18px;flex-shrink:0;margin:4px 4px 0 0}
.family-page button,.family-page .button{display:inline-block;padding:12px 24px;border:1px solid white;border-radius:999px;color:white;font-family:inherit;font-size:1.05rem;font-weight:800;background:linear-gradient(180deg,#7bdcf8 0%,#2db5e5 48%,#0794d0 51%,#0578b5 100%);box-shadow:inset 0 1px 1px white,0 3px 7px rgba(0,57,103,.2);text-shadow:0 1px 2px rgba(0,55,95,.6);text-align:center;text-decoration:none;cursor:pointer}
.family-page button:hover,.family-page .button:hover{filter:brightness(1.08);color:white}.family-page button:focus-visible,.family-page .button:focus-visible{outline:3px solid #0875ac;outline-offset:4px}.family-page button:disabled{opacity:.5;cursor:wait}
.family-page .secondary{background:linear-gradient(180deg,#f6fdff,#d4edf7);color:#086591;text-shadow:0 1px white}.family-page .secondary:hover{color:#086591}.family-page .danger{background:linear-gradient(#fff5f1,#f8ded6);color:#963c2b;text-shadow:0 1px white}.family-page .danger:hover{color:#963c2b}
.family-page .muted,.family-page small{color:#496e80;font-size:.95rem;line-height:1.7}
.family-page .alert,.family-page #notice:not(:empty){padding:18px 22px;border-radius:16px;color:#735a1d;background:linear-gradient(#fff9e9,#fff0d0);border:1px solid #e6d39b;line-height:1.7;margin:20px 0;box-shadow:inset 0 1px white}.family-page #notice:empty{display:none}
.family-page .profile{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:16px 0}.family-page .avatar{font-size:34px;width:60px;height:60px;display:grid;place-items:center;background:linear-gradient(#eefbf5,#c5e9df);border:1px solid white;border-radius:18px;color:#168365}
.family-page .explainer{margin-top:32px;border-top:1px solid rgba(68,170,210,.25);padding-top:26px}.family-page .explainer h2{font-size:1.25rem;color:#168365;margin-bottom:12px}.family-page .explainer p{font-size:1rem;line-height:1.75}
.family-page .prose{line-height:1.75}.family-page .prose h2{margin-top:30px}.family-page .prose h2:first-child{margin-top:0}
.family-page .project{border-top:1px solid rgba(68,170,210,.25);padding:18px 0;display:flex;align-items:center;justify-content:space-between;gap:12px}.family-page .project b{display:block}.family-page .project .row{flex-shrink:0}
.family-page details{margin:22px 0}.family-page summary{cursor:pointer;font-weight:800;margin-bottom:16px;color:#086591}.family-page hr{border:0;height:1px;margin:30px 0;background:linear-gradient(90deg,transparent,#82c7df,transparent)}.family-page .privacy-link{text-align:center;margin-top:28px;font-size:1rem}
@media(max-width:600px){main{padding:20px 12px}.family-page{padding:28px 18px;border-radius:24px;font-size:1.05rem}.family-page .card{padding:22px 18px}.family-page .project{align-items:flex-start;flex-direction:column}.family-page .profile{gap:12px}}