:is(#one-edge, #fixes) { --oe1-gutter: calc(8% + 20px); padding: 80px var(--oe1-gutter); background: #fff; color: #30353A; }
:is(#one-edge, #fixes) p { margin: 0; }
:is(#one-edge, #fixes) .oe1__head { display: grid; gap: 16px; margin-bottom: 40px; }
:is(#one-edge, #fixes) .oe1__eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #30353A; }
:is(#one-edge, #fixes) .oe1__h { margin: 0; padding: 0; font-weight: 700; font-size: 32px; line-height: 1.25; color: #30353A; text-transform: none; letter-spacing: 0; }
:is(#one-edge, #fixes) .oe1__body { max-width: 62ch; font-size: 17px; line-height: 1.6; }
:is(#one-edge, #fixes) .oe1__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
:is(#one-edge, #fixes) .oe1__card { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin: 0; padding: 28px 24px; border-left: 4px solid #D8B98A; border-radius: 4px; background: #f4f4f4; }
:is(#one-edge, #fixes) .oe1__title { margin: 0; padding: 0; font-family: 'Inter', Arial, sans-serif; font-size: 22px; font-weight: 700; line-height: 1.25; color: #30353A; text-transform: none; letter-spacing: 0; }
:is(#one-edge, #fixes) .oe1__line { font-size: 16px; line-height: 1.55; }
:is(#one-edge, #fixes) .oe1__link { margin-top: auto; font-family: 'Inter', Arial, sans-serif; font-weight: 700; font-size: 14px; line-height: 1.4; color: #30353A; text-decoration: underline; text-underline-offset: 4px; }
:is(#one-edge, #fixes) .oe1__link:hover { color: #000; }
:is(#one-edge, #fixes) .oe1__link:focus-visible { outline: 2px solid #30353A; outline-offset: 3px; }
:is(#one-edge, #fixes) .oe1__ask { display: flex; justify-content: center; margin-top: 40px; }
:is(#one-edge, #fixes) .oe1__btn { display: inline-block; padding: 12px 25px; border-radius: 500px; background: #D8B98A; color: #30353A; font-family: 'Inter', Arial, sans-serif; font-weight: 800; font-size: 14px; line-height: 1.4; text-decoration: none; }
:is(#one-edge, #fixes) .oe1__btn:hover { background: #e6d0aa; color: #30353A; }
:is(#one-edge, #fixes) .oe1__btn:focus-visible { outline: 2px solid #30353A; outline-offset: 3px; }

.sf1 { --sf1-gutter: calc(8% + 20px); padding: 80px var(--sf1-gutter); background: #fff; color: #30353A; }
.sf1 p, .sf1 dl, .sf1 dd, .sf1 figure { margin: 0; }
.sf1 .sf1__grid { display: grid; gap: 40px; }
.sf1 .sf1__copy { display: grid; gap: 16px; align-content: start; }
.sf1 .sf1__eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #30353A; }
.sf1 .sf1__h { margin: 0; padding: 0; max-width: 24ch; font-weight: 700; font-size: 32px; line-height: 1.25; color: #30353A; text-transform: none; letter-spacing: 0; }
.sf1 .sf1__body { max-width: 62ch; font-size: 17px; line-height: 1.6; }
.sf1 .sf1__terms { display: grid; gap: 16px; margin-top: 8px; }

.sf1 .sf1__term + .sf1__term { padding-top: 16px; border-top: 1px solid #e3e6e9; }
.sf1 dt { font-family: 'Inter', Arial, sans-serif; font-size: 18px; font-weight: 700; line-height: 1.3; }
.sf1 dd { margin-top: 6px; font-size: 16px; line-height: 1.55; }
.sf1 .sf1__figure { padding: 24px; border-radius: 4px; background: #f4f4f4; }
.sf1 svg { display: block; width: 100%; height: auto; }


#soffit-vs-fascia ~ #repair { background: #f4f4f4; }
#soffit-vs-fascia ~ #repair .ip1__panel { background: #fff; }
#one-edge ~ #colours { background: #f4f4f4; }


#hero + #soffit-vs-fascia { padding-top: 50px; }

@media only screen and (min-width: 992px) {
  .sf1 .sf1__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 56px; align-items: center; }
}
@media only screen and (max-width: 980px) {
  .sf1 { --sf1-gutter: 40px; padding-block: 60px; }
  #hero + #soffit-vs-fascia { padding-top: 20px; }
  .sf1 .sf1__h { font-size: 26px; line-height: 35px; }
  :is(#one-edge, #fixes) { --oe1-gutter: 40px; padding-block: 60px; }
  :is(#one-edge, #fixes) .oe1__h { font-size: 26px; line-height: 35px; }
  :is(#one-edge, #fixes) .oe1__grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}
@media only screen and (max-width: 479px) {
  :is(#one-edge, #fixes) { --oe1-gutter: 24px; }
  .sf1 { --sf1-gutter: 24px; }
  .sf1 .sf1__figure { padding: 12px; }
}


@media (prefers-reduced-motion: reduce) {
  .sf1 .sf1__anim { display: none; }
}
.sf1 .sf1__link { justify-self: start; font-family: 'Inter', Arial, sans-serif; font-weight: 700; font-size: 14px; line-height: 1.4; color: #30353A; text-decoration: underline; text-underline-offset: 4px; }
.sf1 .sf1__link:hover { color: #000; }
.sf1 .sf1__link:focus-visible { outline: 2px solid #30353A; outline-offset: 3px; }


#overflow { background: #f4f4f4; }
#overflow .sf1__figure { background: #fff; }