/* Existing KAPSOM palette, typography and contact behavior; new service and case pages. */
.seo-page { background:var(--paper); color:var(--ink); line-height:1.65; }
.seo-page .site-header { background:var(--ink); color:var(--paper); }
.seo-page .wordmark-dot { color:var(--acid); }
.seo-page main { overflow:clip; }
.seo-page .skip-link { position:absolute; left:1rem; top:0; z-index:100; padding:.75rem 1rem; background:var(--acid); color:var(--ink); transform:translateY(-120%); }
.seo-page .skip-link:focus { transform:translateY(0); }
.seo-breadcrumbs { display:block; margin:0; padding:1.7rem clamp(1.25rem,5vw,5rem); font-size:.8rem; }
.seo-breadcrumbs ol { display:flex; flex-wrap:wrap; gap:.4rem 1rem; list-style:none; padding:0; margin:0; }
.seo-breadcrumbs li + li::before { content:'/'; margin-right:1rem; color:#77776f; }
.seo-breadcrumbs a { text-decoration:underline; text-underline-offset:.2em; }
.seo-hero { padding:clamp(2rem,5vw,5rem) clamp(1.25rem,5vw,5rem) clamp(3.5rem,7vw,7rem); }
.seo-hero h1 { margin:1.3rem 0 2rem; max-width:20ch; font:600 clamp(3.1rem,7.5vw,8.8rem)/1.08 var(--display); letter-spacing:-.035em; }
.seo-hero .eyebrow { color:#55554c; }
.seo-hero-bottom { display:grid; grid-template-columns:minmax(0,1fr) minmax(16rem,.6fr); gap:clamp(2rem,8vw,10rem); border-top:1px solid #b8b8ac; padding-top:2rem; }
.seo-hero-bottom > p, .seo-lead { max-width:47rem; font-size:clamp(1.1rem,1.7vw,1.45rem); margin:0; }
.seo-offer { display:flex; flex-direction:column; align-items:flex-start; gap:.7rem; }
.seo-offer strong { font:500 clamp(2rem,3.5vw,3.6rem)/1.15 var(--display); }
.seo-offer > span { max-width:24rem; font-size:.9rem; color:#55554c; }
.seo-offer .button { margin-top:.75rem; }
.seo-page .button { padding:1rem 1.5rem; font:700 1rem/1.35 var(--sans); white-space:normal; text-align:left; }
.seo-section { padding:clamp(3rem,6vw,6rem) clamp(1.25rem,5vw,5rem); border-top:1px solid #b8b8ac; }
.seo-section h2, .seo-contact h2 { font:500 clamp(2.2rem,4.2vw,4.5rem)/1.12 var(--display); letter-spacing:-.02em; margin:0 0 2rem; }
.seo-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2rem,6vw,7rem); }
.seo-split > div > h2 { max-width:17ch; }
.seo-prose { max-width:44rem; font-size:1.04rem; }
.seo-prose p:first-child { margin-top:0; }
.seo-prose a:not(.button), .seo-related a { text-decoration:underline; text-underline-offset:.23em; }
.seo-situations { list-style:none; padding:0; margin:0; }
.seo-situations li { padding:1.2rem 0; border-bottom:1px solid #b8b8ac; }
.seo-situations li:first-child { padding-top:0; }
.seo-includes { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2rem; padding:0; list-style:none; counter-reset:steps; }
.seo-includes li { border-top:3px solid var(--ink); padding-top:1rem; counter-increment:steps; }
.seo-includes li::before { content:'0' counter(steps); color:#66665d; font-size:.8rem; }
.seo-includes h3 { font:500 1.6rem/1.2 var(--display); margin:1.7rem 0 1rem; }
.seo-includes p { font-size:.95rem; }
.seo-example { padding:3rem clamp(1.25rem,5vw,5rem); background:var(--acid); }
.seo-example a { font:500 clamp(1.8rem,3vw,3rem)/1.3 var(--display); text-decoration:underline; text-underline-offset:.15em; }
.seo-faq details { padding:1.2rem 0; border-bottom:1px solid #b8b8ac; }
.seo-faq details:first-child { border-top:1px solid #b8b8ac; }
.seo-faq summary { cursor:pointer; font-weight:700; padding-right:1rem; }
.seo-faq p { max-width:40rem; }
.seo-related { display:flex; flex-wrap:wrap; gap:1rem 2.5rem; margin:0; padding:2rem clamp(1.25rem,5vw,5rem); border-top:1px solid #b8b8ac; font-size:.95rem; }
.seo-related > span { color:#626259; }
.seo-contact { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,6vw,7rem); padding:clamp(3.5rem,7vw,7rem) clamp(1.25rem,5vw,5rem); background:var(--ink); color:var(--paper); border-top:6px solid var(--orange); }
.seo-contact h2 { font-size:clamp(3rem,5vw,6rem); margin-bottom:0; }
.seo-contact p { max-width:37rem; }
.seo-contact .button { color:var(--ink); margin-top:1rem; }
.seo-email { display:block; margin-top:1.5rem; overflow-wrap:anywhere; text-decoration:underline; text-underline-offset:.25em; }
.seo-page footer { background:var(--ink); color:var(--paper); gap:1.5rem; }
.seo-page footer a { overflow-wrap:anywhere; }
.seo-service-list { padding:0 clamp(1.25rem,5vw,5rem) 4rem; }
.seo-service-row { display:grid; grid-template-columns:3rem minmax(0,1fr) 13rem; align-items:start; gap:2rem; padding:2.5rem 0; border-top:1px solid #a6a69a; }
.seo-service-row:last-child { border-bottom:1px solid #a6a69a; }
.seo-service-row h2 { font:500 clamp(2rem,3.5vw,4rem)/1.15 var(--display); margin:0 0 1rem; }
.seo-service-row p { max-width:43rem; margin:0; }
.seo-service-row:hover h2 { text-decoration:underline; text-underline-offset:.12em; }
.seo-number { padding-top:.5rem; font-size:.85rem; }
.seo-service-price { font:500 1.8rem/1.2 var(--display); padding-top:.2rem; }
.seo-service-price span { display:block; font:600 .9rem/1.5 var(--sans); margin-top:1.5rem; text-decoration:underline; }
.seo-dot { color:var(--orange); }
.seo-concept-note { max-width:45rem; margin:2rem 0 0; padding-left:1rem; border-left:3px solid var(--orange); font-size:.95rem; }
.seo-case-image { margin:0; padding:0 clamp(1.25rem,5vw,5rem) 3rem; }
.seo-case-image img { display:block; width:100%; max-height:46rem; object-fit:cover; }
.seo-case-image figcaption { font-size:.85rem; color:#57574f; margin-top:.8rem; }
.seo-page a:focus-visible, .seo-page button:focus-visible, .seo-page summary:focus-visible { outline:3px solid var(--orange); outline-offset:5px; }
@media (max-width:1000px) { .seo-includes { grid-template-columns:repeat(2,minmax(0,1fr)); } .seo-service-row { grid-template-columns:2rem minmax(0,1fr) 10rem; gap:1.3rem; } }
@media (max-width:760px) {
  .seo-hero-bottom,.seo-split,.seo-contact { grid-template-columns:minmax(0,1fr); gap:2rem; }
  .seo-hero h1 { font-size:clamp(2.9rem,10.5vw,5rem); }
  .seo-service-row { grid-template-columns:1.5rem minmax(0,1fr); gap:1rem; }
  .seo-service-price { grid-column:2; font-size:1.6rem; }
  .seo-service-price span { display:inline; margin-left:1.5rem; }
  .seo-breadcrumbs { font-size:.75rem; }
  .seo-page .site-header nav { background:var(--ink); color:var(--paper); }
}
@media (max-width:430px) { .seo-includes { grid-template-columns:1fr; gap:1.5rem; } .seo-includes h3 { margin-top:1rem; } }
