/* LocalCases homepage: approved navy/gold presentation.
   Load after the existing homepage styles. All rules require body.lc-homepage.
   Sample-report overrides only disable its reveal animation; the data stays intact. */

.lc-homepage {
  --home-marker: #f0cb5e;
  --home-gold-top: #f7dfa0;
  --home-gold-face: #deb339;
  --home-gold-base: #be8b16;
  --home-control-edge: #788393;
  --home-heading: var(--heading, "Figtree", "Archivo", Arial, sans-serif);
}

/* Navigation stays within the existing bounded wrap. */
.lc-homepage .nav {
  border-bottom-color: #dbc481;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .9), 0 8px 22px -20px rgba(11, 27, 51, .55);
}
.lc-homepage .nav .wrap { align-items: center; }
.lc-homepage .nav .btn { min-height: 44px; }
.lc-homepage .navlinks a {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--navy);
}
.lc-homepage .navlinks a:focus-visible::after { transform: scaleX(1); }
.lc-homepage .navmenu {
  min-width: 68px;
  min-height: 44px;
  padding: 12px 16px;
  border-color: #a3acb9;
  background: #fff;
}
.lc-homepage .navmenu:active { transform: scale(.96); background: #fbf6e9; }

/* Figtree supports the larger editorial headings; Archivo remains the hero face. */
.lc-homepage :is(.ask-title, .stakes .statement, .hero .deck, .hero .answer),
.lc-homepage :is(.how, .scan, .system, .timeline, .excl, .guarantee, .faq, .closer) h2,
.lc-homepage :is(.how, .system, .timeline) h3 {
  font-family: var(--home-heading);
  font-weight: 700;
  font-stretch: normal;
}
.lc-homepage :is(.ask-title, .stakes .statement),
.lc-homepage :is(.how, .scan, .system, .timeline, .excl, .guarantee, .faq) h2 {
  line-height: 1.05;
}

/* The headline pin is the deliberate LocalCases exception: before SIGN MORE. */
.lc-homepage .hero { isolation: isolate; }
.lc-homepage .hero-grid { grid-template-rows: max-content 1fr; }
.lc-homepage .hero h1 {
  font-size: clamp(58px, 8.4vw, 132px);
  line-height: .91;
  font-weight: 900;
  font-stretch: 72%;
}
.lc-homepage .hero h1 .hero-title-line {
  display: flex;
  align-items: center;
  gap: .11em;
  min-width: 0;
}
.lc-homepage .hero h1 .hero-title-line > span { min-width: 0; }
.lc-homepage .hero h1 .hero-pin {
  display: block;
  flex: 0 0 auto;
  width: .51em;
  height: .66em;
  filter: drop-shadow(0 3px 2px rgba(80, 54, 8, .16)) drop-shadow(0 8px 7px rgba(80, 54, 8, .15));
}
.lc-homepage .hero .deck { line-height: 1.25; }
.lc-homepage .hero .answer {
  display: block;
  font-size: clamp(28px, 2.9vw, 44px);
  line-height: 1.22;
}
.lc-homepage .hero .answer span {
  display: inline;
  color: var(--ink);
  background: linear-gradient(180deg, transparent 60%, var(--home-marker) 60%);
  padding: 0 .12em;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  text-shadow: none;
  white-space: nowrap;            /* "Be the Answer!" stays together and drops to the next line as one phrase */
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* Enamel is reserved for actual controls. No blanket !important palette layer. */
.lc-homepage :is(.btn-primary, .btn-onnavy) {
  color: var(--navy);
  background: linear-gradient(180deg, var(--home-gold-top), var(--home-gold-face) 44%, var(--home-gold-base));
  border-color: #b88718;
  border-bottom-color: #8a5e06;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .3);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), inset 0 -2px 0 rgba(92, 61, 0, .13),
    0 2px 0 #8a5e06, 0 5px 7px -3px rgba(80, 54, 8, .24), 0 13px 20px -12px rgba(80, 54, 8, .35);
}
@media (hover: hover) and (pointer: fine) {
  .lc-homepage :is(.btn-primary, .btn-onnavy):hover {
    transform: translateY(-1px);
    background: linear-gradient(180deg, #fae7b5, #e9c355 44%, #c89620);
    border-color: #b88718;
    box-shadow: inset 0 1px 0 #fff, inset 0 -2px 0 rgba(92, 61, 0, .13),
      0 3px 0 #8a5e06, 0 8px 12px -5px rgba(80, 54, 8, .3), 0 17px 25px -15px rgba(80, 54, 8, .3);
  }
}
.lc-homepage :is(.btn-primary, .btn-onnavy):active {
  transform: translateY(1px);
  background: linear-gradient(180deg, #e7bf51, #c99622);
  box-shadow: inset 0 2px 3px rgba(92, 61, 0, .2), 0 1px 0 #8a5e06;
}
.lc-homepage :is(.btn-primary, .btn-onnavy):focus-visible {
  outline: 2px solid #fff;
  outline-offset: 1px;
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--navy);
}
.lc-homepage :is(.btn-primary, .btn-onnavy):disabled {
  transform: none;
  cursor: wait;
}

/* Raised white conversion panel, with the invalid state explicitly preserved. */
.lc-homepage .zipbox {
  background: #fff;
  border: 1px solid #ddd0aa;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(11, 27, 51, .06),
    0 10px 25px -5px rgba(11, 27, 51, .09), 0 8px 10px -6px rgba(11, 27, 51, .05);
}
.lc-homepage .zipform { align-items: stretch; }
.lc-homepage .zipform input {
  min-height: 60px;
  line-height: 1.2;
  padding-inline: 20px;
  color: var(--ink);
  background: linear-gradient(#f8f9fb, #fff 45%);
  border: 1.5px solid var(--home-control-edge);
  box-shadow: inset 0 2px 4px rgba(11, 27, 51, .06), 0 1px 0 #fff;
}
.lc-homepage .zipform .btn { min-height: 60px; }
.lc-homepage .zipform input::placeholder { color: #626e80; opacity: 1; }
.lc-homepage .zipform input:focus {
  border-color: var(--gold-ink);
  outline: none;
  box-shadow: 0 0 0 4px rgba(201, 151, 28, .22), inset 0 1px 3px rgba(11, 27, 51, .05);
}
.lc-homepage :is(.fields, .field) input { border-color: var(--home-control-edge); }
.lc-homepage .zipbox.is-invalid input,
.lc-homepage .mbody .is-invalid input { border-color: var(--no); }
.lc-homepage .zipbox.is-invalid input:focus,
.lc-homepage .mbody .is-invalid input:focus {
  border-color: var(--no);
  box-shadow: 0 0 0 4px rgba(179, 38, 30, .15);
}
.lc-homepage .zipbox .undercta.guar {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e5d7b5;
  color: var(--ink);
  font-weight: 600;
}
.lc-homepage .undercta.guar svg {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  margin-top: 3px;
  color: var(--gold-ink);
}
.lc-homepage .undercta.guar .guar-copy { min-width: 0; }
.lc-homepage .proofs { gap: 24px; }
.lc-homepage .proofs li {
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  line-height: 1.6;
}
.lc-homepage .proofs .tick {
  width: 26px;
  height: 26px;
  color: var(--gold-ink);
  border-color: #d4b76c;
  background: linear-gradient(145deg, #fff, #faf1d6);
  box-shadow: inset 0 1px 0 #fff, 0 2px 3px rgba(11, 27, 51, .06);
}
.lc-homepage .proofs .tick svg { width: 16px; height: 16px; }

/* These washes affect the map behind the content, never the content itself. */
.lc-homepage .hero::before {
  background: linear-gradient(0deg, #fff, rgba(255, 255, 255, 0) 16%),
    linear-gradient(90deg, rgba(255, 255, 255, .95), rgba(255, 255, 255, .75) 38%, rgba(255, 255, 255, .16) 72%),
    radial-gradient(ellipse at 43% 48%, rgba(255, 255, 255, .55), transparent 70%);
}
.lc-homepage .asking { isolation: isolate; }
.lc-homepage .zipmap { transition: filter .3s ease; }
/* Quieter behind the questions, but still a map: the pins that drop as people ask stay visible. */
.lc-homepage .zipmap.map-at-questions { filter: grayscale(.45) opacity(.6); }
.lc-homepage .asking::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg, #fff, rgba(255, 255, 255, .58) 120px, rgba(255, 255, 255, .58) 90%, #fff);
}

/* Gold hardware, with a restrained reflection edge and a broad physical shadow. */
.lc-homepage .hero-phone .phone {
  background: linear-gradient(135deg, #fff3cd, #c5a15a 13%, #52442a 32%, #151d2a 64%, #b58b3f 88%, #f8e3ac);
  box-shadow: 0 0 0 1px rgba(68, 49, 13, .55), inset 0 0 0 1px rgba(255, 255, 255, .8),
    inset 0 0 0 4px rgba(10, 21, 38, .8), 0 5px 7px rgba(11, 27, 51, .18),
    7px 25px 28px -18px rgba(11, 27, 51, .45), 8px 34px 48px -14px rgba(11, 27, 51, .27);
}
.lc-homepage .hero-phone .phone::after {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2px;
  border-radius: inherit;
  background: linear-gradient(130deg, #fff9e8, #ead39a 15%, rgba(255, 255, 255, .06) 40%, rgba(201, 151, 28, .05) 68%, #d5b663 88%, #fff2ce);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.lc-homepage .phone .screen {
  background: radial-gradient(ellipse at 0% 0%, #182d4e, transparent 52%), linear-gradient(#0b1931, #071227);
  box-shadow: 0 0 0 1px #050b15, inset 0 1px 2px rgba(255, 236, 185, .15);
}
.lc-homepage .phone .shead { border-bottom-color: rgba(255, 227, 161, .13); }
.lc-homepage .phone .bubble.user {
  background: linear-gradient(155deg, #ecd06e, #ce9f24);
  color: var(--navy);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 3px 7px rgba(0, 0, 0, .12);
}
.lc-homepage .phone .chat > .bubble { flex-shrink: 0; }
.lc-homepage .phone .rec {
  grid-template-columns: 14px minmax(0, 1fr);
  gap: 6px 8px;
  padding: 11px 10px;
}
.lc-homepage .phone .rec > span:last-child:empty { display: none; }
.lc-homepage .phone .rec.you {
  background: linear-gradient(145deg, #1c3b61, #122b4c 52%, #102440);
  border-color: #dfbc61;
  box-shadow: inset 0 1px 0 rgba(255, 235, 184, .32), inset 0 -2px 0 rgba(0, 0, 0, .15),
    0 2px 0 #061022, 0 6px 10px rgba(0, 0, 0, .22), 0 0 20px -12px rgba(242, 207, 102, .4);
}
.lc-homepage .phone .rec.you b { color: #fff; }
.lc-homepage .phone .rec.you small { color: #d3deec; }
.lc-homepage .phone .rec.you .no { color: #f0cc72; }
.lc-homepage .phone .badge-rec {
  grid-column: 2;
  justify-self: start;
  color: var(--navy);
  background: linear-gradient(#f8e5b2, #e2bd61);
  border: 1px solid rgba(255, 237, 192, .65);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 2px 3px rgba(0, 0, 0, .2);
}
.lc-homepage .phone .send {
  background: linear-gradient(145deg, #f1d47e, #c99b2d);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 2px 4px rgba(0, 0, 0, .25);
}

/* Caption remains still; its quote is a separate readable emphasis. */
.lc-homepage .hero-side .story {
  max-width: 42ch;
  padding: 22px 24px;
  border: 1px solid #e0d3b2;
  border-radius: 14px;
  background: linear-gradient(130deg, rgba(255, 255, 255, .96), rgba(255, 252, 243, .9));
  color: #3c485b;
  box-shadow: inset 0 1px 0 #fff, 0 2px 3px rgba(11, 27, 51, .04), 0 10px 25px rgba(11, 27, 51, .07);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.lc-homepage .hero-side .story::before { content: none; }
.lc-homepage .hero-side .story p { margin: 0; }
.lc-homepage .hero-side .story .voice {
  display: block;
  margin: 16px 0;
  padding-left: 20px;
  border-left: 3px solid var(--gold);
  font-family: var(--voice);
  font-style: italic;
  font-weight: 500;
  font-size: 21px;
  line-height: 1.4;
  color: var(--gold-ink);
}

/* Certificate details sit above the existing guilloche texture. */
.lc-homepage .guarantee { overflow-x: clip; }
.lc-homepage .cert {
  isolation: isolate;
  background: #fffdf7;
  box-shadow: 0 0 0 1px #d9c285, inset 0 1px 0 #fff, 0 3px 3px rgba(11, 27, 51, .1),
    0 15px 20px -14px rgba(11, 27, 51, .28), 0 44px 65px -36px rgba(11, 27, 51, .32);
}
.lc-homepage .cert::before {
  content: "";
  position: absolute;
  inset: 7px 3px -5px;
  z-index: -1;
  border: 1px solid #d5c8a6;
  border-radius: 9px;
  background: #eee8d9;
  box-shadow: inset 0 -1px 0 #fff, 0 3px 4px rgba(11, 27, 51, .06);
  pointer-events: none;
}
.lc-homepage .cert::after {
  content: "";
  position: absolute;
  inset: calc(clamp(9px, 1.1vw, 14px) + 7px);
  z-index: 2;
  background:
    linear-gradient(var(--gold), var(--gold)) left top / 22px 2px no-repeat,
    linear-gradient(var(--gold), var(--gold)) left top / 2px 22px no-repeat,
    linear-gradient(var(--gold), var(--gold)) right top / 22px 2px no-repeat,
    linear-gradient(var(--gold), var(--gold)) right top / 2px 22px no-repeat,
    linear-gradient(var(--gold), var(--gold)) left bottom / 22px 2px no-repeat,
    linear-gradient(var(--gold), var(--gold)) left bottom / 2px 22px no-repeat,
    linear-gradient(var(--gold), var(--gold)) right bottom / 22px 2px no-repeat,
    linear-gradient(var(--gold), var(--gold)) right bottom / 2px 22px no-repeat;
  pointer-events: none;
}
.lc-homepage .cert-inner {
  padding: clamp(36px, 5.7vw, 84px);
  border-color: #c4a147;
  outline-color: #eadcb7;
  box-shadow: inset 0 0 28px rgba(230, 220, 196, .22);
}
.lc-homepage .cert-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse at center, rgba(255, 255, 255, .8), rgba(251, 249, 241, .65));
  pointer-events: none;
}
.lc-homepage .cert-inner > * { position: relative; }
.lc-homepage .cert h2 { line-height: 1.04; }
.lc-homepage .cert .writing { margin-top: 8px; }
.lc-homepage .cert .terms-body {
  max-width: 65ch;
  margin-top: 24px;
  font-weight: 400;
  line-height: 1.65;
  color: #374151;
}
.lc-homepage .cert .terms { border-top-color: #e0d3b5; }
.lc-homepage .cert .seal {
  filter: drop-shadow(1px 3px 1px rgba(60, 41, 6, .2)) drop-shadow(6px 13px 10px rgba(11, 27, 51, .24));
}
.lc-homepage .seal .ribbon { filter: drop-shadow(0 2px 1px rgba(60, 41, 6, .3)); }

/* Footer hierarchy and contrast, keeping every original link and attribution. */
.lc-homepage footer {
  background: linear-gradient(180deg, var(--navy), var(--night));
  border-top: 4px solid var(--gold);
  color: #d3dce8;
  box-shadow: inset 0 1px 0 rgba(255, 227, 161, .24);
}
.lc-homepage footer .wordmark .wm { color: #fff; }
.lc-homepage footer .wordmark .wm i { color: var(--lamp); }
.lc-homepage footer .wordmark small { color: #b9c6d8; }
.lc-homepage footer .links { gap: 8px 24px; flex-wrap: wrap; }
.lc-homepage footer .links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 0;
  color: #edf2f8;
  font-weight: 400;
}
.lc-homepage footer .links .tel { font-weight: 600; }
.lc-homepage footer :is(.copy, .attrib) { font-size: 14px; line-height: 1.6; color: #cbd5e1; }
.lc-homepage footer .attrib a { color: #e2eaf5; text-underline-offset: 3px; }
.lc-homepage footer .links a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.lc-homepage footer a:focus-visible,
.lc-homepage .lc .x:focus-visible { outline: 2px solid #fff1c9; outline-offset: 4px; }

/* Keep shared form/grid behavior and modest gutters as the layout stacks. */
@media (min-width: 1280px) {
  .lc-homepage .navlinks { gap: 32px; }
}
@media (max-width: 979px) {
  .lc-homepage .navlinks {
    max-height: calc(100dvh - var(--nav-h) - var(--safe-t));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}
@media (max-width: 959px) {
  .lc-homepage .hero h1 { font-size: clamp(52px, 11.7vw, 112px); }
  .lc-homepage .hero::before {
    background: linear-gradient(0deg, #fff, rgba(255, 255, 255, 0) 14%),
      linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .75) 35%, rgba(255, 255, 255, .28) 68%, rgba(255, 255, 255, .72));
  }
  .lc-homepage .hero-side .story { align-self: center; width: 100%; }
}
@media (max-width: 760px) {
  .lc-homepage .cert .seal { width: min(230px, 80%); justify-self: center; }
}
@media (max-width: 540px) {
  .lc-homepage { --gut: clamp(20px, 6.15vw, 24px); }
  .lc-homepage .hero { padding-top: calc(var(--safe-t) + var(--nav-h) + 32px); }
  .lc-homepage .hero h1 { font-size: clamp(43px, 12.6vw, 64px); }
  .lc-homepage .hero .answer { font-size: clamp(27px, 7.2vw, 34px); line-height: 1.3; }
  .lc-homepage .zipbox {
    box-shadow: inset 0 1px 0 #fff, 0 4px 6px -1px rgba(11, 27, 51, .08), 0 10px 20px -5px rgba(11, 27, 51, .12);
  }
  .lc-homepage .zipform input { text-align: left; }
  .lc-homepage .hero-phone .phone { width: min(290px, calc(100vw - 40px)); }
  .lc-homepage .hero-side .story { font-size: 15px; padding: 20px; }
  .lc-homepage .hero-side .story .voice { font-size: 20px; padding-left: 16px; }
  .lc-homepage .cert-inner { padding: 30px 22px; }
  .lc-homepage .cert h2 { font-size: clamp(32px, 8.8vw, 45px); }
  .lc-homepage .cert .terms-body { font-size: 16px; }
  .lc-homepage .mobilebar .btn { min-height: 44px; }
}
@media (max-width: 460px) {
  .lc-homepage .nav .wrap { gap: 12px; }
  .lc-homepage .nav .lockup { flex: 0 1 auto; min-width: 0; gap: 8px; }
  .lc-homepage .nav .wordmark { min-width: 0; }
  .lc-homepage .nav .wordmark .wm { font-size: clamp(17px, 5vw, 21px); }
  .lc-homepage .nav .wordmark small { font-size: clamp(6px, 1.7vw, 7.5px); letter-spacing: .1em; }
  .lc-homepage .nav .lockup .mark { width: 25px; height: 30px; }
  .lc-homepage .navmenu { flex: 0 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .lc-homepage .zipmap { transition: none; }
  .lc-homepage :is(.btn, .navmenu):is(:hover, :active),
  .lc-homepage .btn:hover .arr { transform: none; }
  .lc-homepage .hero-phone .phone { transform: none; }
}

/* A real sample report is always shown in its finished state. The data attribute
   is the explicit opt-out from the original scanner choreography. These narrow
   important declarations also defeat the legacy band-live important rules;
   they do not change any score, rank, question, name, or table geometry. */
.lc-homepage .report[data-static-report] :is(.qrow .res, .comps li, .ring .val, .ring .num, .snode span, .stat .big) {
  animation: none !important;
  transition: none !important;
}
.lc-homepage .report[data-static-report] :is(.qrow .qt, .comps li, .ring .num, .snode span) {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}
.lc-homepage .report[data-static-report] .qrow .res.ok {
  background: var(--ok-bg) !important;
  color: var(--ok) !important;
}
.lc-homepage .report[data-static-report] .qrow .res.miss {
  background: var(--no-bg) !important;
  color: var(--no) !important;
}
.lc-homepage .report[data-static-report] .qrow .res i { background: currentColor !important; }
.lc-homepage .report[data-static-report] .qrow::before,
.lc-homepage .report[data-static-report] .report-verdict::after,
.lc-homepage .report[data-static-report] .scanbeam { display: none !important; }
.lc-homepage .report[data-static-report] .ring .val {
  stroke-dasharray: 339.3 !important;
  stroke-dashoffset: var(--off, 273.98) !important;
}
.lc-homepage .report[data-static-report] .snode::after { opacity: 1 !important; }
.lc-homepage .report[data-static-report] .snode.yes::before {
  background: var(--navy) !important;
  border-color: var(--navy) !important;
}
.lc-homepage .report[data-static-report] .snode.barely::before {
  background: linear-gradient(90deg, var(--gold) 50%, #fff 50%) !important;
  border-color: var(--gold) !important;
}
.lc-homepage .report[data-static-report] .snode.no::before {
  background: var(--no-bg) !important;
  border-color: var(--no) !important;
}
.lc-homepage .report[data-static-report] .stat .big {
  color: var(--ink) !important;
  background: transparent !important;
}
.lc-homepage .report[data-static-report] .stat:last-child .big { color: var(--gold-ink) !important; }
