.ev-hero{background:#EBDDC8; position:relative; overflow:hidden}
.ev-hero .inner{padding-block:60px 56px; text-align:center; max-width:800px; position:relative}
.ev-hero .mark{position:absolute; inset-inline-start:-60px; top:-40px; width:300px; opacity:.07; pointer-events:none}
.crumbs{font-size:.82rem; color:#6b604c; display:flex; gap:8px; margin-bottom:18px; justify-content:center}
.crumbs a{color:#6b604c; text-decoration:none} .crumbs a:hover{color:var(--gold)}
.ev-hero h1{font-size:clamp(2rem,4.2vw,2.9rem); line-height:1.3; margin-bottom:12px}
.ev-hero .lead{font-size:1.06rem; color:#4a4337; max-width:640px; margin-inline:auto}
.hero-stats{display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:30px}
.hs{display:flex; align-items:center; gap:12px; background:rgba(255,255,255,.6); border:1px solid rgba(178,141,74,.4); border-radius:999px; padding:8px 20px 8px 10px}
.hs strong{width:42px; height:42px; border-radius:50%; background:var(--olive); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.15rem; line-height:1}
.hs span{font-weight:700; font-size:.92rem; color:var(--olive)}
.triad{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; position:relative}
@media (max-width:860px){ .triad{grid-template-columns:1fr; max-width:520px; margin-inline:auto} }
.triad::before{content:""; position:absolute; top:44px; inset-inline:16%; height:1px; background:repeating-linear-gradient(to left, var(--gold) 0 6px, transparent 6px 12px)}
@media (max-width:860px){ .triad::before{display:none} }
.pillar{text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px; padding-inline:10px; position:relative}
.pillar .pi{width:88px; height:88px; border-radius:50%; background:var(--card-bg); border:1px solid rgba(178,141,74,.5); box-shadow:0 0 0 8px var(--off); color:var(--gold); display:flex; align-items:center; justify-content:center; transition:background .4s, color .4s, transform .5s cubic-bezier(.2,.7,.2,1)}
.pillar .pi svg{width:40px; height:40px}
.pillar:hover .pi{background:var(--gold); color:#fff; transform:scale(1.06)}
.pillar h3{font-size:1.15rem}
.pillar p{font-size:.93rem; opacity:.82; max-width:300px}
.grp{padding-block:72px; border-top:1px solid var(--border)}
.grp.alt{background:var(--sand); border-top:none}
.grp.dark{background:var(--olive); color:#F0ECDF; border-top:none}
.grp.dark h2,.grp.dark h3,.grp.dark b{color:#fff}
.g-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:56px; align-items:center}
@media (max-width:900px){ .g-grid{grid-template-columns:1fr; gap:36px} }
@media (min-width:901px){ .g-grid.rev > .g-viz{order:-1} }
.g-head{display:flex; align-items:center; gap:14px; margin-bottom:14px}
.g-num{font-family:'Cormorant Garamond',serif; font-size:2.6rem; line-height:1; color:var(--gold); direction:ltr}
.g-ic{width:52px; height:52px; border-radius:50%; border:1px solid rgba(178,141,74,.55); color:var(--gold); display:flex; align-items:center; justify-content:center; flex:none}
.g-ic svg{width:26px; height:26px}
.g-txt h2{font-size:clamp(1.5rem,3vw,2rem); line-height:1.4}
.g-txt .g-sub{color:var(--gold); font-weight:700; font-size:.92rem; margin-top:4px; display:block}
.grp.dark .g-sub{color:var(--sand)}
.g-txt > p{margin-top:16px; opacity:.88}
.outs{list-style:none; margin:20px 0 0; padding:0; display:flex; flex-direction:column; gap:12px}
.outs li{display:grid; grid-template-columns:30px minmax(0,1fr); gap:12px; align-items:start; line-height:1.75}
.outs li::before{content:""; width:22px; height:22px; margin-top:3px; border-radius:50%; background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 12.5 3.2 3.2L17 9'/%3E%3C/svg%3E") center/14px no-repeat}
.outs b{display:block}
.outs span{font-size:.92rem; opacity:.82}
.in-prod{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:22px; font-size:.86rem}
.in-prod a{border:1px solid rgba(178,141,74,.5); color:var(--olive); border-radius:999px; padding:5px 14px; font-weight:700; text-decoration:none; transition:background .2s,color .2s}
.in-prod a:hover{background:var(--gold); color:#fff; border-color:var(--gold)}
.grp.dark .in-prod a{color:var(--sand); border-color:rgba(234,220,198,.4)}
.comp-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px}
.comp-chips span{direction:ltr; background:var(--off); border:1px solid var(--border); border-radius:3px; padding:5px 10px; font-size:.82rem}
.viz-card{background:var(--card-bg); border:1px solid var(--border); border-radius:4px; padding:28px; position:relative}
.viz-cap{display:block; text-align:center; font-size:.8rem; opacity:.65; margin-top:12px}
/* 01 flow */
.flow{display:flex; flex-direction:column; gap:0; position:relative}
.flow-step{display:grid; grid-template-columns:60px minmax(0,1fr); gap:16px; align-items:center; padding-block:14px}
.flow-step .fi{width:60px; height:60px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff}
.flow-step .fi svg{width:28px; height:28px}
.flow-step b{display:block; font-size:.86rem; color:var(--gold)}
.flow-step p{font-size:.98rem; line-height:1.7}
.flow-arrow{width:2px; height:26px; margin-inline-start:29px; background:linear-gradient(var(--greige),var(--gold)); position:relative}
.flow-arrow::after{content:""; position:absolute; bottom:-4px; inset-inline-start:-4px; border:5px solid transparent; border-top-color:var(--gold)}
/* 02 fatty acids */
.fa{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px}
@media (max-width:520px){ .fa{grid-template-columns:repeat(3,minmax(0,1fr))} }
.hex{aspect-ratio:1/1.1; clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); background:var(--sand); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; transition:background .3s, transform .4s}
.hex:hover{background:var(--gold); color:#fff; transform:translateY(-4px)}
.hex strong{direction:ltr; font-size:.95rem}
.hex span{font-size:.72rem; opacity:.85}
.unsap{margin-top:18px; display:flex; gap:12px; align-items:center; background:var(--olive); color:#F0ECDF; border-radius:4px; padding:14px 16px; font-size:.9rem}
.unsap .g-ic{border-color:rgba(234,220,198,.4); color:var(--sand); width:44px; height:44px}
.unsap b{color:#fff; display:block}
/* 03 wheel */
.wheel{position:relative; aspect-ratio:1/1; max-width:460px; margin-inline:auto}
.wheel .ring{position:absolute; inset:14%; border-radius:50%; border:1px dashed rgba(178,141,74,.6)}
.wheel .core{position:absolute; inset:31%; border-radius:50%; background:var(--olive); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; text-align:center; padding:8px}
.wheel .core span{font-size:clamp(.72rem,1.6vw,.86rem); font-weight:700; background:rgba(255,255,255,.12); border-radius:999px; padding:3px 10px; line-height:1.5}
.wheel .core small{font-size:.7rem; opacity:.75}
.plant{position:absolute; width:22%; display:flex; flex-direction:column; align-items:center; gap:4px; transform:translate(-50%,-50%); text-align:center}
.plant img{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:50%; box-shadow:0 0 0 4px #fff, 0 0 0 5px rgba(178,141,74,.45); transition:transform .4s}
.plant:hover img{transform:scale(1.08)}
.plant span{font-size:clamp(.66rem,1.4vw,.78rem); font-weight:700; color:var(--olive); line-height:1.35; background:rgba(234,220,198,.9); border-radius:3px; padding:1px 5px}
/* 04 study */
.st-nums{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
.st{background:rgba(255,255,255,.06); border:1px solid rgba(240,236,223,.16); border-radius:4px; padding:18px 16px; text-align:center}
.st .g-ic{margin:0 auto 10px; border-color:rgba(234,220,198,.4); color:var(--sand); width:46px; height:46px}
.st strong{display:block; font-size:clamp(1.7rem,3vw,2.2rem); color:var(--sand); line-height:1.15}
.st span{font-size:.84rem; opacity:.85}
.st-res{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px}
.sr{border:1px solid rgba(240,236,223,.16); border-radius:4px; padding:16px}
.sr b{display:flex; align-items:center; justify-content:space-between; gap:8px; color:#fff}
.sr .up{background:var(--gold); color:#fff; font-size:.76rem; border-radius:999px; padding:2px 10px}
.sr p{font-size:.84rem; opacity:.8; margin-top:4px}
.sr svg.wave{width:100%; height:48px; margin-top:10px; display:block}
.grp.dark .viz-cap{color:#F0ECDF}
/* 05 chart */
.chart svg{width:100%; height:auto; display:block}
.legend{display:flex; flex-wrap:wrap; gap:16px; justify-content:center; margin-top:12px; font-size:.86rem}
.legend span{display:inline-flex; align-items:center; gap:8px}
.legend i{width:22px; height:4px; border-radius:2px; display:inline-block}
.two-lists{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:18px}
@media (max-width:520px){ .two-lists{grid-template-columns:1fr} }
.two-lists > div{background:var(--card-bg); border:1px solid var(--border); border-radius:4px; padding:14px 16px}
.two-lists b{font-size:.9rem}
.two-lists p{font-size:.84rem; opacity:.85; margin-top:4px; line-height:1.8}
/* 06 vitamins */
.vit-pair{display:grid; grid-template-columns:1fr 1fr; gap:16px}
@media (max-width:520px){ .vit-pair{grid-template-columns:1fr} }
.vit{background:var(--card-bg); border:1px solid var(--border); border-radius:4px; padding:22px; display:flex; flex-direction:column; gap:10px; transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease, border-color .45s}
.vit:hover{transform:translateY(-6px); box-shadow:0 26px 50px -28px rgba(60,45,20,.45); border-color:rgba(178,141,74,.55)}
.vit .vl{width:64px; height:64px; border-radius:50%; background:var(--gold); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.6rem; font-weight:700; font-family:'Cormorant Garamond',serif; line-height:1}
.vit.e .vl{background:var(--olive)}
.vit b{font-size:1.05rem}
.vit small{direction:ltr; display:block; text-align:right; opacity:.7; font-size:.8rem}
.vit p{font-size:.9rem; opacity:.85; line-height:1.8}
.vit-link{grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:10px; font-size:.86rem; font-weight:700; color:var(--olive)}
.vit-link::before,.vit-link::after{content:""; flex:1; height:1px; background:rgba(178,141,74,.5)}
.caution{display:flex; gap:10px; margin-top:18px; background:#FBF8F2; border:1px solid rgba(178,141,74,.5); border-radius:4px; padding:14px 16px; font-size:.88rem; line-height:1.8}
.caution svg{width:20px; height:20px; color:var(--gold); flex:none; margin-top:3px}
/* matrix */
.mx-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:4px; background:var(--card-bg)}
table.mx{width:100%; min-width:640px; border-collapse:collapse; font-size:.92rem}
.mx th,.mx td{padding:14px 16px; border-bottom:1px solid var(--border); text-align:center}
.mx thead th{background:var(--olive); color:#fff; font-weight:700}
.mx tbody th{text-align:right; font-weight:700; background:var(--off)}
.mx tbody th small{display:block; font-weight:400; opacity:.7; font-size:.8rem}
.mx tr:last-child th,.mx tr:last-child td{border-bottom:none}
.dot{display:inline-block; width:16px; height:16px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px rgba(178,141,74,.18)}
.nodot{display:inline-block; width:16px; height:2px; background:var(--greige)}
.mx tbody tr{transition:background .2s} .mx tbody tr:hover td{background:#FBF8F2}
/* quality */
.q-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px}
@media (max-width:900px){ .q-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:480px){ .q-grid{grid-template-columns:1fr} }
.q{text-align:center; padding:22px 16px; border:1px solid var(--border); border-radius:4px; background:var(--card-bg); display:flex; flex-direction:column; align-items:center; gap:8px}
.q .g-ic{width:56px; height:56px}
.q b{font-size:.98rem}
.q span{font-size:.86rem; opacity:.8}
.ev-cta{background:#EBDDC8; text-align:center}
.ev-cta h2{font-size:clamp(1.5rem,3vw,2rem)}
.ev-cta p{opacity:.82; margin-top:10px}
.ev-cta .cta-row{justify-content:center; margin-top:22px}
.ev-cta .btn-ghost{color:var(--olive); border-color:rgba(65,82,31,.45)}
.disclaimer{font-size:.82rem; opacity:.7; text-align:center; margin-top:28px; max-width:760px; margin-inline:auto}
@media (prefers-reduced-motion:reduce){ .pillar .pi,.hex,.plant img,.vit{transition:none} .vit:hover,.hex:hover{transform:none} }