/* pages.css - Flexible page sections: Team, About, Editorial Policy, Contact.
   Part of the SJRP inner component library (prefix .in-), ported 1:1 from the
   canvas artboards; tokens only, the design's breakpoints. See inner.css. */

/* 5. Cards: feature cards, numbered steps, mission ------------------------ */

.in-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.in-card { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 28px; display: flex; flex-direction: column; gap: 6px; box-sizing: border-box; }
.in-card__title { margin: 12px 0 0; font-size: 1.4375rem; letter-spacing: -.025em; line-height: 1.2; }
.in-card__text { margin: 0; font-size: 0.9375rem; color: var(--dd-text); }
.in-cards-note { margin: 16px 0 0; font-size: 0.84375rem; color: var(--dd-text); }

.in-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--dd-hairline); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.in-steps--5 { grid-template-columns: repeat(5,minmax(0,1fr)); }
.in-step { background: var(--dd-white); padding: 24px; display: flex; flex-direction: column; gap: 8px; }
.in-steps--5 .in-step { padding: 24px 22px; gap: 10px; }
.in-step__num { font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); font-variant-numeric: tabular-nums; }
.in-step__title { margin: 0; font-size: 1.375rem; letter-spacing: -.02em; line-height: 1.2; }
.in-steps--5 .in-step__title { font-size: 1.3125rem; }
.in-step__text { margin: 0; font-size: 0.9375rem; color: var(--dd-text); }
.in-steps--5 .in-step__text { font-size: 0.90625rem; }

.in-mv { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
/* as tall as the quote: no fixed minimum, the two cards still match (grid row) */
.in-mv__card { border-radius: 10px; padding: clamp(24px,2.6vw,32px); display: flex; flex-direction: column; gap: 12px; background: var(--dd-green); color: var(--dd-white); }
.in-mv__card--light { background: var(--dd-green-light); color: var(--dd-ink); }
.in-mv__label { margin: 0; font-size: 0.8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--dd-green-pale); }
.in-mv__card--light .in-mv__label { color: var(--dd-green-accent); }
.in-mv__quote { margin: 0; font-family: var(--dd-font-serif); font-style: italic; font-weight: 400; font-size: clamp(1.5rem,2.2vw,1.875rem); line-height: 1.25; letter-spacing: -.02em; }

@media (max-width:1100px) {
	.in-cards, .in-steps, .in-steps--5 { grid-template-columns: repeat(2,minmax(0,1fr)); }
	/* an odd last item takes the whole row instead of leaving an empty cell */
	.in-cards > :last-child:nth-child(odd), .in-steps > :last-child:nth-child(odd) { grid-column: 1/-1; }
}
@media (max-width:900px) { .in-mv { grid-template-columns: minmax(0,1fr); } }
@media (max-width:560px) {
	.in-cards, .in-steps, .in-steps--5 { grid-template-columns: minmax(0,1fr); }
}

/* 6. People: leadership cards, team cards, rest of the team -------------- */

.in-leaders { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.in-person__role { margin: 0; font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); }
.in-person__name { margin: 0; font-size: 1.5rem; letter-spacing: -.025em; line-height: 1.15; }
.in-person__text { margin: 0; font-size: 0.9375rem; color: var(--dd-text); }
.in-person__more { margin-top: auto; align-self: flex-start; }

.in-people { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; align-items: stretch; }
.in-personcard { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 12px 12px 24px; display: flex; flex-direction: column; gap: 14px; }
.in-personcard__img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center top; border-radius: 6px; display: block; }
.in-personcard__body { padding: 6px 12px 0; display: flex; flex-direction: column; gap: 12px; flex: 1; }
/* Leadership: the team card, two to a row. 5:4 keeps the photo as tall as a
   team card's 4:5 photo in the three-column grid below. */
.in-personcard--lead .in-personcard__img { aspect-ratio: 5/4; object-position: center 22%; }

.in-notice { margin-top: 28px; background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; padding: 20px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; }
.in-notice__main { display: flex; align-items: center; gap: 14px; }
.in-notice__text { display: flex; flex-direction: column; line-height: 1.35; }
.in-notice__title { font-size: 1rem; font-weight: 600; }
.in-notice__sub { font-size: 0.875rem; color: var(--dd-text); }
.in-notice__links { display: flex; flex-wrap: wrap; gap: 8px; }


