/* Start custom CSS *//* Independent hero layers. Text and controls remain static. */
#roofing { view-timeline-name: --onyx-hero; view-timeline-axis: block; }
@keyframes onyxHeroBackdrop { from { transform: translateY(0); } to { transform: translateY(5rem); } }
@keyframes onyxHeroHouse { from { transform: translateY(0); } to { transform: translateY(1.7rem); } }
@keyframes onyxHeroTrees { from { transform: translateY(0); } to { transform: translateY(-.8rem); } }
@supports (animation-timeline: view()) {
  #roofing [data-id="6845ca76"] { animation: onyxHeroBackdrop linear both; animation-timeline: --onyx-hero; animation-range: exit 0% exit 100%; }
  #roofing [data-id="2150bf93"] { animation: onyxHeroHouse linear both; animation-timeline: --onyx-hero; animation-range: exit 0% exit 100%; }
  #roofing [data-id="6567783a"] { animation: onyxHeroTrees linear both; animation-timeline: --onyx-hero; animation-range: exit 0% exit 100%; }
}
@media (prefers-reduced-motion: reduce), (max-width:767px) {
  #roofing .onyx-hero-parallax-layer { animation: none !important; transform: none !important; will-change:auto; }
}
/* Torn process notes with subtle paper texture and editable text. */
[data-id="7bbebc92"] > div {
  isolation:isolate; position:relative; background:transparent !important;
  box-shadow:none; filter:drop-shadow(0 8px 5px rgba(42,32,20,.16));
}
[data-id="349b729e"] { --note-color:#82F3EB; }
[data-id="6e55e172"] { --note-color:#F8D00E; }
[data-id="62e3e6a5"] { --note-color:#FDA347; }
[data-id="37abc6b7"] { --note-color:#2EEE85; }
[data-id="7bbebc92"] > div::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-color:var(--note-color);
  background-image:
    linear-gradient(24deg,rgba(255,255,255,.2),transparent 35%,rgba(65,39,14,.05) 67%,rgba(255,255,255,.12)),
    repeating-linear-gradient(0deg,rgba(65,39,14,.025) 0px,rgba(65,39,14,.025) 1px,transparent 1px,transparent 4px);
  clip-path:polygon(1% 1%,8% 1.5%,14% .5%,21% 1%,29% 0%,36% 1.2%,42% .4%,49% 1%,56% .2%,63% 1.3%,70% .5%,77% 1%,84% .1%,91% 1.3%,99% 0%,99.5% 9%,98.8% 17%,100% 25%,99% 34%,99.7% 43%,98.9% 51%,99.8% 59%,99% 68%,100% 76%,99.1% 84%,99.6% 92%,98% 99%,91% 98.5%,85% 100%,79% 98%,74% 99%,69% 98.5%,65% 100%,62% 98%,59% 99.5%,54% 98.7%,48% 100%,42% 98.5%,36% 99%,30% 98%,24% 99.5%,18% 98.5%,12% 99.7%,6% 98.8%,0% 99%,.6% 91%,0% 83%,1% 75%,.3% 68%,1.2% 60%,0% 52%,.7% 44%,0% 36%,1% 28%,.3% 20%,1% 11%);
}
[data-id="7bbebc92"] > div::after { content:none; }
[data-id="6e55e172"]::before { transform:scaleX(-1); }
[data-id="62e3e6a5"]::before { transform:scaleY(-1); }
[data-id="37abc6b7"]::before { transform:rotate(180deg); }
@media (max-width:767px) {
 [data-id="7bbebc92"] > div { filter:drop-shadow(0 5px 4px rgba(42,32,20,.13)); }
}


/* Reference featured-project sheet: fine tears and faint architectural linework. */
#work {
 clip-path:none !important;
 mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201000%20600%22%20preserveAspectRatio%3D%22none%22%3E%3Cpolygon%20fill%3D%22white%22%20points%3D%220%2C13.2%2010.3%2C14.4%2019.2%2C14.4%2024.6%2C14.7%2029.3%2C12.9%2034.3%2C15%2042.1%2C14.8%2049%2C13.8%2052.2%2C12.3%2061.2%2C11.9%2067.1%2C13.4%2077%2C14.1%2082.7%2C12.8%2086.3%2C12.6%2096.1%2C14.2%2099.4%2C12.5%20106.6%2C12.1%20117.3%2C12.6%20123.4%2C12.4%20126.5%2C11.1%20136%2C12.3%20146%2C13.2%20156.7%2C12.4%20160.8%2C12.4%20171.4%2C13.2%20180.7%2C12.5%20184.4%2C11.4%20188.4%2C10.3%20195.7%2C11.4%20205.5%2C12.7%20210.1%2C12.8%20213.5%2C10.3%20224.2%2C12.5%20230.1%2C10.8%20236.7%2C11.6%20244.4%2C10.6%20253.9%2C11.1%20261.6%2C9.8%20267.3%2C10.6%20271.1%2C9.6%20281.5%2C12%20290.8%2C9.2%20299.2%2C9.9%20309.5%2C9.5%20320.2%2C11%20324.8%2C11.5%20329.2%2C10%20337.8%2C11.1%20345%2C9.2%20349.4%2C8.8%20358.3%2C9.4%20367.4%2C9.6%20377.5%2C10.8%20383%2C8.9%20386.6%2C9.4%20393.8%2C9.7%20398.8%2C9.2%20407.5%2C9.1%20410.9%2C7.8%20414%2C8.4%20421.8%2C7.8%20426.3%2C9.4%20433.9%2C8.5%20440.3%2C8.4%20443.7%2C7.7%20452.4%2C8%20462.9%2C7.8%20472.2%2C9.6%20481.9%2C9.5%20490.9%2C8.7%20501.1%2C9.1%20509%2C8.7%20518.6%2C6.5%20527.5%2C9%20531.9%2C8.5%20540%2C8%20547.6%2C8.6%20555.9%2C6.1%20563.3%2C7.5%20571.7%2C7.8%20574.8%2C7.2%20582.5%2C7.6%20590.5%2C7.1%20597%2C7.4%20605%2C7.3%20610.9%2C6.6%20621.2%2C7.2%20628.9%2C6.1%20633.5%2C6.7%20639.4%2C6.9%20648.6%2C5.3%20656.3%2C6.5%20660.7%2C5.8%20665.3%2C5.1%20673.9%2C4.4%20683.9%2C4.3%20691.5%2C6.1%20699.4%2C5.9%20704.6%2C4.1%20715.4%2C5.9%20721.3%2C4.1%20727.5%2C6.7%20735.5%2C4.5%20743.7%2C5.3%20751.2%2C4.3%20756.8%2C5%20764%2C5.3%20768.1%2C3.5%20777.6%2C5.5%20782.1%2C6%20792.6%2C5%20800.1%2C15.1%20806.7%2C13.1%20817.3%2C5%20822.2%2C2.8%20826.9%2C3.6%20832%2C5.4%20841.9%2C3.4%20852.3%2C5.1%20855.6%2C4%20864.8%2C4.1%20872.7%2C4.2%20883.5%2C2%20887.3%2C3.8%20890.7%2C4.5%20899.8%2C2.6%20907.7%2C3.8%20912.2%2C3%20915.8%2C4.2%20926.7%2C2.8%20935.8%2C3%20942.4%2C4%20951.2%2C3.7%20958%2C3.2%20962%2C1.1%20965.1%2C3.5%20970.5%2C2.6%20977.5%2C3.6%20985.2%2C3.4%20994.4%2C2.5%201000%2C1%201000%2C588.5%20989.7%2C587.1%20982.6%2C587.9%20977.1%2C586.7%20969.7%2C587.6%20963.6%2C587.6%20960.5%2C586.8%20952.9%2C587.6%20947.6%2C587.1%20937.1%2C587%20926.3%2C586.5%20915.9%2C586.1%20910.7%2C586.8%20902.9%2C586.8%20893.6%2C586.6%20890.4%2C586%20885.2%2C586.7%20882.2%2C586.2%20873.9%2C588.2%20867.6%2C586.8%20861.2%2C585.5%20849.6%2C586.8%20846.5%2C587.6%20836.9%2C586.3%20829.3%2C586.3%20824.5%2C587.8%20819.3%2C587.1%20809.4%2C585.1%20803%2C585.6%20795.5%2C586.2%20787.8%2C587%20783.3%2C586.8%20780.1%2C586.6%20770.1%2C585.3%20762.3%2C586.1%20750.5%2C587%20747%2C586.8%20743.8%2C585.8%20734.8%2C585%20723%2C584.5%20717.2%2C584.9%20708.5%2C586%20699.1%2C585.1%20694.8%2C583.6%20691.1%2C584.8%20683.7%2C585%20679.1%2C585.6%20675.3%2C583.6%20672%2C585.9%20666.3%2C583.9%20661.6%2C586.1%20652.5%2C585.9%20644.8%2C583.7%20633.1%2C584.4%20622.9%2C585.6%20614.1%2C585.4%20606%2C582.9%20594.3%2C584.7%20590.4%2C582.9%20585%2C582.6%20578.2%2C585%20568.1%2C584.8%20558.8%2C584.6%20554.3%2C582.6%20546.5%2C584.6%20538.4%2C583.5%20527.8%2C583.1%20524.6%2C581.9%20518.4%2C583.4%20510.7%2C584.1%20506.5%2C574%20498.3%2C574%20491.8%2C583.5%20481.6%2C585%20472.6%2C584.5%20465.4%2C585.5%20462%2C583.8%20458.6%2C584.7%20447%2C585%20441.4%2C586.2%20429.9%2C585.9%20424.5%2C583.8%20419.8%2C586%20411.1%2C584.5%20400.7%2C586.9%20391.8%2C585.8%20386.7%2C585.6%20381.8%2C586.2%20370%2C586.3%20362.6%2C586.6%20359.3%2C586.1%20355.5%2C587.5%20349.9%2C585.7%20346%2C587.6%20336.3%2C587.4%20325.4%2C587.7%20315.3%2C585.8%20303.9%2C586.1%20298.2%2C586.9%20294.5%2C586.6%20284.2%2C587.5%20275.6%2C588.7%20267.2%2C588.3%20260.1%2C586.9%20250.7%2C587.3%20246.3%2C587.2%20241.3%2C589.3%20233.9%2C587.2%20229.9%2C587.2%20226.2%2C589.3%20216.4%2C587.3%20205.6%2C587.6%20196%2C589.1%20185.7%2C589%20176.9%2C588.4%20164.9%2C589.7%20154.4%2C590.8%20143%2C590.6%20134.5%2C591%20124.7%2C591%20121%2C590.6%20111.8%2C589.6%20103%2C591.6%2099.4%2C591.1%2095.5%2C590.1%2089%2C591%2081%2C590.9%2072%2C591.8%2063.1%2C591.1%2052.1%2C591.3%2048.4%2C589.8%2045.2%2C591.6%2041.4%2C589.9%2035.1%2C591.6%2027.4%2C590.6%2023.9%2C590.3%2014.4%2C592.7%204.5%2C592.1%200.6%2C592.2%200%2C592%22%2F%3E%3C%2Fsvg%3E"); mask-size:100% 100%; mask-repeat:no-repeat;
 background-color:#292a29;
 background-image:linear-gradient(97deg,rgba(255,255,255,.025),transparent 42%,rgba(0,0,0,.1)),
 repeating-linear-gradient(0deg,transparent 0 43px,rgba(236,226,208,.034) 43px 44px,transparent 44px 87px),
 repeating-linear-gradient(90deg,transparent 0 61px,rgba(236,226,208,.027) 61px 62px,transparent 62px 121px);
 padding-top:3rem; padding-bottom:3rem;
}
#work [data-id="50112fe8"] { color:#ece2d0; }
#work [data-id="50112fe8"]::first-letter { color:#FDA347; }
@media (max-width:767px) { #work { padding-top:2.8rem; padding-bottom:3rem; } }/* End custom CSS */