/* Clause 55 residential development — local review draft */
.clause55-page .clause55-hero { grid-template-columns: minmax(0, 1.06fr) minmax(440px, .94fr); }
.clause55-page .clause55-hero h1 { max-width: 760px; }
.clause55-page .clause55-hero .canopy-hero-photo { position: relative; overflow: hidden; }
.clause55-page .clause55-hero .canopy-hero-photo img { object-position: 32% center; }
.clause55-page .clause55-hero .canopy-hero-photo figcaption { position: absolute; right: 1rem; bottom: 1rem; padding: .4rem .6rem; background: rgba(20,38,34,.66); color: #fff; font-size: .65rem; }
.clause55-page .section h2 { max-width: 1000px; }
.clause55-section-heading { max-width: 1010px; }
.clause55-section-heading > p:last-child { max-width: 760px; font-size: clamp(1rem, 1.15vw, 1.18rem); }
.clause55-intro { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(3rem, 8vw, 9rem); }
.clause55-intro-copy { max-width: 850px; font-size: clamp(1rem, 1.12vw, 1.16rem); }
.clause55-intro-copy p { margin: 0 0 1.3rem; }
.clause55-application { background: var(--ivory); border-block: 1px solid var(--line); }
.clause55-information-grid { display: grid; grid-template-columns: 1fr 1fr; margin-top: clamp(3rem, 5vw, 5rem); border: 1px solid var(--ink); }
.clause55-information-grid article { padding: clamp(1.8rem, 3vw, 3.5rem); }
.clause55-information-grid article + article { border-left: 1px solid var(--ink); background: rgba(156,174,157,.12); }
.clause55-information-grid span, .clause55-service-grid span { font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--moss); }
.clause55-information-grid h3, .clause55-design-list h3, .clause55-service-grid h3 { margin: 2rem 0 1rem; font-family: var(--serif); font-size: clamp(1.5rem, 2vw, 2.2rem); font-weight: 400; letter-spacing: -.03em; line-height: 1.1; }
.clause55-information-grid p { max-width: 650px; }
.clause55-information-grid .small-note { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .9rem; }
.clause55-design { background: var(--paper); }
.clause55-design-list { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: clamp(3rem, 5vw, 5rem); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.clause55-design-list article { padding: clamp(1.5rem, 2.4vw, 2.8rem); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.clause55-design-list article:nth-child(even) { background: rgba(156,174,157,.12); }
.clause55-design-list article span { font-size: .72rem; font-weight: 800; letter-spacing: .12em; color: var(--moss); }
.clause55-design-list h3 { margin-top: 2.7rem; }
.clause55-design-list p { margin: 0; }
.clause55-canopy { display: grid; grid-template-columns: .73fr 1.27fr; gap: clamp(2rem, 6vw, 7rem); background: var(--forest); color: var(--paper); }
.clause55-canopy .eyebrow { color: rgba(243,240,232,.68); }
.clause55-canopy h2 em { color: var(--sage) !important; }
.clause55-canopy-lead > p:last-child { max-width: 500px; font-size: 1.08rem; }
.clause55-definitions { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-content: start; }
.clause55-definitions > div { border-top: 1px solid rgba(243,240,232,.5); padding-top: 1.3rem; }
.clause55-definitions span { font-family: var(--serif); font-size: clamp(1.4rem, 1.8vw, 2rem); }
.clause55-definitions p { color: rgba(243,240,232,.82); }
.clause55-definitions > p { grid-column: 1 / -1; max-width: 810px; margin: 0; color: rgba(243,240,232,.8); }
.clause55-cover-table, .clause55-canopy .canopy-example, .clause55-canopy .canopy-counting, .clause55-distinction { grid-column: 1 / -1; }
.clause55-cover-table { margin-top: 2rem; }
.clause55-cover-table .canopy-table { color: var(--ink); }
.clause55-cover-table .canopy-table caption { color: var(--paper); }
.clause55-canopy .canopy-example { color: var(--ink); background: var(--ivory); }
.clause55-canopy .canopy-counting { border-color: rgba(243,240,232,.3); }
.clause55-canopy .canopy-counting li { color: rgba(243,240,232,.86); }
.clause55-distinction { margin: 0; padding: 1.4rem 0 0; border-top: 1px solid rgba(243,240,232,.3); color: rgba(243,240,232,.86); }
.clause55-distinction a { display: inline-block; margin-left: .4rem; color: var(--paper); }
.clause55-illustration { background: var(--ivory); }
.clause55-plan-figure { margin: clamp(2.5rem, 5vw, 5rem) 0 0; }
.clause55-plan-figure img { display: block; width: 100%; height: auto; border: 1px solid var(--ink); }
.clause55-plan-figure figcaption { margin-top: .9rem; font-size: .78rem; color: var(--moss); }
.clause55-service-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: clamp(3rem, 5vw, 5rem); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.clause55-service-grid article { display: flex; flex-direction: column; min-height: 380px; padding: clamp(1.5rem, 2.5vw, 3rem); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.clause55-service-grid article:nth-child(even) { background: rgba(156,174,157,.12); }
.clause55-service-grid h3 { margin-top: 2.7rem; }
.clause55-service-grid p { margin: 0 0 1.7rem; }
.clause55-service-grid a { margin-top: auto; font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; border-bottom: 1px solid; padding-bottom: .6rem; }
.clause55-page .canopy-specialist-note { max-width: none; }
.clause55-source { display: grid; grid-template-columns: .36fr 1fr; gap: 3rem; padding-block: clamp(2.5rem, 4vw, 4.5rem); background: var(--ivory); border-top: 1px solid var(--line); }
.clause55-source .eyebrow { margin: 0; }
.clause55-source p:last-child { max-width: 920px; margin: 0; font-size: .88rem; }
.clause55-source a { white-space: nowrap; margin-left: .7rem; }
@media (max-width: 1100px) {
  .clause55-page .clause55-hero, .clause55-intro, .clause55-canopy { grid-template-columns: 1fr; }
  .clause55-design-list, .clause55-service-grid { grid-template-columns: repeat(2, 1fr); }
  .clause55-page .clause55-hero .canopy-hero-photo { min-height: 580px; }
}
@media (max-width: 720px) {
  .clause55-page .clause55-hero .canopy-hero-photo { min-height: 440px; }
  .clause55-information-grid, .clause55-design-list, .clause55-service-grid, .clause55-definitions, .clause55-source { grid-template-columns: 1fr; }
  .clause55-information-grid article + article { border-left: 0; border-top: 1px solid var(--ink); }
  .clause55-definitions > p { grid-column: auto; }
  .clause55-design-list article h3, .clause55-service-grid article h3 { margin-top: 1.4rem; }
  .clause55-service-grid article { min-height: 0; }
  .clause55-source { gap: 1rem; }
  .clause55-source a { display: block; width: fit-content; margin: .5rem 0 0; }
}