.hero>*{min-width:0}.name-part{display:inline-block}.description h2{text-wrap:balance}*{box-sizing:border-box}body{margin:0;background:#f5f4ee;color:#27382f;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}header{height:78px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d9ded7;gap:24px}.brand{font-weight:800;letter-spacing:.14em;font-size:16px}header span{font-size:11px;letter-spacing:.12em}nav{display:flex;gap:22px;font-size:12px}.wrap{max-width:1400px;margin:auto;padding:56px 5vw 80px}.eyebrow{font-size:11px;letter-spacing:.2em;font-weight:700;color:#657466}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.crumb{font-size:12px;color:#657466}h1{font-size:clamp(27px,2.4vw,36px);line-height:1.35;letter-spacing:.02em;margin:14px 0 20px}h2{font-size:25px;font-weight:600;text-wrap:balance}p{margin:0 0 14px}.intro{max-width:670px;color:#607066;font-size:14px}.hero{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(270px,.8fr);gap:44px;align-items:center}.stage{background:white;border:1px solid #e4e7df;position:relative;aspect-ratio:1.5;overflow:hidden;border-radius:3px}.stage img{width:100%;height:100%;object-fit:contain;display:block}.stamp{position:absolute;left:20px;top:16px;z-index:1;font-size:10px;letter-spacing:.15em;color:#617165}.controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:15px 0}.arrows{display:flex;gap:8px}button{border:1px solid #d2d9cf;border-radius:3px;background:transparent;color:#27382f;padding:8px 14px;font-size:12px}button:hover{background:#e9ede4}button:focus-visible,a:focus-visible{outline:3px solid #bc8750;outline-offset:3px}button[aria-pressed=true]{background:#273f31;color:white;border-color:#273f31}.count{font-size:11px;letter-spacing:.12em}.thumbs{display:flex;gap:9px;overflow:auto;padding-bottom:5px}.thumb{width:85px;flex-shrink:0;padding:0;background:white;border:2px solid transparent}.thumb[aria-current=true]{border-color:#536b4e}.thumb img{display:block;width:100%;aspect-ratio:1.5;object-fit:contain}.finish{display:flex;flex-wrap:wrap;gap:8px;margin:23px 0}.caption{margin:18px 0 0;min-height:125px}.caption small{font-size:10px;letter-spacing:.15em;color:#6c7c69}.caption h2{font-size:21px;margin:8px 0}.caption p{font-size:13px;color:#5b6c60}.note{font-size:11px!important;color:#7c7868!important}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;border-top:1px solid #d8dfd3;margin-top:62px;padding-top:30px}.feature b{font-size:22px;font-weight:500}.feature .num{color:#88957b;font-size:11px;margin-bottom:12px}.feature p{font-size:13px;color:#617064;margin-top:10px}.spec{display:grid;grid-template-columns:1fr 2fr;gap:40px;margin-top:65px;padding:32px 0;border-top:1px solid #d8dfd3}.spec h2{margin:0}.spec dl{margin:0}.spec dl div{display:grid;grid-template-columns:150px 1fr;padding:12px 0;border-bottom:1px solid #dfe3d9;font-size:13px}dt{color:#7a8778}dd{margin:0}.next{margin-top:40px;padding:20px;border:1px solid #d6ddd0;display:flex;justify-content:space-between;font-size:13px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:32px;margin-top:40px}.card{background:white;border:1px solid #e0e4d9;transition:transform .2s}.card:hover{transform:translateY(-3px)}.card img{display:block;width:100%;aspect-ratio:1.65;object-fit:contain}.card .copy{padding:20px 26px 27px;border-top:1px solid #eef0e9}.card h2{margin:7px 0;font-size:24px}.card p{font-size:13px;color:#647362;margin:0}.card small{font-size:10px;letter-spacing:.17em}.indexlead{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:end}.indexlead h1{font-size:clamp(35px,4vw,58px);margin-bottom:0}.indexlead p{max-width:460px;font-size:14px;color:#607066}.option-section{margin-top:55px;border-top:1px solid #d8dfd3;padding-top:32px}.option-section p{font-size:14px;color:#607066}.option-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}.option-pair figure{margin:0}.option-pair img{width:100%;display:block;background:white}.option-pair figcaption{font-size:12px;padding-top:8px}.quiet{margin-top:50px;font-size:13px;color:#63715d}footer{padding:30px 5vw;border-top:1px solid #d8dfd3;display:flex;justify-content:space-between;color:#788570;font-size:11px} @media(max-width:850px){header{height:65px}header span{display:none}nav{gap:10px}.hero{grid-template-columns:minmax(0,1fr);gap:22px}.hero .description{grid-row:1}.wrap{padding:30px 5vw 55px}.caption{min-height:0}.features{gap:20px;margin-top:40px}.feature b{font-size:18px}.spec{grid-template-columns:1fr;gap:12px}.indexlead{grid-template-columns:1fr;gap:20px}.cards{gap:18px}.card .copy{padding:16px}.card h2{font-size:20px}}@media(max-width:520px){.topline{flex-direction:column;align-items:flex-start;gap:8px}.topline .eyebrow{white-space:nowrap}.cards,.option-pair{grid-template-columns:1fr}.features{grid-template-columns:1fr;gap:20px}.feature{display:grid;grid-template-columns:30px 1fr;gap:0 10px}.feature p{grid-column:2}.feature .num{margin-top:8px}.spec dl div{grid-template-columns:105px 1fr}.controls button{padding:7px 11px}.brand{font-size:13px}nav{font-size:11px}.stage .stamp{font-size:9px;left:12px;top:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.stage{padding-bottom:48px}.stage #main-image{height:100%;width:100%}.finish-inset{position:absolute;right:12px;bottom:12px;width:25%;max-width:160px;padding:4px;background:#fff;border:1px solid #d5dacd;box-shadow:0 3px 12px #23352814;border-radius:4px}.finish-inset img{width:100%;height:auto;aspect-ratio:1.5;object-fit:contain}.finish-inset span{display:block;font-size:10px;line-height:1.5;text-align:right;padding:3px 4px}.finish-inset:hover{background:#fff;border-color:#567047}.current-finish{position:absolute;left:16px;bottom:13px;font-size:10px;color:#687664}.finish-note{font-size:11px;color:#6c7868;margin-top:-13px}.card-media{position:relative;padding-bottom:28px}.card-media>.card-main{aspect-ratio:1.7;width:100%}.card-inset{position:absolute;bottom:8px;right:10px;width:25%;border:1px solid #dbe0d4;background:#fff;padding:3px;border-radius:3px;box-shadow:0 2px 8px #2335280d}.card .card-inset img{aspect-ratio:1.5}.card-inset span{display:block;font-size:9px;text-align:right;line-height:1.4;padding:2px}.card-finish{position:absolute;left:16px;bottom:10px;font-size:10px;color:#697663}.collection-finishes{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px;color:#607066;font-size:12px}.collection-finishes span{padding:5px 11px;border:1px solid #d6dccc;border-radius:20px}.finish button:before{content:'';display:inline-block;vertical-align:middle;width:10px;height:10px;border-radius:50%;border:1px solid #aaa;margin-right:7px}.finish button[data-finish=black]:before{background:#252628}.finish button[data-finish=birch]:before{background:#dac69d}@media(max-width:520px){.stage{padding-bottom:35px}.finish-inset{right:8px;bottom:8px;width:25%}.finish-inset span{font-size:8px}.current-finish{left:10px;bottom:10px;font-size:9px}}

.layout-link{display:flex;justify-content:space-between;align-items:center;gap:20px;background:#e5eade;border:1px solid #cbd5c5;border-radius:5px;padding:23px 25px;margin-top:28px;font-size:13px}.layout-link b{font-size:12px;font-weight:600;white-space:nowrap}@media(max-width:600px){.layout-link{display:block}.layout-link b{display:block;margin-top:6px}header{gap:12px}header>span{display:none}nav{gap:10px;font-size:10px}}

.countertop-material{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;align-items:center;margin:22px 0;padding:14px;background:#faf9f5;border:1px solid #d6dccc;border-radius:5px;color:#27382f}
.countertop-material>img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:3px}
.countertop-material .countertop-eyebrow{font-size:10px;letter-spacing:.13em;color:#657466}
.countertop-material h3{font-size:15px;line-height:1.5;margin:3px 0 8px}
.countertop-material h3>span{display:block}.countertop-material h3>small{font-size:11px;font-weight:500;color:inherit}
.countertop-material p{font-size:11px;line-height:1.8;margin:0 0 6px;color:#607066}
.countertop-material small{display:block;font-size:10px;line-height:1.7;color:#607066}
.countertop-material .countertop-scope{grid-column:1/-1}.countertop-material .countertop-scope p:last-child{margin-bottom:0}
.wrap>.countertop-material{grid-template-columns:160px minmax(0,1fr);max-width:690px;margin:24px 0 0}
@media(max-width:440px){.countertop-material{grid-template-columns:92px minmax(0,1fr);gap:12px;padding:12px}.countertop-material h3{font-size:13px}.wrap>.countertop-material{grid-template-columns:112px minmax(0,1fr)}}

.hexa-brand{display:block;width:150px;height:56px;object-fit:contain}header .brand{line-height:0}

/* Keep the module catalogue visually connected to the brand site. */
body{background:#f1f0e9;color:#344238}
header{height:86px;border-color:#d8dcd1}
header .brand{flex-shrink:0}
header .logo-window{display:block;position:relative;width:110px;height:43px;overflow:hidden;mix-blend-mode:multiply}
header .logo-window .hexa-brand{position:absolute;width:146px;height:auto;max-width:none;left:-20px;top:-7px}
header nav{margin-left:auto;white-space:nowrap;font-weight:400;gap:25px}
header nav a{min-height:44px;display:flex;align-items:center}
header>span{font-size:10px;letter-spacing:.13em;color:#667160}
.skip-content{position:fixed;top:-80px;left:20px;background:#344238;color:#fff;padding:10px 16px;z-index:10}
.skip-content:focus{top:10px}
.hero{grid-template-columns:minmax(0,1.45fr) minmax(300px,.85fr);column-gap:44px;row-gap:0;grid-template-rows:min-content 1fr;align-items:start}
.hero .product-heading{grid-column:2;grid-row:1}
.hero .gallery{grid-column:1;grid-row:1 / span 2}
.hero .product-options{grid-column:2;grid-row:2}
.description h1{font-weight:500;line-height:1.5}
.description h2{font-size:22px;font-weight:450;line-height:1.65;margin:15px 0}
.product-heading .intro{font-size:13px;line-height:1.95;margin-bottom:0}
.product-options .finish{margin-top:22px}
.gallery .caption{min-height:155px;padding-top:18px;border-top:1px solid #d8dcd1;margin-top:20px;max-width:670px}
.gallery .caption h2{font-weight:450;line-height:1.6;font-size:21px}
.controls button{min-height:40px;cursor:pointer}
.finish button{min-height:44px;cursor:pointer}
.thumb{cursor:pointer}
.next{align-items:center;gap:12px 24px;flex-wrap:wrap;padding:22px 24px}
.next>b{font-weight:500;flex:1;min-width:160px}
.next>.construction-badge{flex-shrink:0}
footer{align-items:center;gap:20px;flex-wrap:wrap}
footer a{min-height:40px;display:flex;align-items:center}
button:focus-visible,a:focus-visible{outline-color:#738569}
@media(max-width:850px){
 header{height:70px;gap:16px}
 header .logo-window{width:86px;height:34px}
 header .logo-window .hexa-brand{width:116px;left:-16px;top:-5px}
 header nav{gap:20px;font-size:11px}
 .hero{display:flex;flex-direction:column;gap:26px;align-items:stretch}
 .hero .description{grid-row:auto}
 .product-heading h1{font-size:29px;margin-block:12px}
 .product-heading h2{font-size:21px;margin-block:14px}
 .gallery .caption{min-height:0;padding-top:15px;margin-top:17px}
 .product-options{border-top:1px solid #d8dcd1}
 .product-options .countertop-material{max-width:600px}
 .next{padding:20px;gap:12px}
 .next>span:first-child{flex-basis:100%;color:#667160;font-size:11px}
}
@media(max-width:400px){
 header{padding-inline:18px;gap:12px}
 header .logo-window{width:72px;height:31px}
 header .logo-window .hexa-brand{width:98px;left:-13px;top:-3px}
 header nav{gap:15px;font-size:10px}
 .product-heading h1{font-size:26px}
 .next>b{font-size:13px;line-height:1.9}
}

.product-heading h2 .phrase{display:inline-block}

.skip-content:not(:focus){clip-path:inset(50%);width:1px;height:1px;overflow:hidden;padding:0;white-space:nowrap}