@media (max-width:1100px) {
	.in-people { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px) {
	.in-people { grid-template-columns: minmax(0,1fr); }
	.in-leaders { grid-template-columns: minmax(0,1fr); }
}

/* 7. Split, checklist, programs, coverage, places ------------------------ */

.in-split { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,420px),1fr)); gap: clamp(32px,5vw,72px); align-items: center; }
.in-split--440 { grid-template-columns: repeat(auto-fit,minmax(min(100%,440px),1fr)); }
.in-split--stretch { align-items: stretch; }
.in-split__text { display: flex; flex-direction: column; gap: 16px; }
.in-split__lead { margin: 0; font-size: 1.0625rem; color: var(--dd-text); max-width: 46ch; }
.in-split__lead--48 { max-width: 48ch; }
.in-split__lead--52 { max-width: 52ch; }
.in-split__link { align-self: flex-start; }
.in-split__img { aspect-ratio: 16/10; }
.in-split__img--43 { aspect-ratio: 4/3; }

/* Text beside a photo: on two columns the photo (or the photo grid) is as tall
   as the text, top and bottom on one line. height:0 + min-height:100% keeps
   the photo's own ratio out of the row height, so the text decides it; the
   row minimum guards a short text. One column keeps the ratios above. */
@media (min-width:901px) {
	.in-split:has(> .in-img, > .in-gallery) { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; grid-auto-rows: minmax(340px,auto); }
	.in-split > .in-img { height: 0; min-height: 100%; aspect-ratio: auto; }
	.in-split > .in-gallery { height: 0; min-height: 100%; grid-template-rows: repeat(2,minmax(0,1fr)); }
	.in-split > .in-gallery > .in-img, .in-split > .in-gallery > .in-gallery__map { height: 100%; min-height: 0; aspect-ratio: auto; }
}
.in-split__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }

.in-checks { display: flex; flex-direction: column; margin-top: 4px; }
.in-check { display: flex; align-items: center; gap: 16px; padding: 6px 0; font-size: 1rem; font-weight: 500; }
.in-check__mark { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--dd-accent-a40); display: flex; align-items: center; justify-content: center; flex: none; color: var(--dd-green-accent); }


.in-notebox { margin-top: 28px; background: var(--dd-green-light); border-radius: 10px; padding: 24px 28px; display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,380px),1fr)); gap: 16px 40px; align-items: center; }
.in-notebox__head { display: flex; flex-direction: column; gap: 8px; }
.in-notebox__title { margin: 0; font-size: 1.3125rem; letter-spacing: -.02em; line-height: 1.25; }
.in-notebox__text { margin: 0; font-size: 0.9375rem; color: var(--dd-ink); }

.in-paygrid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-rows: 1fr; gap: 1px; background: var(--dd-hairline); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; margin-top: 4px; }
.in-paygrid__cell { background: var(--dd-white); min-height: 84px; display: flex; align-items: center; justify-content: center; padding: 14px; }
.in-paygrid__img { width: 68%; height: 40px; object-fit: contain; filter: brightness(0) saturate(100%) invert(18%) sepia(22%) saturate(900%) hue-rotate(115deg) brightness(92%) contrast(90%); }
.in-small { margin: 0; font-size: 0.875rem; color: var(--dd-text); }
.in-small strong { font-weight: 600; color: var(--dd-ink); }
.in-split > .in-formcard { align-self: start; } /* hug the form instead of floating it in a stretched card */
.in-formcard { scroll-margin-top: 90px; background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; padding: 24px 28px 28px; display: flex; flex-direction: column; justify-content: center; gap: 14px; }
.in-formcard__head { display: flex; flex-direction: column; gap: 6px; }
.in-formcard__title { margin: 0; font-size: clamp(1.5rem,2.4vw,1.875rem); letter-spacing: -.03em; }
.in-formcard__text { margin: 0; font-size: 0.90625rem; color: var(--dd-text); }
.in-formcard__note { margin: 0; font-size: 0.78125rem; line-height: 1.55; color: var(--dd-text); }
.in-formcard__note strong { font-weight: 600; color: var(--dd-ink); }

