/* =====================================================================
   Legal Consulting landing page — loaded after styles.css.
   Same brand language as the housing and invoice pages (Bebas Neue display,
   Barlow Condensed body, black bars, one green accent, 1rem == 1 artboard px)
   but a quieter presentation: still hero, one cut-out figure, flat sections,
   generous white space, structured grids.
   ===================================================================== */

.page--legal p, .page--legal li, .page--legal summary { font-family: var(--font-body); font-weight: 500; }
.kicker { font-family: var(--font-display); letter-spacing: .05em; text-transform: uppercase; color: var(--green-dark); }
.btn--ghost { background: transparent; color: var(--white); box-shadow: inset 0 0 0 2rem var(--green); }
.btn--ghost:hover, .btn--ghost:focus-visible { background: var(--green); }
.why, .funding, .cta { background: var(--black); color: var(--white); }
.why .kicker, .funding .kicker { color: var(--green); }
.services, .cases, .facts { list-style: none; }
.facts__item { display: grid; align-items: start; }
.facts__icon { display: block; object-fit: contain; }
.services__item h3, .cases__who, .expert__quote footer, .quote__who { font-family: var(--font-display); text-transform: uppercase; letter-spacing: .04em; }
.hero__kicker { font-family: var(--font-display); letter-spacing: .08em; text-transform: uppercase; color: var(--green); }
/* hero video anchored to the top of the frame: the 1.75 source gets cover-cropped to a wide band on big screens,
   and the faces are in the upper half, so the crop must come off the bottom (parallax moves it down, never up) */
.page--legal .hero__video { top: 0; object-position: 50% 0; }
.page--legal .hero__media { background-position: 50% 0; }   /* poster fallback on phones / reduced motion */
/* hero shade: dark in the bottom-left corner under the headline, fading out diagonally toward the top-right */
.page--legal .hero__shade { background: linear-gradient(to top right, rgba(0,0,0,.95) 0%, rgba(0,0,0,.92) 4.5%, rgba(0,0,0,.87) 13%, rgba(0,0,0,.75) 21%, rgba(0,0,0,.55) 65%, rgba(0,0,0,.10) 93%, rgba(0,0,0,0) 100%); }
.witness__band { background: var(--black); color: var(--white); }
.witness__band p { font-family: var(--font-display); text-transform: uppercase; letter-spacing: .04em; }
.expert__bar { background: var(--black); }
.expert__quote { border-left: 6rem solid var(--green); }
.faq__item summary { cursor: pointer; list-style: none; position: relative; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: "+"; position: absolute; right: 0; top: 0; font-family: var(--font-display); color: var(--green-dark); }
.faq__item[open] summary::after { content: "\2013"; }
.cases__amount { font-family: var(--font-display); color: var(--green-dark); }

/* =====================================================================
   DESKTOP
   ===================================================================== */
