/* Reference-preserving elevation. Existing fonts, palettes and action geometry win. */
body{--craft-ease:cubic-bezier(.22,.72,.2,1);--craft-radius:12px;--craft-ink:#172124;--craft-paper:#f4f5f3;--craft-accent:#293936;--craft-on:#fff}
body[data-template=roofwork]{--craft-accent:#bf192d;--craft-paper:#f5f2ef}
body[data-template=roofstead]{--craft-accent:#ac370f;--craft-radius:16px;--craft-paper:#eff4f6}
body[data-template=proofline]{--craft-accent:#f6a177;--craft-on:#291a12;--craft-ink:#2d1c14;--craft-radius:16px;--craft-paper:#f7ede4}
body[data-template=skyline]{--craft-accent:#203b33;--craft-radius:14px;--craft-paper:#f0f2e9}
body[data-template=ridgeform]{--craft-accent:#fbd33d;--craft-on:#182a33;--craft-paper:#edf3f4}
::selection{background:var(--craft-accent);color:var(--craft-on)}
main h1,main h2,main h3{text-wrap:balance}main p{text-wrap:pretty}
.opening-description,.sky-opening p,.ridge-opening p{font-size:18px;line-height:1.65}
.opening-meta{font-size:12px!important;letter-spacing:.04em}
.header nav a,header nav a{font-size:14px}
.hero-note p,.hero-action p,.hero-descriptor{font-size:clamp(16px,1.2vw,19px)}
.hero-proof small,.hero-basics,.hero-scope span{font-size:15px}
.opening-art img,.hero-art,.hero-roof,.motion-layer{will-change:auto}
/* Natural, image-led depth; keep focus outside media masks. */
.feature-image,.featured-photo,.project-photo,.work-window,.about-photo,.about-tall,.portrait-stack .portrait{box-shadow:0 26px 45px -34px #17292d70}
.feature-image,.featured-photo,.project-photo,.about-photo,.about-tall,.story-wide .editorial-frame{overflow:hidden}
[data-craft-photo]{transform-origin:center;backface-visibility:hidden}
@media(hover:hover) and (pointer:fine){
 .service-row{transition:background-color 180ms var(--craft-ease)}
 .service-row:hover{background-color:#7183780a}
 .text-link:hover,.bench-foot a:hover,.viewfinder-bottom>a:hover{text-decoration:underline;text-underline-offset:6px}
}
.craft-label{display:block;font-size:13px;line-height:1.5;letter-spacing:.12em;font-weight:650;margin-bottom:20px}
.craft-caption{font-size:13px!important;line-height:1.5!important;opacity:.8}
.craft-control{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:14px 23px;border:1px solid transparent;border-radius:var(--craft-radius);font:600 16px/1.35 inherit;font-family:inherit;font-size:16px;line-height:1.35;font-weight:600;background:var(--craft-accent);color:var(--craft-on);text-decoration:none;cursor:pointer;box-shadow:inset 0 1px 0 #ffffff40,0 3px 6px #14242b15;transition:transform 160ms var(--craft-ease),box-shadow 160ms var(--craft-ease),background-color 160ms var(--craft-ease)}
.craft-control:active{transform:translateY(1px);box-shadow:inset 0 1px 3px #0002}.craft-control:focus-visible,.bench-controls input:focus-visible,.scope-list input:focus-visible,.junction-options summary:focus-visible,.care-chapter summary:focus-visible{outline:3px solid currentColor;outline-offset:6px}.craft-control:disabled{opacity:.5;cursor:not-allowed}
.craft-bench h2,.scope-desk h2,.junction-lab h2,.care-story h2,.viewfinder h2,.composition-board h2{font-size:clamp(38px,4.4vw,66px);line-height:1.08;letter-spacing:-.045em;margin:0 0 24px;font-weight:550}
.craft-bench p,.scope-desk p,.junction-lab p,.care-story p,.viewfinder p,.composition-board p{font-size:19px;line-height:1.65;margin:0 0 20px;max-width:47ch}
/* Roofline: a wide, quiet material bench. The range magnifies the real specimen. */
.craft-bench{padding:110px 6% 36px;background:#e7e9e6;color:#1d2825;display:grid;grid-template-columns:.78fr 1.22fr;gap:50px 5%;position:relative}
.bench-intro{align-self:center;max-width:390px}.bench-object{min-width:0}.inspection-window{height:520px;overflow:hidden;border-radius:20px;background:#dce0dc;box-shadow:inset 0 1px #fff9,0 22px 35px -28px #18201b70;display:grid;place-items:center}
.inspection-object{width:100%;height:100%;object-fit:contain;transform:scale(var(--inspect-zoom,1));transform-origin:52% 50%;transition:transform 140ms linear}
.bench-controls{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:24px 6px;font-size:14px}.bench-controls label{font-weight:650}.bench-controls input{width:100%;accent-color:#314d42;min-height:44px;cursor:ew-resize}.bench-controls output{min-width:95px;text-align:right}
.bench-foot{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #9daaa060;padding-top:22px;font-size:14px}.bench-foot p{font-size:13px;margin:0}.bench-foot a{font-weight:600;color:inherit}
/* Roofwork: a planning table, with a usable checklist rather than fake statistics. */
.scope-desk{margin:50px 5%;padding:65px 6%;display:grid;grid-template-columns:1.05fr 1fr;gap:35px 7%;background:#eee9e3;color:#26262a;border-radius:24px;position:relative;isolation:isolate;box-shadow:inset 0 1px #fff,0 24px 50px -40px #302a2377}
.desk-intro{grid-column:1}.desk-art{grid-column:2;grid-row:1/3;align-self:start;position:sticky;top:45px;z-index:-1}.desk-art img{width:115%;max-width:none;height:auto;margin-left:-8%;filter:drop-shadow(0 25px 17px #4c392522)}
.scope-list{border:0;padding:0;margin:0;min-width:0}.scope-list legend{font-size:15px;font-weight:600;margin-bottom:14px}.scope-list label{display:flex;gap:16px;align-items:center;padding:17px 0;border-bottom:1px solid #443b3020;cursor:pointer;font-size:18px}.scope-list input{width:21px;height:21px;accent-color:#bf192d;flex:none}.scope-summary{grid-column:2;grid-row:3;padding:26px 30px;background:#fffdf8;border:1px solid #d8d1c4;border-radius:12px;box-shadow:0 15px 25px -18px #45352644;align-self:end}.scope-summary .craft-label{margin-bottom:15px}.scope-summary p{font-size:17px;min-height:3.2em}.scope-summary small{display:block;font-size:12px;line-height:1.5;margin-top:16px}.scope-summary .craft-control{width:100%}
/* Roofstead: a specimen and clear point-by-point inspection. */
.junction-lab{display:grid;grid-template-columns:1.3fr .7fr;gap:45px 7%;padding:95px 7% 65px;background:#e5edf1;color:#162730;position:relative}
.junction-heading{grid-column:1/-1}.junction-heading p{max-width:none}.junction-stage{position:relative;align-self:center;min-width:0;height:420px;display:grid;place-items:center}.junction-object{width:100%;height:100%;object-fit:contain;transform:translateY(var(--spec-y,0px));filter:drop-shadow(0 28px 15px #1c3a4525)}.junction-marker{position:absolute;width:46px;height:46px;border:1px solid #a53b13;border-radius:50%;left:50%;top:18%;transform:translate(-50%,-50%);box-shadow:0 0 0 7px #fff8;transition:transform 260ms var(--craft-ease);pointer-events:none}.junction-options{align-self:center}.junction-options details{border:0;border-top:1px solid #98acb566;padding:0}.junction-options summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:22px 0;font-size:24px;font-weight:600}.junction-options summary::-webkit-details-marker{display:none}.junction-options details[open] summary{color:#a53b13}.junction-options details[open] summary span{transform:rotate(45deg)}.junction-options details p{font-size:17px;padding:0 0 20px;margin:0}.junction-lab>.craft-caption{grid-column:1/-1;margin:0}
/* Proofline: a human-paced set of chapters, with the photograph opening beside the story. */
.care-story{padding:100px 7%;display:grid;grid-template-columns:.8fr 1.2fr;gap:8%;background:#f6ede4;color:#2e1e15}.care-heading{align-self:start;position:sticky;top:50px}.care-pages{min-width:0}.care-chapter{border:0;border-bottom:1px solid #624c3933}.care-chapter summary{display:flex;justify-content:space-between;align-items:center;gap:25px;font-size:23px;line-height:1.35;font-weight:600;padding:24px 0;cursor:pointer;list-style:none}.care-chapter summary::-webkit-details-marker{display:none}.care-chapter summary b{font-weight:400;font-size:27px}.care-chapter[open] summary b{transform:rotate(45deg)}.care-reveal{padding-bottom:28px}.care-reveal p{font-size:18px}.care-reveal img{width:100%;height:330px;object-fit:contain;background:#e9ded1;border-radius:18px}
/* Skyline: a calm architectural viewfinder. Same photograph is deliberately inspected. */
.viewfinder{padding:100px 6% 70px;color:#23372f;background:#f1f2eb}.viewfinder-heading{max-width:900px;margin-bottom:40px}.viewfinder-heading h2{font-weight:400;font-size:clamp(40px,5vw,74px)}.viewfinder-frame{position:relative;overflow:hidden;border-radius:20px;height:650px;background:#becbbf}.viewfinder-photo{width:100%;height:100%;object-fit:cover;transform:scale(var(--view-scale,1));transform-origin:var(--view-origin,50% 50%);transition:transform 650ms var(--craft-ease)}.viewfinder-caption{position:absolute;bottom:0;inset-inline:0;padding:65px 30px 25px;display:flex;justify-content:space-between;gap:20px;color:#fff;background:linear-gradient(0deg,#172f25ba,transparent);font-size:14px}.viewfinder-bottom{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:25px}.viewfinder-controls{display:flex;flex-wrap:wrap;gap:12px}.viewfinder-controls button{background:transparent;color:#23372f;border-color:#aab7ad;box-shadow:none}.viewfinder-controls button[aria-pressed=true]{background:#23372f;color:#fff;border-color:#23372f}.viewfinder-bottom>a{color:inherit;font-size:15px}
/* Ridgeform: a material board and user-owned visual priorities. */
.composition-board{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:38px 7%;padding:100px 7%;background:#dce9ed;color:#1a303b}.board-copy{align-self:center}.board-art{min-width:0;align-self:center}.board-art img{width:115%;max-width:none;height:auto;margin-left:-8%;filter:drop-shadow(0 22px 17px #19323c25)}.board-choices{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.board-choices button{background:#f4f8f8;color:#1a303b;border-color:#92a7af}.board-choices button[aria-pressed=true]{background:#fbd33d;border-color:#b29420}.board-note{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;gap:12px 25px;border-top:1px solid #8da5b070;padding-top:30px;align-items:center}.board-note>span{font-size:12px;letter-spacing:.12em;font-weight:650}.board-note p{grid-column:1;margin:0;font-size:21px}.board-note>a{grid-column:2;grid-row:1/3}
@media(max-width:1000px){.scope-desk{gap:30px 4%;padding:60px 5%}.viewfinder-bottom{align-items:flex-start;flex-direction:column}.bench-controls{grid-template-columns:1fr auto}.bench-controls input{grid-column:1/-1;grid-row:2}.inspection-window{height:420px}.hero-note p,.hero-action p{font-size:15px}.care-story{gap:5%}.care-story h2{font-size:42px}}
@media(max-width:700px){
 .opening-description,.sky-opening p,.ridge-opening p{font-size:17px}.opening-meta{font-size:11px!important}
 .craft-bench,.scope-desk,.junction-lab,.care-story,.composition-board{display:flex;flex-direction:column;gap:28px;padding:58px 24px}
 .craft-bench h2,.scope-desk h2,.junction-lab h2,.care-story h2,.viewfinder h2,.composition-board h2{font-size:39px;line-height:1.1}
 .craft-bench p,.scope-desk p,.junction-lab p,.care-story p,.viewfinder p,.composition-board p{font-size:17px;line-height:1.65}
 .craft-label{font-size:12px;margin-bottom:16px}.bench-object{width:100%}.inspection-window{height:290px}.bench-controls{padding:15px 4px;gap:7px}.bench-foot{flex-direction:column;font-size:14px}.bench-foot p{font-size:12px}
 .scope-desk{margin:25px 14px}.desk-art{position:static;width:100%;order:1;z-index:auto}.desk-art img{width:100%;margin:0}.desk-intro{order:0}.scope-list{order:2}.scope-summary{order:3;padding:24px}.scope-list label{font-size:17px}
 .junction-stage{height:285px;width:100%;order:1}.junction-heading{order:0}.junction-options{order:2;width:100%}.junction-lab>.craft-caption{order:3;font-size:12px}.junction-options summary{font-size:23px}.junction-marker{width:30px;height:30px}
 .care-heading{position:static}.care-chapter summary{font-size:21px;min-height:70px}.care-reveal img{height:260px}
 .viewfinder{padding:58px 20px}.viewfinder-frame{height:400px}.viewfinder-caption{padding:65px 20px 20px;flex-direction:column;gap:6px;font-size:12px}.viewfinder-controls{gap:12px}.viewfinder-controls button{font-size:14px;padding:12px 15px;min-height:48px}.viewfinder-heading{margin-bottom:28px}
 .board-art img{width:100%;margin:0}.board-note{display:flex;flex-direction:column;align-items:flex-start}.board-note p{font-size:20px}.board-note a{margin-top:12px}.board-choices{gap:12px;margin-top:20px}.board-choices button{font-size:15px}
}
@media(prefers-reduced-motion:reduce){[data-craft-photo],.inspection-object,.junction-object,.viewfinder-photo{transition:none!important}.craft-control{transition:none!important}}
body[data-motion-off] [data-craft-photo],body[data-motion-off] .inspection-object,body[data-motion-off] .viewfinder-photo,body[data-motion-off] .junction-marker{transition:none!important}
@media print{.craft-control,.bench-controls,.board-choices{display:none}.care-chapter .care-reveal{display:block!important}.scope-desk,.care-story,.composition-board{break-inside:avoid}}

.scope-desk .desk-art{grid-row:1;z-index:0}.scope-desk .scope-summary{grid-row:2;align-self:center}
.care-story .care-heading h2{font-size:clamp(38px,3.8vw,57px)}
.junction-marker{top:34%;left:53%}
body[data-template] .section p,body[data-template] .process p,body[data-template] .service-description p{font-size:17px;line-height:1.65}
@media(min-width:1000px){body[data-template] .section p,body[data-template] .process p{font-size:18px}}
@media(max-width:700px){.scope-desk .desk-art{order:1}.scope-desk .scope-summary{order:3}.care-story .care-heading h2{font-size:39px}}
/* Let the form opening speak without the inherited decorative arrow watermark. */
.page--contact .opening-relief,.sky--contact .opening-relief,.ridge--contact .opening-relief{display:none}
@media(max-width:700px){body[data-template=roofstead] .hero-proof{margin-top:22px}body[data-template=roofstead] .split-hero .hero-basics{display:none}}
/* Native anchor navigation; soft-scale is authored separately on artwork. */
html{scroll-behavior:auto}
.craft-bench h2,.scope-desk h2,.junction-lab h2,.care-story h2,.viewfinder h2,.composition-board h2{overflow-wrap:anywhere}.craft-control{max-width:100%;white-space:normal;overflow-wrap:anywhere}