.in-cities { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: var(--dd-hairline); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.in-city { background: var(--dd-white); display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 14px; font-size: 0.9375rem; font-weight: 500; text-decoration: none; }
.in-city svg { color: var(--dd-green-accent); }
.in-cities>.in-city:last-child:nth-child(odd) { grid-column: 1/-1; }
.in-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.in-gallery__img { aspect-ratio: 4/3; }
.in-gallery__img--tall { aspect-ratio: 3/4; grid-row: span 2; }
.in-gallery__map { grid-column: 1/-1; aspect-ratio: 16/8; border-radius: 10px; overflow: hidden; background: var(--dd-bg-warm); border: 1px solid var(--dd-hairline); }
.in-gallery__map iframe { display: block; width: 100%; height: 100%; border: 0; }

@media (max-width:900px) {
	.in-paygrid { gap: 0; }
	.in-paygrid__cell { padding: 12px; aspect-ratio: 4/3; min-height: 0; border-bottom: 1px solid var(--dd-hairline); border-right: 1px solid var(--dd-hairline); }
	.in-paygrid__cell:nth-child(3n) { border-right: 0; }
	.in-paygrid__cell:nth-last-child(-n+3) { border-bottom: 0; }
	.in-paygrid__img { width: 72%; height: 36px; }
}
@media (max-width:560px) {
	.in-cities { grid-template-columns: minmax(0,1fr); }
}

/* 10. Editorial policy ------------------------------------------------------ */

.in-policy { display: flex; flex-direction: column; gap: 32px; }
.in-policy__item { display: flex; flex-direction: column; gap: 10px; }
.in-policy__num { font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); font-variant-numeric: tabular-nums; }
.in-policy__title { margin: 0; font-size: clamp(1.5rem,2.2vw,1.875rem); line-height: 1.1; letter-spacing: -.03em; }
.in-policy__body { display: flex; flex-direction: column; gap: 10px; }
.in-policy__body p, .in-policy__body ul { margin: 0; font-size: 1rem; color: var(--dd-text); max-width: 84ch; overflow-wrap: anywhere; }
.in-policy__body ul { padding: 0 0 0 20px; display: flex; flex-direction: column; gap: 4px; }
.in-policy__body .in-arrowlink { font-size: inherit; }
.in-help { margin-top: 6px; background: var(--dd-bg-warm); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 18px 22px; display: flex; flex-direction: column; gap: 6px; max-width: 84ch; box-sizing: border-box; }
.in-help__title { font-size: 0.90625rem; font-weight: 600; }
.in-help ul { margin: 0; padding: 0 0 0 20px; font-size: 0.9375rem; color: var(--dd-text); display: flex; flex-direction: column; gap: 4px; }
.in-help p { margin: 0; font-size: 0.9375rem; color: var(--dd-text); }

/* 11. Contact --------------------------------------------------------------- */

/* Crumbs over both columns, so the form card starts level with the kicker.
   Left: kicker, h1, lead, call button, then the details as a list (label |
   value rows) that ends on the form's bottom line. Right: the form. */
