.guide-page {
  --info-green: var(--green);
  --info-accent: var(--green);
  --info-pale: #f4f7f4;
  --info-line: var(--line);
  background: #fff;
}
.guide-page .site-header { background: rgba(255,255,255,.97); }
.guide-page .page-hero {
  background-image:
    linear-gradient(90deg, rgba(0,63,48,.94) 0%, rgba(0,63,48,.86) 42%, rgba(0,63,48,.48) 74%, rgba(0,63,48,.12) 100%),
    url("images/tomoe24-hero-guide-v1.png");
}
.guide-page .page-hero h1 { color: var(--white); }
.guide-page .page-hero__eyebrow,
.guide-page .section-kicker { color: var(--gold); }
.guide-page .page-section { background: #fff; }
.guide-page .section-title { color: var(--info-green); font-size: clamp(28px, 2.6vw, 36px); }

.guide-basics { padding-top: 48px; }
.guide-schedule { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--info-line); background: #fff; }
.guide-period { padding: 28px 32px; }
.guide-period + .guide-period { border-left: 1px solid var(--info-line); }
.guide-period__label { margin-bottom: 4px; color: var(--info-accent); font-size: 16px; font-weight: 700; letter-spacing: .08em; }
.guide-period strong { display: block; color: var(--info-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(28px, 3vw, 38px); font-weight: 400; font-variant-numeric: lining-nums tabular-nums; }
.guide-facts { margin: 0; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--info-line); border-top: 0; }
.guide-facts > div { display: grid; grid-template-columns: 90px 1fr; gap: 18px; padding: 20px 32px; }
.guide-facts > div + div { border-left: 1px solid var(--info-line); }
.guide-facts dt { color: var(--info-green); font-weight: 700; }
.guide-facts dd { margin: 0; }
.guide-facts small { display: block; color: var(--muted); font-size: 16px; }

.guide-flow { background: #f4f7f4 !important; }
.guide-timeline { margin: 0; padding: 0; list-style: none; }
.guide-step {
  position: relative;
  display: grid;
  grid-template-columns: 92px 190px minmax(0, 1fr);
  gap: 30px;
  padding: 30px 0;
  border-top: 1px solid var(--info-line);
}
.guide-step:last-child { border-bottom: 1px solid var(--info-line); }
.guide-step__number { color: var(--info-accent); font-family: "Cormorant Garamond", Georgia, serif; font-size: 38px; line-height: 1; }
.guide-step__time { color: var(--info-green); font-size: 20px; font-weight: 700; line-height: 1.8; }
.guide-step__time span { display: inline-block; min-width: 3em; margin-right: 8px; color: var(--muted); font-size: 16px; font-weight: 700; }
.guide-step__body h3 { margin-bottom: 8px; color: var(--info-green); font-family: var(--serif); font-size: 23px; font-weight: 600; line-height: 1.6; }
.guide-step__body p { margin-bottom: 0; }
.guide-step__body ul { margin: 14px 0 0; padding-left: 1.2em; }
.guide-machine-breakdown { margin-top: 16px; padding: 14px 18px; border-left: 3px solid var(--gold); background: #fff; color: var(--info-green); font-weight: 700; }

.rest-note { margin-top: 40px; padding: 30px 34px; display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 30px; border-top: 2px solid var(--gold); background: var(--info-pale); }
.rest-note h3 { margin: 0; color: var(--info-green); font-family: var(--serif); font-size: 22px; font-weight: 600; }
.rest-note p { margin: 0; }

.start-flow { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid var(--info-line); background: #fff; box-shadow: 0 12px 30px rgba(0, 63, 48, .045); list-style: none; }
.start-flow li { position: relative; padding: 28px 24px; border-right: 1px solid var(--info-line); }
.start-flow li:last-child { border-right: 0; }
.start-flow__no { margin-bottom: 16px; color: var(--info-accent); font-family: "Cormorant Garamond", Georgia, serif; font-size: 32px; line-height: 1; }
.start-flow h3 { margin-bottom: 10px; color: var(--info-green); font-size: 18px; }
.start-flow p:last-child { margin-bottom: 0; font-size: 17px; }
.guide-page .start-flow-contact { width: min(100%, 360px); margin-top: 28px; }

.eligibility-summary { margin-top: 38px; padding: 28px 30px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 32px; background: #f4f7f4; }
.eligibility-summary h3 { margin-bottom: 8px; color: var(--info-green); font-family: var(--serif); font-size: 23px; font-weight: 600; }
.eligibility-summary p { margin-bottom: 0; }
.eligibility-summary .text-link { min-height: 48px; padding: 8px 16px; border: 1px solid var(--info-green); text-decoration: none; }

.access-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--info-line); background: #fff; }
.access-item { padding: 28px; border-right: 1px solid var(--info-line); }
.access-item:last-child { border-right: 0; }
.access-item h3 { margin-bottom: 12px; color: var(--info-green); font-size: 18px; }
.access-item p:last-child { margin-bottom: 0; }

@media (max-width: 900px) {
  .guide-step { grid-template-columns: 72px 170px minmax(0, 1fr); gap: 20px; }
  .start-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .start-flow li:nth-child(2) { border-right: 0; }
  .start-flow li:nth-child(n+3) { border-top: 1px solid var(--info-line); }
}

@media (max-width: 768px) {
  .guide-schedule, .guide-facts { grid-template-columns: 1fr; }
  .guide-period + .guide-period, .guide-facts > div + div { border-left: 0; border-top: 1px solid var(--info-line); }
  .guide-period { padding: 22px 20px; }
  .guide-facts > div { padding: 16px 20px; }
  .guide-step { grid-template-columns: 54px minmax(0, 1fr); gap: 16px; }
  .guide-step__time { grid-column: 2; }
  .guide-step__body { grid-column: 2; }
  .guide-step__number { grid-row: 1 / span 2; }
  .rest-note { grid-template-columns: 1fr; gap: 12px; padding: 26px 22px; }
  .start-flow { grid-template-columns: 1fr; }
  .start-flow li { border-right: 0; border-top: 1px solid var(--info-line); }
  .start-flow li:first-child { border-top: 0; }
  .eligibility-summary { grid-template-columns: 1fr; padding: 26px 22px; }
  .eligibility-summary .text-link { justify-content: space-between; }
  .access-grid { grid-template-columns: 1fr; }
  .access-item { border-right: 0; border-bottom: 1px solid var(--info-line); }
  .access-item:last-child { border-bottom: 0; }
}

/* Exact final card-timeline treatment from 07-guide-current.html. */
.guide-flow--source { padding: 80px 0; background: #fff !important; }
.guide-flow--source .page-inner { width: min(1040px, calc(100% - 96px)); }
.guide-flow--source .section-title { font-size: 32px; line-height: 1.5; }
.guide-flow--source .section-lead { max-width: 46em; margin: 24px 0 0; font-size: 18px; line-height: 1.9; }
.guide-flow--source .guide-flow__panel { margin-top: 46px; overflow: hidden; border: 1px solid rgba(0, 86, 63, .13); border-radius: 26px; background: #fff; box-shadow: 0 12px 30px rgba(0, 63, 48, .045); }
.guide-flow--source .guide-timeline { position: relative; margin: 0; padding: 56px 52px 18px; list-style: none; border-radius: 0; background: transparent; box-shadow: none; }
.guide-flow--source .guide-timeline::before { display: none; }
.guide-flow--source .guide-timeline > li { position: relative; display: grid; grid-template-columns: 190px minmax(0, 1fr); grid-template-areas: "time content"; column-gap: 36px; margin: 0 0 48px; padding: 28px 34px 28px 70px; border: 1px solid var(--info-line); border-radius: 10px; background: #f4f7f4; }
.guide-flow--source .guide-timeline > li:last-child { margin-bottom: 0; }
.guide-flow--source .guide-timeline > li:not(:last-child)::after { content: ""; position: absolute; left: 50%; bottom: -32px; width: 0; height: 0; border-right: 13px solid transparent; border-bottom: 0; border-left: 13px solid transparent; border-top: 15px solid var(--gold); transform: translateX(-50%); }
.guide-flow--source .guide-step { position: absolute; top: -35px; left: -14px; z-index: auto; display: block; padding: 0; border: 0; color: var(--gold); font-size: 0; line-height: 1; }
.guide-flow--source .guide-step b { display: block; margin: 0; color: var(--gold); font-family: "Cormorant Garamond", "Times New Roman", serif; font-size: 50px; font-weight: 500; letter-spacing: -.02em; }
.guide-flow--source .guide-time { grid-area: time; align-self: start; color: var(--charcoal); font-family: Georgia, "Times New Roman", serif; font-size: 21px; font-weight: 400; font-variant-numeric: lining-nums tabular-nums; line-height: 1.8; letter-spacing: 0; white-space: nowrap; }
.guide-flow--source .guide-time span { display: inline-block; width: 54px; color: var(--info-green); font-family: var(--sans); font-size: 18px; font-weight: 700; }
.guide-flow--source .guide-timeline > li > div:last-child { grid-area: content; align-self: start; }
.guide-flow--source .guide-timeline h3 { margin: 0; color: var(--info-green); font-size: 21px; font-weight: 700; line-height: 1.5; }
.guide-flow--source .guide-timeline p { margin: 9px 0 0; font-size: 17px; line-height: 1.9; }
.guide-flow--source .guide-timeline ul { margin: 12px 0 0; padding-left: 1.2em; font-size: 17px; line-height: 1.9; }
.guide-flow--source .guide-note { color: #3f4b43; font-size: 17px; line-height: 1.8; }
.guide-flow--source .guide-rest { margin: 0 52px; padding: 26px 0 34px; border-top: 1px solid rgba(0, 86, 63, .16); border-left: 0; }
.guide-flow--source .guide-rest h3 { margin: 0; color: var(--info-green); font-size: 18px; }
.guide-flow--source .guide-rest p { margin: 8px 0 0; font-size: 17px; line-height: 1.9; }

@media (max-width: 900px) {
  .guide-flow--source .guide-timeline > li { display: block; padding: 32px 26px 26px; }
  .guide-flow--source .guide-time { margin-bottom: 12px; }
}

@media (max-width: 768px) {
  .guide-flow--source { padding: 56px 0; }
  .guide-flow--source .page-inner { width: calc(100% - 40px); }
  .guide-flow--source .section-title { font-size: 27px; }
  .guide-flow--source .section-lead { margin-top: 20px; font-size: 17px; }
  .guide-flow--source .guide-flow__panel { margin-top: 34px; border-radius: 18px; box-shadow: 0 12px 30px rgba(0, 63, 48, .045); }
  .guide-flow--source .guide-timeline { padding: 42px 14px 8px; }
  .guide-flow--source .guide-timeline > li { display: block; margin-bottom: 44px; padding: 32px 20px 24px; border-radius: 8px; }
  .guide-flow--source .guide-step { top: -25px; left: 12px; }
  .guide-flow--source .guide-step b { font-size: 36px; }
  .guide-flow--source .guide-time { margin-top: 0; font-size: 20px; }
  .guide-flow--source .guide-timeline h3 { margin-top: 15px; font-size: 19px; }
  .guide-flow--source .guide-timeline p { font-size: 17px; }
  .guide-flow--source .guide-timeline > li:not(:last-child)::after { bottom: -30px; border-right-width: 10px; border-left-width: 10px; border-top-width: 12px; }
  .guide-flow--source .guide-rest { margin: 0 20px; padding: 22px 0 26px; }
}
