/* SEO composition only. Loaded on the service page; shared homepage CSS is untouched.
   Typography uses typography.css tokens. Reveal wrapper and hover surface are separate. */
.seo-page {
  --seo-radius: 26px;
  --seo-gap: 18px;
  --seo-speed: 260ms;
  --seo-ease: cubic-bezier(.2,.65,.3,1);
  background: #eaf1eb;
}
.seo-page .seo-section { padding-block: 66px; border-top: 1px solid #d5e1d8; }
.seo-page .seo-intro { padding: 0 0 66px; }
.seo-breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-height: 62px; padding: 14px 0; color: var(--muted); font-size: var(--text-xs); }
.seo-breadcrumbs a { text-decoration: underline; text-underline-offset: 4px; }
.seo-breadcrumbs [aria-current] { color: var(--ink); }
.seo-hero { display: grid; grid-template-columns: 1.12fr 1fr; grid-template-rows: 1fr auto; grid-template-areas: 'copy media' 'facts media'; background: #fff; border: 1px solid #d4e0d7; border-radius: 34px; box-shadow: 0 20px 54px -30px #193c3230; }
.seo-hero__copy { grid-area: copy; padding: 40px 34px 24px 40px; align-self: center; }
.seo-hero h1 { margin: 0; text-wrap: balance; }
.seo-hero h1 > span { color: var(--accent); }
.seo-hero__lead { font-size: var(--text-lead); line-height: var(--leading-body); color: var(--muted); margin: 24px 0 0; max-width: 47ch; }
.seo-hero__service-note { font-size: var(--text-sm); line-height: var(--leading-body); color: var(--muted); margin: 10px 0 0; max-width: 54ch; }
.seo-hero__actions { display: flex; flex-wrap: wrap; gap: 12px 22px; align-items: center; margin-top: 28px; }
.seo-hero__actions .button { min-height: 54px; }
.seo-text-link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; font-size: var(--text-sm); font-weight: var(--weight-control); color: var(--accent); text-underline-offset: 5px; }
.seo-text-link:hover { text-decoration: underline; }
.seo-hero__media { grid-area: media; margin: 12px 12px 12px 0; min-width: 0; align-self: center; }
.seo-hero__media picture { display: block; border-radius: 26px; overflow: hidden; background: #ecebe6; }
.seo-hero__media img { display: block; width: 100%; height: auto; }
.seo-hero__media figcaption { padding: 10px 7px 0; color: var(--muted); font-size: var(--text-xs); line-height: var(--leading-label); }
.seo-hero__facts { grid-area: facts; list-style: none; margin: 0; padding: 0 34px 34px 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.seo-hero__facts li { display: flex; gap: 10px; align-items: center; font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-label); }
.seo-hero__facts .seo-icon { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px; box-shadow: none; }
.seo-hero__facts .seo-icon svg { width: 21px; height: 21px; }
.seo-heading { max-width: 790px; margin-bottom: 30px; }
.seo-heading .eyebrow { margin-bottom: 14px; }
.seo-heading h2 { margin: 0; text-wrap: balance; text-wrap: pretty; }
.seo-heading > p:last-child { max-width: 72ch; margin: 17px 0 0; color: var(--muted); font-size: var(--text-body); }
.seo-grid { display: grid; gap: var(--seo-gap); margin: 0; padding: 0; list-style: none; }
.seo-grid--three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.seo-grid--four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.seo-grid--two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.seo-grid--archive { grid-template-columns: minmax(0,760px); justify-content: center; }
.seo-grid--steps { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 16px; }
.seo-grid > * { min-width: 0; }
.seo-card { position: relative; isolation: isolate; display: flex; flex-direction: column; height: 100%; min-height: 225px; padding: 24px; border: 1px solid #cbded0; border-radius: var(--seo-radius); overflow: hidden; background: #fff; box-shadow: 0 12px 32px -18px #1e593941; transition: transform var(--seo-speed) var(--seo-ease), border-color var(--seo-speed) ease, box-shadow var(--seo-speed) ease, background-color var(--seo-speed) ease; }
.seo-card > * { position: relative; z-index: 1; }
.seo-card::before, .seo-card::after { content: ''; position: absolute; pointer-events: none; z-index: 0; border-radius: 50%; opacity: .8; transition: transform 280ms var(--seo-ease), opacity 280ms ease; }
.seo-card::before { width: 160px; height: 160px; top: -48px; right: -48px; background: radial-gradient(circle,rgba(88,185,133,.33),rgba(88,185,133,.10) 48%,transparent 72%); }
.seo-card::after { width: 138px; height: 138px; bottom: -50px; left: -42px; background: radial-gradient(circle,rgba(215,173,114,.22),rgba(215,173,114,.06) 50%,transparent 72%); }
.seo-icon { display: grid; place-items: center; width: 54px; height: 54px; flex-shrink: 0; border: 1px solid #bcd9c3; border-radius: 18px; color: var(--accent); background: #eef7f0; box-shadow: inset 0 1px 0 #fff,0 7px 17px #31765013; transition: transform var(--seo-speed) var(--seo-ease), box-shadow var(--seo-speed) ease, background-color var(--seo-speed) ease; }
.seo-icon svg { width: 27px; height: 27px; }
.seo-card__copy { margin-top: 23px; }
.seo-card h3 { margin: 0 0 10px; }
.seo-card p { color: var(--muted); font-size: var(--text-sm); line-height: var(--leading-body); margin: 0; }
.seo-arrow { display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0; border: 1px solid #d9e6db; border-radius: 14px; color: var(--accent); background: #f4f8f3; transition: transform var(--seo-speed) var(--seo-ease), background-color var(--seo-speed) ease, box-shadow var(--seo-speed) ease; }
.seo-arrow svg { width: 21px; height: 21px; }
.seo-card > .seo-arrow { position: absolute; top: 24px; right: 24px; }
.seo-card--info { min-height: 238px; }
.seo-card--condition { min-height: 240px; }
.seo-card--condition .seo-icon { color: #8a6233; background: #fbf3e6; border-color: #e5d2b4; }
.seo-card--condition::before { opacity: .68; }
.seo-card--step { min-height: 285px; padding: 24px 20px; }
.seo-step-number { font-size: var(--text-section); font-weight: var(--weight-section); line-height: var(--leading-section); letter-spacing: var(--tracking-heading); color: #729780; font-variant-numeric: tabular-nums; }
.seo-card--step h3 { font-size: var(--text-panel); }
.seo-card--step .seo-card__copy { margin-top: 35px; }
.seo-footnote { margin: 22px 0 0; max-width: 90ch; font-size: var(--text-sm); color: var(--muted); }
.seo-price { height: 100%; border: 1px solid #cbded0; border-radius: 22px; background: radial-gradient(circle at 100% 0%,rgba(88,185,133,.15),transparent 34%),radial-gradient(circle at 0% 100%,rgba(215,173,114,.10),transparent 32%),#f9fbf8; padding: 22px 24px; box-shadow: 0 10px 26px -20px #1e593938; }
.seo-price h3 { font-size: var(--text-panel); margin: 0 0 8px; }
.seo-price p { color: var(--muted); font-size: var(--text-sm); margin: 0; }
.seo-work-card { height: 100%; background: #fff; border: 1px solid #cbded0; border-radius: var(--seo-radius); overflow: hidden; box-shadow: 0 10px 26px -20px #1e593938; transition: border-color var(--seo-speed) ease, box-shadow var(--seo-speed) ease; }
.seo-work-photo { display: block; background: #f1f2ee; }
.seo-work-photo img { width: 100%; height: auto; display: block; }
.seo-work-copy { padding: 26px; background: radial-gradient(circle at 100% 0%,rgba(88,185,133,.14),transparent 38%),radial-gradient(circle at 0% 100%,rgba(215,173,114,.10),transparent 34%),#fff; }
.seo-work-copy .eyebrow { font-size: var(--text-xs); letter-spacing: 0; text-transform: none; margin-bottom: 12px; }
.seo-work-copy h3 { margin: 0 0 10px; }
.seo-work-copy > p:not(.eyebrow) { margin: 0; font-size: var(--text-sm); color: var(--muted); }
.seo-work-copy .seo-text-link { margin-top: 18px; justify-content: space-between; width: 100%; border-top: 1px solid var(--line); padding-top: 14px; }
.seo-work-photo:focus-visible { outline-offset: -5px; }
.seo-page .seo-faq-shell { max-width: 930px; }
.seo-faq details { background: radial-gradient(circle at 100% 0%,rgba(88,185,133,.14),transparent 36%),radial-gradient(circle at 0% 100%,rgba(215,173,114,.09),transparent 34%),#fff; border-radius: 20px; border: 1px solid #cbded0; padding: 0 24px; margin-bottom: 12px; transition: border-color var(--seo-speed) ease, box-shadow var(--seo-speed) ease; }
.seo-faq summary { min-height: 72px; padding-block: 22px; }
.seo-faq details p { padding-bottom: 24px; }
.seo-related { display: flex; align-items: center; gap: 16px; height: 100%; min-height: 116px; padding: 20px; border: 1px solid #cbded0; border-radius: 22px; background: radial-gradient(circle at 100% 0%,rgba(88,185,133,.21),transparent 39%),radial-gradient(circle at 0% 100%,rgba(215,173,114,.12),transparent 34%),#fff; font-size: var(--text-sm); font-weight: var(--weight-control); box-shadow: 0 10px 26px -20px #1e593938; transition: transform var(--seo-speed) var(--seo-ease), border-color var(--seo-speed) ease, box-shadow var(--seo-speed) ease; }
.seo-related .seo-arrow { margin-left: auto; width: 34px; height: 34px; border-radius: 12px; }
.seo-related__icon { flex: 0 0 38px; width: 38px; height: 38px; color: var(--accent); }
.seo-related > .seo-icon { width: 38px; height: 38px; border: 0; background: transparent; box-shadow: none; }
.seo-page .request-section { padding-block: 70px; }
.seo-page .request-section__copy { padding-top: 24px; }
.seo-page .request-section__copy h2 { text-wrap: balance; }
.seo-page .request-section__copy > p { margin-top: 22px; }
.seo-page .request-form { align-self: start; }

/* Entry sequence: per-section trigger, bounded stagger, independent hover descendants. */
.seo-motion .seo-enter { opacity: 0; transform: translateY(24px); transition: opacity 750ms ease, transform 750ms var(--seo-ease); transition-delay: var(--seo-delay,0ms); }
.seo-motion .seo-enter.is-shown { opacity: 1; transform: none; }
.seo-motion .seo-enter:focus-within { opacity: 1; transform: none; transition-delay: 0ms; }
.seo-card:focus-visible, .seo-related:focus-visible, .seo-work-card:focus-within, .seo-faq details:focus-within { border-color: var(--card-edge-active); box-shadow: var(--card-glow); }
.seo-card:focus-visible .seo-icon { background: #e2f3e7; box-shadow: 0 0 0 7px #58b98526; }
@media (hover:hover) and (pointer:fine) {
  .seo-card:hover { transform: translateY(-2px); border-color: var(--card-edge-active); box-shadow: var(--card-glow); }
  .seo-card--symptom:hover { transform: translateY(-2px); }
  .seo-card:hover::before { transform: scale(1.14) translate(-4px,4px); opacity: 1; }
  .seo-card:hover::after { transform: scale(1.12) translate(5px,-5px); opacity: 1; }
  .seo-card:hover .seo-icon { transform: translateY(-1px); background-color: #e2f3e7; box-shadow: inset 0 1px 0 #fff,0 0 0 7px #58b98526,0 9px 21px #285c4d26; }
  .seo-card--condition:hover .seo-icon { background-color: #fbf0dd; box-shadow: inset 0 1px 0 #fff,0 0 0 6px #d7ad7226; }
  .seo-card--condition:hover::before { opacity: .65; }
  .seo-card:hover .seo-arrow { transform: translateX(3px); background-color: #e2f3e7; box-shadow: 0 0 0 6px #58b98524; }
  .seo-related:hover { transform: translateY(-2px); border-color: var(--card-edge-active); box-shadow: var(--card-glow); }
  .seo-related:hover .seo-arrow { transform: translateX(3px); }
  .seo-work-card:hover { border-color: var(--card-edge-active); box-shadow: 0 0 23px #58b98521,0 18px 35px -16px #1e59393b; }
  .seo-faq details:hover { border-color: #a4cbb0; box-shadow: 0 0 20px #58b9851f; }
  .seo-work-copy .seo-text-link:hover .seo-arrow { transform: translateX(3px); }
}
@media (max-width:1100px) and (min-width:801px) {
  .seo-hero__copy { padding: 30px 26px; }
  .seo-hero__facts { padding: 0 24px 26px; }
  .seo-hero h1 { font-size: clamp(2.65rem,4.6vw,3.35rem); }
  .seo-hero__lead { font-size: var(--text-body); }
  .seo-grid--four { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .seo-grid--steps { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width:800px) {
  .seo-page .seo-section { padding-block: 48px; }
  .seo-page .seo-intro { padding-bottom: 48px; }
  .seo-hero { grid-template-columns: minmax(0,1fr); grid-template-rows: auto; grid-template-areas: 'copy' 'media' 'facts'; border-radius: 28px; }
  .seo-hero__copy { padding: 30px; }
  .seo-hero h1 { max-width: 16ch; }
  .seo-hero__lead { max-width: 58ch; }
  .seo-hero__media { margin: 0 12px; }
  .seo-hero__media picture { border-radius: 21px; }
  .seo-hero__media figcaption { padding-bottom: 14px; }
  .seo-hero__facts { padding: 6px 24px 24px; }
  .seo-grid--three, .seo-grid--four, .seo-grid--steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .seo-card--step { min-height: 220px; }
  .seo-card--step .seo-card__copy { margin-top: 22px; }
  .seo-heading { max-width: 650px; }
  .seo-related { gap: 10px; }
}
@media (max-width:560px) {
  .seo-page { --seo-gap: 12px; --seo-radius: 22px; }
  .seo-page .shell { width: calc(100% - 32px); }
  .seo-breadcrumbs { min-height: 52px; gap: 8px; font-size: var(--text-xs); }
  .seo-hero__copy { padding: 25px 20px 20px; }
  .seo-hero .eyebrow { margin-bottom: 16px; }
  .seo-hero h1 { font-size: var(--text-hero); }
  .seo-hero__lead { margin-top: 18px; }
  .seo-hero__actions { margin-top: 22px; gap: 8px; }
  .seo-hero__actions .button { width: 100%; }
  .seo-hero__actions .seo-text-link { justify-content: center; width: 100%; }
  .seo-hero__media { margin-inline: 8px; }
  .seo-hero__media picture { border-radius: 18px; }
  .seo-hero__media figcaption { padding: 10px 8px 14px; }
  .seo-hero__facts { padding: 0 16px 22px; gap: 10px; }
  .seo-hero__facts li { gap: 8px; }
  .seo-hero__facts .seo-icon { display: none; }
  .seo-heading { margin-bottom: 24px; }
  .seo-heading > p:last-child { font-size: var(--text-sm); margin-top: 16px; }
  .seo-grid--three, .seo-grid--four, .seo-grid--two, .seo-grid--steps { grid-template-columns: minmax(0,1fr); }
  .seo-card { min-height: 0; padding: 22px; }
  .seo-card--symptom { display: grid; grid-template-columns: 42px minmax(0,1fr) 26px; gap: 14px; align-items: start; padding: 20px 16px; }
  .seo-card--symptom .seo-icon { width: 42px; height: 42px; border-radius: 14px; }
  .seo-card--symptom .seo-icon svg { width: 24px; height: 24px; }
  .seo-card--symptom .seo-arrow { position: static; grid-column: 3; grid-row: 1; width: 26px; height: 32px; border: 0; background: transparent; }
  .seo-card--symptom .seo-card__copy { grid-column: 2; grid-row: 1; margin: 0; }
  .seo-card--symptom h3 { font-size: var(--text-panel); margin-bottom: 6px; }
  .seo-card--symptom p { font-size: var(--text-sm); }
  .seo-card--info, .seo-card--condition { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 18px; }
  .seo-card--info .seo-icon, .seo-card--condition .seo-icon { width: 48px; height: 48px; border-radius: 16px; }
  .seo-card--info .seo-card__copy, .seo-card--condition .seo-card__copy { margin: 0; }
  .seo-card--info h3, .seo-card--condition h3 { font-size: var(--text-panel); }
  .seo-card--step { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 20px; }
  .seo-card--step .seo-card__copy { margin: 0; }
  .seo-price { padding: 20px; }
  .seo-work-copy { padding: 22px; }
  .seo-faq details { padding-inline: 18px; }
  .seo-faq summary { min-height: 68px; }
  .seo-related { min-height: 88px; padding: 18px; }
  .seo-page .request-section { padding-block: 48px; }
  .seo-page .request-section__copy { padding-top: 0; }
}
@media (prefers-reduced-motion:reduce) {
  .seo-motion .seo-enter { opacity: 1; transform: none; transition: none; }
  .seo-page .seo-card, .seo-page .seo-card::before, .seo-page .seo-card::after,
  .seo-page .seo-icon, .seo-page .seo-arrow, .seo-page .seo-related,
  .seo-work-card, .seo-faq details { transform: none; transition: none; }
}

/* Approved A2 rhythm block for the six service pages. */
.seo-page .rhythm-section { padding-block: 26px 34px; }
.rhythm-panel--a2 {
  display: grid; grid-template-columns: minmax(250px,.85fr) minmax(0,2fr);
  overflow: hidden; border: 1px solid #bdd5c3; border-radius: 28px;
  color: var(--ink); background: linear-gradient(115deg,#d6eadb 0%,#eaf4e9 57%,#f4f8f0 100%);
}
.rhythm-panel--a2 .rhythm-panel__head {
  display: grid; align-content: center; padding: 36px 40px;
  border-right: 1px solid #b4d0ba;
}
.rhythm-panel--a2 .eyebrow { margin: 0 0 15px; font-size: var(--text-xs); line-height: var(--leading-label); }
.rhythm-panel--a2 .rhythm-zero {
  color: var(--accent); font-size: clamp(3.2rem,5vw,5.2rem);
  font-weight: var(--weight-section); line-height: .95;
  letter-spacing: -.065em; font-variant-numeric: tabular-nums;
}
.rhythm-panel--a2 .rhythm-panel__head p { margin: 16px 0 0; color: var(--muted); font-size: var(--text-sm); }
.rhythm-panel--a2 .rhythm-facts {
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr));
  align-items: center; padding: 32px 22px;
}
.rhythm-panel--a2 .rhythm-fact {
  min-width: 0; min-height: 95px; display: flex; flex-direction: column;
  justify-content: center; gap: 8px; padding: 0 18px;
  border-left: 1px solid #c1d8c3;
}
.rhythm-panel--a2 .rhythm-fact:first-child { border-left: 0; }
.rhythm-panel--a2 .rhythm-fact__label { color: var(--muted); font-size: var(--text-xs); line-height: var(--leading-label); }
.rhythm-panel--a2 .rhythm-fact strong {
  font-size: clamp(1rem,1.5vw,1.35rem); font-weight: var(--weight-control);
  line-height: var(--leading-card); text-wrap: balance;
}
@media (max-width:900px) {
  .rhythm-panel--a2 { grid-template-columns: 1fr; }
  .rhythm-panel--a2 .rhythm-panel__head { border-right: 0; border-bottom: 1px solid #b4d0ba; }
}
@media (max-width:560px) {
  .seo-page .rhythm-section { padding-block: 12px 22px; }
  .rhythm-panel--a2 { border-radius: 22px; }
  .rhythm-panel--a2 .rhythm-panel__head { padding: 28px 26px 24px; }
  .rhythm-panel--a2 .rhythm-facts { grid-template-columns: 1fr; padding: 2px 26px 16px; }
  .rhythm-panel--a2 .rhythm-fact { min-height: 0; border-left: 0; border-top: 1px solid #c1d8c3; padding: 16px 0; }
  .rhythm-panel--a2 .rhythm-fact:first-child { border-top: 0; }
}

/* Compact work-price examples inside each existing cost section. */
.seo-mini-price {
  display: grid; grid-template-columns: minmax(220px,.7fr) minmax(0,1.6fr);
  margin-top: 22px; overflow: hidden; border: 1px solid #cbded0;
  border-radius: 22px; background: #f9fbf8;
}
.seo-mini-price__heading { padding: 27px 30px; background: #eef5ed; border-right: 1px solid #d1e1d2; }
.seo-mini-price__heading .eyebrow { margin: 0 0 12px; }
.seo-mini-price h3 { margin: 0; font-size: var(--text-panel); line-height: var(--leading-card); }
.seo-mini-price__body { min-width: 0; padding: 16px 28px 20px; }
.seo-mini-price ul { list-style: none; margin: 0; padding: 0; }
.seo-mini-price li {
  display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center;
  gap: 14px; min-height: 54px; padding-block: 10px; border-bottom: 1px solid #dce9dc;
  font-size: var(--text-sm); line-height: var(--leading-label);
}
.seo-mini-price li strong { white-space: nowrap; color: var(--accent); font-weight: var(--weight-control); }
.seo-mini-price__body > p { margin: 16px 0 0; color: var(--muted); font-size: var(--text-xs); line-height: var(--leading-body); }
@media (max-width:800px) {
  .seo-mini-price { grid-template-columns: 1fr; }
  .seo-mini-price__heading { padding: 23px 26px 18px; border-right: 0; border-bottom: 1px solid #d1e1d2; }
}
@media (max-width:560px) {
  .seo-mini-price { border-radius: 20px; }
  .seo-mini-price__heading { padding: 20px; }
  .seo-mini-price__body { padding: 8px 20px 20px; }
  .seo-mini-price li { gap: 8px; }
}
