/* Shared responsive layout: preserve full photography and readable controls. */
html{scroll-padding-top:var(--home-header-height,180px);text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{min-width:0;overflow-wrap:break-word}
main,section,article,aside,figure,form,.card,.wrap{min-width:0}
img,video,svg,canvas{max-width:100%}
main img{height:auto}
p,li,dd,label,summary,h1,h2,h3{word-break:keep-all;overflow-wrap:anywhere}
h1{font-size:clamp(28px,4.3vw,58px)}h2{font-size:clamp(24px,3vw,36px)}h3{font-size:clamp(19px,2vw,24px)}
input,select,textarea{min-width:0;max-width:100%;font-size:16px}
button,.btn{white-space:normal;line-height:1.5;min-height:44px;max-width:100%}
iframe{max-width:100%}
.wrap{width:100%}
header.hyoss-site-header .header-account{min-width:0}
header.hyoss-site-header>nav{justify-content:flex-start!important}
header.hyoss-site-header nav a,header.hyoss-site-header nav summary{min-height:40px;display:flex;align-items:center}
.hyoss-collection #home{display:flex;flex-direction:column;align-items:stretch;min-height:460px}
.hyoss-collection #home #cherry-choice{position:relative;z-index:2;box-sizing:border-box}.hyoss-collection #home .hero-copy h1{max-width:100%}
.hyoss-collection #home .hero-copy>p{max-width:42%}
#products .product-grid,.store-products,.detail-hero,.moment-feature,.moment-process{min-width:0}
.detail-hero{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.detail-hero .original-product{aspect-ratio:auto;overflow:visible;background:transparent}
.detail-hero .original-product img{position:static;display:block;width:100%;height:auto;object-fit:contain}
.purchase-order select,.purchase-order input{max-width:100%}
.qa-page h1{font-size:clamp(30px,4vw,46px)}
.signup-page .wrap{max-width:880px}.signup-page #signup{font-size:16px}.signup-page #signup label{font-size:16px}.signup-page #signup input:not([type=checkbox]),.signup-page #signup select{font-size:16px;min-height:48px}
@media(min-width:761px) and (max-width:1100px){
 .wrap{padding-inline:28px}.hyoss-collection #home .hero-copy>p{max-width:48%;font-size:15px}
 .hyoss-collection #home .hero-copy h1{font-size:clamp(30px,4vw,42px)}
 .detail-hero{gap:24px}.ingredient-list{grid-template-columns:repeat(4,minmax(0,1fr))}
 #story>.wrap{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px}
}
@media(max-width:760px){
 .wrap{padding-inline:20px;padding-block:40px}.card{padding:22px 18px}
 header.hyoss-site-header{padding:8px 14px!important;gap:6px 12px!important}
 header.hyoss-site-header>.logo{flex-basis:104px!important;width:104px!important;height:52px!important}
 header.hyoss-site-header .header-account{flex:1 1 0;gap:6px;font-size:12px}
 header.hyoss-site-header .header-account>.language-picker{gap:4px}
 header.hyoss-site-header .language-picker select{font-size:14px;min-height:36px;padding:5px 8px;width:auto}
 header.hyoss-site-header>nav{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 8px!important;overflow:visible!important;flex-wrap:wrap!important;padding:0!important}
 header.hyoss-site-header nav a,header.hyoss-site-header nav summary{white-space:normal!important;word-break:keep-all;overflow-wrap:anywhere;font-size:12px!important;line-height:1.4!important;min-height:40px;padding:4px 0!important}
 header.hyoss-site-header .branch-menu{min-width:0}header.hyoss-site-header .branch-submenu{position:absolute;left:0;top:100%;min-width:100px}
 .hyoss-collection #home{height:calc(100svh - var(--home-header-height,170px));min-height:480px}
 .hyoss-collection #home>video{flex:0 1 auto;max-height:24svh;object-fit:contain}
 .hyoss-collection #home .hero-copy{padding:10px 20px 6px;justify-content:center}
 .hyoss-collection #home .hero-copy>p{max-width:100%}
 .hyoss-collection #home .hero-copy h1{font-size:clamp(23px,5.5vw,32px);line-height:1.35;letter-spacing:-.04em}
 .hyoss-collection #home .hero-copy .btn{min-height:40px;font-size:13px;padding:8px 12px}
 .hyoss-collection #home #cherry-choice{padding:8px 16px 14px;gap:8px}
 .grid,.store-products,.detail-hero,.moment-feature,.moment-process,.store-detail .detail-brand-moment,.store-detail .detail-ritual{grid-template-columns:minmax(0,1fr);gap:24px}
 .detail-hero{padding-block:24px}.store-intro{padding-top:32px}.detail-section{padding-block:32px}
 .detail-section p{font-size:16px;line-height:1.85}.store-price{font-size:26px}
 .ingredient-list{grid-template-columns:repeat(2,minmax(0,1fr))}.ingredient-list li{min-width:0}.ingredient-list .ingredient-photo{margin-inline:auto}
 .inline-purchase-row{flex-wrap:wrap;gap:10px}.inline-purchase-row input.detail-quantity{flex:0 0 80px;width:80px}.inline-purchase-row .btn{min-width:0;max-width:none;flex:1 1 140px}
 #story>.wrap{grid-template-columns:minmax(0,1fr)}
 #products .product-card>img{width:100%;height:auto;max-height:none;object-fit:contain}
 .signup-page h1{font-size:28px}.signup-page .signup-form-card{padding:22px 18px}.signup-page #signup details{padding:14px 0}.signup-page #signup summary{font-size:16px}.signup-page .notice{font-size:15px}
 .qa-page{padding-top:32px}.qa-page summary{font-size:17px}
 footer{padding:32px 20px}footer p{font-size:14px}footer a{overflow-wrap:anywhere}
}
@media(max-width:380px){
 header.hyoss-site-header .header-account>.language-picker>span{display:none}
 header.hyoss-site-header>.logo{flex-basis:88px!important;width:88px!important;height:44px!important}
 .wrap{padding-inline:16px}.hyoss-collection #home .hero-copy{padding-inline:16px}
 .hyoss-collection #home #cherry-choice{padding-inline:12px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Let content determine hero height rather than stretching empty space. */
.hyoss-collection #home{height:auto;min-height:0;max-height:none;justify-content:flex-start}.hyoss-collection #home .hero-copy{flex:none;padding:32px 24px 18px;margin:0 auto}.hyoss-collection #home #cherry-choice{padding-top:8px;padding-bottom:20px}@media(max-width:760px){.hyoss-collection #home{height:auto;min-height:0}.hyoss-collection #home>video{flex:none;height:auto;max-height:none;aspect-ratio:1624/686}.hyoss-collection #home .hero-copy{padding:16px 20px 12px}.hyoss-collection #home #cherry-choice{padding:4px 16px 16px}}
/* Larger process photos retain their original source crop and proportions. */
.store-detail .process-grid figcaption{padding:5px 8px;font-size:16px;line-height:1.5}
@media(max-width:760px){
 .store-detail .process-grid{grid-template-columns:minmax(0,1fr);gap:16px;justify-items:center}
 .store-detail .process-grid figure{width:calc((100% - 14px)*2/3);min-width:0}
 .store-detail .process-grid figcaption{padding:5px 6px;font-size:15px;line-height:1.5}
}
/* The home film plays at its original brightness, with no dark overlay. */
.hyoss-collection #home>video{opacity:1!important;filter:none!important}
.hyoss-collection #home::after,.hyoss-collection #home::before{opacity:0!important;pointer-events:none!important}

/* Desktop home: fade the text backing into the film, keeping its right side clear. */
@media(min-width:761px){
 .hyoss-collection #home::after{content:'';display:block!important;position:absolute;inset:0;z-index:0;opacity:1!important;background:linear-gradient(90deg,rgba(32,16,8,.97) 0%,rgba(32,16,8,.92) 28%,rgba(32,16,8,.72) 43%,rgba(32,16,8,.28) 56%,rgba(32,16,8,0) 70%)!important;pointer-events:none!important}
 .hyoss-collection #home .hero-copy{position:relative;z-index:1}
 .hyoss-collection #home #cherry-choice{position:relative;z-index:1}
}
