.product-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(420px,.8fr);background:#ece7df}
.product-gallery{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:#d3cdc4;align-content:start}
.product-gallery figure{margin:0;background:#fff;aspect-ratio:1/1;overflow:hidden}
.product-gallery-main{grid-column:1/-1;aspect-ratio:1.3/1!important}
.product-gallery img{width:100%;height:100%;object-fit:cover}
.product-summary{padding:4.5vw 4vw;align-self:start;position:sticky;top:0}
.product-summary h1{font:400 clamp(45px,4.3vw,66px)/.98 var(--display);margin:17px 0}
.product-code{font-size:9px;font-weight:700;letter-spacing:.16em;color:var(--muted)}
.product-dek{font-size:15px;line-height:1.68;color:#56524d;margin:23px 0}
.quick-specs{margin:0;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.quick-specs div{display:block;padding:12px 12px 11px 0;border-bottom:1px solid var(--line)}
.quick-specs div:nth-child(odd){border-right:1px solid var(--line)}
.quick-specs div:nth-child(even){padding-left:12px}
.quick-specs dt{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.quick-specs dd{margin:6px 0 0;font-size:13px;text-align:left}
.product-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.accuracy-note{font-size:10px;color:var(--muted);margin-top:18px}
.spec-builder{padding:105px 6vw;background:#f4f0e9}
.spec-builder-heading{display:grid;grid-template-columns:1.25fr .75fr;gap:8vw;align-items:end;margin-bottom:55px}
.spec-builder-heading h2{font:400 clamp(42px,4.5vw,66px)/1 var(--display);margin:16px 0 0;max-width:800px}
.spec-builder-heading>p{color:var(--muted);line-height:1.75;margin:0}
.spec-builder-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(330px,.6fr);gap:6vw;align-items:start}
.spec-fields{display:grid;gap:40px}
.spec-field{border:0;border-top:1px solid var(--line);padding:25px 0 0;margin:0;min-width:0}
.spec-field legend{font:400 25px var(--display);padding:0 20px 0 0}
.spec-field>p{font-size:11px;color:var(--muted);margin:14px 0 0;max-width:760px}
.spec-options{display:flex;gap:8px;flex-wrap:wrap}
.spec-option{min-width:124px;padding:13px 15px;background:transparent;border:1px solid #c8c0b5;text-align:left;cursor:pointer;color:var(--ink);transition:.2s}
.spec-option span{display:block;font-size:12px}
.spec-option small{display:block;margin-top:7px;font-size:8px;letter-spacing:.09em;color:var(--muted)}
.spec-option:hover,.spec-option.is-selected{background:#171717;border-color:#171717;color:#fff}
.spec-option.is-selected small,.spec-option:hover small{color:rgba(255,255,255,.65)}
.spec-summary{position:sticky;top:25px;background:#171717;color:#fff;padding:38px}
.spec-summary h3{font:400 32px var(--display);margin:16px 0 25px}
.spec-summary dl{border-top:1px solid rgba(255,255,255,.18);margin:0}
.spec-summary dl div{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.18)}
.spec-summary dt{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.52)}
.spec-summary dd{margin:0;font-size:12px;text-align:right}
.spec-summary dd[data-status="request"]{color:#e1c7a7}
.spec-summary-status{font-size:10px;color:rgba(255,255,255,.58);line-height:1.6;margin:22px 0}
.spec-summary .button{width:100%}
.colour-chart{margin-top:105px;padding-top:95px;border-top:1px solid var(--line)}
.colour-chart-heading{display:grid;grid-template-columns:1.1fr .9fr;gap:8vw;align-items:end}
.colour-chart-heading h2{font:400 clamp(40px,4vw,60px)/1 var(--display);margin:16px 0 0}
.colour-chart-heading>div:last-child p{font-size:12px;color:var(--muted);line-height:1.7}
.colour-chart-heading a{font-size:9px;letter-spacing:.12em;font-weight:700;border-bottom:1px solid}
.colour-filters{display:flex;gap:8px;margin:38px 0 22px;overflow-x:auto;padding-bottom:4px}
.colour-filters button{white-space:nowrap;border:1px solid #c8c0b5;background:transparent;padding:11px 17px;font-size:10px;letter-spacing:.06em;cursor:pointer}
.colour-filters button.is-active{background:#171717;color:#fff;border-color:#171717}
.colour-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px}
.colour-card{position:relative;padding:0;border:0;background:#fff;text-align:left;cursor:pointer;overflow:hidden;color:var(--ink)}
.colour-card[hidden]{display:none}
.colour-card img{aspect-ratio:4/5;object-fit:cover;transition:transform .35s}
.colour-card>span{display:block;min-height:64px;padding:12px;font-size:10px;line-height:1.35}
.colour-card>span strong{display:block;font-size:12px;margin-bottom:4px}
.colour-card:hover img{transform:scale(1.025)}
.colour-card.is-selected{outline:3px solid #171717;outline-offset:-3px}
.colour-card.is-selected:after{content:"SELECTED";position:absolute;top:10px;right:10px;background:#171717;color:#fff;padding:6px 8px;font-size:7px;letter-spacing:.1em}
.product-answer{padding:62px 6vw;background:#171717;color:#fff;display:grid;grid-template-columns:.4fr .8fr 1.2fr;gap:5vw;align-items:center}
.product-answer h2{font:400 36px/1.05 var(--display);margin:0}
.product-answer>p:last-child{color:rgba(255,255,255,.68);line-height:1.75}
.product-section{padding:100px 6vw}
.product-section-heading{display:grid;grid-template-columns:.5fr 1fr 1fr;gap:5vw;align-items:end;margin-bottom:45px}
.product-section-heading h2,.product-specification h2,.product-customisation h2{font:400 clamp(40px,4vw,62px)/1.02 var(--display);margin:0}
.product-section-heading>p:last-child{color:var(--muted)}
.buyer-checks{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.buyer-checks article{padding:35px 28px;border-right:1px solid var(--line)}
.buyer-checks article:last-child{border:0}
.buyer-checks span{font:400 30px var(--display);color:#9f876c}
.buyer-checks h3{font:400 25px var(--display);margin:20px 0 10px}
.buyer-checks p{font-size:13px;line-height:1.65;color:var(--muted)}
.method-comparison,.product-knowledge,.related-products{padding:100px 6vw;background:#fff}
.method-comparison{background:#ece6dc}
.comparison-scroll-hint{display:none;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.comparison-scroll{overflow-x:auto}
.comparison-scroll:focus-visible{outline:2px solid #171717;outline-offset:4px}
.comparison-scroll table{width:100%;min-width:1040px;border-collapse:collapse;background:#fff}
.comparison-scroll th,.comparison-scroll td{padding:22px 20px;border:1px solid var(--line);vertical-align:top;text-align:left;font-size:12px;line-height:1.6}
.comparison-scroll thead th{background:#171717;color:#fff;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.comparison-scroll tbody th{width:175px;font:400 18px var(--display)}
.service-comparison{padding:100px 6vw;background:#171717;color:#fff;display:grid;grid-template-columns:.7fr 1.3fr;gap:8vw}
.service-comparison>div:first-child h2{font:400 clamp(40px,4vw,60px)/1.02 var(--display);margin:16px 0 22px}
.service-comparison>div:first-child>p:last-child{color:rgba(255,255,255,.58);line-height:1.7}
.service-comparison-table{border-top:1px solid rgba(255,255,255,.2)}
.service-comparison-table>div{display:grid;grid-template-columns:.55fr 1fr 1fr;gap:25px;padding:19px 0;border-bottom:1px solid rgba(255,255,255,.2);font-size:11px;line-height:1.55}
.service-comparison-table>div>strong{font:400 17px var(--display)}
.service-comparison-table>div>span:last-child{color:rgba(255,255,255,.5)}
.service-comparison-table .service-comparison-head{font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.service-comparison-table .service-comparison-head strong{font:inherit}
.product-specification{padding:95px 6vw;background:#ddd4c7;display:grid;grid-template-columns:.85fr 1.15fr;gap:10vw}
.product-specification>div:first-child>p:last-child{color:#5e5953;max-width:520px}
.product-specification h3{font:400 25px var(--display);margin:0 0 14px}
.product-specification h3:not(:first-child){margin-top:38px}
.product-specification dl{margin:0;border-top:1px solid rgba(20,20,20,.18)}
.product-specification dl div{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:13px 0;border-bottom:1px solid rgba(20,20,20,.18)}
.product-specification dt{font-size:11px;color:#5e5953}
.product-specification dd{margin:0;text-align:right;font-size:13px}
.product-specification ul{padding:0;list-style:none;border-top:1px solid rgba(20,20,20,.18)}
.product-specification li{padding:11px 0;border-bottom:1px solid rgba(20,20,20,.18);font-size:13px}
.product-specification li:before{content:"To confirm";font-size:8px;letter-spacing:.1em;text-transform:uppercase;margin-right:15px;color:#766553}
.product-customisation{padding:90px 6vw;background:#fff;display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:end}
.product-customisation ul{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.product-customisation li{padding:16px 0;border-bottom:1px solid var(--line)}
.product-customisation .button{grid-column:2;justify-self:start}
.knowledge-grid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.knowledge-grid article{padding:30px 25px;border-right:1px solid var(--line)}
.knowledge-grid article:last-child{border-right:0}
.knowledge-grid article>span{font:400 27px var(--display);color:#9f876c}
.knowledge-grid h3{font:400 24px/1.08 var(--display);margin:18px 0 13px}
.knowledge-grid p{font-size:12px;line-height:1.7;color:var(--muted)}
.related-products{background:#f4f0e9}
.related-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
.related-product-card{background:#fff}
.related-product-card img{height:390px;object-fit:cover}
.related-product-card>div{padding:30px}
.related-product-card span{font-size:8px;letter-spacing:.12em;color:var(--muted)}
.related-product-card h3{font:400 30px var(--display);margin:14px 0 12px}
.related-product-card p{font-size:12px;color:var(--muted);line-height:1.65;min-height:60px}
.related-product-card strong{display:block;margin-top:24px;font-size:8px;letter-spacing:.12em}
@media(max-width:1050px){
  .product-hero{grid-template-columns:1fr}
  .product-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:2px}
  .product-gallery figure,.product-gallery-main{flex:0 0 78vw;aspect-ratio:1.3/1!important;scroll-snap-align:start}
  .product-summary{position:static}
  .product-section-heading{grid-template-columns:1fr 1fr}
  .product-section-heading>p:last-child{grid-column:1/-1}
  .comparison-scroll-hint{display:block}
  .buyer-checks{grid-template-columns:1fr 1fr}
  .buyer-checks article:nth-child(2){border-right:0}
  .spec-builder-layout{grid-template-columns:1fr}
  .spec-summary{position:static}
  .colour-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .service-comparison{grid-template-columns:1fr}
  .knowledge-grid{grid-template-columns:1fr 1fr}
  .knowledge-grid article{border-bottom:1px solid var(--line)}
  .knowledge-grid article:nth-child(even){border-right:0}
  .related-product-card img{height:300px}
}
@media(max-width:720px){
  .product-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:2px}
  .product-gallery figure,.product-gallery-main{flex:0 0 88vw;aspect-ratio:1/1!important;scroll-snap-align:start}
  .product-summary{padding:60px 22px}
  .product-summary h1{font-size:47px}
  .spec-builder{padding:70px 22px}
  .spec-builder-heading,.colour-chart-heading{grid-template-columns:1fr;gap:22px}
  .spec-builder-heading h2{font-size:42px}
  .spec-fields{gap:34px}
  .spec-options{display:grid;grid-template-columns:1fr 1fr}
  .spec-option{min-width:0}
  .spec-summary{padding:28px 23px}
  .colour-chart{margin-top:75px;padding-top:65px}
  .colour-grid{grid-template-columns:1fr 1fr}
  .colour-card>span{min-height:68px}
  .product-answer{padding:50px 22px;grid-template-columns:1fr;gap:15px}
  .product-section{padding:70px 22px}
  .product-section-heading{grid-template-columns:1fr;gap:18px}
  .product-section-heading>p:last-child{grid-column:auto}
  .buyer-checks{grid-template-columns:1fr}
  .buyer-checks article{border-right:0;border-bottom:1px solid var(--line)}
  .product-specification{padding:70px 22px;grid-template-columns:1fr;gap:45px}
  .product-customisation{padding:70px 22px;grid-template-columns:1fr;gap:35px}
  .product-customisation .button{grid-column:auto}
  .method-comparison,.product-knowledge,.related-products{padding:70px 22px}
  .service-comparison{padding:70px 22px;gap:40px}
  .service-comparison-table>div{grid-template-columns:1fr;gap:8px}
  .service-comparison-table .service-comparison-head{display:none}
  .service-comparison-table>div>span:before{display:block;margin-bottom:4px;font-size:7px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.42)}
  .service-comparison-table>div>span:nth-child(2):before{content:"DS HAIR WORKFLOW"}
  .service-comparison-table>div>span:nth-child(3):before{content:"UNSTRUCTURED RISK"}
  .knowledge-grid{grid-template-columns:1fr}
  .knowledge-grid article{border-right:0}
  .related-product-grid{grid-template-columns:1fr}
  .related-product-card img{height:330px}
}
