/* XANMI C+A v8 — edition for Hakkaisan-inspired experiential storytelling.
 * All animation values are XANMI PROPOSALS, NOT copied Hakkaisan metrics.
 * Official BIOFOOD logo tokens remain unchanged. */
:root { --v8-violet:#70517F; --v8-lavender:#E7DDED; --v8-paper:#FBFAF7;--v8-cream:#F7F4EE;
 --v8-ink:#29252E;--v8-gold:#C9AF49; --v8-text:#5D5262; --v8-ease:cubic-bezier(.22,1,.36,1);
 --v8-gutter:clamp(24px,6.5vw,110px); --v8-head:'Comfortaa','Trebuchet MS',sans-serif;
 --v8-th:'IBM Plex Sans Thai','Noto Sans Thai',Tahoma,sans-serif;
}
/* Simpler, relaxed header and prevent all page-specific overflowing images */
body {overflow-x:clip;} main{min-width:0;} img {height:auto;}
html[lang='th'] .v8-product-copy,html[lang='th'] .v8-rice-copy,
html[lang='th'] .v8-character-copy,html[lang='th'] .v8-story-statement,
html[lang='th'] .v8-ritual,html[lang='th'] .v8-facts-wrap {font-family:var(--v8-th)}
.v8-kicker{font:600 10px/1.55 var(--v8-head);letter-spacing:.18em;color:var(--v8-violet);margin:0 0 22px}
.v8-product-intro{display:grid;grid-template-columns:51% 49%;min-height:720px;background:var(--v8-paper);}
.v8-product-copy{padding:100px 7vw 85px var(--v8-gutter);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0}
.v8-product-copy h1{font:500 clamp(46px,5.5vw,92px)/1.16 var(--v8-head);letter-spacing:-.075em;color:var(--v8-ink);margin:0 0 21px;overflow-wrap:anywhere}
.v8-ideogram{display:block;font-family:var(--v8-th);font-size:clamp(34px,3.4vw,59px);letter-spacing:.02em;font-weight:400;color:#977BAA;margin:8px 0}
.v8-subtitle{font:500 clamp(13px,1.4vw,18px)/1.7 var(--v8-head);color:var(--v8-violet);margin:0 0 36px;max-width:550px}
.v8-hero-lead{font-size:clamp(19px,2vw,27px);line-height:1.66;color:#4D4050;font-weight:500;margin:0 0 15px;max-width:510px}
.v8-product-copy>p:not(.v8-subtitle):not(.v8-hero-lead){font-size:14px;max-width:530px;color:#655E68;line-height:2.1}
.v8-spec-line{display:flex;flex-wrap:wrap;gap:10px 27px;margin:36px 0 25px;padding-top:18px;border-top:1px solid #D8CCDD;font:600 10px var(--v8-head);letter-spacing:.05em;color:#76627C}
.v8-link-cta{display:inline-flex;align-items:center;gap:35px;padding:12px 0;color:var(--v8-violet);border-bottom:1px solid #B89DC4;font-weight:600;font-size:13px;transition:gap .35s var(--v8-ease),color .3s}
.v8-link-cta:hover{gap:45px;color:var(--color-brand-blue)}
.v8-product-art{position:relative;background:radial-gradient(circle at 46% 35%,#FBF8FF 0%,#E8DDEC 45%,#D4C2E0 100%);min-height:720px;display:grid;place-items:center;isolation:isolate;overflow:hidden}
.v8-product-halo{position:absolute;border-radius:50%;border:1px solid #ffffff91;width:75%;aspect-ratio:1;max-width:620px;}
.v8-product-art>img{position:relative;height:min(70vh,610px);width:auto;max-width:54%;object-fit:contain;filter:drop-shadow(26px 29px 25px rgba(66,43,74,.24));z-index:1;transform:rotate(-4deg)}
.v8-media-caption{position:absolute;bottom:28px;right:27px;font:600 10px var(--v8-head);letter-spacing:.12em;color:#7D6D89}
.v8-story-statement{padding:clamp(100px,14vw,190px) var(--v8-gutter);text-align:center;background:#FFFEFC;min-height:520px;display:flex;justify-content:center;align-items:center}
.v8-story-statement>div{max-width:780px;margin:auto}
.v8-story-statement h2{font:500 clamp(30px,4vw,60px)/1.55 var(--v8-th);color:#57405E;margin:0 0 26px;white-space:pre-line;letter-spacing:normal}
.v8-story-statement p:not(.v8-kicker){font-size:clamp(15px,1.5vw,19px);line-height:2.25;color:#756E76;max-width:690px;margin:0 auto}
.v8-rice-story{display:grid;grid-template-columns:52% 48%;min-height:680px;background:#F5F1F8}
.v8-rice-art{min-height:620px;overflow:hidden;display:flex;background:#E6DCEC}
.v8-rice-art img{width:100%;height:100%;object-fit:cover;min-height:620px}
.v8-rice-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:80px var(--v8-gutter);min-width:0}
.v8-rice-copy h2{font:500 clamp(32px,4.5vw,64px)/1.3 var(--v8-head);color:#44324E;letter-spacing:-.055em;margin:0 0 25px}
.v8-rice-copy h2 em{font-style:normal;color:#A086B4}
.v8-rice-copy p:not(.v8-kicker){color:#65586A;font-size:16px;line-height:2.15;max-width:470px}
.v8-ritual{background:#3E3046;color:#FFF;padding:clamp(85px,10vw,145px) var(--v8-gutter);}
.v8-ritual-heading{text-align:center;max-width:900px;margin:0 auto 65px}
.v8-ritual .v8-kicker{color:#D8BDE6}
.v8-ritual h2{font:500 clamp(33px,5.3vw,76px)/1.42 var(--v8-head);color:#FFF;letter-spacing:-.064em;margin:0 0 15px}
.v8-ritual h2 span{color:#C6A9D5}
.v8-ritual-heading>p:not(.v8-kicker){font-size:19px;color:#EFE1F1}
.v8-ritual-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;max-width:1250px;margin:auto}
.v8-ritual-steps article{padding:24px 0 0;border-top:1px solid #8C778F;min-width:0}
.v8-step-index{font:500 12px var(--v8-head);color:#D8BDE6;margin-bottom:23px}
.v8-ritual-steps h3{font:600 clamp(18px,2.1vw,28px)/1.5 var(--v8-head);color:#FFF;margin:0 0 13px}
html[lang='th'] .v8-ritual-steps h3{font-family:var(--v8-th)}
.v8-ritual-steps article:nth-child(n+2) h3{font-family:var(--v8-head)}
.v8-ritual-steps p{font-size:14px;line-height:2.0;color:#E1D6E4;margin:0}
.v8-ritual-note{font-size:13px;line-height:2.1;color:#CABED0;max-width:850px;margin:60px auto 0;padding-top:25px;border-top:1px solid #84708B;text-align:center}
.v8-character{display:grid;grid-template-columns:1fr 1fr;min-height:615px;background:#F9F7F4}
.v8-character-copy{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:90px var(--v8-gutter)}
.v8-character h2{font:500 clamp(29px,3.5vw,55px)/1.55 var(--v8-th);color:#44334C;white-space:pre-line;letter-spacing:normal;margin:0 0 26px}
html[lang='en'] .v8-character h2,html[lang='en'] .v8-story-statement h2,html[lang='en'] .v8-next h2{font-family:var(--v8-head);line-height:1.5;letter-spacing:-.04em}
.v8-character-copy p:not(.v8-kicker){font-size:16px;line-height:2;color:#685D6C;max-width:540px}
.v8-character-art{display:flex;justify-content:center;align-items:center;background:linear-gradient(155deg,#D7C7E0,#EBE4F0);padding:55px}
.v8-character-art img{max-height:480px;width:auto;object-fit:contain;filter:drop-shadow(15px 16px 18px #55456b22)}
.v8-product-facts{background:#FBFAF7;padding:110px var(--v8-gutter) 60px}
.v8-facts-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:6vw;max-width:1250px;margin:auto}
.v8-facts-head h2{font:500 clamp(37px,5vw,70px)/1.4 var(--v8-head);letter-spacing:-.07em;color:#4D3E58;margin:0 0 16px}
.v8-facts-head h2 span{color:#997BAA}
.v8-facts-head>p:not(.v8-kicker){max-width:350px;font-size:14px;line-height:2}
.v8-facts-list>div{display:grid;grid-template-columns:36% 64%;gap:10px;border-top:1px solid #DED6E1;padding:19px 10px 19px 0;align-items:start}
.v8-facts-list dt{font-weight:600;font-size:13px;color:#63546C}
.v8-facts-list dd{margin:0;font-size:14px;color:#4B4750;line-height:1.9;overflow-wrap:anywhere}
.v8-safety-note{max-width:1250px;margin:40px auto 0;font-size:11px;line-height:2;color:#827B85;border-top:1px solid #E2DBE5;padding-top:22px}
.v8-next{background:#E8DDED;min-height:540px;padding:100px var(--v8-gutter);display:grid;place-items:center;text-align:center}
.v8-next>div{max-width:850px}
.v8-next h2{font:500 clamp(31px,4.5vw,59px)/1.5 var(--v8-th);white-space:pre-line;color:#4F3B5D;margin:0 0 22px}
.v8-next p:not(.v8-kicker){font-size:15px;color:#6B5A72;line-height:2;max-width:610px;margin:0 auto 30px}
.v8-next-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.v8-next-actions a{font-size:12px;border:1px solid #B89BC7;color:#604974;padding:13px 18px;transition:background-color .25s,color .25s}
.v8-next-actions a:hover{background:#654E7A;color:white}
.v8-home-ritual{background:#3E3046;color:white;padding:90px var(--v8-gutter);overflow:hidden}
.v8-home-ritual-inner{max-width:1180px;margin:auto;display:grid;grid-template-columns:1.4fr .6fr;gap:60px;align-items:center}
.v8-home-ritual .v8-kicker{color:#D5BDE2}
.v8-home-ritual h2{font:500 clamp(44px,5vw,72px)/1.27 var(--v8-head);margin:0 0 22px;color:white;letter-spacing:-.06em}
.v8-home-ritual h2 span{color:#C6A5D6}
.v8-home-ritual p:not(.v8-kicker){font-size:15px;line-height:2;color:#E3DAE7;max-width:540px}
.v8-home-ritual .v8-link-cta{color:#EBD8F5;border-bottom-color:#B697CC}
.v8-home-ritual-symbol{font-size:clamp(120px,16vw,235px);line-height:.86;color:#ffffff10;text-align:center;display:flex;gap:0;font-weight:300}
@media(max-width:930px){.v8-product-intro{grid-template-columns:1fr 1fr}.v8-product-art{min-height:590px}.v8-product-copy{padding:65px 6vw}.v8-product-art>img{max-height:490px}.v8-rice-copy{padding:50px 6vw}.v8-character-copy{padding:50px 6vw}}
@media(max-width:720px){.v8-product-intro,.v8-rice-story,.v8-character,.v8-facts-wrap,.v8-home-ritual-inner{grid-template-columns:1fr}.v8-product-art{grid-row:1;min-height:420px;max-height:480px}.v8-product-art>img{height:390px;max-width:48%}.v8-product-copy{padding:45px 7vw 60px}.v8-product-copy h1{font-size:clamp(43px,10vw,68px)}.v8-ideogram{font-size:39px}.v8-hero-lead{font-size:21px}.v8-story-statement{padding:100px 7vw;min-height:490px}.v8-rice-art,.v8-rice-art img{min-height:360px;max-height:470px}.v8-rice-copy{padding:70px 7vw 80px}.v8-ritual{padding:80px 7vw}.v8-ritual-steps{grid-template-columns:1fr;gap:22px}.v8-ritual-steps article{padding-top:15px}.v8-ritual-heading{margin-bottom:40px}.v8-ritual h2{font-size:clamp(31px,7vw,49px)}.v8-ritual-note{margin-top:40px}.v8-character-copy{padding:75px 7vw}.v8-character-art{min-height:390px;padding:30px}.v8-character-art img{max-height:340px}.v8-product-facts{padding:75px 7vw}.v8-facts-head h2{font-size:45px}.v8-next{padding:80px 7vw}.v8-home-ritual{padding:72px 7vw}.v8-home-ritual-symbol{display:none}}
@media(max-width:440px){.v8-product-art{min-height:340px}.v8-product-art>img{height:300px;max-width:55%}.v8-product-copy{padding-top:35px}.v8-product-copy h1{font-size:42px}.v8-spec-line{gap:9px 15px;font-size:9px}.v8-facts-list>div{grid-template-columns:1fr;gap:3px}.v8-rice-copy h2{font-size:32px}}
@media(prefers-reduced-motion:reduce){.v8-link-cta,.v8-next-actions a{transition:none!important}}
