/* SCHITAY CSS Phase 2: Long-form content, FAQ, sources, methodology, informational and error pages. */

.reading-shell {
width:100%; max-width:var(--shell-reading-max);
}
.list-number {
color: #656771; font-size: 10px; font-weight: 750;
}
.list-arrow {
width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: var(--violet); background: var(--soft-violet);
}
.calculator-page .lead {
max-width: 690px; margin: 0 0 30px; color: var(--muted); font-size: 16px; line-height: 1.65;
}
.calculator-layout > article > .content-card,
.calculator-layout > article > .faq-card {
width:100%; max-width:100%;
}
.calculator-layout > article > :is(.content-card,.faq-card,.notice) :is(p,ul,ol) {
width:100%; max-width:var(--shell-reading-max);
}
.content-card {
margin-top: 22px; padding: 27px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.56);
}
.content-card h2 {
margin: 0 0 16px; font-size: 22px;
}
.content-card > .section-kicker + h2 {
margin-top: 9px;
}
.content-card ul {
display: grid; gap: 8px; margin: 0; padding-left: 20px; color: var(--muted); font-size: 13px;
}
.source-card ul {
display: grid; gap: 13px; padding: 0; list-style: none;
}
.source-card li {
display: grid; gap: 4px;
}
.source-card a {
color: var(--violet); font-size: 13px; font-weight: 800; text-decoration: underline; text-underline-offset: 3px;
}
.source-card li span {
color: var(--muted); font-size: 11px; line-height: 1.5;
}
.source-references {
width:100%; max-width:var(--shell-reading-max); min-width:0;
}
.source-references > h3 {
margin:0 0 12px;
}
.source-references li {
min-width:0;
}
.source-references a {
min-width:0; line-height:1.45; overflow-wrap:break-word;
}
.source-disclosure {
margin-top:14px;
}
.source-disclosure summary {
display:flex; width:max-content; max-width:100%; min-height:44px; align-items:center; gap:10px; padding:10px 14px; border:1px solid #d8d1ef; border-radius:12px; box-sizing:border-box; color:#4d348f; background:#f7f4ff; cursor:pointer; font-size:var(--text-sm); font-weight:800; line-height:1.35; list-style:none;
}
.source-disclosure summary::-webkit-details-marker {
display:none;
}
.source-disclosure summary::after {
width:7px; height:7px; flex:0 0 7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; content:""; transform:rotate(45deg) translateY(-2px); transition:transform .18s ease;
}
.source-disclosure[open] summary::after {
transform:rotate(225deg) translate(-1px,-1px);
}
.source-disclosure summary:hover {
border-color:#bdb1e2; background:#f2edff;
}
.source-disclosure summary:focus-visible {
outline:3px solid rgba(99,62,229,.22); outline-offset:2px;
}
.source-disclosure .source-list--secondary {
margin-top:13px;
}
.content-card p {
color: var(--muted); font-size: 13px; line-height: 1.7;
}
.content-card h3 {
margin: 23px 0 11px; font-size: 14px;
}
.faq-card {
margin-top: 22px; padding: 27px; border: 1px solid var(--line); border-radius: 22px; background: #fff;
}
.faq-card h2 {
margin: 9px 0 17px; font-size: 24px;
}
.faq-card details {
border-top: 1px solid var(--line);
}
.faq-card summary {
padding: 16px 0; cursor: pointer; font-size: 13px; font-weight: 750;
}
.faq-card details p {
margin: -4px 0 17px; color: var(--muted); font-size: 12px; line-height: 1.65;
}
.info-hero {
padding: 38px 0 68px;
  border-bottom: 1px solid var(--line);
  background: radial-gradient(circle at 82% 10%, rgba(217,248,76,.4), transparent 21%), linear-gradient(145deg,#f2edff,#fbfaf6 68%);
}
.info-hero .breadcrumbs {
margin-bottom: 52px;
}
.info-hero h1 {
max-width: 850px; margin: 15px 0 19px; font-size: clamp(43px,6vw,76px); line-height: .96; letter-spacing: -.065em;
}
.info-hero > .container > p {
max-width: 760px; margin: 0; color: var(--muted); font-size: 17px; line-height: 1.7;
}
.info-layout {
display: grid; grid-template-columns: minmax(0,760px) 280px; justify-content: space-between; gap: 70px; padding-top: 72px; padding-bottom: 96px;
}
.info-article {
min-width: 0;
}
.info-article > section {
padding: 34px 0; border-top: 1px solid var(--line);
}
.info-article > section:first-child,
.info-article > .document-date + section {
padding-top: 0; border-top: 0;
}
.info-article h2 {
margin: 0 0 17px; font-size: 27px; line-height: 1.1; letter-spacing: -.035em;
}
.info-article p,
.info-article li {
color: var(--muted); font-size: 14px; line-height: 1.75;
}
.info-article p {
margin: 0 0 14px;
}
.info-article p:last-child {
margin-bottom: 0;
}
.info-article a {
color: var(--violet); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.info-card-grid {
display: grid; grid-template-columns: 1fr 1fr; gap: 13px;
}
.info-card-grid > div {
min-height: 160px; padding: 21px; border: 1px solid var(--line); border-radius: 18px; background: #fff;
}
.info-card-grid strong {
display: block; margin-bottom: 10px; font-size: 15px;
}
.info-card-grid p {
font-size: 12px; line-height: 1.65;
}
.info-callout {
margin-top: 34px; padding: 24px; border-radius: 20px; color: #fff; background: linear-gradient(140deg,#6c47e7,#4728b9);
}
.info-callout strong {
display: block; margin-bottom: 10px; font-size: 17px;
}
.info-callout p {
color: #eeeaff; font-size: 13px;
}
.info-callout a {
color: var(--lime); font-size: 12px; font-weight: 850; text-decoration: none;
}
.info-aside {
position: sticky; top: 110px; align-self: start; display: flex; flex-direction: column; gap: 12px; padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: #fff;
}
.info-aside strong {
font-size: 22px; letter-spacing: -.04em;
}
.info-aside p {
margin: 0 0 7px; color: var(--muted); font-size: 12px; line-height: 1.6;
}
.info-aside a {
padding-top: 12px; border-top: 1px solid var(--line); color: var(--violet); font-size: 12px; font-weight: 750;
}
.method-steps {
margin: 0; padding: 0; list-style: none; counter-reset: method;
}
.method-steps li {
position: relative; padding: 0 0 26px 52px; counter-increment: method;
}
.method-steps li::before {
content: counter(method); position: absolute; left: 0; top: 0; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: #fff; background: var(--violet); font-size: 11px; font-weight: 850;
}
.method-steps li:not(:last-child)::after {
content: ""; position: absolute; left: 16px; top: 39px; bottom: 5px; width: 1px; background: #dcd6ef;
}
.method-steps strong {
display: block; margin-bottom: 5px; color: var(--ink); font-size: 15px;
}
.method-steps p {
margin: 0;
}
.contact-email {
display: inline-block; margin-bottom: 17px; font-size: clamp(27px,4vw,43px); font-weight: 850; letter-spacing: -.045em;
}
.document-date {
display: inline-flex; margin: 0 0 38px !important; padding: 8px 11px; border-radius: 10px; color: #555864 !important; background: #efede8; font-size: 10px !important; font-weight: 750;
}
.not-found {
min-height: 70vh; display: grid; place-items: center; padding: 70px 0; text-align: center;
}
.not-found .container {
display: flex; max-width: 680px; flex-direction: column; align-items: center;
}
.error-code {
color: var(--violet); font-size: 90px; font-weight: 900; letter-spacing: -.08em;
}
.not-found h1 {
margin: 0; font-size: 42px; letter-spacing: -.045em;
}
.not-found p {
margin: 15px 0 28px; color: var(--muted);
}
.not-found-actions {
display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 20px;
}
.not-found-actions .inline-button {
margin-top: 0;
}
@media (max-width: 1020px) {
.info-layout {
grid-template-columns: minmax(0,1fr) 250px; gap: 38px;
}
}
@media (max-width: 720px) {
.info-hero {
padding-top: 26px; padding-bottom: 50px;
}
.info-hero .breadcrumbs {
margin-bottom: 35px;
}
.info-hero h1 {
font-size: 44px;
}
.info-hero > .container > p {
font-size: 15px;
}
.info-layout {
grid-template-columns: 1fr; gap: 38px; padding-top: 52px; padding-bottom: 70px;
}
.info-aside {
position: static;
}
.info-card-grid {
grid-template-columns: 1fr;
}
.info-card-grid > div {
min-height: 0;
}
}
.list-number,
.method-steps li::before {
font-size: var(--text-xs);
}
.content-card p,
.content-card ul,
.info-article p,
.info-article li {
font-size: var(--text-base);
    line-height: 1.7;
}
.content-card h3 {
font-size: var(--text-lg);
    line-height: 1.35;
}
.info-hero h1 {
font-size: clamp(2rem, 3.2vw, 2.5rem);
    line-height: 1.08;
    letter-spacing: -.045em;
}
.not-found h1 {
font-size: 2.5rem;
    line-height: 1.08;
}
.info-card-grid p,
.info-callout p,
.info-callout a,
.info-aside p,
.info-aside a,
.faq-card details p,
.source-card li span {
font-size: var(--text-sm);
    line-height: var(--leading-copy);
}
.faq-card summary,
.source-card a {
font-size: var(--text-sm);
}
.document-date {
font-size: var(--text-xs) !important;
}
.content-card table.percent-choice-table {
width:100%; max-width:100%; table-layout:fixed; border-collapse:collapse;
}
.content-card table.percent-choice-table th,
.content-card table.percent-choice-table td {
padding:10px 12px; border-bottom:1px solid var(--line); color:var(--muted); font-size:var(--text-sm); line-height:1.45; text-align:left; overflow-wrap:normal; word-break:normal;
}
.content-card table.percent-choice-table th {
color:var(--ink); font-weight:850;
}
@media (max-width:360px) {
.content-card table.percent-choice-table th,
.content-card table.percent-choice-table td {
padding:8px 7px;
}
}
.content-card table.date-boundary-table {
width:100%; max-width:100%; table-layout:fixed; border-collapse:collapse;
}
.content-card table.date-boundary-table th,
.content-card table.date-boundary-table td {
padding:10px 12px; border-bottom:1px solid var(--line); color:var(--muted); font-size:var(--text-sm); line-height:1.45; text-align:left; overflow-wrap:normal; word-break:normal;
}
.content-card table.date-boundary-table th {
color:var(--ink); font-weight:850;
}
@media (max-width:360px) {
.content-card table.date-boundary-table th,
.content-card table.date-boundary-table td {
padding:8px 7px;
}
}
.content-card table.bmi-category-table {
width:100%; max-width:100%; table-layout:fixed; border-collapse:collapse;
}
.content-card table.bmi-category-table th,
.content-card table.bmi-category-table td {
padding:10px 12px; border-bottom:1px solid var(--line); color:var(--muted); font-size:var(--text-sm); line-height:1.45; text-align:left; overflow-wrap:normal; word-break:normal;
}
.content-card table.bmi-category-table th {
color:var(--ink); font-weight:850;
}
.content-card .source-card {
margin-top:24px; padding-top:22px; border-top:1px solid var(--line);
}
@media (max-width:360px) {
.content-card table.bmi-category-table th,
.content-card table.bmi-category-table td {
padding:8px 7px;
}
}
@media print {
.source-disclosure > summary {
display:none !important;
}
.source-disclosure:not([open]) > .source-list--secondary {
display:grid !important;
}
}
