.page-head { max-width: none; width: 100%; }
.page-head h1, .page-head > p:last-child, .guides-intro { max-width: none; width: 100%; }
.diy-work-copy, .diy-work-copy p { width: 100%; max-width: none; }
[data-page="/diy"] .page-body > .two-col { display: block; }
[data-page="/diy"] .service-grid { width: 100%; }
.consult-checklist { padding: 0; margin: 18px 0; list-style: none; }
.consult-checklist li { display: grid; grid-template-columns: 9px minmax(0, 1fr); gap: 12px; align-items: baseline; margin: 13px 0; }
.consult-checklist li::before { content: ""; width: 7px; height: 7px; border: 1.5px solid var(--blue); border-radius: 50%; }
.whole-card { color: inherit; cursor: pointer; transition: background-color 160ms ease; }
.whole-card:hover { background-color: var(--pale); }
.whole-card:focus-visible { outline: 3px solid #b27830; outline-offset: 5px; }
.decision-card.whole-card { padding-inline: 18px; padding-bottom: 22px; }
.consult-summary h2 { font-size: 23px; }
.article-body > .article-intro { margin-bottom: 32px; width: 100%; max-width: none; }
.faq details p, .method-note, .property-context { width: 100%; max-width: none; }
.consultation-photo-head .consultation-photo-copy > p:last-child { width: 100%; max-width: none; }
.filter-row button, .guide-filter button { padding: 10px 17px; min-height: 44px; border: 1px solid var(--line); background: transparent; color: var(--ink); font: 13px/1.5 var(--sans); cursor: pointer; }
.filter-row button[aria-pressed="true"], .guide-filter button[aria-pressed="true"] { color: #fff; background: var(--blue); border-color: var(--blue); }
.channel-icon { width: 23px; height: 23px; flex: 0 0 23px; }
.channel-link { gap: 12px; }
.line-brand-space { display: inline-flex; padding: 12px; flex: 0 0 auto; }
.line-brand-icon { display: block; width: 24px; height: 24px; max-width: none; object-fit: contain; }
details summary { cursor: pointer; }
details .accordion-content { display: flow-root; }
.breadcrumb { display: block; padding-top: 26px; font: 12px/1.8 var(--sans); color: var(--muted); }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 6px 12px; padding: 0; margin: 0; list-style: none; }
.breadcrumb li { display: inline-flex; align-items: baseline; gap: 12px; min-width: 0; }
.breadcrumb li + li::before { content: "/"; color: var(--muted); }
.breadcrumb a { display: inline-block; padding: 4px 0; text-decoration: underline; text-underline-offset: 4px; }
.breadcrumb [aria-current] { overflow-wrap: anywhere; }
/* A: a quiet circular arrow for content links and whole-card destinations. */
.text-link.link-design-a { display: inline-flex; align-items: center; gap: 18px; min-height: 52px; max-width: 100%; border-bottom: 0; line-height: 1.8; }
.property-bottom.link-design-a { justify-content: flex-start; align-items: center; gap: 18px; }
.link-design-a > .link-arrow { display: inline-flex; flex: 0 0 34px; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 1px solid currentColor; border-radius: 50%; color: var(--blue); transition: background-color 160ms ease, color 160ms ease; }
.link-arrow svg { width: 20px; height: 20px; }
.link-arrow-back svg { transform: rotate(180deg); }
.link-arrow-external svg { transform: rotate(-45deg); }
a.link-design-a:hover > .link-arrow, a.link-design-a:focus-visible > .link-arrow,
.whole-card:hover .link-arrow, .whole-card:focus-visible .link-arrow { color: #fff; background-color: var(--blue); border-color: var(--blue); }
a.link-design-a:hover, a.link-design-a:focus-visible,
.whole-card:hover .link-design-a, .whole-card:focus-visible .link-design-a { text-decoration: underline; text-underline-offset: 6px; }
.guide-card .text-link.link-design-a, .decision-card .text-link.link-design-a { align-self: flex-start; }
@media (max-width: 650px) {
  .desktop-break { display: none; }
  [data-page] .page-head h1 { font-size: 30px; }
  .line-brand-icon { width: 40px; height: 40px; }
  .line-brand-space { padding: 10px; }
  [data-page="/diy"] .page-head h1 { font-size: 30px; }
}
@media (max-width: 600px) { .footer { padding-bottom: 27px; } }
@media (prefers-reduced-motion: reduce) {
  .whole-card { transition: none; }
  .link-design-a > .link-arrow { transition: none; }
}

/* Keep the channel mark and its label together; arrow spacing is independent. */
.channel-link.link-design-a { gap: 0; }
.channel-link.link-design-a > .channel-icon { margin-right: 12px; }
.channel-link.link-design-a > .link-arrow { margin-left: 18px; }
.nav a[href*="instagram.com"] { display: flex; align-items: center; gap: 8px; }
.nav-social-icon { width: 18px; height: 18px; flex: 0 0 18px; }