/* Exterior Design: shared project planning additions. Existing page styles remain intact. */
html{overflow-x:clip}
.nav-item:focus-within .dropdown{opacity:1;visibility:visible;transform:none}
.project-context,.project-range,.project-guides,.project-brief-section,.project-space-section{padding:64px 28px}
.project-context{background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.project-context .wrap{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start}
.project-context h2,.project-range h2,.project-guides h2,.project-brief-section h2,.project-space-section h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.5vw,46px);line-height:1.12;margin:0 0 18px}
.project-context p,.project-range p,.project-space-section p,.project-guides p,.project-brief-section p{color:var(--ink-soft);margin-bottom:18px;max-width:70ch}
.project-links{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.project-links a{padding:10px 16px;border:1px solid var(--line);border-radius:24px;font-size:14px;background:var(--paper);text-decoration:underline;text-underline-offset:3px}
.project-links a:hover{border-color:var(--red);color:var(--red)}
.project-check{border-left:3px solid var(--red);padding-left:18px}
.project-cards,.space-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:30px}
.project-card,.space-card{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--cream)}
.project-card img{width:100%;height:220px;object-fit:cover}
.project-card-body,.space-card{padding:26px}
.project-card h3,.space-card h3{font-family:var(--serif);font-size:29px;font-weight:400;line-height:1.2;margin-bottom:14px}
.project-card ul,.project-guides ul{list-style:none;padding:0;margin:0}
.project-card li{border-top:1px solid var(--line);padding:14px 0}
.project-card li a{font-weight:600;text-decoration:underline;text-underline-offset:3px}
.project-card li span{display:block;color:var(--ink-soft);font-size:14px;margin-top:5px}
.project-intro{max-width:1360px;margin:auto;padding:55px 28px 28px}
.project-intro h1{font-family:var(--serif);font-weight:400;line-height:1.06;font-size:clamp(42px,5.4vw,76px);max-width:19ch;margin-bottom:24px}
.project-intro h1 em{color:var(--red);font-weight:300}
.project-intro .dek{font-size:19px;color:var(--ink-soft);max-width:68ch;margin-bottom:26px}
.project-intro .hero-cta{margin-bottom:14px}
.project-guides{background:var(--cream)}
.project-guides ul{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.project-guides a{display:block;border:1px solid var(--line);border-radius:14px;padding:18px;text-decoration:underline;text-underline-offset:4px}
.project-brief{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:26px}
.project-field{display:flex;flex-direction:column;gap:8px;font-weight:600}
.project-field input,.project-field select,.project-field textarea{width:100%;font:inherit;font-weight:400;background:var(--cream);color:var(--ink);padding:13px;border:1px solid #968b7c;border-radius:9px}
.project-field textarea{min-height:120px;resize:vertical}
.project-field small,.project-note{font-weight:400;font-size:14px;color:var(--ink-soft)}
.project-brief fieldset{border:1px solid var(--line);border-radius:12px;padding:18px;min-width:0}
.project-brief legend{font-weight:600;padding:0 6px}
.project-options{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.project-options label{display:flex;gap:10px;align-items:center;cursor:pointer;font-size:15px}
.project-options input{accent-color:var(--red);width:18px;height:18px;flex-shrink:0}
.project-wide{grid-column:1/-1}
.project-brief .project-action{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.project-context .btn,.project-intro .btn,.project-brief .btn{white-space:normal;text-align:center;justify-content:center}
.project-context a:focus-visible,.project-intro a:focus-visible,.project-brief a:focus-visible,.project-brief input:focus-visible,.project-brief select:focus-visible,.project-brief textarea:focus-visible{outline:3px solid var(--red);outline-offset:4px}
#project-brief,#project-range,#roofing,#decking{scroll-margin-top:100px}
@media(max-width:800px){.project-context .wrap,.project-cards,.space-cards,.project-guides ul,.project-brief{grid-template-columns:1fr}.project-context,.project-range,.project-guides,.project-brief-section,.project-space-section{padding:44px 20px}.project-intro{padding:38px 20px 22px}.project-card img{height:230px}.project-wide{grid-column:auto}}
@media(max-width:420px){.project-options{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.marquee-track,.hero-badge,.fab::after{animation:none}}