:root{--navy:#142c39;--gold:#d7b271;--paper:#f7f5ee;--ink:#1b3038;--muted:#5b6b70;--roof:#383b3b;--siding:#eeeae1;--trim:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:5px}button{cursor:pointer}img{max-width:100%;object-fit:cover}h1,h2,h3,p{margin-top:0}h1,h2{font-family:Georgia,serif;font-weight:400;line-height:1.07;letter-spacing:-.035em}h1{font-size:clamp(48px,6.8vw,94px);margin-bottom:28px}h2{font-size:clamp(36px,4.4vw,60px);margin-bottom:26px}h3{font-size:24px;line-height:1.25}em{font-weight:400;color:#ac813f}p{color:var(--muted)}.top{background:var(--navy);color:#fff;padding:10px 5%;font-size:11px;letter-spacing:.18em;display:flex;justify-content:space-between}.top span{letter-spacing:0;color:#c5d0d4}header{padding:18px 5%;background:#fff;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:20;border-bottom:1px solid #ddd}.brand{display:flex;align-items:center;gap:14px}.brand b{font-family:Georgia,serif;font-size:40px;line-height:1;letter-spacing:-4px;border-top:3px solid var(--gold);padding-top:6px}.brand b span{color:#ae803c}.brand small{font-size:10px;font-weight:700;line-height:1.5;letter-spacing:.12em}.brand img{width:70px;height:62px;object-fit:contain}header nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:700}.button{display:inline-block;border:0;background:var(--gold);color:#172d39;padding:17px 25px;font-size:14px;letter-spacing:.02em;font-weight:700;border-radius:2px}.button:hover{background:#e6c58c}.menu{display:none}.hero{min-height:730px;position:relative;padding:85px 7%;display:flex;align-items:center;background:var(--navy);color:#fff}.hero>img,.hero-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-shade{background:linear-gradient(90deg,rgba(12,31,42,.94),rgba(12,31,42,.6) 49%,rgba(12,31,42,.03))}.hero article{position:relative;max-width:740px}.hero h1 em{color:var(--gold)}.hero p{color:#e0e6e6;max-width:570px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.19em;text-transform:uppercase;color:#98733a;margin-bottom:24px}.hero .eyebrow{color:var(--gold)}.text-link{margin-left:28px;font-size:14px;border-bottom:1px solid #aaa;padding-bottom:7px}.caption{position:absolute;bottom:22px;right:28px;font-size:9px;letter-spacing:.15em}.intro{padding:85px 8%;max-width:1100px}.intro>p:last-child{max-width:720px;font-size:19px}main>section:not(.hero):not(.intro):not(.subhero):not(.split):not(.cta){padding:75px 7%}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:36px}.section-head>a{font-size:14px;margin-bottom:28px}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.service-card{padding:35px;background:white;border:1px solid #dedfd9;display:flex;flex-direction:column;transition:transform .2s}.service-card:hover{transform:translateY(-5px);border-color:#ad8e58}.service-card>span{font-size:10px;letter-spacing:.12em;color:#8b703e}.service-card h3{font:32px/1.15 Georgia,serif;margin-top:32px}.service-card b{margin-top:auto;padding-top:24px;font-size:13px}.split{display:grid;grid-template-columns:1fr 1fr}.split>img{height:590px;width:100%}.split>div{padding:70px 10%;align-self:center}.dark,.cta{background:var(--navy);color:white}.dark p,.cta p{color:#c5d0d5}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:40px}.steps article{border-top:1px solid #c8c8bf;padding-top:25px}.steps b{color:#a8874e;font:32px Georgia,serif;display:block;margin-bottom:20px}.cta{padding:65px 7%;display:flex;justify-content:space-between;align-items:center;gap:30px}.cta h2{font-size:46px;margin:0}.cta .eyebrow{color:var(--gold)}footer{padding:65px 7% 25px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px;background:#0e212b;color:#e8ebe8}footer p{color:#aab6ba;font-size:14px;margin-top:25px}footer h3{font-size:15px}footer a:not(.brand){display:block;font-size:14px;margin:9px 0;color:#c9d1d3}.fine{font-size:12px!important;line-height:1.6}.fine a{text-decoration:underline}footer>.fine{grid-column:1/-1;border-top:1px solid #2c424c;padding-top:25px}.subhero{display:grid;grid-template-columns:1.1fr 1fr;padding:0;background:#eae8df}.subhero>div{padding:70px 12%}.subhero h1{font-size:clamp(42px,5.7vw,76px)}figure{margin:0;position:relative}.subhero img{width:100%;height:100%;min-height:540px}.subhero figcaption{position:absolute;right:15px;bottom:15px;font-size:11px;background:#ffffffdc;padding:6px 12px}.guide{display:grid;grid-template-columns:270px minmax(0,800px);gap:70px}.guide aside{position:sticky;top:130px;align-self:start}.guide aside a{display:block;border-bottom:1px solid #d8d8cf;padding:13px 0;font-size:14px}.guide article{margin-bottom:55px}.guide h2{font-size:37px}.guide p{font-size:18px}.color-callout{background:#e9e7dd}.faq{max-width:1100px;margin:auto}details{border-bottom:1px solid #ccc;padding:23px 0}summary{cursor:pointer;font-weight:700;font-size:20px}details p{margin:20px 0 0}.studio{display:grid;grid-template-columns:1.2fr 1fr;gap:45px;background:#eae8df}.preview{position:sticky;top:120px;align-self:start}.preview svg{width:100%;border:1px solid #d0d4cd;border-radius:5px}.preview>p{margin-top:18px}label{display:grid;gap:8px;font-size:15px;font-weight:700;margin-bottom:22px}input,select,textarea{width:100%;min-width:0;border:1px solid #aeb9b7;padding:13px;background:#fff;color:var(--ink);border-radius:3px}.collection{background:white;padding:22px;margin:22px 0;border:1px solid #d2d5d1}.collection h3{margin:0;font-size:22px}.collection>p{font-size:13px}.swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.swatches button{padding:6px;border:1px solid #ccc;background:white;color:var(--ink);font-size:12px;text-align:left;line-height:1.4}.swatches i{height:55px;display:block;margin-bottom:8px;background:var(--color)}.swatches button[aria-pressed=true]{outline:3px solid #a77d39}.collection>a{font-size:12px;text-decoration:underline}.trim{display:flex;flex-wrap:wrap;gap:8px}.trim button{padding:10px;background:white;border:1px solid #aaa}.contact-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:85px}.contact-grid form{background:#fff;border:1px solid #ddd;padding:35px}.contact-grid aside h2{font-size:44px}.contact-grid li{margin:15px 0;color:var(--muted)}.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;z-index:100;background:white;padding:15px}@media(max-width:900px){header nav{gap:14px;font-size:12px}.brand small{display:none}.services{grid-template-columns:1fr 1fr}.split,.subhero{grid-template-columns:1fr}.subhero img{max-height:400px;min-height:0}.subhero>div{padding:55px 7%}.split>img{height:380px}.guide{grid-template-columns:1fr}.guide aside{position:static}.studio{grid-template-columns:1fr}.preview{position:static}.contact-grid{gap:35px}.hero{min-height:680px}}@media(max-width:600px){.top span{display:none}.menu{display:block;border:0;background:none;font-size:25px}header{padding:14px 6%}header nav{display:none;position:absolute;top:100%;left:0;right:0;background:white;padding:25px;flex-direction:column;align-items:stretch;font-size:16px}header nav.open{display:flex}.hero{padding:65px 7%;min-height:650px}.hero-shade{background:rgba(12,31,42,.7)}h1{font-size:54px}.text-link{display:block;margin:24px 0 0;width:max-content}.services,.steps,.contact-grid{grid-template-columns:1fr}.intro{padding:60px 7%}.section-head{display:block}.cta{display:block}.cta .button{margin-top:30px}.cta h2{font-size:36px}footer{grid-template-columns:1fr 1fr;gap:25px}footer>div:first-child{grid-column:1/-1}.contact-grid form{padding:22px}main>section:not(.hero):not(.intro):not(.subhero):not(.split):not(.cta){padding:50px 6%}.brand small{display:block}.subhero h1{font-size:48px}}
.nav-group{position:relative}.nav-group summary{font-size:14px;list-style:none;cursor:pointer;padding:10px 0}.nav-group summary::after{content:' ⌄';color:#a8874e}.nav-group>div{position:absolute;top:100%;left:0;min-width:245px;background:#fff;box-shadow:0 10px 30px #102a3926;border:1px solid #ddd;padding:12px;max-height:65vh;overflow:auto}.nav-group a{display:block;padding:9px 12px;font-size:14px}.nav-group a:hover{background:#f3eee3}.manufacturer-directory article{padding:30px 0;border-bottom:1px solid #ccc}.manufacturer-directory article>a{display:inline-block;text-decoration:underline;font-size:14px;margin:20px 20px 0 0}.color-name-list{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.color-name-list span{display:flex;align-items:center;gap:10px;font-size:14px}.color-name-list i{width:40px;height:35px;flex-shrink:0;border:1px solid #bbb}.directory-links{display:grid;grid-template-columns:1fr 1fr;gap:15px}.directory-links a{padding:16px;background:#fff;border:1px solid #ddd}.guide article img{width:100%}.nav-group>summary::-webkit-details-marker{display:none}@media(max-width:1000px){header nav{gap:12px}.nav-group summary{font-size:12px}}@media(max-width:600px){.nav-group>div{position:static;box-shadow:none;min-width:0}.nav-group summary{font-size:17px}.color-name-list,.directory-links{grid-template-columns:1fr 1fr}.color-name-list span{font-size:12px}.manufacturer-directory article{padding:22px 0}}
/* Larger Royal identity and a more substantial header. */
header .brand img{width:112px;height:90px}header .brand small{font-size:12px;letter-spacing:.1em}header{padding-top:12px;padding-bottom:12px}footer .brand img{width:125px;height:100px}.hero{min-height:760px}.hero-shade{background:linear-gradient(90deg,rgba(12,31,42,.92),rgba(12,31,42,.62) 44%,rgba(12,31,42,.02) 78%)}.hero>img{object-position:center 56%}.brand{gap:10px}@media(max-width:1100px){header .brand small{display:none}}@media(max-width:600px){header .brand img{width:90px;height:76px}header .brand small{display:block;font-size:10px}.hero-shade{background:linear-gradient(90deg,rgba(12,31,42,.86),rgba(12,31,42,.46))}.hero{min-height:680px}}

header .nav-group{padding:0;border:0}header .nav-group[open]{z-index:30}
/* Photography-led service presentation and spacious Royal project storytelling. */
.services{grid-template-columns:repeat(6,minmax(0,1fr));gap:28px}.photo-card{grid-column:span 2;padding:0 0 30px;overflow:hidden;border:0;box-shadow:0 8px 30px #122b3909}.photo-card:nth-child(4),.photo-card:nth-child(5){grid-column:span 3}.photo-card>img{width:100%;height:260px;display:block;object-fit:cover;transition:transform .5s}.photo-card:nth-child(4)>img,.photo-card:nth-child(5)>img{height:340px}.photo-card:hover>img{transform:scale(1.025)}.photo-card>span,.photo-card>h3,.photo-card>p,.photo-card>b{margin-left:27px;margin-right:27px}.photo-card>span{margin-top:28px}.photo-card>h3{margin-top:18px}.photo-card>p{font-size:16px}.photo-card>b{padding-top:10px}.craft-feature{position:relative;background:#142c39;padding:0!important;min-height:680px;display:grid;grid-template-columns:1.25fr 1fr}.craft-feature>img{width:100%;height:100%;min-height:680px;object-fit:cover}.craft-feature>div{align-self:center;padding:70px 12%;color:#fff}.craft-feature h2{font-size:clamp(40px,4vw,60px)}.craft-feature p{color:#c5d1d6}.craft-feature .eyebrow{color:#d7b271}.craft-feature small{display:block;font-size:11px;color:#aebcc1;margin-top:28px}.work-gallery>div{display:grid;grid-template-columns:1fr 1fr;gap:30px}.work-gallery figure:first-child{grid-column:1/-1}.work-gallery img{width:100%;height:360px;object-fit:cover}.work-gallery figure:first-child img{height:520px}.work-gallery figcaption{font-size:14px;padding:12px 0;color:#61727a}.subhero figure>img{object-position:center}.subhero{grid-template-columns:1fr 1.12fr}.hero h1{max-width:800px}@media(max-width:1000px){.services{grid-template-columns:1fr 1fr}.photo-card,.photo-card:nth-child(4),.photo-card:nth-child(5){grid-column:auto}.photo-card:last-child{grid-column:1/-1}.craft-feature{grid-template-columns:1fr}.craft-feature>img{height:470px;min-height:0}.craft-feature>div{padding:55px 7%}.subhero{grid-template-columns:1fr}}@media(max-width:600px){.services,.work-gallery>div{grid-template-columns:1fr}.photo-card,.photo-card:last-child{grid-column:auto}.photo-card>img,.photo-card:nth-child(4)>img,.photo-card:nth-child(5)>img{height:250px}.craft-feature>img{height:330px}.work-gallery figure:first-child img,.work-gallery img{height:280px}.photo-card>h3{font-size:30px}}

/* GAF manufacturer photographs */
[hidden]{display:none!important}
#roof-photo{margin:0;background:white;padding:24px;border:1px solid #d2d3ca}
#roof-photo-image{display:block;width:100%;height:auto;max-height:490px;object-fit:contain}
#roof-photo-caption{font:32px Georgia,serif;margin:22px 0 12px;color:#142c39}
#roof-photo a{font-size:14px;text-decoration:underline}
#palette-summary{white-space:pre-line}
.photographic-swatches{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.photographic-swatches button{padding:8px;text-align:left;font-size:15px;line-height:1.4}
.photographic-swatches img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:#f4f4f1;margin-bottom:10px}
.photographic-swatches button[aria-pressed=true]{outline:3px solid #b68b46;outline-offset:2px}
@media(max-width:600px){#roof-photo{padding:16px}.photographic-swatches{gap:12px}.photographic-swatches button{font-size:14px}}

.photographic-swatches img.official-color-chip{width:100%;height:14px;aspect-ratio:auto;object-fit:cover;margin:8px 0 0}#detail-color-sample{display:block;width:100%;height:24px;object-fit:cover;margin-top:12px}

.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}footer a, .contact-grid aside a{overflow-wrap:anywhere}

/* Larger, readable typography and direct estimate enquiries. */
body{font-size:20px;line-height:1.65}.top{font-size:14px;letter-spacing:.07em}.top span{font-size:16px}
header nav,.nav-group summary,.nav-group a{font-size:17px}header nav{gap:18px}.button,.text-link,.section-head>a{font-size:18px}.eyebrow{font-size:14px}.photo-card>p,.guide p,.intro>p:last-child{font-size:20px}.service-card b,.guide aside a{font-size:18px}.service-card>span{font-size:14px}
label{font-size:19px}input,select,textarea{font-size:18px;min-height:52px}.form-heading{font-size:36px}.contact-grid{gap:48px}.contact-grid form .button{width:100%}.contact-grid aside>.button{font-size:26px}.contact-grid aside{min-width:0}.contact-grid form{min-width:0}
footer p,footer a:not(.brand),footer h3{font-size:18px}.fine{font-size:15px!important}.collection>p,.collection>a,#roof-photo a,.color-name-list span,.photographic-swatches button,.swatches button{font-size:17px}.work-gallery figcaption,.craft-feature small{font-size:15px}
@media(max-width:1250px){header .brand small{display:none}header nav{gap:13px}.nav-group summary,header nav{font-size:16px}header nav .button{padding:15px;font-size:16px}}
@media(max-width:1000px){.menu{display:block;border:0;background:none;font-size:28px}header nav{display:none;position:absolute;top:100%;left:0;right:0;background:white;padding:24px;flex-direction:column;align-items:stretch;max-height:80vh;overflow:auto}header nav.open{display:flex}.nav-group>div{position:static;box-shadow:none;min-width:0}.nav-group summary,header nav,.nav-group a{font-size:18px}.contact-grid{grid-template-columns:1fr}.contact-grid aside{order:-1}.contact-grid aside ul,.contact-grid aside h2,.contact-grid aside .eyebrow:nth-of-type(2){display:none}}
@media(max-width:600px){body{font-size:18px}.top{font-size:12px}.photo-card>p,.guide p,.intro>p:last-child{font-size:18px}.contact-grid aside>.button{font-size:23px}.form-heading{font-size:30px}.photographic-swatches button{font-size:16px}footer{grid-template-columns:1fr}footer>div{min-width:0}.contact-grid{gap:28px}}

.welcome-video{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);gap:48px;align-items:center;background:#eae8df}.welcome-video h2{font-size:clamp(36px,4vw,58px)}.welcome-video video{display:block;width:100%;aspect-ratio:16/9;background:#142c39;object-fit:contain}.welcome-video figcaption{font-size:15px;line-height:1.5;margin-top:12px;color:#526168}.welcome-phone{display:block;font-size:32px;font-weight:700;margin:24px 0}.welcome-video .button{margin-top:8px}@media(max-width:1000px){.welcome-video{grid-template-columns:1fr;gap:28px}}

/* Consistent gutters on service guides at every screen size. */
main>section.guide{padding:72px max(6%,calc((100% - 1440px)/2));grid-template-columns:240px minmax(0,1fr);gap:64px}.guide>div,.guide aside{min-width:0}.guide article{scroll-margin-top:150px}
@media(max-width:900px){main>section.guide{grid-template-columns:1fr;gap:32px;padding:48px 6%}.guide aside{position:static}.guide aside a{padding:12px 0}}

.breadcrumbs{padding:22px 7%;display:flex;flex-wrap:wrap;gap:12px;font-size:16px;line-height:1.5;background:#f7f5ee}.breadcrumbs a{text-decoration:underline}.breadcrumbs span[aria-current]{color:#53636b}

.lead-panel{background:#142c39;color:#fff;padding:40px}.lead-panel p{color:#dce4e7}.lead-panel .eyebrow{color:#d7b271}.lead-panel a{overflow-wrap:anywhere}.lead-panel h3{font:36px/1.2 Georgia,serif}.lead-panel .button{margin:10px 0 25px}@media(max-width:600px){.lead-panel{padding:25px}}

main>section.construction-estimate{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:0;padding:0;margin:65px auto;max-width:1600px;width:88%;background:#fff;border:1px solid #dedfd9}.construction-estimate figure{min-height:700px;position:relative}.construction-estimate figure>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:45% center}.construction-estimate figcaption{position:absolute;bottom:18px;left:18px;background:#ffffffde;padding:6px 12px;font-size:13px}.construction-estimate form{padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:0 18px;min-width:0}.construction-estimate form>h2,.construction-estimate form>p,.construction-estimate form>button,.construction-estimate form>label:has(textarea){grid-column:1/-1}.construction-estimate label{font-size:17px;margin-bottom:16px}.construction-estimate textarea{height:110px}.construction-estimate .form-heading{font-size:36px}.construction-estimate form>p{font-size:17px}.construction-estimate form>p a{text-decoration:underline}.construction-estimate .button{width:100%}
@media(max-width:1000px){main>section.construction-estimate{grid-template-columns:1fr}.construction-estimate figure{min-height:0;aspect-ratio:3/2}.construction-estimate figure>img{object-position:center}}
@media(max-width:600px){main>section.construction-estimate{margin:36px auto;width:90%}.construction-estimate form{padding:24px;grid-template-columns:1fr}.construction-estimate .form-heading{font-size:31px}}

main>section.construction-estimate{padding:0!important}.construction-estimate form{align-content:start}.construction-estimate label input::placeholder{font-weight:400}.construction-estimate form>label:has(select){grid-column:1/-1}

.service-next{background:#eae8df;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:50px}.service-next h2{font-size:clamp(32px,4vw,48px)}.service-next aside a{display:block;padding:13px 0;border-bottom:1px solid #c6c9c4;font-size:18px}.service-phone{display:inline-block;margin:18px 0;text-decoration:underline;font-weight:700}.mobile-leads{display:none}@media(max-width:800px){.service-next{grid-template-columns:1fr;gap:30px}}@media(max-width:600px){body:has(.mobile-leads){padding-bottom:72px}.mobile-leads{display:grid;grid-template-columns:1fr 1fr;position:fixed;bottom:0;left:0;right:0;z-index:40;background:#142c39;padding:10px 12px max(10px,env(safe-area-inset-bottom));gap:10px;box-shadow:0 -3px 15px #0002}.mobile-leads a{text-align:center;font-size:16px;font-weight:700;padding:12px 5px;color:white}.mobile-leads a:last-child{background:#d7b271;color:#142c39}body:has(form:focus-within) .mobile-leads{display:none}}

.local-links{background:#eae8df}.local-links>div{display:flex;flex-wrap:wrap;gap:14px;margin:24px 0}.local-links>div a{padding:16px 22px;background:white;border:1px solid #d0d4ce;font-size:18px;font-weight:700}