.in-contact { padding-block: 32px 56px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,520px); gap: 20px clamp(32px,5vw,72px); align-items: start; }
.in-contact__crumbs { grid-column: 1/-1; }
.in-contact__crumbs:empty { display: none; }
.in-contact__text { display: flex; flex-direction: column; gap: 20px; }
.in-contact__lead { margin: -6px 0 0; font-size: 1.03125rem; line-height: 1.5; color: var(--dd-text); max-width: 48ch; }
.in-contact__phone { align-self: flex-start; display: inline-flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 22px; border-radius: 8px; font-size: 1.125rem; font-weight: 600; text-decoration: none; background: var(--dd-gold); color: var(--dd-ink); }
.in-contact__note { margin: -8px 0 0; font-size: 0.84375rem; color: var(--dd-text); }
.in-details { display: flex; flex-direction: column; background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; margin-top: 8px; }
.in-details__cell { display: grid; grid-template-columns: 128px minmax(0,1fr); gap: 4px 16px; align-items: baseline; padding: 14px 20px; }
.in-details__cell + .in-details__cell { border-top: 1px solid var(--dd-hairline-card); }
.in-details__label { font-size: 0.75rem; font-weight: 600; letter-spacing: .02em; color: var(--dd-green-accent); }
.in-details__value { display: flex; flex-direction: column; gap: 4px; font-size: 0.9375rem; font-weight: 500; line-height: 1.45; }
.in-details__value p { margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.in-details__value a { text-decoration: none; overflow-wrap: anywhere; }
.in-details__value .in-details__sub { font-size: 0.84375rem; font-weight: 400; color: var(--dd-text); }
.in-details__value .in-details__link { margin-top: 4px; display: inline-flex; align-items: center; gap: 6px; font-size: 0.875rem; font-weight: 600; color: var(--dd-green-accent); word-break: normal; }
.in-contactform { background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; padding: clamp(22px,2.5vw,30px); display: flex; flex-direction: column; gap: 14px; box-sizing: border-box; }
.in-contactform__title { margin: 0; font-size: clamp(1.5rem,2.4vw,1.875rem); letter-spacing: -.03em; line-height: 1.1; }

@media (min-width:901px) {
	/* both columns end on one line: the details sit at the text column's foot */
	.in-contact { align-items: stretch; }
	.in-contact__text .in-details { margin-top: auto; }
}
.in-contactform textarea { height: 110px; min-height: 110px; }
.in-contactform .gform_footer { margin-top: 4px; padding-top: 0; }

@media (max-width:900px) {
	.in-contact { grid-template-columns: minmax(0,1fr); gap: 24px; }
	.in-contact__crumbs { margin-bottom: -10px; }
}

/* Phone: title, call button and the details first (a compact list), then the
   form full width. */
@media (max-width:560px) {
	.in-contact { padding-top: 16px; gap: 20px; }
	.in-contact__crumbs { display: none; } /* the BreadcrumbList schema stays */
	.in-contact__text { gap: 14px; }
	.in-contact__text > .in-contact__lead { margin: -4px 0 0; font-size: 1rem; }
	.in-contact__phone { align-self: stretch; justify-content: center; min-height: 52px; }
	.in-contact__note { margin: -6px 0 0; font-size: 0.78125rem; }
	.in-details { margin-top: 4px; }
	/* label above the value: the e-mail address never breaks mid-word */
	.in-details__cell { grid-template-columns: minmax(0,1fr); gap: 2px; padding: 11px 14px; }
	.in-details__value a { overflow-wrap: normal; }
	.in-details__value, .in-details__value p { gap: 2px; font-size: 0.875rem; }
	.in-details__value .in-details__sub { font-size: 0.78125rem; }
	.in-details__value .in-details__link { margin-top: 2px; font-size: 0.8125rem; }
	.in-contactform { padding: 20px 16px; }
}

/* Contact form: the note between the insurance fields and the message box. */
.in-contactform .in-formnote { margin: -6px 0 0; font-size: 0.78125rem; font-weight: 400; line-height: 1.5; color: var(--dd-text); }
.in-formcard__note p { margin: 0; }

/* Contact Us hero on the Verify Insurance layout (section/contact_hero.php). */
.vi-formcard__text { margin: 0; font-size: 0.84375rem; line-height: 1.45; color: var(--dd-text); }
.ct-hero .vi-form .gform_wrapper.gravity-theme .gfield textarea, .ct-hero .vi-form .gform_wrapper.gravity-theme .gfield textarea.small { height: 84px; min-height: 84px; }
/* Contact facts band under the hero, the Verify page's "At a glance" strip. The email
   column is wider so the address never wraps; on phones the band stacks. */
.ct-facts .lp-glance { grid-template-columns: minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.25fr); gap: 0 24px; }
.ct-facts .lp-glance__value { font-size: 0.9375rem; }
.ct-facts .in-details__value p { margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.ct-facts .in-details__value a { overflow-wrap: normal; white-space: nowrap; }
.ct-facts .in-details__value .in-details__sub { font-size: 0.84375rem; }
@media (max-width: 1100px) {
  .ct-facts .lp-glance { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .ct-facts .lp-glance { grid-template-columns: minmax(0,1fr); gap: 0; }
  .ct-facts .lp-glance__item { padding: 10px 0; }
  .ct-facts .lp-glance__item + .lp-glance__item { border-top: 1px solid var(--dd-hairline-card); }
  .ct-facts .in-details__value a { white-space: normal; overflow-wrap: anywhere; }
}
