/* ==========================================================================
   KuduDoc v6 — emergency-access.html in the v6 language (loaded after theme.css).
   v5 CSS sits in a lower layer, so plain rules here win; theme.css !important rules are
   overridden with !important only where noted.
   24 Sep 2026: content rewritten for Daniel's owner controls (cancel, block, several people, a waiting time you set);
   the stat row, the 'not a will' band, the reach grid and the Vault capture were cut.
   ========================================================================== */

/* ---------------------------------------------------------------- 0 · shared: the landing's 1200px column, v6 type */
html body .ea-page .ea-wrap { max-width: 1280px; }
html body .ea-page .kd-eyebrow { color: #006bcb; }
html body .ea-page .kd-h2 { font-weight: 650; letter-spacing: -.032em; }
html body .ea-page .kd-h2 .text-slate { color: #56697f; }
html body .ea-page .ea-sub { color: #56697f; }
html body .ea-page .ea-proof { color: #56697f; }
/* text links in the one link blue (v5's inherit the navy body colour), as on the other trust pages */
html body .ea-page .link-underline { color: #006bcb; font-weight: 600; text-decoration-color: rgba(0, 107, 203, .3); }
html body .ea-page .link-underline:hover { text-decoration-color: currentColor; }
/* the card every surface on this page uses */
html body .ea-page :is(.ea-ui, .ea-seat-figure) {
  border: 0; border-radius: 22px; background: #fff;
  box-shadow: inset 0 0 0 1px rgba(16, 45, 73, .07), 0 1px 2px rgba(16, 45, 73, .05), 0 16px 40px -24px rgba(16, 45, 73, .32);
}

/* ---------------------------------------------------------------- 1 · the opening: blue, the mark as a flat poster, easing into the pale ground */
/* the poster, as big as the landing's: its strokes rise from above the fold (cropped only at the top) and read
   as strokes around the access map, not as a cap peeking over it. It is anchored to the bottom so the lowest
   stroke end (88.5% down the drawing) always lands ~190px above the section's edge — whole, on the blue, never
   in the ease. The ease runs to transparent, so it meets the page ground at whatever shade it has there. */
html body #hero.ea-hero {
  position: relative; overflow: hidden; color: #fff;
  padding: 168px 0 196px !important;   /* theme.css clears the nav with !important */
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 72'%3E%3Cg transform='translate(40 36) rotate(-8) skewX(-14) translate(-31 -32)' stroke-linecap='round' stroke-width='6.5'%3E%3Cpath d='M13 14V50' stroke='%23004e99' stroke-opacity='.16'/%3E%3Cpath d='M25 9V55' stroke='%23004e99' stroke-opacity='.22'/%3E%3Cpath d='M37 13V51' stroke='%23004e99' stroke-opacity='.13'/%3E%3Cpath d='M49 18V46' stroke='%23004e99' stroke-opacity='.18'/%3E%3C/g%3E%3C/svg%3E") right -6vw bottom 40px / auto 1300px no-repeat,
    linear-gradient(180deg, #2a64a0 0, #2a64a0 calc(100% - 150px), rgba(42, 100, 160, 0) 100%),
    none;
  /* a solid colour too, so site.js reads this section as dark and gives the nav its white tone; it is
     clipped to the content box (via the empty last layer) so it never paints under the ease */
  background-color: #2a64a0;
  background-clip: border-box, border-box, content-box;
}
html body .ea-hero .ea-wrap { position: relative; z-index: 1; }
html body .ea-hero-copy > .kd-eyebrow {
  display: flex; align-items: center; margin: 0 0 6px; color: #d6eeff;
  font: 600 12.5px/1 var(--font-sans); letter-spacing: .15em; text-transform: uppercase;
}
html body .ea-hero-copy > .kd-eyebrow::before {
  content: ""; flex: none; width: 3px; height: 13px; margin-right: 10px; border-radius: 2px;
  background: #ff762b; transform: skewX(-14deg) rotate(-8deg) translateY(1px);
}
html body .ea-hero h1 { font: 650 clamp(46px, 6vw, 86px)/.98 var(--font-display); letter-spacing: -.038em; color: #fff; }
html body .ea-hero h1 .ea-h1-first { color: #fff; }
html body .ea-hero h1 .text-slate { color: #a9dcff; }
html body .ea-hero h1 .kd-rule { width: 96px; height: 4px; margin: 18px 0 16px; background: #ff762b; }
html body .ea-hero .ea-sub { font: 400 clamp(20px, 2vw, 26px)/1.4 var(--font-sans); letter-spacing: -.012em; color: rgba(236, 244, 252, .86); }
/* the boundary chips were cut (the hero card already says ordinary documents only, never the Vault); a little air before the buttons instead */
html body .ea-hero-actions { margin-top: 10px; }
html body .ea-hero-copy > .fence { color: rgba(236, 244, 252, .86); }
/* a fence's rule is its ::before; on the blue it is pale, not a blue line lost in the blue */
html body :is(.ea-hero, #closing) .fence::before { background: rgba(214, 238, 255, .5); }
html body .ea-hero .btn-ghost { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(191, 227, 255, .45); padding-left: 22px; padding-right: 22px; }
html body .ea-hero .btn-ghost:hover { background: rgba(191, 227, 255, .1); color: #fff; }
html body .ea-hero .ea-cta-note { color: rgba(236, 244, 252, .8); }
/* the access map: a white card on the blue */
html body .ea-hero-figure {
  border: 0; border-radius: 24px; background: #fff; color: #102d49;
  box-shadow: 0 2px 4px rgba(6, 22, 42, .08), 0 24px 60px -18px rgba(6, 22, 42, .38);
}
html body .ea-map-heading > b { font-weight: 650; color: #102d49; }
html body .ea-window { border: 0; border-radius: 18px; background: #f3f8fd; }
html body .ea-window strong { font-weight: 650; color: #102d49; }
html body .ea-people > svg { stroke: #006bcb; }            /* the one orange stays for the CTA and the rule */
/* the illustrated states' labels: Montserrat 650 like every heading, not 700 */
html body .ea-page :is(.ea-ui-person b, .ea-mail-subject, .ea-wait b, .ea-doc-head b) { font-weight: 650; }

/* ---------------------------------------------------------------- 3 · the four steps: illustrated states become cards */
html body .ea-ui > figcaption { border-bottom-color: rgba(16, 45, 73, .07); }
html body .ea-ui-footer { border-top-color: rgba(16, 45, 73, .08); }
html body .ea-step-copy h3 { font-weight: 650; color: #102d49; }
html body .ea-step-copy p { color: #56697f; }
html body .ea-step-number { color: #006bcb; }
html body .ea-step::before { background: rgba(16, 45, 73, .1); }
/* "Wait" is a state, not the seal: blue, not orange */
html body .ea-step:nth-child(3) > i { background: #006bcb; }
html body .ea-chip-wait { background: #e3effa; color: #004e99; }
html body .ea-chip-wait::before { background: #006bcb; }
html body .ea-timer svg { stroke: #006bcb; }
html body .ea-timer .ea-timer-track { stroke: #dcebf8; }
html body .ea-timer strong { font-weight: 650; color: #102d49; }

/* ---------------------------------------------------------------- 3b · the illustrated states: a second person, the mock cancel control, record notes */
html body .ea-ui-person + .ea-ui-person { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(16, 45, 73, .07); }
html body .ea-mock-btn {
  display: inline-flex; align-items: center; margin-top: 14px; padding: 7px 14px; border-radius: 999px;
  font: 600 13px/1.2 var(--font-sans); color: #102d49; background: #fff; box-shadow: inset 0 0 0 1.5px rgba(16, 45, 73, .2);
}
html body .ea-timer strong { font-size: 22px; letter-spacing: -.03em; }
html body .ea-doc-note { display: block; margin-top: 3px; font: 400 12.5px/1.4 var(--font-sans); font-style: normal; color: #56697f; }

/* ---------------------------------------------------------------- 4 · your rules: four controls beside the illustrated rules card */
html body #controls .ea-title .kd-h2 { text-wrap: balance; }
html body .ea-controls-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
html body .ea-control-list { list-style: none; margin: 0; padding: 0; }
html body .ea-control-list li { display: flex; gap: 18px; align-items: flex-start; padding: 22px 0; border-top: 1px solid rgba(16, 45, 73, .08); }
html body .ea-control-list li:first-child { border-top: 0; padding-top: 0; }
html body .ea-control-list li > .icon {
  flex: none; width: 44px; height: 44px; padding: 11px; border-radius: 14px; box-sizing: border-box;
  color: #006bcb; background: #eef5fc; fill: none; stroke: currentColor;
}
html body .ea-control-list h3 { margin: 2px 0 6px; font: 650 19px/1.3 var(--font-display); letter-spacing: -.02em; color: #102d49; }
html body .ea-control-list p { margin: 0; font-size: 15.5px; line-height: 1.55; color: #56697f; }
html body .ea-rules { max-width: 540px; justify-self: end; width: 100%; }
html body .ea-rule-list { margin: 14px 0 0; }
html body .ea-rule-list > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 0; border-top: 1px solid rgba(16, 45, 73, .07); }
html body .ea-rule-list dt { font-size: 14px; color: #56697f; }
html body .ea-rule-list dd { display: flex; align-items: center; gap: 10px; margin: 0; font: 650 14.5px/1.3 var(--font-sans); color: #102d49; text-align: right; }
html body .ea-mini-avatars { display: inline-flex; }
html body .ea-mini-avatars .avatar { width: 28px; height: 28px; font-size: 10px; box-shadow: 0 0 0 2px #fff; }
html body .ea-mini-avatars .avatar + .avatar { margin-left: 4px; }
html body .ea-quorum {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 8px;
  padding: 14px 16px; border-radius: 14px; background: #f3f8fd;
}
html body .ea-quorum b { display: block; font: 650 15px/1.3 var(--font-display); color: #102d49; }
html body .ea-quorum small { display: block; margin-top: 3px; font-size: 13px; color: #56697f; }
html body .ea-quorum .ea-mock-btn { margin-top: 0; flex: none; }

/* ---------------------------------------------------------------- 5 · household: one row, the heading is the section's */
html body .ea-household-row { border-top: 0; padding: 0; }
html body .ea-household-row .kd-h2 { margin: 0; }
html body .ea-household-row .kd-marks { font-size: 16px; color: #3f5470; }

/* ---------------------------------------------------------------- 4b · household: rows on the ground, the seat list as a card */
html body .ea-feature-row { border-top-color: rgba(16, 45, 73, .08); }
html body .ea-feature-copy .kd-h3 { font-weight: 650; letter-spacing: -.025em; }
html body .ea-feature-copy p { color: #56697f; }
html body .ea-seat-figure.surface-paper { padding: 26px; }
html body .ea-seat { border-color: rgba(16, 45, 73, .1); border-radius: 14px; }
html body .ea-seat.is-payer { border-color: #006bcb; }
html body .ea-seat.is-empty { background: #f6f9fd; }

/* ---------------------------------------------------------------- 7 · FAQ: theme.css boxes each item; give the text room inside the box */
html body .ea-faq .accordion-trigger { padding: 22px 20px 22px 24px; color: #102d49; }
html body .ea-faq .accordion-body { padding: 0 24px 22px; color: #56697f; }

/* ---------------------------------------------------------------- 8 · the closing: full bleed, straight into the footer */
html body #closing.ea-closing { padding: 0 !important; max-width: none; }
html body #closing.ea-closing > .ea-wrap { max-width: none; padding: 0; }
html body #closing.ea-closing .cta-gradient {
  grid-template-columns: minmax(0, 1fr);
  padding: 112px max(40px, calc((100% - 1200px) / 2)) 96px !important;
}
html body #closing.ea-closing .cta-gradient::after { content: none; }
html body #closing.ea-closing .cta-gradient-inner { max-width: 1200px; margin: 0; }
html body #closing.ea-closing .cta-gradient-kd .eyebrow { color: #d6eeff; }
html body #closing.ea-closing .fence { color: rgba(236, 244, 252, .82); max-width: 72ch; }
html body #closing.ea-closing .ea-close-note { color: rgba(236, 244, 252, .8); }
/* the page ends where the closing band ends */
html body .ea-page { padding-bottom: 0; margin-bottom: 0; }

/* ---------------------------------------------------------------- phone */
@media (max-width: 1200px) and (min-width: 901px) {
  html body #hero.ea-hero { background-position: right -6vw bottom 75px, 0 0, 0 0; background-size: auto 1000px, auto, auto; }
}
@media (max-width: 900px) {
  html body .ea-controls-row { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  html body .ea-rules { justify-self: stretch; max-width: none; }
  html body #hero.ea-hero { padding: 132px 0 180px !important; background-position: right -40vw top 90px, 0 0, 0 0; background-size: auto 820px, auto, auto; }
}
@media (max-width: 600px) {
  html body #hero.ea-hero { padding: 124px 0 170px !important; }
  html body .ea-hero h1 { font-size: 46px; }
  html body .ea-hero .ea-sub { font-size: 19px; }
  html body .ea-hero-actions { gap: 10px; }
  html body .ea-hero-actions .btn-ghost { width: 100%; padding: 12px 22px; }
  html body .ea-faq .accordion-trigger { padding: 20px 14px 20px 18px; }
  html body .ea-faq .accordion-body { padding: 0 18px 20px; }
  html body #closing.ea-closing .cta-gradient { padding: 80px 20px 64px !important; }
  html body .ea-control-list li { gap: 14px; padding: 18px 0; }
  html body .ea-control-list h3 { font-size: 17.5px; }
  html body .ea-control-list p { font-size: 15px; }
  html body .ea-quorum { flex-direction: column; align-items: flex-start; }
}

/* ---------------------------------------------------------------- SEO wording pass (27 Sep 2026) */
/* step 04's pointer to the life file checklist: a quieter second line under the step copy */
html body .ea-step-copy p.ea-step-more { margin-top: 14px; font-size: 15px; }
/* the steps heading is now the searched question; give it room for two lines, keep the paragraph at reading width */
html body #steps .ea-title { max-width: 980px; }
html body #steps .ea-title .kd-h2 { text-wrap: balance; }
html body #steps .ea-title .ea-sub { max-width: 720px; }

/* review (27 Sep 2026): the closing's primary action is the landing's orange, as on every other page */
html body #closing .btn-onblue {
  color: #fff; border: 0; background: linear-gradient(180deg, #ff8f45 0%, #ff6a30 55%, #ff5528 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -1px 0 rgba(160,40,10,.25), 0 1px 2px rgba(120,30,0,.25), 0 8px 22px -6px rgba(255,90,40,.55);
}
html body #closing .btn-onblue:hover { background: linear-gradient(180deg, #ff9a55 0%, #ff7036 55%, #ff5a2c 100%); color: #fff; }
