:root{--ink:#193E34;--paper:#F6F0E5;--muted:#52605B;--accent:#AD563D;--line:rgba(27,35,32,.14);--serif:'Inter Display',Arial,sans-serif;--sans:'Inter',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6}a{color:inherit}button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #E6B65B;outline-offset:4px}.skip{position:absolute;top:-100px;left:20px;background:white;padding:10px;z-index:100}.skip:focus{top:12px}.header{height:96px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 4.5%;border-bottom:1px solid var(--line)}.brand{display:inline-flex;gap:10px;align-items:center;text-decoration:none;white-space:nowrap;font-family:var(--serif);font-weight:800;letter-spacing:-1px;font-size:25px}.brand b{font-weight:500}.brand-symbol{display:grid;place-items:center;color:var(--paper);background:var(--ink);height:32px;width:32px;font:700 22px var(--sans);letter-spacing:-2px}.header nav{display:flex;gap:30px}.header nav a{text-decoration:none;font-size:14px;font-weight:500}.header nav a:hover,.text-link:hover{color:var(--accent)}.nav-cta{font-size:14px;text-decoration:none;border-bottom:1px solid;padding:8px 0;display:flex;gap:25px}.hero{display:grid;grid-template-columns:42% 58%;min-height:620px;padding:50px 4.5% 60px;gap:0;max-width:1700px;margin:auto}.hero-copy{padding:26px 30px 12px 0}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;margin:0 0 22px;color:var(--accent)}h1{font-family:var(--serif);font-size:clamp(48px,4.8vw,78px);line-height:1.06;letter-spacing:-2.7px;font-weight:400;margin:0 0 25px}h1 em{color:var(--accent);font-weight:400}.intro{max-width:390px;color:var(--muted);font-size:17px;line-height:1.75;margin:0 0 30px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;text-decoration:none;padding:15px 23px;font-weight:500;min-height:54px;border:none}.dark{background:var(--ink);color:white}.dark:hover{background:#193E34}.light{background:#F6F0E5;color:var(--ink)}.light:hover{background:white}.micro{font-size:13px;color:var(--muted);margin-top:20px}.hero-image{position:relative;min-height:520px;background:#e0e5e0;margin-left:15px}.hero-image>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.image-caption{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(15,30,30,.8));padding:60px 22px 20px;color:white;display:flex;justify-content:space-between;gap:20px;font-size:12px}.image-caption span:first-child{font-weight:700;letter-spacing:1.5px}.stats{display:grid;grid-template-columns:repeat(4,1fr);background:var(--ink);color:white;padding:34px 4.5%;gap:24px}.stats div{border-right:1px solid #46534C;padding:0 18px}.stats div:last-child{border:0}.stats strong{display:block;font:400 36px var(--serif);letter-spacing:-1px}.stats strong small{font-family:var(--sans);font-size:16px;letter-spacing:0}.stats span{font-size:13px;color:#F6F0E5}.section{padding:90px 4.5%;max-width:1700px;margin:auto}.section-top{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:34px}.section-top>p{max-width:340px;color:var(--muted);margin:0 0 8px}.section-top .eyebrow{margin-bottom:13px}h2{font-family:var(--serif);font-size:clamp(36px,3.7vw,54px);line-height:1.12;font-weight:400;letter-spacing:-1.5px;margin:0}.region-tabs{display:flex;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:32px}.region-tabs button{border:1px solid var(--line);padding:11px 18px;background:transparent;cursor:pointer;font-size:14px;min-height:46px}.region-tabs button[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:white}.region-tabs button:hover{border-color:var(--ink)}.style-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px}.option-kicker{font-size:12px;color:var(--muted);letter-spacing:1px;text-transform:uppercase}h3{font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.2;margin:6px 0 0}.variant-label{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--muted)}select{padding:10px 35px 10px 12px;max-width:240px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:14px}.view-pair{display:grid;grid-template-columns:1fr 1fr;gap:22px}figure{margin:0}.image-button{display:block;padding:0;border:0;width:100%;position:relative;cursor:zoom-in;background:#e9e9e0}.view-pair img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}.expand{position:absolute;right:12px;bottom:12px;background:var(--paper);height:32px;width:32px;display:grid;place-items:center;font-size:20px;color:var(--ink)}figcaption{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);padding:12px 0;border-bottom:1px solid var(--line)}figcaption span:first-child{font-weight:700;letter-spacing:1.3px;color:var(--ink)}.finish-notes{display:grid;grid-template-columns:1fr 1fr;gap:22px;font-size:14px;color:var(--muted)}.finish-notes p{margin:12px 0}.concept-note{font-size:12px;color:var(--muted);margin:20px 0 0}.details{display:grid;grid-template-columns:40% 60%;gap:0;padding-top:30px;padding-bottom:100px}.detail-copy{padding:22px 60px 0 0}.detail-copy>p:not(.eyebrow){color:var(--muted);margin:24px 0}.detail-copy ul{list-style:none;padding:0;margin:25px 0}.detail-copy li{border-bottom:1px solid var(--line);padding:12px 0;font-size:14px;display:flex;gap:16px}.detail-copy li span{font-size:12px;color:var(--accent)}.text-link{display:inline-flex;text-decoration:none;gap:30px;border-bottom:1px solid;margin-top:8px;padding-bottom:6px;font-size:14px}.detail-image{position:relative;margin-left:20px}.detail-image img{width:100%;height:100%;object-fit:cover}.detail-image figcaption{position:absolute;bottom:20px;left:24px;color:white;border:none;font:italic 28px var(--serif);text-shadow:0 1px 8px #000}.contact{background:var(--ink);color:white;display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:70px;max-width:none}.contact .eyebrow{color:#C5CEB9}.contact h2{font-size:clamp(40px,4vw,62px)}.contact p:not(.eyebrow){max-width:540px;color:#F6F0E5}.contact-action{justify-self:center}.contact-action p{max-width:280px!important;font-size:13px}footer{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:35px 4.5% 30px}footer>p{font-size:13px;text-align:right;color:var(--muted)}footer small{grid-column:1/-1;font-size:12px;max-width:900px;color:var(--muted)}dialog{border:0;background:#193E34;padding:42px 12px 12px;max-width:min(94vw,1400px);color:white;width:94vw}dialog::backdrop{background:rgba(9,20,25,.85)}dialog img{display:block;width:100%;max-height:78vh;object-fit:contain}dialog p{margin:10px 0 0;font-size:13px}.close-dialog{position:absolute;top:5px;right:12px;border:0;background:none;color:white;font-size:14px;padding:6px 12px;cursor:pointer}@media(min-width:1600px){.hero{min-height:720px}.hero-image{min-height:600px}}@media(max-width:950px){.header{height:80px}.header nav{gap:18px}.hero{grid-template-columns:44% 56%;padding-top:25px;min-height:540px}.hero-image{min-height:450px}.hero-copy{padding:20px 20px 0 0}h1{font-size:51px}.intro{font-size:16px}.details{grid-template-columns:1fr 1fr}.detail-copy{padding-right:30px}.section{padding-top:65px;padding-bottom:65px}.nav-cta{gap:10px}.image-caption{flex-direction:column;gap:4px}.contact{gap:30px}}@media(max-width:700px){.header{padding:0 20px;height:76px}.header nav{display:none}.brand{font-size:22px}.nav-cta{font-size:12px}.hero{display:flex;flex-direction:column;padding:28px 20px 30px;gap:24px}.hero-copy{padding:10px 0 0}.eyebrow{margin-bottom:16px}h1{font-size:58px;letter-spacing:-2px}.intro{max-width:100%;margin-bottom:20px}.hero-image{margin:0;min-height:0}.hero-image>img{height:auto;aspect-ratio:3/2;object-fit:contain}.micro{margin-bottom:0}.stats{grid-template-columns:1fr 1fr;padding:27px 20px;gap:24px}.stats div{padding:0 8px}.stats div:nth-child(2){border:0}.stats strong{font-size:31px}.stats span{font-size:12px}.section{padding:52px 20px}.section-top{display:block}.section-top>p{max-width:100%;margin-top:20px}.region-tabs{gap:6px}.region-tabs button{font-size:13px;padding:10px 12px}.style-heading{align-items:flex-start;flex-direction:column;gap:14px}.variant-label{width:100%;justify-content:space-between}select{max-width:70%}.view-pair,.finish-notes{grid-template-columns:1fr}.view-pair{gap:18px}.finish-notes{gap:0}.details{display:flex;flex-direction:column;padding-top:10px;gap:28px}.detail-copy{padding:0}.detail-image{margin:0}.detail-image img{display:block;aspect-ratio:3/2}.contact{grid-template-columns:1fr;gap:24px}.contact-action{justify-self:start}footer{display:block;padding:30px 20px}footer>p{text-align:left}footer small{display:block;line-height:1.6}.image-caption{padding-top:35px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Sundello brand system: graphite, malachite, quarry and layered mark. */
:root{--quarry:#F6F0E5;--amber:#E6B65B;--mono:'Inter',Arial,sans-serif}
.header{background:var(--paper);min-height:104px;height:auto;padding-top:20px;padding-bottom:20px}
.brand{gap:4px;letter-spacing:-.02em;font-weight:700}.brand-mark{display:block;width:60px;height:48px;flex:none}.brand-lockup{display:flex;flex-direction:column;line-height:1.1;gap:7px}.brand-lockup small{font:400 9px var(--mono);letter-spacing:.055em;text-transform:uppercase}.brand b{font-weight:500}
.hero{background:var(--quarry)}h1,h2,h3{font-weight:600;letter-spacing:-.025em}h1{font-weight:700}h1 em{font-style:normal;font-weight:700}
.eyebrow,.option-kicker,.image-caption,.stats span,figcaption,.detail-copy li span,footer>p{font-family:var(--mono)}.eyebrow{font-weight:500;font-size:11px;letter-spacing:.12em}.option-kicker{letter-spacing:.04em}.dark{background:var(--accent)}.dark:hover{background:#8D432E}.region-tabs button[aria-selected=true]{background:var(--accent);border-color:var(--accent)}.stats strong{font-family:var(--mono);font-weight:500;font-size:32px;letter-spacing:-.05em}.stats strong small{font-family:var(--mono);font-size:13px}.detail-image figcaption{font-style:normal;font-weight:500}.contact{border-top:4px solid var(--amber)}.light{background:var(--quarry)}
@media(max-width:950px){.header nav{gap:14px}.header{gap:16px}.brand-lockup small{font-size:8px}}
@media(max-width:700px){.header{min-height:86px;padding:15px 20px}.brand-mark{width:48px;height:38.4px}.brand{font-size:23px}.brand-lockup small{font-size:7px}.nav-cta{max-width:116px;line-height:1.4}h1{font-size:clamp(43px,11vw,58px)}.stats strong{font-size:28px}.stats strong small{font-size:12px}}

@font-face{font-family:'Inter';src:url('assets/fonts/Inter-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('assets/fonts/Inter-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'Inter Display';src:url('assets/fonts/InterDisplay-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
:root{--ink:#193E34;--paper:#F6F0E5;--accent:#AD563D;--quarry:#F6F0E5;--line:#C5CEB9;--muted:#526257;--serif:'Inter Display',Arial,sans-serif;--sans:'Inter',Arial,sans-serif}
body{font-family:var(--sans);font-weight:400}h1,h1 em,h2,h3{font-family:var(--serif);font-weight:600}h1{font-size:clamp(44px,4.8vw,64px);line-height:1.0625}h2{font-size:clamp(34px,3.7vw,40px);line-height:1.15}.intro{font-size:18px;line-height:28px}
.brand{gap:15px;min-width:180px;letter-spacing:-.025em;font-family:var(--serif);font-weight:600}.brand-mark{width:40px;height:36px}.brand-wordmark{font-size:32px;line-height:1.1}.eyebrow,.option-kicker,.image-caption,.stats span,figcaption,footer>p{font-family:var(--sans);font-weight:500}.eyebrow{text-transform:none;letter-spacing:.03em;font-size:12px}.stats strong{font-family:var(--sans);font-weight:400;letter-spacing:-.025em}.dark{background:var(--ink)}.dark:hover{background:#285746}.region-tabs button[aria-selected=true]{background:var(--ink);border-color:var(--ink)}.image-caption span:first-child{font-weight:600;font-family:var(--serif);letter-spacing:0;white-space:nowrap}.contact{border-top:3px solid #E6B65B}.contact .eyebrow{color:#C5CEB9}.button,.header nav a{font-weight:500}
@media(max-width:700px){.brand{gap:12px;min-width:180px}.brand-wordmark{font-size:30px}.brand-mark{width:36px;height:32.4px}.header{gap:12px}.nav-cta{max-width:108px}h1{font-size:clamp(43px,11vw,58px)}}

/* Aligned exterior comparison, shared geometry with independently themed settings. */
.comparison-section{padding-bottom:15px}.compare-frame{position:relative;aspect-ratio:3/2;width:100%;overflow:hidden;background:var(--line);isolation:isolate}.compare-frame>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;user-select:none}.compare-overlay{clip-path:inset(0 calc(100% - var(--reveal)) 0 0)}.compare-divider{position:absolute;top:0;bottom:0;left:var(--reveal);width:3px;transform:translateX(-50%);background:var(--paper);pointer-events:none;box-shadow:0 0 6px #0005}.compare-divider span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:48px;height:48px;border:2px solid var(--paper);border-radius:50%;background:var(--ink);color:var(--paper);font-size:26px}.compare-tag{position:absolute;top:18px;padding:8px 12px;background:var(--paper);color:var(--ink);font-size:13px;font-weight:500;pointer-events:none}.compare-tag-left{left:18px}.compare-tag-right{right:18px}.compare-frame input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.compare-frame:focus-within{outline:3px solid var(--accent);outline-offset:5px}.compare-controls{display:flex;justify-content:center;gap:10px;margin-top:18px;flex-wrap:wrap}.compare-controls button{border:1px solid var(--line);background:transparent;color:var(--ink);padding:10px 16px;cursor:pointer;font-size:14px;min-height:44px}.compare-controls button:hover{background:var(--ink);color:var(--paper)}@media(max-width:700px){.compare-tag{top:10px;font-size:10px;padding:5px 7px}.compare-tag-left{left:10px}.compare-tag-right{right:10px}.compare-divider span{width:38px;height:38px;font-size:22px}.compare-controls{gap:6px}.compare-controls button{font-size:12px;padding:8px 10px}}

/* Roof collection: retain Sundello's existing typography and colors. */
.roof-hero{display:grid;grid-template-columns:minmax(290px,.8fr) minmax(0,1.65fr);gap:44px;align-items:center;padding:40px 4.5% 48px;min-height:0;scroll-margin-top:24px}.roof-hero .hero-copy{padding:0;max-width:440px}.roof-hero h1{font-size:clamp(40px,4.25vw,62px);line-height:1.04;letter-spacing:-.045em}.roof-hero .eyebrow{font-size:14px;margin-bottom:20px}.roof-hero .intro{font-size:16px;line-height:1.65;margin:20px 0 26px;max-width:370px}.roof-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px}.roof-choice{border:1px solid #a7b3a3;background:transparent;color:var(--ink);border-radius:2px;min-height:123px;text-align:left;padding:14px;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;gap:4px;transition:background .18s,border-color .18s}.roof-choice svg{width:66px;height:37px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;margin-bottom:4px}.roof-choice>span{font-size:16px;font-weight:500}.roof-choice small{font-size:12px;line-height:1.4;opacity:.8}.roof-choice[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.roof-choice:hover{border-color:var(--ink)}.roof-choice[aria-pressed=false]:hover{background:#e9e8d9}.roof-finish-heading{display:flex;justify-content:space-between;gap:12px;font-size:14px;margin:24px 0 10px}.roof-finish-heading span:last-child{color:var(--muted);font-size:12px}.roof-finishes{display:flex;gap:8px;flex-wrap:wrap}.roof-finish{background:transparent;border:1px solid #a7b3a3;color:var(--ink);padding:8px 11px;min-height:44px;font-size:14px;line-height:1.35;cursor:pointer;display:flex;align-items:center;gap:8px;border-radius:2px}.roof-finish[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:#e9e8d9}.finish-swatch{width:17px;height:17px;flex:none;border:1px solid #193e3450;border-radius:50%}.roof-finish-description{font-size:14px;line-height:1.65;color:var(--muted);min-height:46px;margin:14px 0}.roof-hero .text-link{font-size:14px;margin-top:6px}.roof-stage{min-width:0;align-self:center}.roof-image-button{position:relative;background:#e9e8d9;border:0;display:block;width:100%;padding:0;cursor:zoom-in}.roof-image-button img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}.roof-expand{position:absolute;bottom:14px;right:14px;display:grid;place-items:center;background:var(--paper);color:var(--ink);width:38px;height:38px;font-size:25px}.roof-caption{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line);font-size:13px}.roof-caption>div{display:flex;flex-direction:column;gap:5px}.roof-caption>div>span{font-size:12px;color:var(--muted);font-weight:400;letter-spacing:0}.roof-caption strong{font-size:20px;font-weight:500;letter-spacing:-.025em;color:var(--ink)}.roof-caption>span{font-size:12px;color:var(--muted);font-weight:400;letter-spacing:0}.roof-note{font-size:12px;line-height:1.6;color:var(--muted);margin:12px 0 0}.roof-hero button:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.variant-label{font-size:14px}.concept-note{font-size:13px}.region-tabs button{font-size:14px}.option-kicker{font-size:13px}.section-top>p{font-size:16px}.compare-tag{font-size:14px}.header nav a{font-size:14px}
@media(min-width:1600px){.roof-hero{min-height:0;max-width:1700px;margin:auto;padding-top:60px;padding-bottom:60px}}
@media(max-width:1100px){.roof-hero{gap:28px;grid-template-columns:minmax(275px,.85fr) minmax(0,1.15fr)}.roof-hero h1{font-size:44px}.roof-choice{padding:12px}.roof-choice small{font-size:12px}}
@media(max-width:820px){.roof-hero{display:flex;flex-direction:column;align-items:stretch;gap:26px;padding:32px 24px 36px}.roof-hero .hero-copy{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.roof-hero .eyebrow{grid-column:1/-1}.roof-hero h1{grid-column:1;font-size:48px}.roof-hero .intro{grid-column:1;grid-row:3;margin:16px 0 0}.roof-picker{grid-column:2;grid-row:2 / span 2}.roof-finish-heading,.roof-finishes,.roof-finish-description,.roof-hero .text-link{grid-column:1/-1}.roof-hero .text-link{justify-self:start}.roof-finish-description{min-height:0}.roof-stage{width:100%}.roof-choice{justify-content:center}.header nav{display:none}}
@media(max-width:520px){.roof-hero{padding:26px 20px 32px;gap:22px}.roof-hero .hero-copy{display:block}.roof-hero h1{font-size:46px}.roof-hero .eyebrow{font-size:13px;margin-bottom:14px}.roof-hero .intro{margin:18px 0 22px;max-width:none}.roof-picker{gap:10px}.roof-choice{min-height:117px}.roof-finish-heading{margin-top:20px}.roof-finish{padding:8px 10px;font-size:14px}.roof-finish-description{margin:12px 0}.roof-caption{padding:14px 0}.roof-caption strong{font-size:18px}.roof-caption>span{max-width:80px;text-align:right}.roof-note{font-size:12px}.header .nav-cta{font-size:13px}.stats span{font-size:13px}.compare-tag{font-size:12px}.compare-controls button{font-size:14px}.variant-label{flex-wrap:wrap}select{max-width:100%}.region-tabs button{font-size:14px}.style-heading h3{font-size:29px}}
@media(prefers-reduced-motion:reduce){.roof-choice{transition:none}}
@media(max-width:520px){.roof-hero{gap:0}.roof-hero .hero-copy{display:contents}.roof-hero .eyebrow{order:0}.roof-hero h1{order:1;font-size:40px}.roof-hero .intro{order:2;margin:14px 0 20px}.roof-picker{order:3}.roof-choice{min-height:105px}.roof-stage{order:4;margin:22px 0 0}.roof-finish-heading{order:5;margin-top:24px}.roof-finishes{order:6}.roof-finish-description{order:7}.roof-hero .text-link{order:8;align-self:flex-start;margin-top:8px}}

.outpost-crosslink{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:30px 4.5%;border-bottom:1px solid var(--line);font-size:17px}.outpost-crosslink a{font-weight:500;text-underline-offset:5px}@media(max-width:700px){.outpost-crosslink{align-items:flex-start;flex-direction:column;padding:28px 20px;gap:8px}}