@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500&family=Roboto+Condensed:wght@300;400;500&display=swap');
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;color:#343434;font-family:Arial,sans-serif;font-size:14px;line-height:1.8;background:white}h1,h2,h3,p,ul,figure{margin:0}ul{padding:0;list-style:none}img{max-width:100%;vertical-align:bottom}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a,button{transition:opacity .2s}a:hover{opacity:.65}a:focus-visible,button:focus-visible{outline:2px solid #76644b;outline-offset:5px}.skip{position:absolute;left:-9999px}.skip:focus{left:20px;top:20px;z-index:10001;background:white}.global-header{height:90px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:#fff;position:relative;z-index:90}.wordmark{font:italic 42px Georgia,serif;letter-spacing:-2px}.menu-toggle{border:0;background:none;width:32px;padding:0;display:grid;gap:7px}.menu-toggle span{height:1px;background:#666;width:30px}.header-shop{font:12px 'Roboto Condensed',Arial,sans-serif;letter-spacing:.14em}#global-menu{position:absolute;top:90px;left:0;right:0;z-index:100;background:#f7f7f7;padding:35px 6vw}#global-menu:not([hidden]){display:flex;gap:40px}.hero-image{height:calc(100svh - 90px)!important;min-height:600px;object-fit:cover;object-position:center 48%}.products-main .-nav{background:linear-gradient(transparent,rgba(255,255,255,.5))}.products-main .-name h1{font-size:40px;font-weight:400;letter-spacing:.1em}.products-main .-name p{line-height:1.7}.products-main .-buy a{font-size:14px}.products-main .-menu:before{display:none}.nav-fx .nav-fx-box{box-sizing:border-box}.products-concept .concept-product{width:260px;max-height:370px;object-fit:contain}.products-concept .-logo p{font:14px 'Roboto Condensed',sans-serif;letter-spacing:.1em;text-align:center;margin-top:25px}.products-concept .-detail h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:42px;font-weight:400}.products-concept .-detail p{font-size:14px;line-height:2.1}.products-concept .-concept_typo h3 strong{font:32px 'Roboto Condensed',sans-serif;letter-spacing:.12em}.products-concept .-concept_typo h3 span{font:12px Arial,sans-serif;display:block;margin-top:10px;letter-spacing:.1em}.products-read{background:#f0ede7}.products-read img{max-width:320px;margin:60px auto;display:block}.products-read h2,.film h2,.color-section h2,.specification h2{font:400 36px/1.4 'Cormorant Garamond',Georgia,serif}.roasting-ritual{padding:6vw}.roasting-ritual .mod__flex{display:flex;gap:4vw}.roasting-ritual .mod__flex__item{width:50%}.roasting-ritual img{width:100%;height:32vw;object-fit:cover}.roasting-ritual h3{font:400 26px/1.4 'Cormorant Garamond',Georgia,serif;padding:24px 0 12px}.roasting-ritual p{font-size:14px}.film{text-align:center;padding:5vw 8vw 10vw}.film p{margin:16px 0 40px;color:#777}.film video{width:min(900px,100%);max-height:570px;background:#eaeaea}.function .-text h3{font-family:'Cormorant Garamond',Georgia,serif;font-size:32px}.function .more-content-area{height:auto!important;overflow:visible}.function .-image img{height:40vw;object-fit:cover}.function:nth-of-type(8) .-image img{object-fit:contain}.function .function-title{margin-bottom:30px}.function-anchor .-flex .-item a:after{content:'↓';background:none;width:auto;height:auto;margin-top:-12px;color:#777}.function-anchor .-flex .-item a .-text{font-family:Georgia,serif;padding-right:30px}.specification{max-width:1100px;margin:auto}.specification h2{text-align:center;margin:35px 0 55px}.specification table{width:100%;border-collapse:collapse;font-size:14px}.specification th,.specification td{padding:20px 18px;border-bottom:1px solid #ddd;text-align:left;vertical-align:top;font-weight:400}.specification th{width:30%;color:#888}.color-section{text-align:center;background:#eaeaea;padding:90px 6vw}.color-section>p{margin:20px 0}.color-buttons{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:35px 0}.color-choice{padding:9px 20px;border:1px solid #aaa;background:transparent;color:#555}.color-choice.active{background:#343434;color:#fff;border-color:#343434}#color-photo{width:400px;height:380px;object-fit:contain;mix-blend-mode:multiply}.order-section{padding:100px 8vw;max-width:1400px;margin:auto;text-align:center}.order-section>h2{font:400 36px 'Roboto Condensed',sans-serif;letter-spacing:.1em}.order-section>p{margin:20px 0 60px;color:#777}#product-component-prototype{min-height:400px}.purchase-help{font-size:12px}.products-gallery{display:grid;grid-template-columns:repeat(3,1fr)}.products-gallery img{width:100%;height:32vw;object-fit:cover}footer{background:#f6f6f6;padding:70px 6vw;color:#777}footer>div{display:flex;gap:40px;margin:35px 0}footer small{display:block;margin-top:35px;font-size:11px}
@media(max-width:749px){html{scroll-padding-top:75px}.global-header{height:80px}.wordmark{font-size:34px}.header-shop{font-size:10px}.hero-image{height:72vw!important;min-height:0;object-position:45% center}.products-main .-nav{position:static;background:white;padding-bottom:24px}.products-main .-name h1{font-size:32px}.products-main .-menu ul{display:flex;justify-content:center}.products-main .-menu ul li{width:33.333%;min-width:0;max-width:none}.products-main .-menu ul li:last-child{margin:0}.products-main .-menu ul li a{padding:15px 8px}.products-main .-menu ul li a span{font-size:14px}.products-main .-buy{margin-bottom:25px}.products-concept .-logo{width:100%;padding:0 0 50px}.products-concept .-detail{width:100%;padding:0 5vw}.products-concept .-detail h2{font-size:34px}.products-concept .concept-product{width:170px}.products-read h2,.film h2,.color-section h2{font-size:29px}.products-read img{width:210px;margin:45px auto}.roasting-ritual{padding:15vw 8vw}.roasting-ritual .mod__flex{display:block}.roasting-ritual .mod__flex__item{width:100%;margin-bottom:50px}.roasting-ritual img{height:80vw}.roasting-ritual h3{font-size:26px}.film{padding:0 8vw 20vw}.film p{font-size:12px}.function .-image img{height:85vw}.function .-text h3{font-size:28px}.function .-text p{font-size:14px}.function-anchor .-flex .-item a .-text{font-size:15px}.function-anchor .-flex .-item a .-num{min-width:65px}.specification h2{font-size:32px}.specification th,.specification td{padding:16px 8px;font-size:12px}.specification th{width:35%}.color-section{padding:65px 8vw}#color-photo{width:100%;height:300px}.color-choice{padding:6px 13px;font-size:12px}.order-section{padding:70px 8vw}.products-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}.products-gallery img{min-width:85%;height:90vw;scroll-snap-align:start}footer>div{flex-direction:column;gap:15px}#global-menu:not([hidden]){display:grid;gap:20px}.nav-fx .nav-fx-box{padding:12px 20px}.nav-fx .nav-fx-le{width:55%}.nav-fx .-title{font-size:15px}.nav-fx .-title strong{font-size:10px}.nav-fx .-buy a{font-size:12px;height:43px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Reference palette and official brand assets. */
:root{--reference-white:#fff;--reference-concept:#d9d6d4;--reference-introduction:#ebecf0;--reference-gray:#eaeaea;--reference-nav:#f7f7f7}
body,.global-header,.products-main .-nav{background:var(--reference-white)}
.products-concept{background:var(--reference-concept)}
.products-read{background:var(--reference-introduction)}
.function.-bg-gray,.color-section{background:var(--reference-gray)}
.nav-fx .nav-fx-box{background:var(--reference-nav)}
.products-main .-nav{background:none}
.wordmark{display:inline-flex;align-items:center;line-height:1;letter-spacing:normal}
.wordmark img{width:190px;height:auto;display:block}
.film-player{width:min(900px,100%);aspect-ratio:16/9;margin:0 auto;background:#ebecf0}
.film-player iframe{display:block;width:100%;height:100%;border:0}
@media(max-width:749px){.wordmark img{width:150px}.products-main .-nav{background:var(--reference-white)}.film{padding-bottom:15vw}}

/* Editorial illustrations: keep complete drawings and product silhouettes visible. */
.products-concept .concept-product.editorial-sketch{width:420px;max-height:none;aspect-ratio:1;object-fit:contain}
.products-read img.introduction-product{width:min(660px,85vw);max-width:660px;margin:55px auto;mix-blend-mode:multiply}
.function .-image.media-sketch{display:flex;align-items:center;justify-content:center;background:inherit;padding:3vw}
.function .-image.media-sketch img{width:100%;height:34vw;object-fit:contain}
.function .-image.media-thermal img{height:40vw;object-fit:contain;background:#eaeaea}
.function .-image.media-heat-source{display:flex;align-items:center;justify-content:center;padding:5vw}
.function .-image.media-heat-source img{width:100%;height:30vw;object-fit:contain}
#anchor-function-5 .-image img{object-fit:cover}
@media(max-width:749px){
 .products-concept .concept-product.editorial-sketch{width:min(330px,82vw)}
 .products-read img.introduction-product{width:88vw;margin:35px auto}
 .function .-image.media-sketch{padding:5vw}
 .function .-image.media-sketch img{height:76vw}
 .function .-image.media-thermal img{height:75vw}
 .function .-image.media-heat-source{padding:10vw}
 .function .-image.media-heat-source img{height:65vw}
}

@media(max-width:749px){.products-main .-menu ul li{width:50%}}

/* Keep the delicate concept sketch readable on the pale concept background. */


/* Approved original artwork: adjust display contrast only, without regenerating geometry. */


/* Simplified concept and original six-photo everyday mosaic. */
html{scroll-padding-top:30px}
.products-concept .-detail h2{margin-bottom:1.1em}
.products-read img.introduction-product{margin-bottom:0}
.everyday-gallery{background:#292826}
.everyday-grid{display:flex;width:100%;gap:0}
.everyday-column{display:flex;flex-wrap:wrap;width:33.333333%;aspect-ratio:1}
.everyday-column figure{margin:0;overflow:hidden;min-width:0}
.everyday-column .image-half{width:50%;height:50%}
.everyday-column .image-full{width:100%;height:50%}
.everyday-middle .image-half,.everyday-right .image-full{height:100%}
.everyday-column img{display:block;width:100%;height:100%;object-fit:cover}
.everyday-discover{padding:65px 24px;text-align:center}
.everyday-discover a{display:inline-block;border:1px solid #817e76;padding:15px 50px;color:#f2eee7;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.everyday-discover a:hover{border-color:#f2eee7}
@media(max-width:749px){
 html{scroll-padding-top:20px}
 .everyday-grid{display:block}
 .everyday-column{width:100%}
 .everyday-discover{padding:40px 24px}
 .everyday-discover a{padding:15px 25px;font-size:11px}
}

/* One product navigation, with the official Zenroast logo. */
.hero-image{height:100svh!important;min-height:600px}
.products-main .-name h1{padding:0;margin:0;line-height:1}
.products-main .-name h1 .product-logo{display:block;width:225px;height:auto}
.products-main .-name p{margin-top:18px}
.products-main .-name{padding-bottom:30px}
@media(max-width:749px){
.hero-image{height:72vw!important;min-height:0}
.products-main .-nav{padding:35px 6vw 24px}
.products-main .-name h1 .product-logo{width:189px;margin:0 auto}
.products-main .-name p{margin-top:16px}
.products-main .-name{padding-bottom:24px}
.products-main .-buy{width:min(250px,100%);margin:0 auto 22px}
.products-main .-menu ul li{width:33.333333%}
.products-main .-menu ul li a{padding:15px 4px}
}

/* Simple hero links, aligned to the right on desktop. */
.products-main .-menu ul{display:flex;gap:0}
.products-main .-menu ul li{margin:0;max-width:none;min-width:0}
.products-main .-menu ul li a strong{white-space:nowrap}
@media(min-width:750px){
.products-main .-nav .-nav-fl{justify-content:flex-start}
.products-main .-menu{width:auto}
.products-main .-menu ul li{width:auto}
.products-main .-menu ul li a{padding:18px 22px}
.products-main .-menu ul li:last-child a{padding-right:0}
}

/* Hero navigation: no dividers, balanced alignment at both breakpoints. */
.products-main .-menu ul li,
.products-main .-menu ul li:last-child{border:0;margin:0}
.products-main .-menu ul li a{padding:16px 0;text-align:center}
.products-main .-menu ul li a strong{padding:0;line-height:1.4}
.products-main .-menu ul{margin:0;padding:0;overflow:visible;flex-wrap:nowrap}
@media(min-width:750px){
.products-main .-nav{display:flex;align-items:center;justify-content:space-between;gap:40px}
.products-main .-name{width:auto;padding-bottom:0;flex:0 0 auto}
.products-main .-nav .-nav-fl{display:block;flex:0 0 auto}
.products-main .-menu ul{gap:36px}
.products-main .-menu ul li a,
.products-main .-menu ul li:last-child a{padding:16px 0}
}
@media(max-width:749px){
.products-main .-menu{width:100%}
.products-main .-menu ul{display:flex;justify-content:center;width:100%}
.products-main .-menu ul li{flex:1 1 0;width:0;text-align:center}
.products-main .-menu ul li a{padding:16px 0}
}

/* Refined hero, illustration caption, and detail numbers. */
.products-main .-name h1 .product-logo{width:200px}
.products-concept .-logo p{margin-top:0}
.function .function-title p strong{font-weight:300;margin-left:12px}
@media(max-width:749px){.products-main .-name h1 .product-logo{width:168px}}

/* Shared navigation bar below the hero; remains at the top while scrolling. */
main > .-nav{position:sticky;top:0;z-index:100;background:#fff;width:100%;padding:24px 6vw 16px;color:#343434;line-height:1.4}
main > .-nav .-name{width:100%;padding:0;margin:0;text-align:center}
main > .-nav .-name h1{padding:0;margin:0;line-height:1}
main > .-nav .product-logo{display:block;width:168px;height:auto;margin:0 auto}
main > .-nav .-nav-fl{display:block;margin-top:18px}
main > .-nav .-menu{width:100%;max-width:480px;margin:0 auto}
main > .-nav .-menu ul{display:flex;flex-wrap:nowrap;margin:0;padding:0;list-style:none}
main > .-nav .-menu li{flex:1 1 0;min-width:0;margin:0;border:0;text-align:center}
main > .-nav .-menu a{display:block;padding:12px 0;text-align:center}
main > .-nav .-menu strong{display:block;padding:0;font:700 14px/1.4 'Roboto Condensed',Arial,sans-serif;white-space:nowrap;color:#636262}
html{scroll-padding-top:160px}
@media(max-width:749px){main > .-nav{padding:24px 6vw 14px}html{scroll-padding-top:155px}}

/* Horizontal brand and navigation, with an order action. */
main > .-nav{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:20px 4vw}
main > .-nav .-name{width:auto;flex:0 0 auto}
main > .-nav .product-logo{width:168px;margin:0}
main > .-nav .-nav-fl{margin:0;flex:0 1 auto}
main > .-nav .-menu{max-width:none}
main > .-nav .-menu ul{align-items:center;gap:28px}
main > .-nav .-menu li{flex:0 0 auto}
main > .-nav .-menu .nav-order a{padding:13px 24px;background:#343434;border-radius:3px}
main > .-nav .-menu .nav-order strong{color:#fff;letter-spacing:.08em}
html{scroll-padding-top:110px}
@media(max-width:749px){
main > .-nav{gap:12px;padding:16px 5vw;flex-wrap:wrap}
main > .-nav .product-logo{width:126px}
main > .-nav .-nav-fl{flex:1 1 100%}
main > .-nav .-menu ul{gap:10px;justify-content:space-between}
main > .-nav .-menu li{flex:0 1 auto}
main > .-nav .-menu .nav-order a{padding:10px 14px}
html{scroll-padding-top:140px}
}

/* Reveal the header on upward scrolling; compact mobile menu. */
main > .direction-nav{transition:transform .24s ease}
main > .direction-nav.nav-hidden{transform:translateY(-100%)}
.product-menu-toggle{display:none}
@media(max-width:749px){
main > .direction-nav{flex-wrap:nowrap;position:sticky;padding:18px 5vw}
.product-menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:9px;border:0;background:none;color:#343434}
.product-menu-toggle span{display:block;width:22px;height:1px;background:currentColor;transition:transform .2s,opacity .2s}
main > .direction-nav .-nav-fl{display:none;position:absolute;top:100%;left:0;width:100%;padding:8px 5vw 20px;background:#fff}
main > .direction-nav.menu-open .-nav-fl{display:block}
main > .direction-nav .-menu ul{display:flex;flex-direction:column;align-items:stretch;gap:0}
main > .direction-nav .-menu li{width:100%;flex:auto}
main > .direction-nav .-menu a{padding:15px;text-align:left}
main > .direction-nav .-menu .nav-order{margin-top:8px}
main > .direction-nav .-menu .nav-order a{padding:14px 20px;text-align:center}
.menu-open .product-menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .product-menu-toggle span:nth-child(2){opacity:0}
.menu-open .product-menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
html{scroll-padding-top:90px}
}
@media(prefers-reduced-motion:reduce){main > .direction-nav,.product-menu-toggle span{transition:none}}

/* Mobile needs only the brand and order action. */
@media(max-width:749px){
main > .direction-nav .-nav-fl{display:block;position:static;width:auto;flex:0 0 auto;padding:0;background:none}
main > .direction-nav .-menu ul{display:flex;flex-direction:row}
main > .direction-nav .-menu li{display:none}
main > .direction-nav .-menu .nav-order{display:block;width:auto;margin:0}
main > .direction-nav .-menu .nav-order a{padding:11px 20px}
}

/* Balanced concept copy on smaller screens. */
@media(max-width:749px){
.products-concept .-detail{padding:0 7vw;text-align:center}
.products-concept .-detail > div{width:100%;max-width:380px;margin:0 auto}
.products-concept .-detail h2{text-align:center;line-height:1.25;margin-bottom:24px}
.products-concept .-detail p{text-align:center;font-size:14px;line-height:2.05}
}

.products-read{background:#f0ede7}
@media(max-width:749px){.products-concept .-detail p{text-wrap:balance}}

/* Product identification, set in the reference page’s condensed sans. */
.hero-product-info{position:absolute;left:4vw;bottom:4vw;color:#343434;font-family:'Roboto Condensed','Yu Gothic Medium',YuGothic,'Hiragino Kaku Gothic Pro',sans-serif}
.hero-product-info h2{margin:0 0 14px;padding:0;font:400 40px/1.35 'Roboto Condensed','Yu Gothic Medium',YuGothic,sans-serif;letter-spacing:.08em}
.hero-product-info h2 span{font-size:.52em;letter-spacing:.05em;white-space:nowrap}
.hero-product-info p{font-size:14px;line-height:1.7;letter-spacing:.06em}
@media(max-width:749px){
.hero-product-info{left:6vw;bottom:6vw}
.hero-product-info h2{font-size:26px;margin-bottom:8px}
.hero-product-info p{font-size:14px;letter-spacing:.025em}
}

/* A full first viewport including the navigation, with quiet product data. */
:root{--product-nav-height:84px}
.products-main .hero-image{height:calc(100dvh - var(--product-nav-height))!important;min-height:0}
.hero-product-info{color:#77736d}
.hero-product-info h2{font-size:22px;line-height:1.5;letter-spacing:.08em;margin-bottom:5px}
.hero-product-info h2 span{font-size:14px;letter-spacing:.04em}
.hero-product-info p{font-size:14px;line-height:1.6;letter-spacing:.035em}
@media(max-width:749px){
.hero-product-info h2{font-size:18px;margin-bottom:4px}
.hero-product-info h2 span{font-size:12px}
.hero-product-info p{font-size:12px;letter-spacing:.025em}
}

/* Header logo at 90% of its original size. */
main > .direction-nav .product-logo{width:151.2px}
@media(max-width:749px){main > .direction-nav .product-logo{width:113.4px}}

/* Match the concept hue to the warm introduction below. */
.products-concept{background:#e5e0d8}

/* Slightly larger hero product data. */
.hero-product-info h2{font-size:24px}
.hero-product-info h2 span{font-size:15.5px}
.hero-product-info p{font-size:15.5px}
@media(max-width:749px){
.hero-product-info h2{font-size:20px}
.hero-product-info h2 span{font-size:13px}
.hero-product-info p{font-size:13px}
}

/* Roasting and brewing as two connected parts of the ritual. */
.roasting-ritual{padding:80px 6vw;background:#fff}
.ritual-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4vw;max-width:1200px;margin:0 auto}
.ritual-card{min-width:0;text-align:left}
.ritual-card img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.ritual-card h3{font:400 30px/1.3 'Cormorant Garamond',Georgia,serif;margin:25px 0 12px;padding:0}
.ritual-card p{font-size:14px;line-height:1.9;color:#69655f}
@media(max-width:749px){
.roasting-ritual{padding:48px 5vw}
.ritual-grid{gap:5vw}
.ritual-card h3{font-size:23px;margin:18px 0 10px}
.ritual-card p{font-size:14px;line-height:1.8}
.ritual-card p br{display:none}
}

.ritual-card h3,.ritual-card p{text-align:left}

/* A warm pause for the how-to film. */
.film{background:#fff;padding:80px 8vw}
@media(max-width:749px){.film{padding:56px 8vw}}


/* A concise introduction to the roasting process. */
.roasting-ritual{padding:80px 6vw}
.ritual-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:3vw;max-width:1200px}
.ritual-card .ritual-step{margin-top:24px;color:#898279;font:400 12px/1.5 'Roboto Condensed',Arial,sans-serif;letter-spacing:.12em}
.ritual-card h3{margin:10px 0 12px;font-size:28px;text-wrap:balance}
.ritual-card p{margin:0;max-width:34em;line-height:1.85}
@media(max-width:749px){
.roasting-ritual{padding:48px 6vw}
.ritual-grid{grid-template-columns:1fr;gap:36px}
.ritual-card{display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr);column-gap:20px;align-content:start}
.ritual-card img{grid-column:1;grid-row:1 / 4;align-self:start}
.ritual-card .ritual-step{grid-column:2;margin-top:0;font-size:12px}
.ritual-card h3{grid-column:2;font-size:24px;margin:7px 0 10px}
.ritual-card p{grid-column:2;font-size:14px;line-height:1.75}
}

/* An index of the ten product details. */
.detail-index{padding:72px 6vw;background:#f0ede7}
.detail-index h2{text-align:center;font:400 36px/1.4 'Cormorant Garamond',Georgia,serif;margin:0 0 36px}
.detail-index nav{max-width:1100px;margin:0 auto}
.detail-index ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.detail-index a{display:flex;align-items:center;gap:20px;height:100%;min-height:82px;padding:18px 24px;background:#fff}
.detail-index-number{font:300 30px/1 'Roboto Condensed',Arial,sans-serif;color:#999084;min-width:34px}
.detail-index-label{font:400 18px/1.45 'Cormorant Garamond',Georgia,serif}
.detail-index-arrow{margin-left:auto;color:#999084;font-size:18px}
@media(max-width:749px){
.detail-index{padding:48px 6vw}
.detail-index h2{font-size:30px;margin-bottom:28px}
.detail-index ol{grid-template-columns:1fr;gap:8px}
.detail-index a{min-height:68px;padding:15px 18px;gap:15px}
.detail-index-number{font-size:27px}
.detail-index-label{font-size:18px}
}

/* Editorial detail index: photographs, small numbers, and open rows. */
.detail-index{padding:64px 6vw;background:#f0ede7}
.detail-index nav{max-width:1200px}
.detail-index ol{column-gap:56px;row-gap:0}
.detail-index li{border-bottom:1px solid #d9d3c9}
.detail-index a{position:relative;gap:22px;min-height:142px;padding:22px 0;background:none}
.detail-index-thumbnail{display:block;flex:0 0 96px;width:96px;height:96px;object-fit:cover;border-radius:2px}
.detail-index-copy{display:flex;flex-direction:column;gap:7px;min-width:0}
.detail-index-number{font:400 12px/1.2 'Roboto Condensed',Arial,sans-serif;letter-spacing:.12em;color:#92897c;min-width:0}
.detail-index-label{font:400 22px/1.3 'Cormorant Garamond',Georgia,serif;text-wrap:balance}
.detail-index-arrow{flex:0 0 auto;font-size:17px;margin-left:auto;align-self:flex-end;margin-bottom:6px;color:#9b9285;transition:transform .2s}
.detail-index a:hover .detail-index-arrow{transform:translate(2px,-2px)}
@media(max-width:749px){
.detail-index{padding:28px 6vw 40px}
.detail-index ol{grid-template-columns:1fr;gap:0}
.detail-index a{min-height:112px;padding:16px 0;gap:20px}
.detail-index-thumbnail{width:80px;height:80px;flex-basis:80px}
.detail-index-number{font-size:12px}
.detail-index-label{font-size:21px}
}

/* Cropped photographs occupy the right side of each index card. */
.detail-index ol{gap:14px}
.detail-index li{border:0;min-width:0}
.detail-index a{position:relative;isolation:isolate;overflow:hidden;min-height:156px;padding:24px;background:#fff;gap:0}
.detail-index-thumbnail{position:absolute;z-index:-1;right:0;top:0;bottom:0;width:35%;height:100%;max-width:none;object-fit:cover;border-radius:0;object-position:center;transition:transform .35s ease}
.detail-index-copy{width:65%;padding-right:26px;gap:9px}
.detail-index-number{font:400 12px/1.2 'Roboto Condensed',Arial,sans-serif;letter-spacing:.12em}
.detail-index-label{font:400 22px/1.3 'Cormorant Garamond',Georgia,serif}
.detail-index-arrow{position:absolute;right:calc(35% + 12px);bottom:18px;margin:0;font-size:17px;line-height:1}
.detail-index a:hover .detail-index-arrow{transform:translateY(2px)}
.detail-index a:hover .detail-index-thumbnail{transform:scale(1.04)}
@media(max-width:749px){
.detail-index ol{gap:10px}
.detail-index a{min-height:132px;padding:20px}
.detail-index-thumbnail{width:36%;height:100%;flex-basis:auto}
.detail-index-copy{width:64%;padding-right:18px}
.detail-index-label{font-size:21px}
.detail-index-arrow{right:calc(36% + 10px);bottom:15px}
}

/* Compact index rows with original number/title treatment. */
.detail-index a{min-height:96px;padding:18px 22px}
.detail-index-thumbnail{width:31%;height:100%;object-fit:cover}
.detail-index-copy{width:69%;display:flex;flex-direction:row;align-items:center;gap:20px;padding-right:20px}
.detail-index-number{font:300 30px/1 'Roboto Condensed',Arial,sans-serif;letter-spacing:0;min-width:34px;flex:0 0 34px;color:#999084}
.detail-index-label{font:400 18px/1.4 'Cormorant Garamond',Georgia,serif;text-wrap:initial}
.detail-index-arrow{right:calc(31% + 9px);bottom:12px;font-size:15px}
.function .media-heat-source img{object-fit:contain;height:auto;max-height:480px;width:100%}
@media(max-width:749px){
.detail-index a{min-height:96px;padding:15px 16px}
.detail-index-thumbnail{width:30%}
.detail-index-copy{width:70%;gap:13px;padding-right:16px}
.detail-index-number{font-size:27px;min-width:29px;flex-basis:29px}
.detail-index-label{font-size:18px}
.detail-index-arrow{right:calc(30% + 7px);bottom:10px}
}

@media(max-width:749px){
.detail-index-thumbnail{width:35%}
.detail-index-copy{width:65%;gap:10px;padding-right:12px}
.detail-index-arrow{right:calc(35% + 6px)}
}

/* Diagonal leading edge on index photographs. */
.detail-index-thumbnail{width:35%;clip-path:polygon(14% 0,100% 0,100% 100%,0 100%)}
@media(max-width:749px){.detail-index-thumbnail{width:39%}}

/* Clear downward action over the photograph. */
.detail-index-thumbnail{clip-path:polygon(22% 0,100% 0,100% 100%,0 100%)}
.detail-index-arrow{right:12px;bottom:12px;display:flex;align-items:center;justify-content:center;width:34px;height:34px;margin:0;border-radius:50%;background:rgba(255,255,255,.92);color:#48443e;font:400 25px/1 Arial,sans-serif;box-shadow:0 1px 5px #00000012}
@media(max-width:749px){.detail-index-arrow{right:10px;bottom:10px;width:32px;height:32px;font-size:24px}}

/* Near-vertical crop and a restrained line arrow. */
.detail-index-thumbnail{clip-path:polygon(7% 0,100% 0,100% 100%,0 100%)}
.detail-index-arrow{right:16px;bottom:16px;width:22px;height:30px;border-radius:0;background:none;box-shadow:none;font-size:0;color:#fff;filter:drop-shadow(0 1px 2px #0008)}
.detail-index-arrow::before{content:"";position:absolute;width:1.5px;height:25px;top:0;left:10px;background:currentColor}
.detail-index-arrow::after{content:"";position:absolute;width:11px;height:11px;left:5px;bottom:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
@media(max-width:749px){.detail-index-arrow{right:14px;bottom:14px;width:22px;height:30px;font-size:0}}

/* A small downward chevron over the photograph. */
.detail-index-arrow{width:18px;height:18px;right:17px;bottom:16px}
.detail-index-arrow::before{display:none}
.detail-index-arrow::after{width:9px;height:9px;left:4px;bottom:6px;border-width:1.5px}
@media(max-width:749px){.detail-index-arrow{width:18px;height:18px;right:15px;bottom:14px}}

.function .media-radiant img{object-fit:contain}
.spec-heat-sources{text-align:center;padding:45px 0 10px}
.spec-heat-sources img{display:block;width:min(580px,100%);height:auto;margin:0 auto}
.spec-heat-sources p{font-size:14px;line-height:1.9;color:#777;margin:22px 0 0}
@media(max-width:749px){.spec-heat-sources{padding:32px 0 0}.spec-heat-sources img{width:100%}}

/* Square crop matching the other detail images. */
.function .media-radiant img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:center}

.function .media-radiant img{aspect-ratio:1;object-fit:contain;object-position:center}
.spec-heat-sources img{width:min(464px,80%)}
@media(max-width:749px){.spec-heat-sources img{width:80%}}

#anchor-function-10 .more-content-area p + p{margin-top:1.25em}

/* A small illustration between specification and ordering. */
.order-illustration{text-align:center;padding:30px 6vw 0}
.order-illustration img{display:block;width:210px;max-width:60vw;height:auto;margin:0 auto}
@media(max-width:749px){.order-illustration{padding-top:24px}.order-illustration img{width:170px}}

/* Original ceramic-form measurement motif. */
.spec-mark{width:64px;height:48px;margin:0 auto;color:#948b7f}
.spec-mark svg{display:block;width:100%;height:100%}

.typed-caption{min-height:26px}
.typed-caption-text{white-space:nowrap}
.typed-caption.is-typing .typed-caption-text::after{content:"";display:inline-block;width:1px;height:.9em;margin-left:3px;vertical-align:-.05em;background:currentColor;animation:caption-caret .8s step-end infinite}
@keyframes caption-caret{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.typed-caption-text::after{display:none!important}}


.products-concept .-logo p.typed-caption{font-weight:400;font-size:13px}