@media (min-width: 761px) {
  /* hero: shorter than the other pages, three-line headline on the left */
  .hero--legal { height: 700rem; }
  .hero__kicker { position: absolute; left: 124rem; top: 190rem; font-size: 25rem; }
  .hero__title--three { top: 232rem; font-size: 72rem; line-height: 1.02; }
  .hero--legal .hero__band--fit { top: 478rem; width: auto; padding-right: 24rem; white-space: nowrap; }
  .hero--legal .hero__btn { top: 548rem; width: auto; padding: 0 34rem; }

  /* lead */
  .lead .in { padding: 96rem 120rem 80rem; }
  .lead__grid { display: grid; grid-template-columns: 640rem 1fr; column-gap: 80rem; align-items: start; }
  .lead__p { font-size: 22rem; line-height: 30rem; }
  .lead__h2 { padding-left: 28rem; border-left: 6rem solid var(--green); font-size: 36rem; line-height: 1.08; letter-spacing: .03em; text-transform: uppercase; }
  .facts { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 40rem; margin-top: 70rem; padding-top: 34rem; border-top: max(1px, 1rem) solid #d9d9d9; }
  .facts__item { grid-template-columns: 84rem 1fr; column-gap: 22rem; }   /* row stays inside the 120rem site margins */
  .facts__icon { width: 84rem; height: 84rem; margin-top: -10rem; }
  .facts__item strong { display: block; font-family: var(--font-display); font-weight: 400; font-size: 46rem; line-height: 1; letter-spacing: .03em; text-transform: uppercase; color: var(--green-dark); }
  .facts__item span { display: block; margin-top: 10rem; font-size: 19rem; line-height: 24rem; }

  /* why: five services + a contact card */
  .why .in { padding: 100rem 120rem 110rem; }
  .why__head { display: grid; grid-template-columns: 500rem 1fr; column-gap: 80rem; align-items: start; }
  .why__h2 { font-size: 64rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .why__p { font-size: 21rem; line-height: 28rem; color: #e6e6e6; }
  .services { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30rem; margin-top: 70rem; }
  .services__item { padding: 28rem 0 0; border-top: 4rem solid var(--green); }
  .services__item h3 { font-size: 30rem; line-height: 1.02; }
  .services__item p { margin-top: 14rem; font-size: 18rem; line-height: 24rem; color: #d6d6d6; }
  .services__item--cta { border-top-color: #333; }
  .services__item--cta .btn { margin-top: 22rem; width: 182rem; height: 37rem; }

  /* counsel */
  .counsel__grid { display: grid; grid-template-columns: 640rem 1fr; column-gap: 70rem; align-items: center; padding: 100rem 120rem; }
  .counsel__video { background: var(--black); }
  .counsel__video img, .counsel__video wistia-player { display: block; width: 100%; }
  .kicker { font-size: 25rem; }
  .counsel__h2 { margin-top: 12rem; font-size: 44rem; line-height: 1.04; letter-spacing: .03em; text-transform: uppercase; }
  .counsel__p { margin-top: 22rem; font-size: 20rem; line-height: 27rem; }
  .counsel__text .btn { margin-top: 28rem; width: 182rem; height: 37rem; }

  /* testimonial */
  .quote .in { padding: 0 120rem 100rem; }
  .quote__panel { padding: 56rem 70rem 60rem; background: var(--gray); }
  .quote__text { margin-top: 18rem; max-width: 900rem; }
  .quote__text p { font-size: 30rem; line-height: 38rem; }
  .quote__who { margin-top: 20rem; font-size: 24rem; color: #333; }
  .quote__panel .btn { margin-top: 30rem; width: 182rem; height: 37rem; }

  /* witness */
  .witness .in { padding: 0 120rem; }
  .witness__h2 { padding-top: 10rem; font-size: 64rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .witness__band { margin-top: 40rem; padding: 28rem 0; }
  .witness__band p { font-size: 36rem; line-height: 1.05; }
  .witness__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 60rem; padding-top: 50rem; padding-bottom: 110rem; }
  .witness__grid p { font-size: 20rem; line-height: 27rem; }

  /* expert: black bar with the bust rising above it, like a step on the other pages */
  .expert .in { position: relative; padding: 0 120rem 110rem; }
  .expert__bar { position: absolute; left: 120rem; right: 120rem; top: 110rem; height: 200rem; }
  .expert__figure { position: absolute; left: 150rem; top: 0; width: 250rem; height: 310rem; overflow: hidden; z-index: 2; }
  .expert__figure img { width: 100%; }
  .expert__head { position: relative; height: 310rem; padding: 110rem 0 0 320rem; display: flex; flex-direction: column; justify-content: center; color: var(--white); z-index: 1; }
  .expert__head .kicker { color: var(--green); }
  .expert__h2 { margin-top: 9rem; font-size: 44rem; line-height: 1.02; letter-spacing: .05em; text-transform: uppercase; }
  .expert__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30rem 60rem; margin-top: 56rem; }
  .expert__grid p { font-size: 20rem; line-height: 27rem; }
  .expert__photo { grid-column: 2; grid-row: 2 / span 2; align-self: start; }   /* transparent cut-out of the ALE Reports binder, sits on the white page */
  .expert__photo img { display: block; width: 100%; height: auto; }
  .expert__quote { margin-top: 56rem; padding: 6rem 0 6rem 30rem; max-width: 900rem; }
  .expert__quote p { font-size: 24rem; line-height: 32rem; }
  .expert__quote footer { margin-top: 14rem; font-size: 22rem; color: var(--green-dark); }

  /* funding */
  .funding__grid { display: grid; grid-template-columns: 500rem 1fr; column-gap: 80rem; padding: 100rem 120rem; }
  .funding__h2 { font-size: 64rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .funding__text p { font-size: 22rem; line-height: 30rem; color: #e6e6e6; }
  .funding__btns { display: flex; flex-wrap: wrap; gap: 16rem; margin-top: 34rem; }
  .funding__btns .btn { height: 44rem; padding: 0 26rem; font-size: 22rem; }

  /* results */
  .results .in { padding: 100rem 120rem 90rem; }
  .cases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24rem; margin-top: 26rem; }
  .cases__item { padding: 34rem 30rem 36rem; background: var(--gray); }
  .cases__lead { font-size: 18rem; line-height: 22rem; text-transform: uppercase; letter-spacing: .03em; }
  .cases__amount { margin-top: 8rem; font-size: 64rem; line-height: 1; }
  .cases__what { margin-top: 18rem; font-size: 18rem; line-height: 22rem; }
  .cases__who { margin-top: 6rem; font-size: 24rem; line-height: 1.05; }
  .cases__how { margin-top: 18rem; padding-top: 16rem; border-top: max(1px, 1rem) solid #cfcfcf; font-size: 18rem; line-height: 23rem; }
  .results__note { margin-top: 24rem; font-size: 15rem; line-height: 20rem; color: #6a6a6a; }

  /* cta */
  .cta__grid { display: grid; grid-template-columns: 1fr auto; column-gap: 60rem; align-items: center; padding: 70rem 120rem; }
  .cta__p { padding-left: 28rem; border-left: 6rem solid var(--green); font-size: 24rem; line-height: 31rem; }
  .cta__btn { height: 56rem; padding: 0 34rem; font-size: 28rem; }

  /* faq */
  .faq__grid { display: grid; grid-template-columns: 400rem 1fr; column-gap: 80rem; padding: 100rem 120rem 110rem; }
  .faq__h2 { font-size: 64rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .faq__item { border-top: max(1px, 1rem) solid #d9d9d9; }
  .faq__item:last-child { border-bottom: max(1px, 1rem) solid #d9d9d9; }
  .faq__item summary { padding: 22rem 60rem 22rem 0; font-size: 24rem; line-height: 30rem; font-weight: 700; }
  .faq__item summary::after { top: 18rem; font-size: 40rem; }
  .faq__item p { padding: 0 60rem 26rem 0; font-size: 19rem; line-height: 26rem; }
}

/* =====================================================================
   MOBILE (<= 760px)
   ===================================================================== */
@media (max-width: 760px) {
  .hero__kicker { font-size: 18rem; margin-bottom: 12rem; }
  .hero__title--three { font-size: 46rem; }
  .hero--legal .hero__band--fit { white-space: normal; }
  .page--legal .hero__shade { background: linear-gradient(180deg, rgba(0,0,0,.3) 0%, rgba(0,0,0,.4) 35%, rgba(0,0,0,.88) 100%); }
  .kicker { font-size: 20rem; }

  .lead .in { padding-top: 60rem; padding-bottom: 50rem; }
  .lead__p { font-size: 19rem; line-height: 25rem; }
  .lead__h2 { margin-top: 30rem; padding-left: 16rem; border-left: 6rem solid var(--green); font-size: 28rem; line-height: 1.08; letter-spacing: .03em; text-transform: uppercase; }
  .facts { margin-top: 40rem; padding-top: 24rem; border-top: 1px solid #d9d9d9; display: grid; row-gap: 22rem; }
  .facts__item { grid-template-columns: 60rem 1fr; column-gap: 16rem; }
  .facts__icon { width: 60rem; height: 60rem; margin-top: -6rem; }
  .facts__item strong { display: block; font-family: var(--font-display); font-weight: 400; font-size: 38rem; line-height: 1; letter-spacing: .03em; text-transform: uppercase; color: var(--green-dark); }
  .facts__item span { display: block; margin-top: 6rem; font-size: 18rem; line-height: 23rem; }

  .why .in { padding-top: 60rem; padding-bottom: 60rem; }
  .why__h2 { font-size: 44rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .why__p { margin-top: 20rem; font-size: 19rem; line-height: 25rem; color: #e6e6e6; }
  .services { display: grid; row-gap: 30rem; margin-top: 40rem; }
  .services__item { padding-top: 18rem; border-top: 4rem solid var(--green); }
  .services__item h3 { font-size: 26rem; line-height: 1.02; }
  .services__item p { margin-top: 10rem; font-size: 18rem; line-height: 24rem; color: #d6d6d6; }
  .services__item--cta { border-top-color: #333; }
  .services__item--cta .btn { margin-top: 16rem; height: 40rem; padding: 0 24rem; }

  .counsel__grid { padding-top: 60rem; padding-bottom: 50rem; }
  .counsel__video { background: var(--black); }
  .counsel__video img, .counsel__video wistia-player { display: block; width: 100%; }
  .counsel__text { margin-top: 26rem; }
  .counsel__h2 { margin-top: 8rem; font-size: 30rem; line-height: 1.05; letter-spacing: .03em; text-transform: uppercase; }
  .counsel__p { margin-top: 16rem; font-size: 18rem; line-height: 24rem; }
  .counsel__text .btn { margin-top: 20rem; height: 40rem; padding: 0 24rem; }

  .quote .in { padding-bottom: 50rem; }
  .quote__panel { padding: 30rem 22rem 34rem; background: var(--gray); }
  .quote__text { margin-top: 14rem; }
  .quote__text p { font-size: 22rem; line-height: 29rem; }
  .quote__who { margin-top: 14rem; font-size: 20rem; color: #333; }
  .quote__panel .btn { margin-top: 22rem; height: 40rem; padding: 0 24rem; }

  .witness__h2 { font-size: 40rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .witness__band { margin-top: 24rem; padding: 20rem 0; }
  .witness__band p { font-size: 24rem; line-height: 1.1; }
  .witness__grid { display: grid; row-gap: 18rem; padding-top: 30rem; padding-bottom: 60rem; }
  .witness__grid p { font-size: 18rem; line-height: 24rem; }

  .expert .in { display: flex; flex-direction: column; padding-bottom: 60rem; }
  .expert__bar { display: none; }
  .expert__figure { order: 1; width: 52%; margin-bottom: -40rem; z-index: 2; }
  .expert__figure img { width: 100%; }
  .expert__head { order: 2; margin: 0 -22rem; padding: 56rem 22rem 26rem; background: var(--black); color: var(--white); }
  .expert__head .kicker { color: var(--green); }
  .expert__h2 { margin-top: 6rem; font-size: 32rem; line-height: 1.02; letter-spacing: .05em; text-transform: uppercase; }
  .expert__grid { order: 3; display: grid; row-gap: 18rem; margin-top: 26rem; }
  .expert__grid p { font-size: 18rem; line-height: 24rem; }
  .expert__photo img { display: block; width: 100%; height: auto; }
  .expert__quote { order: 4; margin-top: 30rem; padding: 4rem 0 4rem 18rem; }
  .expert__quote p { font-size: 20rem; line-height: 27rem; }
  .expert__quote footer { margin-top: 10rem; font-size: 20rem; color: var(--green-dark); }

  .funding__grid { padding-top: 60rem; padding-bottom: 60rem; }
  .funding__h2 { font-size: 44rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .funding__text { margin-top: 20rem; }
  .funding__text p { font-size: 19rem; line-height: 25rem; color: #e6e6e6; }
  .funding__btns { display: grid; row-gap: 12rem; margin-top: 24rem; }
  .funding__btns .btn { height: 44rem; padding: 0 20rem; font-size: 18rem; white-space: normal; text-align: center; }

  .results .in { padding-top: 60rem; padding-bottom: 50rem; }
  .cases { display: grid; row-gap: 16rem; margin-top: 18rem; }
  .cases__item { padding: 24rem 20rem 26rem; background: var(--gray); }
  .cases__lead { font-size: 16rem; line-height: 20rem; text-transform: uppercase; letter-spacing: .03em; }
  .cases__amount { margin-top: 6rem; font-size: 50rem; line-height: 1; }
  .cases__what { margin-top: 14rem; font-size: 17rem; line-height: 21rem; }
  .cases__who { margin-top: 4rem; font-size: 22rem; line-height: 1.05; }
  .cases__how { margin-top: 14rem; padding-top: 12rem; border-top: 1px solid #cfcfcf; font-size: 17rem; line-height: 22rem; }
  .results__note { margin-top: 18rem; font-size: 14rem; line-height: 19rem; color: #6a6a6a; }

  .cta__grid { padding-top: 50rem; padding-bottom: 50rem; }
  .cta__p { padding-left: 16rem; border-left: 6rem solid var(--green); font-size: 20rem; line-height: 26rem; }
  .cta__btn { margin-top: 24rem; height: 48rem; padding: 0 22rem; font-size: 20rem; white-space: normal; text-align: center; }

  .faq__grid { padding-top: 60rem; padding-bottom: 60rem; }
  .faq__h2 { font-size: 44rem; line-height: 1.01; letter-spacing: .04em; text-transform: uppercase; }
  .faq__list { margin-top: 24rem; }
  .faq__item { border-top: 1px solid #d9d9d9; }
  .faq__item:last-child { border-bottom: 1px solid #d9d9d9; }
  .faq__item summary { padding: 16rem 40rem 16rem 0; font-size: 20rem; line-height: 26rem; font-weight: 700; }
  .faq__item summary::after { top: 12rem; font-size: 32rem; }
  .faq__item p { padding: 0 30rem 20rem 0; font-size: 18rem; line-height: 24rem; }
}

/* reduced motion: styles.css swaps the hero video for the storm poster; this page has its own still */
@media (prefers-reduced-motion: reduce) {
  .page--legal .hero__media { background-image: url("../assets/img/legal/lc-hero.jpg?v=ba8043ef"); }
}
