.seo-header { display: flex; align-items: center; justify-content: space-between; gap: 22px; min-height: 86px; }
.seo-header nav { gap: 18px; }
.seo-phone { font: 700 .9rem Arial, sans-serif; white-space: nowrap; text-decoration: none; }
.seo-main { padding-top: 44px; padding-bottom: 100px; }
.seo-breadcrumb { margin-bottom: 60px; color: var(--muted); font: .8rem/1.5 Arial, sans-serif; }
.seo-main .eyebrow { margin-bottom: 14px; }
.seo-main h1 { max-width: 900px; font-size: clamp(2.65rem, 5.8vw, 5.4rem); }
.seo-lead { max-width: 800px; margin: 28px 0; font: clamp(1.15rem, 2vw, 1.5rem)/1.55 Georgia, serif; }
.seo-price { max-width: 800px; margin: -10px 0 4px; color: var(--ink); font: 700 1rem/1.6 Arial, sans-serif; }
.seo-area { max-width: 800px; margin: 0 0 28px; color: var(--muted); font: 1rem/1.6 Arial, sans-serif; }
.seo-case-contact { margin: 0 0 36px; }
.seo-case-contact-button { max-width: 100%; text-align: center; }
.seo-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-bottom: 62px; }
.button-secondary { background: transparent; border-color: var(--walnut); color: var(--walnut); }
.button-secondary:hover { background: #eadbc6; }
.seo-case-actions { gap: 12px; margin: 22px 0 0; }
.seo-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.seo-content > section, .seo-related { min-width: 0; padding: 30px; border-top: 1px solid #b79d75; background: #eee6d9; }
.seo-content h2, .seo-related h2 { margin-bottom: 18px; font-size: clamp(1.55rem, 2.5vw, 2.3rem); }
.seo-content h3 { margin: 22px 0 8px; font-size: 1.17rem; }
.seo-content p, .seo-content li, .seo-related li { font: 1rem/1.7 Arial, sans-serif; }
.seo-content p:last-child { margin-bottom: 0; }
.seo-content ul, .seo-related ul { margin: 0; padding-left: 20px; }
.seo-content li + li, .seo-related li + li { margin-top: 9px; }
.seo-content a:not(.button), .seo-related a { color: #725027; }
.seo-exclusions { grid-column: 1 / -1; }
.seo-exclusions ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding: 0 !important; list-style: none; }
.seo-exclusions li { min-width: 0; margin: 0 !important; padding-left: 16px; border-left: 2px solid #b79d75; }
.seo-cases { grid-column: 1 / -1; }
.seo-case-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; list-style: none; padding: 0 !important; }
.seo-case-grid li + li { margin-top: 0; }
.seo-case-card { display: block; height: 100%; background: #e4d8c7; text-decoration: none; }
.seo-case-card img { display: block; width: 100%; height: clamp(140px, 18vw, 220px); object-fit: cover; }
.seo-case-card span { display: block; padding: 12px 14px; font-weight: 700; line-height: 1.4; }
.seo-case-card:hover span, .seo-case-card:focus-visible span { color: #805333; }
.seo-related { margin-top: 28px; }
.seo-photo-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 36px 0 48px; }
.seo-photo-pair figure { margin: 0; background: #e4d8c7; }
.seo-photo-pair img { width: 100%; max-height: 650px; object-fit: contain; }
.seo-photo-pair figcaption { padding: 10px 16px; font: 700 .85rem Arial, sans-serif; }
@media (max-width: 850px) { .seo-header { flex-wrap: wrap; padding-block: 17px; } .seo-header nav { position: static; order: 3; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; gap: 0; padding: 0; border: 0; border-top: 1px solid var(--line); background: transparent; box-shadow: none; } .seo-header nav a { padding: 13px 2px 0; border: 0; text-align: center; white-space: nowrap; font-size: .7rem; } }
@media (max-width: 700px) { .seo-header { min-height: 70px; } .seo-header nav a { font-size: .65rem; } .seo-phone { font-size: .75rem; } .seo-main { padding-top: 25px; padding-bottom: 70px; } .seo-breadcrumb { margin-bottom: 35px; } .seo-content, .seo-photo-pair { grid-template-columns: minmax(0, 1fr); } .seo-content > section, .seo-related { padding: 22px; } .seo-exclusions ul { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(190px, 80%); gap: 16px; overflow-x: auto; padding-bottom: 12px !important; scroll-snap-type: x proximity; } .seo-exclusions li { scroll-snap-align: start; } .seo-case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 380px) { .seo-main h1 { font-size: 2.1rem; } .seo-actions .button { width: 100%; padding-inline: 10px; font-size: .68rem; letter-spacing: .04em; } }