:root{--green:#194832;--deep:#143f2e;--cream:#f7f3e7;--paper:#fcfbf6;--gold:#ae9259;--muted:#697469;--line:#dddccf}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;color:var(--green);background:var(--paper);font:16px/1.7 Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:5px}img{display:block;width:100%;height:100%;object-fit:cover}button{cursor:pointer}h1,h2,h3,p{margin-top:0}h1,h2,.serif{font-family:Georgia,'Times New Roman',serif;font-weight:400;line-height:1.18}h1{font-size:clamp(36px,4.4vw,64px);letter-spacing:-1.5px}h2{font-size:clamp(29px,3vw,44px);letter-spacing:-.7px}h3{font-size:20px;line-height:1.35}p{margin-bottom:20px}small,.small{font-size:12px}.wrap{max-width:1280px;margin:auto;padding:0 48px}.eyebrow{text-transform:uppercase;letter-spacing:2.4px;font-size:11px;font-weight:bold;display:block;margin-bottom:16px}.demo{background:#e9e3d3;text-align:center;font-size:11px;padding:5px 20px;letter-spacing:.3px}.utility{background:var(--deep);color:#f7f3e7;font-size:10px;letter-spacing:.2px}.utility .wrap{display:flex;justify-content:space-between;padding-top:7px;padding-bottom:7px}.utility-values{display:flex;gap:24px}.header{background:var(--cream);border-bottom:1px solid var(--line);position:relative;z-index:20}.header-inner{display:flex;align-items:center;gap:30px;min-height:104px}.logo{width:130px;flex-shrink:0;text-align:center}.logo img{object-fit:contain;height:67px}.logo .textlogo{font-family:Georgia,serif;font-size:28px;font-weight:bold;letter-spacing:2px}.logo small{display:block;font-size:10px;font-style:italic}.nav{display:flex;align-items:center;justify-content:flex-end;gap:23px;flex:1;font-size:12px;font-weight:bold}.nav details{position:relative}.nav summary{cursor:pointer;list-style:none}.nav summary:after{content:'⌄';padding-left:6px}.nav details>div{position:absolute;top:30px;left:-15px;width:240px;background:var(--cream);border:1px solid var(--line);box-shadow:0 12px 30px #12352215;padding:10px}.nav details a{display:block;padding:9px}.nav a:hover,.nav summary:hover{color:#a3833d}.menu-toggle{display:none;border:1px solid var(--line);background:transparent;padding:7px 12px;color:var(--green)}.hero{margin:28px auto 0;position:relative;min-height:430px;display:flex;align-items:center;background:#eeefdf;overflow:hidden}.hero .hero-art{position:absolute;inset:0}.hero .hero-art img{object-position:center}.hero.has-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#f6f3e7ee 0%,#f6f3e7cf 35%,#f6f3e722 65%,transparent)}.hero-copy{position:relative;z-index:2;padding:58px 52px;max-width:620px}.hero-copy h1{font-size:clamp(35px,3.7vw,55px);margin-bottom:20px}.hero-copy p{max-width:480px;font-size:15px}.hero.smallhero{min-height:300px}.hero.smallhero .hero-copy{max-width:850px}.hero-controls{display:flex;gap:8px;align-items:center;position:absolute;bottom:20px;right:24px;z-index:3}.hero-controls button{background:var(--paper);border:1px solid var(--line);width:38px;height:38px;color:var(--green)}.hero-controls output{font-size:12px;background:var(--paper);padding:7px 13px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;background:var(--green);color:#fff;padding:12px 22px;font-size:12px;font-weight:bold;letter-spacing:.3px;border:1px solid var(--green)}.button:after{content:'→';font-size:18px;line-height:1}.button.light{background:transparent;color:var(--green)}.actions{display:flex;flex-wrap:wrap;gap:12px}.section{padding:70px 0}.section.soft{background:var(--cream)}.section.green{background:var(--green);color:var(--cream)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px}.section-head h2{margin-bottom:10px}.section-head p{margin:0;color:var(--muted)}.green .section-head p{color:#d7dfce}.link{font-size:13px;border-bottom:1px solid var(--gold);padding-bottom:5px}.grid{display:grid;gap:24px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.grid.five{grid-template-columns:repeat(5,minmax(0,1fr))}.quick-links{padding:25px 0}.quick-links a{border:1px solid var(--line);padding:20px 24px;display:flex;justify-content:space-between;gap:20px;background:var(--cream);align-items:center}.quick-links strong{display:block;font-family:Georgia,serif;font-size:21px}.quick-links small{color:var(--muted)}.split{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px}.split .visual{height:420px}.split.reverse .visual{order:2}.split.reverse .copy{order:1}.split .copy{padding:15px 0}.visual{background:#e9ecdf;overflow:hidden;position:relative}.visual.contain{background:#f6f4ed}.visual.contain img{object-fit:contain}.visual.portrait img{object-fit:contain}.missing{display:flex;align-items:center;justify-content:center;height:100%;min-height:180px;border:1px solid var(--line);padding:25px;text-align:center;background:linear-gradient(135deg,#eceee1,#f7f3e7);color:#6f7d6d;font-size:13px}.asset-note{font-size:10px;color:var(--muted);margin:7px 0 0}.card{background:var(--paper);color:var(--green);border:1px solid var(--line);min-width:0;display:flex;flex-direction:column}.card .visual{height:225px}.card-body{padding:23px;display:flex;flex-direction:column;flex:1}.card-body h3{font-family:Georgia,serif;font-size:23px;font-weight:400}.card-body p{font-size:14px;color:var(--muted)}.card-body .link{align-self:flex-start;margin-top:auto}.product-card .visual{height:240px}.product-card .card-body{padding:18px}.product-card h3{font-family:Arial,sans-serif;font-size:17px;font-weight:600}.product-card .price{font-size:12px;color:#8c7047;margin-top:auto;margin-bottom:15px}.band{text-align:center;padding:65px 30px;background:#e6ecdf}.band h2{max-width:750px;margin:0 auto 20px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);margin-top:30px}.metrics>div{padding:20px 24px;border-left:1px solid #ffffff30}.metrics>div:first-child{border-left:0}.metrics b{font-family:Georgia,serif;font-size:32px;font-weight:400;color:#d6c797}.metrics h3{font-size:17px;margin:12px 0}.metrics p{font-size:13px;margin-bottom:0}.wide-image{height:340px}.person .visual{height:410px}.person h3{margin-bottom:9px}.person .role{font-size:12px;line-height:1.6}.breadcrumb{font-size:12px;color:var(--muted);margin:25px 0}.subnav{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}.subnav a,.filter{border:1px solid var(--line);padding:9px 17px;background:transparent;color:var(--green);font-size:12px}.filter.active{background:var(--green);color:#fff}.article-head{max-width:1000px;margin:60px auto 42px;display:grid;grid-template-columns:1fr 280px;gap:60px;align-items:center}.article-head h1{font-size:44px}.article-head .visual{height:230px}.status{font-size:11px;color:#85734f;border-left:2px solid #b69b62;padding-left:12px;margin-bottom:25px}.article-body{max-width:1000px;margin:auto}.article-chapter{display:grid;grid-template-columns:270px 1fr;gap:60px;border-top:1px solid var(--line);padding:35px 0}.article-chapter h2{font:600 21px/1.4 Arial,sans-serif;letter-spacing:0;margin-top:2px}.article-chapter p{font-size:16px;line-height:1.9}.article-chapter .chapter-number{display:block;font-size:10px;color:var(--gold);letter-spacing:2px;margin-bottom:12px}.article-lead{font-size:20px!important;line-height:1.7!important}.article-photos{max-width:850px;margin:40px auto}.article-photos .visual{height:370px}.closing{padding:60px 25px;text-align:center;background:#eef0e5;margin-top:45px}.closing p{font:36px/1.3 Georgia,serif;max-width:800px;margin:0 auto}.prevnext{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:30px 0}.prevnext a{padding:22px;border:1px solid var(--line)}.prevnext a:last-child{text-align:right}.prevnext small{display:block;letter-spacing:2px;font-size:10px}.explore{display:grid;grid-template-columns:1.15fr 1fr;gap:25px}.explore .major .visual{height:330px}.explore .minor{display:grid;gap:18px}.explore .minor a{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px}.explore .minor .visual{height:120px}.explore h3{font-family:Georgia,serif;font-size:27px;font-weight:400;margin:5px 0}.video-title{text-align:center;margin-bottom:28px}.video-frame{aspect-ratio:16/9;background:#173e2f;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#f2eddd;padding:30px;text-align:center}.video-frame .play{width:66px;height:66px;border:1px solid #ffffff60;border-radius:50%;display:grid;place-items:center;margin-bottom:20px;font-size:24px}.video-frame p{max-width:500px}.video-control{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.video-control button{background:transparent;border:1px solid var(--line);padding:9px 18px;color:var(--green);font-size:12px}.video-control output{font-size:12px}.contact h2{font-size:46px}.contact .grid{align-items:start}.contact .hold{font-size:13px;color:var(--muted);max-width:580px}.contact-links{display:flex;flex-wrap:wrap;gap:24px}.footer{background:var(--deep);color:#e9eedf;padding:50px 0 20px}.footer-grid{display:grid;grid-template-columns:1.2fr repeat(4,1fr);gap:30px}.footer h3{font-size:13px}.footer a{display:block;font-size:11px;margin:9px 0;color:#d2deca}.footer-bottom{font-size:10px;border-top:1px solid #ffffff20;margin-top:40px;padding-top:20px;display:flex;justify-content:space-between;gap:25px}.searchbar{display:flex;gap:15px;margin-bottom:30px}.searchbar input,.searchbar select{padding:12px 15px;border:1px solid var(--line);background:var(--paper);color:var(--green);min-width:0}.searchbar input{flex:1}.empty{padding:35px;border:1px solid var(--line);text-align:center}.specs{border-top:1px solid var(--line);margin:25px 0}.specs div{display:grid;grid-template-columns:160px 1fr;gap:20px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.form label{display:block;font-size:13px;margin:15px 0 5px}.form input,.form textarea,.form select{display:block;width:100%;padding:13px;border:1px solid var(--line);background:var(--paper);color:var(--green)}.form button{margin-top:20px}.form-output{margin-top:18px;padding:18px;background:#e8eee0}.tag{font-size:10px;text-transform:uppercase;letter-spacing:1.4px;color:#8d7848}.map-hold{min-height:360px;display:grid;place-items:center;text-align:center;background:#e5eadd;border:1px solid var(--line);padding:40px}.map-hold p{max-width:380px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip{position:absolute;left:20px;top:-100px;background:white;padding:15px;z-index:100}.skip:focus{top:10px}[hidden]{display:none!important}@media(min-width:1600px){.wrap{max-width:1440px}.hero{min-height:500px}}@media(max-width:1180px){.wrap{padding-left:30px;padding-right:30px}.nav{gap:14px;font-size:11px}.header-inner{gap:22px}.grid.five{grid-template-columns:repeat(3,1fr)}.article-chapter{grid-template-columns:220px 1fr;gap:40px}.split{gap:35px}}@media(max-width:1000px){.header-inner{min-height:86px;justify-content:space-between}.logo{width:110px}.menu-toggle{display:block}.nav{display:none;position:absolute;top:86px;left:0;right:0;background:var(--cream);padding:20px 30px;border-bottom:1px solid var(--line);font-size:14px;align-items:stretch}.nav.open{display:flex;flex-direction:column}.nav details>div{position:static;box-shadow:none;width:auto;border:0;padding:0 12px}.utility-values span:last-child{display:none}.grid.four{grid-template-columns:repeat(2,1fr)}.split{gap:28px}.split .visual{height:390px}.footer-grid{grid-template-columns:repeat(3,1fr)}.article-head{grid-template-columns:1fr 230px;gap:30px}}@media(max-width:760px){.wrap{padding:0 22px}.utility .wrap{padding-top:7px;padding-bottom:7px}.utility-values span:nth-child(2){display:none}.section{padding:45px 0}.hero{margin-top:15px;min-height:490px;align-items:end}.hero-copy{padding:35px 25px 62px}.hero.has-image:after{background:linear-gradient(0deg,#f6f3e7ff 0%,#f6f3e7ed 35%,#f6f3e733 85%)}.hero .hero-art img{object-position:65%}.hero-copy h1{font-size:36px}.hero-copy p{font-size:14px}.hero.smallhero{min-height:310px}.hero.smallhero .hero-copy{padding:35px 25px}.grid.three,.grid.five{grid-template-columns:repeat(2,minmax(0,1fr))}.split,.grid.two{grid-template-columns:1fr}.split.reverse .visual{order:0}.split.reverse .copy{order:1}.split .visual{height:340px}.split{gap:25px}.metrics{grid-template-columns:repeat(2,1fr)}.metrics>div:nth-child(3){border-left:0}.section-head{align-items:start}.section-head .link{max-width:120px;flex-shrink:0}.article-head{grid-template-columns:1fr;margin-top:35px;gap:20px}.article-head h1{font-size:36px}.article-head .visual{height:260px}.article-chapter{grid-template-columns:1fr;gap:15px;padding:25px 0}.article-chapter p{font-size:16px}.article-photos .grid.two{grid-template-columns:1fr 1fr}.article-photos .visual{height:260px}.closing p{font-size:29px}.explore{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.contact h2{font-size:38px}.wide-image{height:250px}.searchbar{flex-wrap:wrap}.searchbar input{flex-basis:100%}.prevnext{gap:12px}.prevnext a{padding:16px;font-size:13px}.person .visual{height:420px}}@media(max-width:420px){.grid.five,.grid.three{gap:14px}.product-card .visual{height:175px}.product-card .card-body{padding:13px}.product-card h3{font-size:15px}.product-card .button{padding:9px 12px;gap:10px}.grid.four{grid-template-columns:1fr}.quick-links .grid.three{grid-template-columns:1fr}.article-photos .grid.two{gap:12px}.article-photos .visual{height:220px}.explore .minor a{grid-template-columns:110px 1fr;gap:15px}.explore h3{font-size:23px}.footer-grid{gap:25px}.actions .button{font-size:11px;padding:10px 15px;gap:15px}.specs div{grid-template-columns:110px 1fr}.video-control button{padding:8px 10px;font-size:11px}}
.hero-art>.visual{height:100%}.brand-hero{margin-top:26px}.brand-hero .visual{height:auto;aspect-ratio:16/7.8}.brand-hero img{object-fit:contain;background:var(--cream)}.hero-actionbar{display:flex;gap:15px;padding:22px 28px;background:#efeddf}.wide-image>.visual{height:100%}@media(max-width:760px){.brand-hero .visual{aspect-ratio:16/9}.hero-actionbar{padding:18px 15px;gap:10px}.hero-actionbar .button{padding:10px 13px;font-size:11px;gap:12px}}
/* R03: user-supplied 1536 x 480 hero, unchanged image bytes and full frame. */
.brand-hero-r03{position:relative;background:var(--cream)}
.brand-hero-r03 .visual{aspect-ratio:16/5;height:auto;background:transparent}
.brand-hero-r03 .visual img{width:100%;height:auto;aspect-ratio:16/5;object-fit:contain;background:transparent}
.brand-hero-copy{position:absolute;left:0;top:0;bottom:0;width:43%;padding:24px 28px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(90deg,rgba(250,247,235,.93),rgba(250,247,235,.79) 75%,rgba(250,247,235,0));}
.brand-hero-copy h1{font-size:clamp(28px,2.65vw,43px);line-height:1.12;letter-spacing:-.8px;margin:0 0 16px;max-width:440px}
.brand-hero-copy .eyebrow{margin-bottom:12px}
.brand-hero-copy p{font-size:13px;line-height:1.6;max-width:340px;margin:0}
@media(max-width:1024px){.brand-hero-copy{padding:18px 22px}.brand-hero-copy h1{font-size:30px}.brand-hero-copy p{font-size:12px}}
@media(max-width:820px){.brand-hero-r03 .visual{aspect-ratio:16/5}.brand-hero-copy{position:static;width:100%;padding:26px 24px;background:var(--cream)}.brand-hero-copy h1{font-size:34px;max-width:600px}.brand-hero-copy p{font-size:14px;max-width:600px}}
@media(max-width:420px){.brand-hero-copy{padding:23px 20px}.brand-hero-copy h1{font-size:30px}}
/* R04: source logos and semantic icons; full artwork, never stretched or clipped. */
.asset-icon{width:74px;height:74px;object-fit:contain;flex-shrink:0;display:block;margin:0 0 15px}.quick-links .asset-icon{width:54px;height:54px;margin:0}.quick-links a{gap:16px}.quick-links a>div{flex:1}.metrics .asset-icon{width:92px;height:92px;margin:0 auto 15px}.metrics>div{text-align:center}.metrics b{font-size:22px}.brand-logo{display:block;width:auto;max-width:175px;height:92px;object-fit:contain;margin:0 0 20px}.article-head .brand-logo{height:70px;max-width:150px}.footer-brand-logo{width:130px;height:95px;object-fit:contain;background:var(--cream);padding:8px;border-radius:3px;margin-bottom:12px}.nav .nav-brand{display:flex;gap:12px;align-items:center}.nav-brand img{width:48px;height:36px;object-fit:contain}.distribution-heading{display:flex;align-items:center;gap:24px}.distribution-heading>.asset-icon{width:130px;height:130px}.distribution-heading .section-head{margin-bottom:0}.distribution-heading{margin-bottom:32px}.journal-categories .asset-icon{width:65px;height:65px}.visual.portrait{background:var(--cream)}.visual.portrait img{object-fit:contain}.article-head .visual.portrait{height:320px}.person .visual.portrait{height:410px}.split .visual.portrait{height:540px}@media(max-width:760px){.distribution-heading{gap:16px;align-items:flex-start}.distribution-heading>.asset-icon{width:84px;height:84px}.quick-links .asset-icon{width:50px;height:50px}.split .visual.portrait{height:440px}.article-head .visual.portrait{height:360px}}
/* Category badges have baked-in labels: display the full supplied artwork at a readable review size. */
.quick-links .asset-icon{width:100px;height:100px}.journal-categories .asset-icon{width:170px;height:170px;max-width:100%;margin:0 auto 18px}.quick-links a{padding:18px}.distribution-heading>.asset-icon{width:150px;height:150px}@media(max-width:1180px){.quick-links .asset-icon{width:80px;height:80px}.quick-links a{gap:12px}.quick-links strong{font-size:19px}}@media(max-width:760px){.quick-links .grid.three{grid-template-columns:1fr}.quick-links .asset-icon{width:100px;height:100px}.distribution-heading>.asset-icon{width:100px;height:100px}}
/* R05 — user review corrections. */
.nav-about{position:relative;display:flex;align-items:center;gap:4px}.nav-about-disclosure{position:static!important}.nav-about-disclosure summary{padding:8px 5px}.nav-about-disclosure summary:after{display:none}.nav-about-disclosure>div{top:100%!important;left:-16px!important}.nav-about-link{padding:8px 0}.hero-values{display:flex;align-items:center;gap:12px;margin-top:17px}.hero-values>div{display:flex;align-items:center;gap:6px;flex:1;min-width:0}.hero-values .asset-icon{width:55px;height:55px;object-fit:contain;margin:0}.hero-values span{font-size:10px;line-height:1.3;max-width:90px}.brand-hero-copy h1{margin-bottom:12px}.brand-hero-copy .eyebrow{margin-bottom:9px}.brand-hero-copy p{font-size:12px}.person{display:grid;grid-template-columns:45% 55%;border-radius:18px;padding:18px;background:#fff;align-items:stretch;gap:0}.person .visual.portrait{height:100%;min-height:330px;max-height:440px;border-radius:12px;background:#f2f3ee}.person .card-body{padding:20px 0 20px 22px;justify-content:center}.person .card-body h3{font-family:Arial,sans-serif;font-weight:700;font-size:27px;line-height:1.12;margin-bottom:13px}.person .eyebrow{font-size:10px;letter-spacing:1.4px;margin-bottom:13px}.person .role{font-size:14px;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:18px}.person .card-body p:not(.role){font-size:14px;line-height:1.7}.person .link{margin-top:8px}.video-heading{display:grid;grid-template-columns:140px 1fr 150px;gap:25px;align-items:start;text-align:center;margin-bottom:32px}.video-heading h2{font-family:Arial,sans-serif;font-weight:700;font-size:36px;margin:0 0 18px}.video-heading p{font-size:13px;color:var(--muted);margin:0}.video-heading>.brand-logo{width:120px;height:80px;margin:0}.video-motto{font:italic 19px/1.35 Georgia,serif;color:#3e6939}.video-layout{display:grid;grid-template-columns:minmax(260px,.39fr) minmax(0,1fr);gap:20px;align-items:start}.video-playlist{background:#f3f5eb;border:1px solid #d9e2ce;border-radius:12px;padding:15px;min-width:0}.playlist-title{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px;font-size:16px}.playlist-title>span{font-size:11px;color:var(--muted)}.playlist-scroll{max-height:490px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#b1c4ad transparent;padding-right:5px}.playlist-item{display:grid;grid-template-columns:95px 1fr;gap:11px;align-items:center;width:100%;text-align:left;border:1px solid transparent;border-radius:7px;background:transparent;padding:10px 7px;color:var(--green);margin-bottom:8px}.playlist-item.selected{border-color:#a9cfa1;background:#e8f0df}.playlist-item strong{display:block;font-size:12px;line-height:1.4}.playlist-item small{display:block;font-size:10px;line-height:1.4;margin-top:4px}.playlist-item em{display:block;font-style:normal;font-size:9px;color:var(--muted);margin-top:6px}.video-thumb{position:relative;aspect-ratio:16/10;display:grid;place-items:center;background:#e3e9db;border-radius:5px;overflow:hidden}.video-thumb img{object-fit:contain}.video-thumb b{position:absolute;top:0;left:0;z-index:1;background:#174832;color:white;padding:2px 6px;border-radius:3px;font-size:11px}.video-main{min-width:0}.video-main .video-frame{aspect-ratio:16/9;border-radius:12px;padding:25px;background:linear-gradient(130deg,#ecf0e4,#c6d9bd);color:var(--green);position:relative;justify-content:center}.video-demo-brand .brand-logo{width:130px;height:85px;margin:0 auto 18px}.video-main .play{background:white;border:1px solid #cdd8c7;color:var(--green);width:58px;height:58px;margin:0 0 17px;font-size:22px}.video-main h3{font-size:28px;margin:0 0 10px;font-family:Georgia,serif}.video-main p{font-size:13px;margin:0 0 13px}.video-main [data-video-status]{font-size:10px;color:#55694f;max-width:80%}.video-main .video-control{margin-top:16px}.video-control button:last-child{background:var(--green);color:white;border-color:var(--green);border-radius:5px}.contact-reference{max-width:1180px}.contact-pin{display:grid;place-items:center;background:var(--green);color:white;width:48px;height:48px;border-radius:50%;font-size:29px;margin-bottom:20px}.contact-reference h2{font-family:Arial,sans-serif;font-weight:700;margin-bottom:10px;font-size:44px}.contact-reference .hotline{color:#c9521b;font-size:25px;font-weight:700;margin:0 0 9px}.contact-reference h3{font-size:22px;margin:0 0 10px}.contact-address{font-size:16px}.contact-socials{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:32px}.contact-socials>a,.contact-socials>span{font-size:13px;font-weight:700;border-bottom:2px solid #d79668;padding-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;overflow-wrap:anywhere}.contact-socials b{font-size:20px;flex-shrink:0}.content-transition{margin:55px 0 30px;padding:45px 35px 35px;background:linear-gradient(110deg,#f3f7ef,#fffffc 50%,#f2f6ed);border:1px solid #e6ecdf;position:relative;overflow:hidden}.content-transition:before,.content-transition:after{content:'';position:absolute;width:105px;height:105px;background:url('/assets/r04/icon-leaves.webp') center/contain no-repeat;opacity:.26;pointer-events:none}.content-transition:before{left:-20px;top:8px;transform:rotate(-25deg)}.content-transition:after{right:-20px;top:10px;transform:rotate(25deg)}.transition-intro{text-align:center;position:relative;z-index:1}.transition-intro h2{font-size:40px;max-width:700px;margin:14px auto 22px}.transition-intro .eyebrow{font-size:9px}.content-transition .prevnext{margin:26px 0 36px;position:relative;z-index:1}.content-transition .prevnext a{border:1px solid #8ba999;border-radius:6px;font:23px/1.3 Georgia,serif;background:#ffffff70}.content-transition .prevnext small{font:700 9px/1.5 Arial,sans-serif;margin-bottom:6px}.related-title{text-align:center;position:relative}.related-title h2{font-size:31px;margin-bottom:10px}.related-title .eyebrow{font-size:8px}.transition-card{display:block;border-radius:7px;background:white;border:1px solid #e4e9dc;overflow:hidden}.transition-card .visual{height:180px}.transition-card .visual img{object-fit:contain}.transition-card>div:last-child{padding:18px 42px 18px 18px;position:relative}.transition-card h3{font:22px/1.25 Georgia,serif;margin:0 0 8px}.transition-card p{font-size:12px;line-height:1.5;margin:0}.transition-card span{position:absolute;right:12px;bottom:22px;width:26px;height:26px;background:#eef1e6;border-radius:50%;display:grid;place-items:center}
@media(max-width:1180px){.hero-values{gap:7px}.hero-values .asset-icon{width:44px;height:44px}.hero-values span{font-size:9px}.person .card-body h3{font-size:24px}.person .card-body p:not(.role){font-size:12px}.person .card-body{padding-left:15px}.video-layout{grid-template-columns:285px minmax(0,1fr)}.playlist-item{grid-template-columns:75px 1fr}.playlist-scroll{max-height:440px}.contact-socials{gap:20px}.contact-socials>a{font-size:12px}}
@media(max-width:1024px){.brand-hero-copy{position:static;width:100%;padding:28px;background:var(--cream)}.brand-hero-copy h1{font-size:36px;max-width:700px}.brand-hero-copy p{font-size:14px;max-width:650px}.hero-values{max-width:650px;gap:25px;margin-top:20px}.hero-values .asset-icon{width:65px;height:65px}.hero-values span{font-size:12px;max-width:120px}.person{grid-template-columns:43% 57%;padding:14px}.person .visual.portrait{min-height:350px}.video-heading{grid-template-columns:110px 1fr}.video-motto{display:none}.video-heading h2{font-size:31px}.video-layout{grid-template-columns:250px minmax(0,1fr)}.playlist-item{grid-template-columns:65px 1fr;gap:8px}.playlist-scroll{max-height:390px}.video-main h3{font-size:24px}.video-demo-brand .brand-logo{width:100px;height:60px;margin-bottom:10px}.video-main .play{width:48px;height:48px;margin-bottom:10px}.video-main .video-frame{padding:18px}.contact-socials{grid-template-columns:repeat(2,minmax(0,1fr))}.transition-card .visual{height:150px}}
@media(max-width:760px){.nav-about{display:grid;grid-template-columns:1fr 40px}.nav-about-disclosure{display:contents}.nav-about-disclosure summary{grid-column:2;grid-row:1;padding:8px 12px;text-align:center}.nav-about-disclosure>div{grid-column:1/-1}.person{grid-template-columns:44% 56%;padding:15px}.person .visual.portrait{min-height:340px}.person .card-body h3{font-size:26px}.person .card-body p:not(.role){font-size:14px}.hero-values{gap:10px}.hero-values .asset-icon{width:52px;height:52px}.hero-values span{font-size:10px}.video-heading{grid-template-columns:75px 1fr;gap:14px;text-align:left}.video-heading>.brand-logo{width:75px;height:55px}.video-heading h2{font-size:26px;margin-bottom:9px}.video-heading p{font-size:11px}.video-layout{grid-template-columns:1fr}.video-main{grid-row:1}.video-playlist{grid-row:2}.playlist-scroll{max-height:285px}.playlist-item{grid-template-columns:100px 1fr}.playlist-item strong{font-size:14px}.playlist-item small{font-size:12px}.playlist-item em{font-size:10px}.video-main .video-frame{min-height:250px}.video-main h3{font-size:26px}.video-demo-brand .brand-logo{width:95px;height:55px}.content-transition{padding:32px 20px;margin-top:35px}.transition-intro h2{font-size:30px}.content-transition .prevnext a{font-size:18px;padding:15px}.content-transition .grid.three{grid-template-columns:1fr}.transition-card{display:grid;grid-template-columns:42% 58%}.transition-card .visual{height:180px}.transition-card h3{font-size:22px}.transition-card>div:last-child{align-self:center}.contact-reference h2{font-size:38px}.contact-reference .hotline{font-size:23px}.contact-reference h3{font-size:20px}.contact-address{font-size:14px}}
@media(max-width:420px){.person{grid-template-columns:42% 58%;padding:12px}.person .visual.portrait{min-height:360px}.person .card-body{padding-left:14px}.person .card-body h3{font-size:23px}.person .role{font-size:12px}.person .card-body p:not(.role){font-size:12px}.person .eyebrow{font-size:9px;letter-spacing:.7px}.hero-values>div{flex-direction:column;align-items:flex-start;gap:7px}.hero-values .asset-icon{width:65px;height:65px}.hero-values span{font-size:10px}.brand-hero-copy{padding:23px 20px}.brand-hero-copy h1{font-size:30px}.contact-socials{grid-template-columns:1fr;gap:20px}.content-transition{padding:28px 15px}.transition-intro h2{font-size:27px}.transition-card .visual{height:160px}.transition-card h3{font-size:20px}}
@media(max-width:760px){.nav-about{display:block}.nav-about-link{display:block;padding-right:45px}.nav-about-disclosure{display:block!important}.nav-about-disclosure summary{position:absolute;right:0;top:0;width:40px;height:40px;padding:8px 12px}.nav-about-disclosure>div{position:static!important;width:auto}}
@media(max-width:760px){.person{display:flex;flex-direction:column;padding:18px}.person .visual.portrait{width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:auto}.person .visual.portrait img{width:100%;height:auto;object-fit:contain}.person .card-body{padding:25px 5px 10px}.person .card-body h3{font-size:31px}.person .role{font-size:16px}.person .card-body p:not(.role){font-size:15px}.person .eyebrow{font-size:11px;letter-spacing:1.3px}}

/* Exact user-reference medallions via an unchanged screenshot sprite. */
.hero-medallion{display:block;flex:0 0 65px;width:65px;height:65px;border-radius:50%;background-repeat:no-repeat}.hero-value-plant{background-image:url('/assets/r23-optimized/r12/hero-value-plant.png.webp');background-size:72.77678571px 72.77678571px;background-position:-4.06250000px -4.06250000px}.hero-value-flavor{background-image:url('/assets/r23-optimized/r12/hero-value-flavor.png.webp');background-size:84.90625000px 84.90625000px;background-position:-8.46354167px 0.00000000px}.hero-value-sustainable{background-image:url('/assets/r23-optimized/r12/hero-value-sustainable.png.webp');background-size:95.89411765px 95.89411765px;background-position:-13.38235294px 0.00000000px}
.person{grid-template-columns:44% 56%}.person .visual.portrait{position:relative;min-height:0;height:auto;max-height:none;aspect-ratio:3/4;align-self:center}.person .visual.portrait img{object-fit:cover;object-position:center 25%}.person-vl04 .visual.portrait img{position:absolute;width:100%;height:auto;max-width:none;left:0;top:-12%;object-fit:cover}
@media(max-width:1180px) and (min-width:1025px){.hero-values>div{flex-direction:column;align-items:flex-start}.hero-values{gap:8px}}
@media(max-width:760px){.person .visual.portrait{height:auto;aspect-ratio:3/4;min-height:0}.person .visual.portrait img{height:100%;object-fit:cover}.person-vl04 .visual.portrait img{height:auto}.hero-values>div{flex-direction:column;align-items:flex-start}.hero-values{gap:12px}}
/* R06 — supplied four-article editorial study, scoped to About bodies. */
.editorial-wrap{max-width:1240px}.editorial-study{background:#faf9f4;border-radius:14px;overflow:hidden;box-shadow:0 14px 60px #133b2a14;color:#1a3e2d;margin:30px 0 50px}.editorial-top{padding:76px 8% 62px;background:linear-gradient(115deg,#f8f4e8,#e9eee5)}.editorial-top h1{font:400 clamp(36px,4vw,58px)/1.14 Georgia,serif;letter-spacing:-.025em;max-width:800px;margin:14px 0 22px}.editorial-top p{max-width:720px}.editorial-top .eyebrow{color:#9b8753;font-size:13px;font-weight:700}.editorial-top.with-portrait{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:32px;align-items:center}.editorial-top .visual.portrait{height:360px;border-radius:10px}.editorial-top .visual.portrait img{object-fit:contain}.editorial-chapter{display:grid;grid-template-columns:minmax(0,36fr) minmax(0,64fr);gap:56px;padding:58px 8%;border-top:1px solid #d9e2d8}.editorial-chapter.alternate{background:#f6f4ed}.editorial-heading{padding-right:15px}.editorial-heading>span{font:35px Georgia,serif;color:#9c905e}.editorial-heading h2{font:400 clamp(26px,2.5vw,37px)/1.2 Georgia,serif;color:#174331;letter-spacing:0;margin:8px 0}.editorial-copy{min-width:0;font-size:17px;line-height:1.85;max-width:660px}.editorial-copy p{margin:0 0 20px}.editorial-copy p:last-child{margin-bottom:0}.editorial-duo{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:35px 22%;background:#f1f4ec}.editorial-duo .visual{height:310px;border-radius:10px}.editorial-duo img{object-fit:contain}.content-transition .transition-card[aria-current=page]{border:2px solid #8ba999}.content-transition .grid.four{gap:18px}.content-transition .grid.four .transition-card h3{font-size:21px}.distribution-source{height:auto!important;min-height:0!important;aspect-ratio:auto!important;background:#f7f3e7}.distribution-source img{width:100%;height:auto;object-fit:contain}.partner-banner{margin-bottom:38px}.map-caption{padding:25px 0}.nav>details>div,.nav-about-disclosure>div{z-index:30}.nav-group:last-of-type .nav-about-disclosure>div{left:auto!important;right:0}.nav-about-disclosure summary{min-width:30px;min-height:40px;display:flex;align-items:center;justify-content:center}.nav details[open]>summary{color:#a3833d}.nav-about:focus-within>.nav-about-link{color:#a3833d}
@media(max-width:1100px){.nav{gap:12px}.content-transition .grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.editorial-top.with-portrait{grid-template-columns:minmax(0,1fr) 220px}.editorial-chapter{gap:35px}}
@media(max-width:760px){.editorial-wrap{padding-left:20px;padding-right:20px}.editorial-top{padding:35px 6% 32px}.editorial-top h1{font-size:32px}.editorial-top.with-portrait{display:block}.editorial-top .visual.portrait{height:350px;margin-top:25px}.editorial-chapter{display:block;padding:28px 6%}.editorial-heading h2{font-size:25px;margin-bottom:22px}.editorial-copy{font-size:16px}.editorial-duo{padding:16px 6%;gap:10px}.editorial-duo .visual{height:210px}.content-transition .grid.four{grid-template-columns:1fr}.nav-about-disclosure summary{min-width:44px;min-height:44px}.nav-group:last-of-type .nav-about-disclosure>div{right:auto}}
@media(max-width:1000px){.nav-about{display:block;position:relative;width:100%}.nav-about>.nav-about-link{display:block;padding:10px 50px 10px 0}.nav-about-disclosure{display:block!important;position:static!important}.nav-about-disclosure summary{position:absolute;right:0;top:0;width:44px;height:44px}.nav-about-disclosure>div{position:static!important;width:100%;padding:5px 12px 12px!important}.nav-about-disclosure>div a{white-space:normal}.nav{max-height:calc(100vh - 100px);overflow-y:auto}}
/* R07 shared navigation and footer complete the About-reference page shell. */
.shared-transition .card{border-radius:7px;overflow:hidden}.shared-transition .card .visual{height:180px}.shared-transition .card-body{padding:18px}.shared-transition .card-body h3{font-size:21px}.shared-transition .card-body p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.footer-grid{grid-template-columns:1.2fr repeat(7,minmax(0,1fr));gap:23px}.footer-grid h3{font-size:12px;line-height:1.5}.footer-grid a{font-size:11px;line-height:1.6;overflow-wrap:break-word}.footer-bottom a{display:inline;font-size:inherit}.explore .minor .visual img[src*="partner-booth"]{object-fit:contain}
@media(max-width:1180px){.footer-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px}.shared-transition .grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.footer-grid a{font-size:12px}.shared-transition .grid.three,.shared-transition .grid.four{grid-template-columns:1fr}.shared-transition .card .visual{height:230px}}
.nav .nav-brand-mark{display:inline-block;width:48px;height:36px;object-fit:contain;vertical-align:middle;margin-right:10px}

.handoff-rest-r14 *{box-sizing:border-box}.handoff-rest-r14{margin:0;background:#f1efe8;color:#193f30;font:16px/1.75 system-ui,Arial}.handoff-rest-r14 .top{background:#173d2c;color:white;padding:22px 5%}.handoff-rest-r14 .top h1{margin:0;font-size:24px}.handoff-rest-r14 .top p{margin:0;color:#cbd9ce}.handoff-rest-r14 .wrap{max-width:1140px;margin:auto;padding:22px 18px}.handoff-rest-r14 .tabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:20px}.handoff-rest-r14 .tabs button{background:white;border:1px solid #b9cbb9;border-radius:5px;padding:10px 13px;color:#173d2c;cursor:pointer}.handoff-rest-r14 .tabs button.active{background:#173d2c;color:white}.handoff-rest-r14{background:#fffdf8;border:1px solid #dce4d8}.handoff-rest-r14 .hero{padding:48px 8%;background:#ebf0e8}.handoff-rest-r14 .hero h1{font:normal clamp(30px,4vw,49px)/1.16 Georgia,serif;margin:15px 0}.handoff-rest-r14 .hero p{max-width:740px}.handoff-rest-r14 .eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase}.handoff-rest-r14 .split{display:grid;grid-template-columns:35% 65%;gap:30px;padding:35px 8%;border-top:1px solid #e0e6dc}.handoff-rest-r14 .side span{font:32px Georgia;color:#a5956c}.handoff-rest-r14 .side h3{font:normal 28px/1.22 Georgia,serif}.handoff-rest-r14 .copy{padding-right:22px}.handoff-rest-r14 .copy p{margin:0 0 16px}.handoff-rest-r14 .image-slot{margin:24px 8%;height:230px;background:#e4ebe2;border:2px dashed #94ab98;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#627966;gap:7px;text-align:center}.handoff-rest-r14 .image-slot small{font-size:12px}.handoff-rest-r14 .foot{padding:28px 8%;background:#e9eee7;color:#617965}.handoff-rest-r14 .warning{padding:15px;background:#fff4df;border-left:4px solid #b9a06c;margin:15px 0}.handoff-rest-r14 .warning b{color:#6f582d}@media(max-width:700px){.handoff-rest-r14 .split{display:block;padding:25px 6%}.handoff-rest-r14 .hero{padding:35px 6%}.handoff-rest-r14 .side h3{font-size:25px}.handoff-rest-r14 .copy{padding:0}.handoff-rest-r14 .image-slot{margin:18px 6%;height:180px}}.handoff-rest-r14{background:#f4f1e9;color:#234331;font-family:system-ui,-apple-system,Arial,sans-serif;line-height:1.85}.handoff-rest-r14 .top{background:#173b2b;padding-top:30px;padding-bottom:30px;border-bottom:4px solid #baa875}.handoff-rest-r14 .top h1{font-family:Georgia,serif;font-weight:400;font-size:29px;letter-spacing:.01em}.handoff-rest-r14 .wrap{max-width:1190px;padding-top:30px}.handoff-rest-r14 .tabs{position:sticky;top:0;background:#f4f1e9;padding:13px 0;z-index:2}.handoff-rest-r14 .tabs button{border-radius:20px;font-weight:600;padding:10px 17px}.handoff-rest-r14{border-color:#e2e3d9;border-radius:12px;overflow:hidden;box-shadow:0 12px 34px rgba(20,50,29,.06)}.handoff-rest-r14 .hero{background:linear-gradient(115deg,#e9eee6,#f9f4e9);padding-top:65px;padding-bottom:60px}.handoff-rest-r14 .hero h1{font-size:clamp(34px,4.5vw,56px);letter-spacing:-.035em;max-width:790px}.handoff-rest-r14 .hero p{font-size:17px;color:#425b48}.handoff-rest-r14 .eyebrow{color:#61795d;font-weight:700}.handoff-rest-r14 .split{padding-top:46px;padding-bottom:46px;border-color:#e7e6dd}.handoff-rest-r14 .split:nth-of-type(even){background:#fafbf6}.handoff-rest-r14 .side h3{font-size:30px;letter-spacing:-.015em}.handoff-rest-r14 .side span{color:#b49b68}.handoff-rest-r14 .copy p{color:#384d3f}.handoff-rest-r14 .image-slot{height:270px;border-radius:11px;border:1.5px dashed #98aa96;background:linear-gradient(135deg,#e3ebe0,#eeeee3);box-shadow:inset 0 0 0 8px rgba(255,255,255,.28)}.handoff-rest-r14 .image-slot strong{font-family:Georgia,serif;font-size:23px;color:#436c50}.handoff-rest-r14 .image-slot span{font-size:12px;letter-spacing:.06em}.handoff-rest-r14 .foot{background:#e7ede5}.handoff-rest-r14 .warning{background:#fff8e9}@media(max-width:700px){.handoff-rest-r14 .top h1{font-size:23px}.handoff-rest-r14 .hero{padding-top:35px;padding-bottom:35px}.handoff-rest-r14 .hero p{font-size:16px}.handoff-rest-r14 .split{padding-top:28px;padding-bottom:28px}.handoff-rest-r14 .image-slot{height:205px}.handoff-rest-r14 .tabs{position:static}}
.handoff-rest-r14{max-width:1190px;margin:0 auto 40px;font:16px/1.85 system-ui,-apple-system,Arial,sans-serif}.handoff-rest-r14 .hero{display:block;position:static;min-height:0;overflow:visible;margin:0;border:0}.handoff-rest-r14 .hero h1{color:inherit}.handoff-rest-r14 .split{grid-template-columns:minmax(0,35fr) minmax(0,65fr)}.handoff-rest-r14 .copy{min-width:0;max-width:none;padding:0 22px 0 0}.handoff-rest-r14 .eyebrow{display:block}.handoff-rest-r14 [data-source-copy]{overflow-wrap:break-word}@media(max-width:700px){.handoff-rest-r14 .split{display:block}.handoff-rest-r14 .copy{padding:0}}
/* Loving R16 typography-only candidate. Load LAST on every HTML route.
 * Three exact rendered text sizes: 16px / 24px / 32px, all viewports.
 * Existing image pixels, copy, colors, DOM order and grid columns stay intact.
 * !important intentionally retires legacy inline/breakpoint font sizes.
 */
html body {
  font-size: 16px !important;
  font-family: Arial, sans-serif !important;
  line-height: 1.6;
}
html body * {
  font-size: inherit !important;
  font-family: inherit !important;
}
html body *::before,
html body *::after {
  font-size: inherit !important;
  font-family: inherit !important;
}

/* Level 1: page titles and section titles. */
html body h1,
html body h2 {
  font-size: 32px !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

/* Level 2: subheadings and card titles. */
html body h3,
html body h4,
html body h5,
html body h6,
html body .quick-links strong,
html body .closing p {
  font-size: 24px !important;
  font-family: Arial, sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

/* Level 3: body, navigation, controls, labels, and descriptive captions.
 * Explicit exceptions also override the old .article-lead !important rule.
 */
html body .article-lead,
html body .eyebrow,
html body .tag,
html body .nav,
html body .button,
html body button,
html body input,
html body select,
html body textarea,
html body .footer h3,
html body .hero-values span,
html body .quick-links small,
html body .playlist-item strong,
html body .playlist-item small,
html body .playlist-item em {
  font-size: 16px !important;
  font-family: Arial, sans-serif !important;
  line-height: 1.5 !important;
}
html body .eyebrow,
html body .tag,
html body .nav,
html body .button,
html body .footer h3,
html body .hero-values span,
html body .quick-links small,
html body label,
html body .playlist-item strong {
  font-weight: 600 !important;
}
html body .eyebrow,
html body .tag {
  letter-spacing: .06em !important;
}

/* Text reflow safeguards; no new columns, reordered sections, or image crops. */
html body :is(h1, h2, h3, h4, h5, h6, p, a, small, button, label, output) {
  overflow-wrap: anywhere;
}
html body :is(.copy, .card-body, .quick-links a > div, .nav, .hero-values span) {
  min-width: 0;
}
html body :is(.button, .nav a, .nav summary, .subnav a, .filter) {
  white-space: normal;
}
html body .hero-values span {
  max-width: none;
}
/* Transcribed raster taglines retain their wording as accessible authored text. */
html body .icon-source-caption {
  display: block;
  font-size: 16px !important;
  font-family: Arial, sans-serif !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  margin-top: 8px;
}
/* Larger type must not silently lose words under the legacy three-line clamp. */
html body .shared-transition .card-body p {
  display: block;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  overflow: visible;
}

/* Optional R16 typography correction, held for parent review.
 * ONLY the eight supplied category badges with duplicate baked-in captions.
 * Replaced-element box clips the caption area, while keeping the complete symbol.
 * Original source bytes remain untouched. No logo/product/package selector.
 */
html body img.asset-icon:is(
  [src$="/icon-about.webp"],
  [src$="/icon-products.webp"],
  [src$="/icon-commitment.webp"],
  [src$="/icon-distribution.webp"],
  [src$="/icon-journal-green.webp"],
  [src$="/icon-journal-ingredients.webp"],
  [src$="/icon-journal-journey.webp"],
  [src$="/icon-journal-kitchen.webp"]
) {
  height: auto !important;
  aspect-ratio: 25 / 17;
  object-fit: cover !important;
  object-position: center top !important;
}
/* The raised accent on “Về” starts slightly higher than other captions. */
html body img.asset-icon[src$="/icon-about.webp"] {
  aspect-ratio: 3 / 2;
}

.lf-open{position:fixed;right:18px;bottom:18px;z-index:9990;background:#244b3d;color:#fff;border:1px solid #fff;border-radius:100px;padding:13px 19px;box-shadow:0 3px 16px #0003;font:600 16px system-ui;cursor:pointer}.lf-dialog{width:min(560px,calc(100% - 28px));max-height:calc(100dvh - 32px);padding:24px;border:1px solid #dbdfd7;border-radius:18px;background:#fffdf8;color:#203c31;box-sizing:border-box;overflow:auto;z-index:9991}.lf-dialog::backdrop{background:#10241dc2}.lf-form{display:flex;flex-direction:column;gap:14px;font:16px/1.5 system-ui}.lf-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.lf-heading h2{margin:0;font-size:24px;line-height:1.3}.lf-close{background:none;border:0;font-size:32px;line-height:1;color:inherit;cursor:pointer;padding:4px;min-width:44px;min-height:44px}.lf-form label{display:flex;flex-direction:column;gap:5px;font-size:16px}.lf-form input,.lf-form textarea{width:100%;box-sizing:border-box;border:1px solid #a8b6ad;border-radius:7px;padding:10px;font:16px/1.45 system-ui;color:#203c31;background:#fff}.lf-note{font-size:16px;color:#526257;margin:0}.lf-page{font-size:16px;margin:0;overflow-wrap:anywhere}.lf-status{margin:0;font-size:16px;overflow-wrap:anywhere}.lf-send{background:#244b3d;color:#fff;padding:12px;border:0;border-radius:8px;font:600 16px system-ui;cursor:pointer}.lf-send:disabled{opacity:.6;cursor:wait}.lf-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.lf-dialog :focus-visible,.lf-open:focus-visible{outline:3px solid #cc9b38;outline-offset:3px}@media(max-width:480px){.lf-open{right:12px;bottom:max(12px,env(safe-area-inset-bottom));padding:12px 15px}.lf-dialog{padding:18px}}
/* Scoped additions respect the site's three-size typography without changing page content. */
html body .lf-dialog .lf-heading h2{font-size:24px!important;line-height:1.3!important}html body .lf-dialog .lf-close{font-size:32px!important;line-height:1!important}

/* Real reserved toolbar row. No fixed overlay and no body bottom-padding trick. */
html:has(body.lf-shell) { height: 100%; overflow: hidden; }
body.lf-shell {
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}
body.lf-shell > #lf-page-viewport {
  grid-row: 1;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  scrollbar-gutter: stable;
  scroll-behavior: smooth;
  scroll-padding-top: 110px;
  touch-action: auto;
}
body.lf-shell > #lf-page-viewport.lf-drawing-active {
  overflow: hidden;
  touch-action: none;
  scroll-behavior: auto;
}
body.lf-shell > #lf-toolbar {
  grid-row: 2;
  position: relative;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  background: #fffdf8;
  border-top: 1px solid #dbdfd7;
}
body.lf-shell #lf-toolbar .lf-open {
  position: static;
  inset: auto;
  margin: 0;
  min-height: 44px;
  padding: 9px 15px;
  box-shadow: none;
}
body.lf-shell #lf-page-viewport:focus-visible {
  outline: 2px solid #cc9b38;
  outline-offset: -2px;
}
@media(max-width:1000px) {
  body.lf-shell #lf-page-viewport .nav {
    max-height: calc(100dvh - var(--lf-toolbar-height, 61px) - 100px);
  }
}
@media(prefers-reduced-motion:reduce) {
  body.lf-shell > #lf-page-viewport {scroll-behavior:auto;}
}
@media print {
  html:has(body.lf-shell), body.lf-shell {height:auto;overflow:visible;display:block;}
  body.lf-shell > #lf-page-viewport {height:auto;overflow:visible;display:block;}
  body.lf-shell > #lf-toolbar {display:none;}
}

/* Region selection uses outlines only: approved page geometry stays unchanged. */
body.lf-shell #lf-toolbar .lf-region-open,
.lf-selection-cancel,.lf-region-actions button {
  min-height:44px;
  padding:9px 15px;
  border:1px solid #879c8d;
  border-radius:22px;
  background:#fffdf8;
  color:#244b3d;
  font:600 16px/1.4 system-ui;
  cursor:pointer;
}
body.lf-shell #lf-toolbar .lf-region-open {
  order:-1;
  background:#244b3d;
  border-color:#244b3d;
  color:#fff;
}
body.lf-shell #lf-toolbar .lf-open {background:#fffdf8;color:#244b3d;border-color:#879c8d;}
.lf-selection-tools {display:flex;align-items:center;flex-wrap:wrap;gap:8px;flex:1 1 100%;min-width:0;}
.lf-selection-tools p {flex:1 1 280px;margin:0;color:#203c31;font:16px/1.4 system-ui;}
.lf-selection-tools[hidden],.lf-region-open[hidden],.lf-region-actions button[hidden],.lf-selected-context[hidden] {display:none!important;}
.lf-region-actions {display:flex;flex-wrap:wrap;gap:8px;}
.lf-region-actions button {flex:1 1 auto;}
.lf-selected-context {margin:0;padding:10px 12px;border-left:4px solid #b45616;border-radius:5px;background:#fff0da;color:#203c31;overflow-wrap:anywhere;}
body.lf-shell #lf-page-viewport.lf-selecting-region [data-la-anchor] {cursor:crosshair;}
body.lf-shell #lf-page-viewport.lf-selecting-region [data-la-anchor]:focus-visible {outline:3px dashed #b45616;outline-offset:3px;}
body.lf-shell #lf-page-viewport .lf-selected-region {outline:4px solid #b45616;outline-offset:3px;}
.lf-region-open:focus-visible,.lf-selection-cancel:focus-visible {outline:3px solid #cc9b38;outline-offset:3px;}
.lf-region-open:disabled,.lf-region-actions button:disabled {opacity:.6;cursor:wait;}
@media(max-width:480px) {
  body.lf-shell #lf-toolbar .lf-region-open,body.lf-shell #lf-toolbar .lf-open {flex:1 1 145px;padding:9px 10px;}
  .lf-selection-cancel {width:100%;}
}
@media print {
  body.lf-shell #lf-page-viewport .lf-selected-region {outline:none;}
}

/* Keep the explicit send action reachable inside either scrolling review dialog.
   It remains in normal flow, so the final fields/status can scroll fully above it. */
.lf-dialog {scroll-padding-block:18px 80px;}
.lf-dialog .lf-form > .lf-send {
  position:sticky;
  bottom:0;
  z-index:2;
  flex-shrink:0;
  min-height:48px;
  box-shadow:0 -12px 0 4px #fffdf8;
}
.lf-dialog .lf-form input,.lf-dialog .lf-form textarea {scroll-margin-block:18px 80px;}

/* Private review entry: public link, never public review data. */
body.lf-shell #lf-toolbar .lf-review-link {
  min-height:44px;display:inline-flex;align-items:center;padding:9px 12px;
  color:#244b3d;font:600 16px/1.4 system-ui;text-decoration:underline;
  text-underline-offset:3px;border-radius:8px;
}
.lf-review-link:focus-visible {outline:3px solid #cc9b38;outline-offset:2px;}
@media(max-width:480px){body.lf-shell #lf-toolbar .lf-review-link {padding:4px 8px;min-height:44px;margin-inline:auto;}}
.lf-review-location {flex:1 1 100%;margin:0;color:#244b3d;font:15px/1.4 system-ui;overflow-wrap:anywhere;}

/* R17: user's body-size icon text correction. Append after R16 typography.
 * Only icon-associated text / Explore labels. No copy or image replacement.
 * Overall authored-text scale remains 16 / 24 / 32px.
 */
html body .hero-values span,
html body .quick-links :is(strong, small, .icon-source-caption),
html body .metrics :is(b, h3, p),
html body .card-body:has(> .asset-icon) :is(h3, p, .link, .icon-source-caption),
html body .distribution-heading :is(h2, p, .eyebrow, .icon-source-caption),
html body .explore :is(h3, p, .eyebrow, .link),
html body .icon-source-caption {
  font-size: 16px !important;
  font-family: Arial, sans-serif !important;
  line-height: 1.6 !important;
  letter-spacing: normal !important;
}
/* Body copy stays normal weight, including the transcribed raster taglines. */
html body .hero-values span,
html body .quick-links small,
html body .metrics :is(b, p),
html body .card-body:has(> .asset-icon) :is(p, .link, .icon-source-caption),
html body .distribution-heading :is(p, .eyebrow, .icon-source-caption),
html body .explore :is(p, .eyebrow, .link),
html body .icon-source-caption {
  font-weight: 400 !important;
}
/* Modest distinction for titles, never oversized or heavy body copy. */
html body .quick-links strong,
html body .metrics h3,
html body .card-body:has(> .asset-icon) h3,
html body .distribution-heading h2,
html body .explore h3 {
  font-weight: 600 !important;
  margin-bottom: 6px;
}
html body .icon-source-caption { margin-top: 6px; }

/* Same three values and column order; smaller medallions leave room for words.
 * Sprite crop proportions are scaled exactly from the existing 65px icons.
 */
html body .hero-values { gap: 12px; }
html body .hero-values > div { gap: 8px; }
html body .hero-values .hero-medallion {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
}
html body .hero-value-plant {
  background-size: 53.74285714px 53.74285714px;
  background-position: -3px -3px;
}
html body .hero-value-flavor {
  background-size: 62.7px 62.7px;
  background-position: -6.25px 0;
}
html body .hero-value-sustainable {
  background-size: 70.81411765px 70.81411765px;
  background-position: -9.88235294px 0;
}
html body .hero-values span {
  min-width: 0;
  max-width: none;
  overflow-wrap: normal;
  word-break: normal;
}
/* At narrow widths, retain the existing three-column, icon-above-label pattern. */
@media (max-width: 1180px) {
  html body .hero-values > div { flex-direction: column; align-items: flex-start; }
}
/* Home's two supplied distribution cards only. Preserve complete map/booth art. */
html body .distribution-heading + .grid.two > .card > .distribution-source {
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 4 / 3 !important;
}
html body .distribution-heading + .grid.two > .card > .distribution-source img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
html body .distribution-heading + .grid.two .card-body h3 {
  font-size: 16px !important;
  font-family: Arial, sans-serif !important;
  font-weight: 600 !important;
  line-height: 1.6 !important;
}
/* Shared intrinsic rows align title/body/action without clipping any text.
 * Subgrid is supported by current Chrome, Safari and Firefox.
 * Existing single-column mobile arrangement remains unchanged.
 */
@media (min-width: 761px) {
  html body .distribution-heading + .grid.two {
    grid-template-rows: auto auto auto auto;
    row-gap: 0;
  }
  html body .distribution-heading + .grid.two > .card {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
  html body .distribution-heading + .grid.two > .card > .card-body {
    display: grid;
    grid-row: span 3;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
  html body .distribution-heading + .grid.two .card-body .link {
    justify-self: start;
    align-self: end;
  }
}

/* Approved existing image mappings only; retain baseline frame layout and dimensions. */
body .approved-image-r21.approved-image-r21.approved-image-r21 {position:relative;overflow:hidden;border-style:solid;border-color:transparent;background:#f3f0e7;box-shadow:none;}
body .approved-image-r21.approved-image-r21.approved-image-r21 > img {position:absolute;inset:0;width:100%;height:100%;display:block;max-width:100%;border-radius:inherit;}

/* Audit R23: layout repairs only; approved 16 / 24 / 32 type scale unchanged. */
html body .logo{min-width:158px}
html body .logo small{white-space:nowrap}
html body .product-card .button{white-space:nowrap;gap:12px}
html body .handoff-r08.handoff-product .hero .visual:before{z-index:2;max-width:calc(100% - 24px);line-height:1.5;background:#fffdf8}
html body .handoff-r08.handoff-product .hero .visual{padding-top:76px}
html body .video-external-icon{width:1em;height:1em;display:inline-block;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.7}
@media (min-width:761px) and (max-width:1000px){
 html body .quick-links .grid.three{grid-template-columns:1fr}
 html body .quick-links a>div{min-width:0}
 html body .hero.has-image:after{background:linear-gradient(90deg,#f6f3e7 0%,#f6f3e7f5 65%,#f6f3e7cf 100%)}
 html body .grid.three:has(> .card:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
 html body .grid.three:has(> .card:only-child),html body .grid.four:has(> .card:only-child){grid-template-columns:1fr}
}
@media (max-width:600px){
 html body .grid.three,html body .grid.four,html body .grid.five{grid-template-columns:1fr}
 html body .hero.has-image:after{background:linear-gradient(0deg,#f6f3e7 0%,#f6f3e7f5 75%,#f6f3e799 100%)}
 html body .product-card .button{align-self:flex-start;min-width:145px}
}
/* The QA warning has its own band; never paint it over supplied artwork. */
html body .handoff-r08.handoff-product .hero .visual:has(> img){padding:0;display:flex;flex-direction:column;aspect-ratio:auto}
html body .handoff-r08.handoff-product .hero .visual:has(> img):before{position:static;display:block;align-self:stretch;max-width:none;margin:0;padding:8px 10px;flex:0 0 auto;text-align:left}
html body .handoff-r08.handoff-product .hero .visual>img{position:static!important;inset:auto!important;display:block;width:100%!important;height:auto!important;aspect-ratio:4 / 3;object-fit:contain!important;flex:0 0 auto}
@media (min-width:761px) and (max-width:1000px){
 html body .grid.three:has(> .card){grid-template-columns:repeat(2,minmax(0,1fr))}
 html body .grid.three:has(> .card:only-child){grid-template-columns:1fr}
}

/* R33 reviewed global roles. Opt-in only; R32 pilot CSS/HTML remain untouched.
   No source replacement, typography, navigation, footer, contact, utility
   icons/logos, video or annotation changes. Existing card grids are retained. */
html body.frame-roles-r33 .frame-r33.frame-r33 {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  min-width: 0;
  min-height: 0;
  max-height: none;
  padding: 0;
  overflow: hidden;
  align-self: center;
}
html body.frame-roles-r33 .frame-r33.frame-r33 > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: none;
  aspect-ratio: auto;
  object-fit: var(--frame-fit, contain) !important;
  object-position: var(--frame-focus, 50% 50%) !important;
  background: transparent;
}
/* True packshots and portrait product photos always retain the entire source. */
html body.frame-roles-r33 .frame-r33.frame-product-r33 {
  aspect-ratio: 1 / 1;
  --frame-fit: contain;
}
html body.frame-roles-r33 .frame-r33.frame-product-r33 > .missing {
  position: absolute;
  inset: 0;
  height: 100%;
}
/* Reserved for the two specific landscape bottle sources checked in R32. */
html body.frame-roles-r33 .frame-r33.frame-product-r33.frame-scene-r33 {
  --frame-fit: cover;
  --frame-focus: 50% 50%;
}
html body.frame-roles-r33 .frame-r33.frame-article-r33 {
  aspect-ratio: 4 / 3;
  --frame-fit: cover;
}
html body.frame-roles-r33 .frame-nature-r33 { --frame-focus: 100% 50%; }
html body.frame-roles-r33 .frame-kitchen-r33 { --frame-focus: 100% 50%; }
html body.frame-roles-r33 .frame-journal-r33 { --frame-focus: 75% 50%; }
html body.frame-roles-r33 .frame-founder-r33 { --frame-focus: 50% 12%; }
html body.frame-roles-r33 .frame-ambassador-r33 { --frame-focus: 50% 28%; }
html body.frame-roles-r33 .frame-r33.frame-document-r33 { --frame-fit: contain; }
/* Natural body imagery overrides old fixed-height/ultrawide image slots.
   Never crop full-body portraits; a portrait card has a different role. */
html body.frame-roles-r33 .frame-body-wrap-r33 { height: auto; }
html body.frame-roles-r33 .frame-r33.frame-body-r33 {
  aspect-ratio: auto;
  width: 100%;
  max-width: 880px;
  margin-inline: auto;
  padding: 0;
  background: transparent;
}
html body.frame-roles-r33 .frame-r33.frame-body-r33 > img {
  position: static;
  inset: auto;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain !important;
}
html body.frame-roles-r33 .frame-r33.frame-body-square-r33 { max-width: 640px; }
html body.frame-roles-r33 .frame-r33.frame-body-portrait-r33 { max-width: 320px; align-self: start; }
/* Hero default is safe contain; near-16:9 scenes have negligible bands.
   Natural-ratio exceptions preserve N03, printed text and product packages. */
html body.frame-roles-r33 .frame-r33.frame-hero-image-r33 {
  aspect-ratio: 16 / 9;
  --frame-fit: contain;
}
/* Natural-ratio exceptions avoid artificial bands while protecting content.
   N03 uses its existing 4:3 source; printed-brand cards retain native 16:9. */
html body.frame-roles-r33 .frame-r33.frame-hero-natural-r33,
html body.frame-roles-r33 .frame-r33.frame-card-natural-r33 {
  aspect-ratio: auto;
}
html body.frame-roles-r33 .frame-r33.frame-hero-natural-r33 > img,
html body.frame-roles-r33 .frame-r33.frame-card-natural-r33 > img {
  position: static;
  inset: auto;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain !important;
}
/* Approved technical-label correction keeps its original pending-QA status. */
html body.frame-roles-r33 .handoff-r08.handoff-product .hero > .frame-product-hero-r33::before {
  content: 'ẢNH – CHƯA NGHIỆM THU';
}
/* Existing product-story warning stays a distinct status band. The image
   below it stays natural-ratio, without warning text over its artwork. */
html body.frame-roles-r33 .handoff-r08.handoff-product .hero > .frame-r33.frame-product-hero-r33 {
  display: flex;
  flex-direction: column;
  width: calc(100% - 56px);
  max-width: calc(100% - 56px);
  height: auto;
  min-height: 0;
  max-height: none;
  padding: 0;
  aspect-ratio: auto;
  align-self: start;
}
html body.frame-roles-r33 .handoff-r08.handoff-product .hero > .frame-r33.frame-product-hero-r33 > img {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: auto;
  object-fit: contain !important;
  object-position: 50% 50% !important;
}
/* Existing shared banner now has distinct copy and image tracks. No content
   is removed, and it is not mistaken for an article-specific opening image. */
html body.frame-roles-r33 .hero.frame-banner-r33 {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1.15fr);
  gap: 24px;
  min-height: 0;
  align-items: center;
}
html body.frame-roles-r33 .hero.frame-banner-r33::after { content: none; }
html body.frame-roles-r33 .hero.frame-banner-r33 > .hero-art {
  position: static;
  inset: auto;
  min-width: 0;
  order: 2;
}
html body.frame-roles-r33 .hero.frame-banner-r33 > .hero-copy {
  position: static;
  width: auto;
  max-width: none;
  min-width: 0;
  order: 1;
  padding: 32px;
}
/* Contract used by the separate approved-hero placement transform. The class
   works on lead/opening/intro/hero/editorial-top without changing typography. */
html body.frame-roles-r33 .frame-editorial-hero-r33.frame-editorial-hero-r33 {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1.15fr);
  gap: 32px;
  align-items: center;
  max-width: none;
  min-height: 0;
  padding: 48px 5%;
}
html body.frame-roles-r33 .frame-editorial-hero-r33 > figure { margin: 0; }
html body.frame-roles-r33 .frame-hero-copy-r33 { min-width: 0; }
@media (max-width: 1000px) {
  html body.frame-roles-r33 .hero.frame-banner-r33,
  html body.frame-roles-r33 .frame-editorial-hero-r33.frame-editorial-hero-r33 {
    grid-template-columns: minmax(0,1fr);
    gap: 24px;
  }
  html body.frame-roles-r33 .frame-editorial-hero-r33.frame-editorial-hero-r33 { padding: 32px 6%; }
  html body.frame-roles-r33 .hero.frame-banner-r33 > .hero-copy { padding: 32px 6% 0; }
}
@media (max-width: 740px) {
  html body.frame-roles-r33 .handoff-r08.handoff-product .hero > .frame-r33.frame-product-hero-r33 {
    width: calc(100% - 36px);
    max-width: calc(100% - 36px);
  }
}

/* R37: confirmed homepage review, 18 October 2026.
   Existing artwork and wording are unchanged. No animation, product crop,
   body-image change, or global icon treatment. */

/* Photographic 16:9 hero roles fill their own frames. Natural-ratio artwork,
   portrait imagery, printed product scenes and packshots keep their safeguards. */
html body.feedback-polish-r37 .frame-r33.frame-hero-image-r33:not(.frame-hero-natural-r33):not(.frame-product-hero-r33) {
  --frame-fit: cover;
}

/* The panoramic homepage photograph is one continuous opening, not a small
   image beside a separate card. The woman and bowl stay in the clear right side. */
html body.feedback-polish-r37.frame-page-home-r32 #main > .wrap:first-child {
  max-width: none;
  padding-inline: 0;
  background: var(--cream);
}
html body.feedback-polish-r37 .brand-hero-r03.frame-hero-r32 {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  isolation: isolate;
  min-height: 520px;
  margin-top: 0;
  background: var(--cream);
}
html body.feedback-polish-r37 .brand-hero-r03 > .frame-home-photo-r32 {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  align-self: stretch;
  --frame-fit: cover;
  --frame-focus: 100% 50%;
  z-index: -1;
}
html body.feedback-polish-r37 .brand-hero-r03 > .frame-home-photo-r32::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 32px;
  background: linear-gradient(to bottom, transparent, var(--cream));
  pointer-events: none;
}
html body.feedback-polish-r37 .brand-hero-r03 > .brand-hero-copy {
  position: relative;
  inset: auto;
  width: 51%;
  min-width: 0;
  max-width: 800px;
  padding: 36px clamp(30px, 5vw, 86px);
  padding-right: clamp(42px, 6vw, 104px);
  justify-content: center;
  background: linear-gradient(90deg, rgba(247,243,231,.98) 0%, rgba(247,243,231,.96) 66%, rgba(247,243,231,.84) 84%, rgba(247,243,231,0) 100%);
}
html body.feedback-polish-r37 .brand-hero-copy h1,
html body.feedback-polish-r37 .brand-hero-copy p {
  max-width: 510px;
}
html body.feedback-polish-r37 .hero-actionbar {
  justify-content: center;
  flex-wrap: wrap;
  padding: 12px 24px 18px;
  background: var(--cream);
}

/* Only the three marked navigation badges. darken removes their light matte
   against this exact cream surface without re-creating or changing source art.
   Isolate each link so the blend cannot affect neighboring text or imagery. */
html body.feedback-polish-r37.frame-page-home-r32 .quick-links {
  padding: 12px 0 22px;
  background: var(--cream);
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links .grid.three {
  gap: 0;
  align-items: stretch;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links a {
  isolation: isolate;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) 14px;
  align-items: center;
  column-gap: 12px;
  padding: 12px 20px;
  border: 0;
  border-right: 1px solid var(--line);
  background: var(--cream);
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links a:last-child {
  border-right: 0;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links .asset-icon {
  width: 62px;
  max-width: 100%;
  margin: 0;
  mix-blend-mode: darken;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links a > div {
  min-width: 0;
  align-self: start;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links strong {
  display: block;
  margin: 0 0 4px;
  font-size: 17px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links small,
html body.feedback-polish-r37.frame-page-home-r32 .quick-links .icon-source-caption {
  display: block;
  margin: 0;
  font-size: 13px !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
  color: #4f604f;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links .icon-source-caption {
  margin-top: 2px;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links a > span:last-child {
  align-self: center;
  font-size: 18px;
}
html body.feedback-polish-r37.frame-page-home-r32 .quick-links + .section.soft {
  padding-top: 30px;
}

@media (min-width: 1600px) {
  html body.feedback-polish-r37 .brand-hero-r03.frame-hero-r32 {
    min-height: 32.5vw;
  }
}
@media (max-width: 1150px) {
  /* At narrow widths keep text out of the face/bowl entirely. A bottom fade
     joins the full-frame image to the copy, rather than hiding the photograph. */
  html body.feedback-polish-r37 .brand-hero-r03.frame-hero-r32 {
    min-height: 0;
  }
  html body.feedback-polish-r37 .brand-hero-r03 > .frame-home-photo-r32 {
    position: relative;
    inset: auto;
    grid-row: 1;
    height: auto;
    aspect-ratio: 16 / 7;
    z-index: 0;
  }
  html body.feedback-polish-r37 .brand-hero-r03 > .brand-hero-copy {
    grid-row: 2;
    width: 100%;
    max-width: none;
    padding: 16px 6% 24px;
    background: var(--cream);
  }
  html body.feedback-polish-r37 .brand-hero-copy h1,
  html body.feedback-polish-r37 .brand-hero-copy p {
    max-width: 700px;
  }
  html body.feedback-polish-r37.frame-page-home-r32 .quick-links a {
    grid-template-columns: 52px minmax(0, 1fr) 14px;
    column-gap: 10px;
    padding-inline: 12px;
  }
  html body.feedback-polish-r37.frame-page-home-r32 .quick-links .asset-icon {
    width: 52px;
  }
}
@media (max-width: 760px) {
  html body.feedback-polish-r37.frame-page-home-r32 .quick-links .grid.three {
    grid-template-columns: minmax(0, 1fr);
  }
  html body.feedback-polish-r37.frame-page-home-r32 .quick-links a {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 12px 0;
  }
  html body.feedback-polish-r37.frame-page-home-r32 .quick-links a:last-child {
    border-bottom: 0;
  }
  html body.feedback-polish-r37.frame-page-home-r32 .quick-links strong {
    font-size: 16px !important;
  }
}
@media (max-width: 600px) {
  html body.feedback-polish-r37 .brand-hero-r03 > .frame-home-photo-r32 {
    aspect-ratio: 16 / 9;
  }
  html body.feedback-polish-r37 .brand-hero-copy .hero-values {
    gap: 10px;
    margin-top: 18px;
  }
}

/* R38 · approved all-page hero rollout. The R37 homepage is not opted in.
   The repeated opt-in class deliberately outranks legacy handoff selectors.
   Only existing opening containers are selected. Original image bytes, image
   attributes, body-image roles, prose, links and feedback anchors stay intact. */
html body.hero-rollout-r38.hero-rollout-r38 #main { overflow-x: clip; }
html body.hero-rollout-r38.hero-rollout-r38 .r38-hero-host { overflow: visible; }
html body.hero-rollout-r38.hero-rollout-r38 .r38-surface.r38-surface {
  position: relative;
  width: 100vw;
  max-width: none;
  margin: 0 calc(50% - 50vw);
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: var(--cream, #f7f3e7);
  color: var(--ink, #193f30);
  isolation: isolate;
  min-height: 0;
  overflow: hidden;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-surface.r38-surface::after {
  content: '';
  display: block;
  position: absolute;
  inset: auto 0 0;
  height: 30px;
  background: linear-gradient(to bottom, rgba(247,243,231,0), var(--cream, #f7f3e7));
  pointer-events: none;
  z-index: 2;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-surface .r38-copy {
  position: relative;
  min-width: 0;
  max-width: none;
  width: 100%;
  padding: 34px max(6%, calc((100vw - 960px) / 2)) 56px;
  background: var(--cream, #f7f3e7);
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-surface .r38-copy > :last-child { margin-bottom: 0; }
/* Two reviewed landscape sources have their human/meal subject on the right.
   Use the COMPLETE 16:9 photograph as a continuous full-width canvas. */
html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-overlay.r38-surface {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-overlay > .r38-media {
  position: relative;
  inset: auto;
  grid-area: 1 / 1;
  order: 0;
  min-width: 0;
  width: 100%;
  align-self: center;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-overlay > .r38-copy {
  grid-area: 1 / 1;
  order: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 48%;
  padding: 42px clamp(30px, 5vw, 90px);
  padding-right: clamp(40px, 6vw, 100px);
  background: linear-gradient(90deg, rgba(247,243,231,.99) 0%, rgba(247,243,231,.97) 64%, rgba(247,243,231,.86) 82%, rgba(247,243,231,0) 100%);
}
/* No crop, no stretch. The image defines its own geometry, not a fixed-height
   panorama. Labels, food, hands, and faces retain the approved source frame. */
html body.hero-rollout-r38.hero-rollout-r38 .r38-surface .r38-image-frame.r38-image-frame {
  position: relative;
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  aspect-ratio: auto;
  background: transparent;
  --frame-fit: contain;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-surface .r38-image-frame.r38-image-frame > img {
  position: static;
  inset: auto;
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  border-radius: 0;
}
/* Complete natural artwork flows edge-to-edge into its existing copy.
   Copy never overlays faces, printed packaging, or an unreviewed focal area. */
html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-natural.r38-surface,
html body.hero-rollout-r38.hero-rollout-r38 .r38-editorial-natural.r38-surface {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: stretch;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-natural > .r38-media,
html body.hero-rollout-r38.hero-rollout-r38 .r38-editorial-natural > .r38-media {
  position: relative;
  inset: auto;
  order: 0;
  width: 100%;
  min-width: 0;
  margin: 0;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-natural > .r38-copy,
html body.hero-rollout-r38.hero-rollout-r38 .r38-editorial-natural > .r38-copy { order: 1; }
html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-natural > .r38-media::after,
html body.hero-rollout-r38.hero-rollout-r38 .r38-editorial-natural > .r38-media::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 24px;
  background: linear-gradient(to bottom, rgba(247,243,231,0), var(--cream, #f7f3e7));
  pointer-events: none;
}
/* Portraits remain full subject, and packshots retain their square/contain
   source treatment. A continuous cream field joins art and information. */
html body.hero-rollout-r38.hero-rollout-r38 .r38-portrait.r38-surface,
html body.hero-rollout-r38.hero-rollout-r38 .r38-sku.r38-surface,
html body.hero-rollout-r38.hero-rollout-r38 .r38-product-stage.r38-surface {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  align-items: center;
  padding: 28px max(5%, calc((100vw - 1280px) / 2)) 48px;
  background: linear-gradient(110deg, #f7f3e7, #f1f1e7 60%, #f7f3e7);
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-portrait > .r38-copy,
html body.hero-rollout-r38.hero-rollout-r38 .r38-sku > .r38-copy,
html body.hero-rollout-r38.hero-rollout-r38 .r38-product-stage > .r38-copy {
  padding: 32px clamp(24px, 4vw, 64px);
  background: transparent;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-portrait > .r38-portrait-media {
  order: 1;
  justify-self: center;
  width: 100%;
  max-width: 420px;
  margin: 0;
  border-radius: 0;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-portrait > .r38-copy { order: 0; }
html body.hero-rollout-r38.hero-rollout-r38 .r38-sku > .r38-sku-media {
  width: 100%;
  max-width: 580px;
  margin: 0 auto;
  border-radius: 0;
  --frame-fit: contain;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-product-stage.r38-product-stage > .r38-product-media.r38-product-media.r38-product-media {
  width: 100%;
  max-width: 580px;
  min-height: 0;
  margin: 0 auto;
  border-radius: 0;
  --frame-fit: contain;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-product-stage > .r38-product-media > img {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  max-height: none;
  object-fit: contain !important;
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-product-title.r38-surface,
html body.hero-rollout-r38.hero-rollout-r38 .r38-text.r38-surface {
  display: block;
  padding: 64px max(7%, calc((100vw - 960px) / 2)) 70px;
  background: linear-gradient(115deg, #f7f3e7 0%, #f1f1e7 72%, #f7f3e7 100%);
}
html body.hero-rollout-r38.hero-rollout-r38 .r38-product-title.r38-surface { padding-bottom: 28px; }
html body.hero-rollout-r38.hero-rollout-r38 .r38-product-title.r38-surface::after { content: none; }
/* Narrow screens use the approved homepage's safe stacking principle.
   No text is placed on photographs and no fixed-height crop is introduced. */
@media (max-width: 1000px) {
  html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-overlay.r38-surface {
    display: flex;
    flex-direction: column;
  }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-overlay > .r38-media { order: 0; }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-overlay > .r38-media::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 24px;
    background: linear-gradient(to bottom, rgba(247,243,231,0), var(--cream, #f7f3e7));
    pointer-events: none;
  }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-banner-overlay > .r38-copy {
    order: 1;
    width: 100%;
    padding: 26px 6% 46px;
    background: var(--cream, #f7f3e7);
  }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-surface .r38-copy { padding: 26px 6% 46px; }
}
@media (max-width: 760px) {
  html body.hero-rollout-r38.hero-rollout-r38 .r38-portrait.r38-surface,
  html body.hero-rollout-r38.hero-rollout-r38 .r38-sku.r38-surface,
  html body.hero-rollout-r38.hero-rollout-r38 .r38-product-stage.r38-surface {
    grid-template-columns: minmax(0, 1fr);
    padding: 24px 6% 36px;
  }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-portrait > .r38-portrait-media { order: 0; max-width: 340px; }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-portrait > .r38-copy { order: 1; }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-product-title.r38-surface,
  html body.hero-rollout-r38.hero-rollout-r38 .r38-text.r38-surface { padding: 36px 6% 48px; }
  html body.hero-rollout-r38.hero-rollout-r38 .r38-product-title.r38-surface { padding-bottom: 20px; }
}

/* R40: use the approved R37 homepage's visual frame, not image source ratio.
   The homepage is deliberately not opted in. Copy and specifications remain
   normal-flow content; a photo frame is not the combined photo + text section. */
html body.hero-dimensions-r40.hero-dimensions-r40 #main {
  container-type: inline-size;
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface.r38-surface {
  --r40-hero-height: 520px;
  width: 100cqw;
  max-width: none;
  margin-inline: calc(50% - 50cqw);
}
/* cqw measures the actual page width, excluding any desktop scrollbar, exactly
   as the homepage's full-width wrap does. No closer query containers exist. */
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface .r38-image-frame.r38-image-frame,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface .r38-portrait-media.r38-portrait-media,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface .r38-sku-media.r38-sku-media,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-product-stage.r38-product-stage > .r38-product-media.r38-product-media.r38-product-media {
  position: relative;
  inset: auto;
  display: grid;
  place-items: center;
  width: 100%;
  max-width: none;
  height: var(--r40-hero-height);
  min-height: 0;
  max-height: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  aspect-ratio: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  --frame-fit: contain;
  --frame-focus: 50% 50%;
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface .r38-image-frame.r38-image-frame > img,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface .r38-portrait-media.r38-portrait-media > img,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface .r38-sku-media.r38-sku-media > img,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-product-stage.r38-product-stage > .r38-product-media.r38-product-media.r38-product-media > img {
  position: absolute !important;
  inset: 0 !important;
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: auto;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  border-radius: 0;
}
/* Only the two already-reviewed right-subject photographs keep desktop copy
   over the left fade. Like home, this minimum can grow for unusually long copy. */
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay.r38-surface {
  min-height: var(--r40-hero-height);
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay > .r38-media {
  align-self: stretch;
  min-height: var(--r40-hero-height);
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay > .r38-media > .r38-image-frame.r38-image-frame {
  position: absolute;
  inset: 0;
  height: 100%;
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay > .r38-media > .r38-image-frame.r38-image-frame > img {
  object-position: 100% 50% !important;
}
/* Safe, reviewed kitchen photographs remain full-bleed at ordinary widths.
   The unusually wide desktop frame falls back to contain for story_kitchen
   rather than cropping its raised hand or the main bowl. */
@media (max-width: 1400px) {
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay > .r38-media > .r38-image-frame.r38-image-frame > img[src$="story_kitchen.jpeg"] {
    object-fit: cover !important;
  }
}
/* journal_kitchen contains a child at the right edge: keep it fully contained. */
/* This composition has a verified central vertical safe area for all three
   main subjects: soybeans, tofu, and the sauce bowl. */
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-editorial-natural > .r38-image-frame.r38-image-frame > img[src$="nl02-img-01.webp"] {
  object-fit: cover !important;
  object-position: 50% 44% !important;
}
/* A full-width framed visual comes first. Portrait identity, printed packaging
   and complete product compositions stay contained; long copy/specs stay below. */
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-portrait.r38-surface,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-sku.r38-surface,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-product-stage.r38-surface {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 0;
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-portrait > .r38-portrait-media,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-sku > .r38-sku-media,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-product-stage > .r38-product-media {
  order: 0;
  flex: none;
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-portrait > .r38-copy,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-sku > .r38-copy,
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-product-stage > .r38-copy {
  order: 1;
  width: 100%;
  padding: 34px max(6%, calc((100cqw - 960px) / 2)) 56px;
}
/* The existing product QA label is a separate 42px status band below the
   measured image frame, never over a printed label or part of frame height. */
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-product-stage.r38-product-stage > .r38-product-media.r38-product-media.r38-product-media {
  margin-bottom: 42px;
  overflow: visible;
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-product-stage.r38-product-stage > .r38-product-media.r38-product-media.r38-product-media::before {
  position: absolute;
  display: flex;
  align-items: center;
  top: 100%;
  left: 0;
  right: 0;
  width: 100%;
  max-width: none;
  min-height: 42px;
  margin: 0;
  padding: 8px max(6%, calc((100cqw - 960px) / 2));
  box-sizing: border-box;
  text-align: left;
}
/* Missing-image holds retain their original words, centered in the same frame.
   Text-only openings have no fabricated image or empty narrow-screen canvas. */
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-sku-media > .missing {
  position: static;
  width: 100%;
  height: auto;
  min-height: 0;
  max-width: 650px;
  padding: 24px;
  text-align: center;
}
html body.hero-dimensions-r40.hero-dimensions-r40 .r38-text.r38-surface {
  min-height: var(--r40-hero-height);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 1600px) {
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface.r38-surface {
    --r40-hero-height: 32.5vw;
  }
}
@media (max-width: 1150px) {
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface.r38-surface {
    --r40-hero-height: calc(100cqw * 7 / 16);
  }
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay.r38-surface {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay > .r38-media {
    order: 0;
    min-height: 0;
    height: var(--r40-hero-height);
    flex: none;
  }
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay > .r38-copy {
    order: 1;
    width: 100%;
    padding: 26px 6% 46px;
    background: var(--cream, #f7f3e7);
  }
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface .r38-copy {
    padding: 26px 6% 46px;
  }
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-text.r38-surface {
    min-height: 0;
  }
  /* Keep the proven R39 normal-flow controls, extended to the home breakpoint. */
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay[data-hero-slides] > .r38-copy {
    padding-bottom: 18px;
  }
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-banner-overlay[data-hero-slides] > .hero-controls {
    position: static;
    order: 2;
    align-self: stretch;
    justify-content: flex-end;
    width: auto;
    margin: 0;
    padding: 0 6% 34px;
  }
}
@media (max-width: 600px) {
  html body.hero-dimensions-r40.hero-dimensions-r40 .r38-surface.r38-surface {
    --r40-hero-height: calc(100cqw * 9 / 16);
  }
}

/* R46. Authoritative HOME composition, not the superseded split pilots.
   Only independently source-fit-checked routes opt in. The whole composition
   stops growing at1920x624; no photo-only enlargement behind fixed tiny copy.
   HOME itself does not load this file. The existing HOME medallion sources are reused unchanged. */
html body.hero-template-r46 #main {
  container-type: inline-size;
  background: #f7f3e7;
}
html body.hero-template-r46 #main .r46-primary-host {
  background: transparent;
  overflow: visible;
}
html body.hero-template-r46 #main .r46-hero.r46-hero {
  --r46-focus: 100% 50%;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  width: min(100cqw, 1920px);
  max-width: 1920px;
  min-height: clamp(520px, 32.5cqw, 624px);
  height: auto;
  margin: 0 calc(50% - min(50cqw, 960px));
  padding: 0;
  gap: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  isolation: isolate;
  overflow: hidden;
  background: #f7f3e7;
  color: #194832;
}
html body.hero-template-r46 #main .r46-hero.r46-hero::before,
html body.hero-template-r46 #main .r46-hero.r46-hero::after {
  content: none;
}
html body.hero-template-r46 #main .r46-hero[data-r46-primary-hero="/bai/j02"] { --r46-focus: 100% 90%; }
html body.hero-template-r46 #main .r46-hero[data-r46-primary-hero="/bai/k01"] { --r46-focus: 100% 75%; }
html body.hero-template-r46 #main .r46-hero[data-r46-primary-hero="/ve-loving"] { --r46-focus: 100% 45%; }
html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-media.r46-media {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  aspect-ratio: auto;
  align-self: stretch;
  background: transparent;
  overflow: hidden;
  z-index: -1;
}
html body.hero-template-r46 #main .r46-hero.r46-hero .r46-photo-frame.r46-photo-frame {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  aspect-ratio: auto;
  background: transparent;
}
html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-media.r46-media img {
  position: absolute !important;
  inset: 0 !important;
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  max-height: none;
  margin: 0;
  border-radius: 0;
  aspect-ratio: auto;
  object-fit: cover !important;
  object-position: var(--r46-focus) !important;
}
html body.hero-template-r46 #main .r46-hero.r46-hero .r46-photo-frame::before,
html body.hero-template-r46 #main .r46-hero.r46-hero .r46-photo-frame::after,
html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-media::before {
  content: none;
}
html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-media::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 32px;
  background: linear-gradient(to bottom, transparent, #f7f3e7);
  pointer-events: none;
  z-index: 1;
}
html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-copy.r46-copy {
  position: relative;
  inset: auto;
  grid-area: 1 / 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
  width: 51%;
  min-width: 0;
  max-width: 800px;
  margin: 0;
  padding: 36px clamp(30px, 5vw, 86px);
  padding-right: clamp(42px, 6vw, 104px);
  box-sizing: border-box;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, rgba(247,243,231,.98) 0%, rgba(247,243,231,.96) 66%, rgba(247,243,231,.84) 84%, rgba(247,243,231,0) 100%);
  color: #194832;
  z-index: 1;
}
html body.hero-template-r46 #main .r46-copy.r46-copy h1 {
  max-width: 510px;
  margin: 0 0 12px;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 32px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none;
  text-wrap: wrap;
  overflow-wrap: normal;
  word-break: normal;
  color: #194832;
}
html body.hero-template-r46 #main .r46-copy.r46-copy p {
  max-width: 510px;
  margin: 0;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: 0;
  color: #194832;
}
html body.hero-template-r46 #main .r46-copy.r46-copy > .eyebrow,
html body.hero-template-r46 #main .r46-copy.r46-copy > .tag,
html body.hero-template-r46 #main .r46-copy.r46-copy > .meta {
  margin: 0 0 9px;
  padding: 0;
  border: 0;
  background: transparent;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #194832;
}
html body.hero-template-r46 #main .r46-copy.r46-copy > .button {
  align-self: flex-start;
  width: auto;
  min-height: 0;
  margin: 20px 0 0;
  padding: 11px 20px;
}
html body.hero-template-r46 #main .r46-hero.r46-hero > .hero-controls {
  position: absolute;
  inset: auto 28px 28px auto;
  display: flex;
  width: auto;
  margin: 0;
  padding: 0;
  gap: 12px;
  align-items: center;
  z-index: 2;
}
html body.hero-template-r46 #main .r46-reading-intro {
  width: 100%;
  max-width: 960px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 30px 0 36px;
}
html body.hero-template-r46 #main .r46-reading-intro > .r42-intro,
html body.hero-template-r46 #main .r46-reading-intro > .r41-intro {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
}
html body.hero-template-r46 #main .r46-reading-intro p { margin: 0 0 16px; }
/* Demote, never hide or delete, the redundant original generic brand banner. */
html body.hero-template-r46 #main .r46-support-host {
  width: 100%;
  max-width: 1180px;
  box-sizing: border-box;
  margin: 32px auto;
  padding: 0 48px;
  background: transparent;
}
html body.hero-template-r46 #main .r46-support.r46-support {
  position: relative;
  display: grid;
  grid-template-columns: minmax(180px, 28%) minmax(0, 1fr);
  align-items: center;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 24px 0;
  gap: 28px;
  border: 0;
  border-top: 1px solid #d8dece;
  border-bottom: 1px solid #d8dece;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
html body.hero-template-r46 #main .r46-support.r46-support::after { content: none; }
html body.hero-template-r46 #main .r46-support.r46-support > .r46-support-media,
html body.hero-template-r46 #main .r46-support.r46-support > .r46-support-media > .r38-image-frame.r38-image-frame {
  position: relative;
  inset: auto;
  grid-area: auto;
  width: 100%;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  aspect-ratio: auto;
  background: transparent;
}
html body.hero-template-r46 #main .r46-support.r46-support img {
  position: static !important;
  inset: auto !important;
  display: block;
  width: 100% !important;
  height: auto !important;
  max-height: none;
  object-fit: contain !important;
}
html body.hero-template-r46 #main .r46-support.r46-support > .r46-support-copy {
  position: static;
  grid-area: auto;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
}
html body.hero-template-r46 #main .r46-support-copy h2 { margin: 8px 0 0; font-size: 24px !important; }
html body.hero-template-r46 #main .r46-source-hold.r46-source-hold {
  min-height: 0;
  padding: 28px 6%;
}
html body.hero-template-r46 #main .r46-source-hold.r46-source-hold > .r46-copy {
  width: 100%;
  max-width: 960px;
  margin: auto;
  padding: 0;
  background: transparent;
}
@media (max-width: 1150px) {
  /* HOME's approved narrow-screen fallback keeps copy away from the subject. */
  html body.hero-template-r46 #main .r46-hero.r46-hero { min-height: 0; }
  html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-media.r46-media {
    position: relative;
    inset: auto;
    grid-row: 1;
    height: auto;
    aspect-ratio: 16 / 7;
    z-index: 0;
  }
  html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-copy.r46-copy {
    grid-area: 2 / 1;
    width: 100%;
    max-width: none;
    padding: 16px 6% 24px;
    background: #f7f3e7;
  }
  html body.hero-template-r46 #main .r46-copy.r46-copy h1,
  html body.hero-template-r46 #main .r46-copy.r46-copy p { max-width: 700px; }
  html body.hero-template-r46 #main .r46-hero.r46-hero > .hero-controls {
    position: static;
    grid-area: 3 / 1;
    justify-content: flex-end;
    padding: 0 6% 24px;
    background: #f7f3e7;
  }
}
@media (max-width: 600px) {
  html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-media.r46-media { aspect-ratio: 16 / 9; }
  html body.hero-template-r46 #main .r46-support-host { padding-inline: 6%; }
  html body.hero-template-r46 #main .r46-support.r46-support { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  html body.hero-template-r46 #main .r46-support.r46-support > .r46-support-media { max-width: 320px; }
}

/* Exact approved HOME value row, including the original48px sprite crops. */
html body.hero-template-r46 #main .r46-copy.r46-copy .hero-values { display: flex; align-items: stretch; gap: 12px; max-width: none; margin-top: 24px; }
html body.hero-template-r46 #main .r46-copy.r46-copy .hero-values > div { display: flex; flex: 1; min-width: 0; flex-direction: column; align-items: flex-start; gap: 8px; }
html body.hero-template-r46 #main .r46-copy.r46-copy .hero-values .hero-medallion { display: block; flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; background-repeat: no-repeat; }
html body.hero-template-r46 #main .r46-copy.r46-copy .hero-value-plant { background-image: url('/assets/r23-optimized/r12/hero-value-plant.png.webp'); background-size: 53.74285714px 53.74285714px; background-position: -3px -3px; }
html body.hero-template-r46 #main .r46-copy.r46-copy .hero-value-flavor { background-image: url('/assets/r23-optimized/r12/hero-value-flavor.png.webp'); background-size: 62.7px 62.7px; background-position: -6.25px 0; }
html body.hero-template-r46 #main .r46-copy.r46-copy .hero-value-sustainable { background-image: url('/assets/r23-optimized/r12/hero-value-sustainable.png.webp'); background-size: 70.81411765px 70.81411765px; background-position: -9.88235294px 0; }
html body.hero-template-r46 #main .r46-copy.r46-copy .hero-values span { max-width: none; font-family: Arial, sans-serif !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.6 !important; letter-spacing: normal !important; overflow-wrap: normal; word-break: normal; }
@media (max-width:600px) { html body.hero-template-r46 #main .r46-copy.r46-copy .hero-values { gap: 10px; margin-top: 18px; } }

@media (max-width: 1150px) {
  /* Scale the same soft bottom effect on narrow photos so it does not wash
     away the principal dish; the exact desktop fade remains32px. */
  html body.hero-template-r46 #main .r46-hero.r46-hero > .r46-media::after { height: min(32px, 3cqw); }
}

/* R50 local Về Loving candidate. One original photo covers the whole stage.
   No R48 contain/blank-canvas prototype or query switch is reused.
   Desktop above1150px is byte-for-byte unaffected by these scoped rules. */
@media (max-width: 1150px) {
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-hero.r46-hero[data-r46-primary-hero="/ve-loving"] {
    min-height: clamp(400px, 52cqw, 480px);
    height: auto;
  }
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-hero.r46-hero > .r46-media.r46-media {
    position: absolute;
    inset: 0;
    grid-area: 1 / 1;
    height: 100%;
    aspect-ratio: auto;
    z-index: -1;
  }
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-hero.r46-hero > .r46-copy.r46-copy {
    grid-area: 1 / 1;
    width: 58%;
    max-width: none;
    padding: 28px 10% 76px 6%;
    justify-content: center;
    background: linear-gradient(90deg, rgba(247,243,231,.98) 0%, rgba(247,243,231,.96) 66%, rgba(247,243,231,.84) 84%, rgba(247,243,231,0) 100%);
  }
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-copy.r46-copy h1,
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-copy.r46-copy p { max-width: 510px; }
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-copy.r46-copy > .button {
    max-width: 100%;
    box-sizing: border-box;
    white-space: normal;
  }
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-hero.r46-hero > .hero-controls {
    position: absolute;
    inset: auto 6% 20px auto;
    grid-area: 1 / 1;
    width: auto;
    padding: 0;
    border-radius: 24px;
    background: rgba(247,243,231,.94);
  }
}
@media (max-width: 600px) {
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-hero.r46-hero[data-r46-primary-hero="/ve-loving"] { min-height: 340px; }
  html body.hero-template-r46.hero-mobile-overlay-r50 #main .r46-hero.r46-hero > .r46-copy.r46-copy {
    width: 100%;
    padding: 24px 6% 76px;
    background: linear-gradient(90deg, rgba(247,243,231,.96) 0%, rgba(247,243,231,.90) 62%, rgba(247,243,231,.76) 100%);
  }
}
/* Exact route-approved sources. Conditional rim fades await live visual QA. */
html body.hero-template-r46 #main .r46-hero[data-r46-primary-hero="/bai/k01"] { --r46-focus: 100% 80%; }
html body.hero-template-r46 #main .r46-hero[data-r46-primary-hero="/bai/j04"] { --r46-focus: 100% 60%; }

/* Scoped filled-slot media only. Existing frame height, margin, border width and radius remain unchanged. */
html body #main [data-article="K01"] .private-editorial-slot[data-image-slot="GB01-IMG-01"]{position:relative;overflow:hidden}
html body #main [data-article="K01"] .private-editorial-slot[data-image-slot="GB01-IMG-01"]>picture{position:absolute;inset:0;display:block}
html body #main [data-article="K01"] .private-editorial-slot[data-image-slot="GB01-IMG-01"]>picture>img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 80%}
@media(max-width:700px){html body #main [data-article="K01"] .private-editorial-slot[data-image-slot="GB01-IMG-01"]>picture>img{object-position:50% 60%}}

html body #main [data-article="J06"] .private-editorial-slot[data-image-slot="J06-IMG-01"]{position:relative;overflow:hidden}
html body #main [data-article="J06"] .private-editorial-slot[data-image-slot="J06-IMG-01"]>picture{position:absolute;inset:0;display:block}
html body #main [data-article="J06"] .private-editorial-slot[data-image-slot="J06-IMG-01"]>picture>img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 45%}
@media(max-width:700px){html body #main [data-article="J06"] .private-editorial-slot[data-image-slot="J06-IMG-01"]>picture>img{object-position:50% 50%}}

