/* Compact retail destinations, with a single coordinated entrance. */
.brand-promises.home-promises { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:24px; margin-bottom:24px; }
.home-promises>a.promise-card { --promise-accent:#789985; --promise-delay:0ms; display:grid; grid-template-columns:54px minmax(0,1fr) 22px; grid-template-rows:auto; align-items:center; gap:14px; position:relative; min-width:0; min-height:106px; padding:18px; border:1px solid #dfe6df; border-radius:9px; background:#fff; color:var(--ink); isolation:isolate; text-decoration:none; transition:border-color 250ms,background-color 250ms,box-shadow 350ms; }
.home-promises>a.promise-origins { --promise-accent:#d88c75; --promise-delay:70ms; border-color:#ecdcd4; background:#fffaf7; }
.home-promises>a.promise-science { --promise-delay:140ms; }
.home-promises>a.promise-card::after { content:""; position:absolute; inset:auto 18px 0; height:2px; background:var(--promise-accent); opacity:0; transform:scaleX(0); transform-origin:left; transition:transform 600ms cubic-bezier(.22,1,.36,1),opacity 250ms; pointer-events:none; }
.home-promises .promise-index { display:none; }
.home-promises .promise-visual { grid-area:1/1; display:block; flex:none; width:54px; height:54px; margin:0; pointer-events:none; }
.home-promises .promise-visual svg { display:block; width:100%; height:100%; overflow:visible; fill:none; stroke:#526b5b; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.home-promises .promise-visual .art-wash { display:none; }
.home-promises .promise-visual .art-paper { fill:#fff; }
.home-promises .promise-visual .art-mint { fill:#f2f6f1; }
.home-promises .promise-visual .art-coral { fill:#d98a73; stroke:#d98a73; }
.home-promises .promise-visual .art-fine { stroke:#9eb4a4; stroke-width:1; }
.home-promises .promise-visual .art-quiet { stroke:#b7c7ba; stroke-width:1; }
.home-promises .promise-original .art-trace,.home-promises .promise-origins .art-trace { opacity:.45; stroke-dasharray:2 6; }
.home-promises .promise-visual text { font:650 10px var(--sans); letter-spacing:.2px; fill:#48604f; stroke:none; text-anchor:middle; }
.home-promises .promise-copy { grid-area:1/2; display:block; min-width:0; }
.home-promises .promise-copy strong { display:block; color:#23352b; font-size:15.5px; font-weight:650; letter-spacing:-.25px; line-height:1.35; text-wrap:initial; }
.home-promises .promise-copy small { display:block; max-width:36ch; margin-top:4px; color:#6a746d; font-size:11.5px; font-weight:400; line-height:1.5; }
.home-promises .promise-arrow { grid-area:1/3; align-self:center; justify-self:end; display:grid; place-items:center; width:22px; height:28px; border:0; border-radius:0; background:none; color:#647c6a; transition:color 250ms; }
.home-promises .promise-arrow svg { display:block; width:17px; height:17px; transform:none; transition:transform 550ms cubic-bezier(.22,1,.36,1); }
.home-promises .art-package,.home-promises .art-country,.home-promises .art-orbits { transform-box:fill-box; transform-origin:center; transition:transform 700ms cubic-bezier(.22,1,.36,1); }
.home-promises .art-country { transition-delay:var(--art-delay,0ms); }
.home-promises>a.promise-card:focus-visible { border-color:#8ca692; background:#fbfcfa; }
.home-promises>a:focus-visible::after { opacity:.75; transform:scaleX(1); }
.home-promises>a:focus-visible .promise-arrow { color:#294d36; }
.home-promises>a:focus-visible .promise-arrow svg { transform:translateX(3px); }
@media(hover:hover) {
 .home-promises>a.promise-card:hover { border-color:#aebfb1; background:#fbfcfa; box-shadow:0 5px 15px -12px #183e2c45; }
 .home-promises>a.promise-origins:hover { border-color:#dcae99; background:#fff7f1; }
 .home-promises>a:hover::after { opacity:.75; transform:scaleX(1); }
 .home-promises>a:hover .promise-arrow { color:#294d36; }
 .home-promises>a:hover .promise-arrow svg { transform:translateX(3px); }
 .home-promises>a:hover .art-package { transform:translateY(-3px) rotate(-4deg); }
 .home-promises>a:hover .art-country-kr { transform:translate(-4px,-3px); }
 .home-promises>a:hover .art-country-jp { transform:translate(4px,-3px); }
 .home-promises>a:hover .art-country-cn { transform:translateY(4px); }
 .home-promises>a:hover .art-orbits { transform:rotate(28deg); }
}
.home-promises.promise-reveal-ready:not(.is-revealed)>a { opacity:0; translate:0 8px; }
.home-promises.is-animating>a { animation:promise-arrive 650ms cubic-bezier(.22,1,.36,1) var(--promise-delay) both; }
.home-promises.is-animating>a::after { animation:promise-rule 1400ms cubic-bezier(.22,1,.36,1) var(--promise-delay) both; }
.home-promises.is-animating .promise-copy { animation:promise-copy 700ms cubic-bezier(.22,1,.36,1) calc(var(--promise-delay) + 70ms) both; }
.home-promises.is-animating .promise-arrow { animation:promise-direction 850ms cubic-bezier(.22,1,.36,1) calc(var(--promise-delay) + 160ms) both; }
.home-promises.is-animating .art-package { animation:promise-package 1100ms cubic-bezier(.22,1,.36,1) var(--promise-delay) both; }
.home-promises.is-animating .art-country { animation:promise-country 1050ms cubic-bezier(.22,1,.36,1) calc(var(--promise-delay) + var(--art-delay,0ms)) both; }
.home-promises.is-animating .art-orbits { animation:promise-orbit 1250ms cubic-bezier(.22,1,.36,1) var(--promise-delay) both; }
.home-promises.is-animating .art-trace { animation:promise-trace 1200ms ease-out calc(var(--promise-delay) + 100ms) both; stroke-dasharray:400; }
@keyframes promise-arrive { from{opacity:0;translate:0 8px} to{opacity:1;translate:0 0} }
@keyframes promise-copy { from{opacity:0;translate:0 3px} to{opacity:1;translate:0 0} }
@keyframes promise-direction { from{opacity:0;translate:-7px 0} to{opacity:1;translate:0 0} }
@keyframes promise-rule { 0%{opacity:0;transform:scaleX(0)} 45%{opacity:.65;transform:scaleX(1)} 100%{opacity:0;transform:scaleX(1)} }
@keyframes promise-package { from{transform:translateY(-9px) rotate(-8deg)} to{transform:translateY(0) rotate(0)} }
@keyframes promise-country { from{opacity:0;transform:scale(.78)} to{opacity:1;transform:scale(1)} }
@keyframes promise-orbit { from{opacity:.1;transform:rotate(-35deg)} to{opacity:1;transform:rotate(0)} }
@keyframes promise-trace { from{stroke-dashoffset:400} to{stroke-dashoffset:0} }
@media(max-width:1100px) and (min-width:761px) {
 .brand-promises.home-promises { gap:10px; }
 .home-promises>a.promise-card { grid-template-columns:44px minmax(0,1fr) 18px; gap:10px; padding:16px 14px; min-height:108px; }
 .home-promises .promise-visual { width:44px; height:44px; }
 .home-promises .promise-copy strong { font-size:14.5px; letter-spacing:-.2px; }
 .home-promises .promise-copy small { font-size:11px; }
 .home-promises .promise-arrow { width:18px; }
 .home-promises .promise-arrow svg { width:15px; height:15px; }
}
@media(max-width:760px) {
 .brand-promises.home-promises { grid-template-columns:minmax(0,1fr); gap:0; margin-top:18px; margin-bottom:20px; }
 .home-promises>a.promise-card { grid-template-columns:40px minmax(0,1fr) 18px; gap:13px; min-height:88px; padding:12px 14px; border-radius:0; border-color:#e2e7e1; border-bottom-width:0; background:#fff; }
 .home-promises>a.promise-card:first-child { border-radius:9px 9px 0 0; }
 .home-promises>a.promise-card:last-child { border-radius:0 0 9px 9px; border-bottom-width:1px; }
 .home-promises>a.promise-origins { background:#fffcfa; }
 .home-promises>a.promise-card::after { left:14px; right:14px; height:1px; }
 .home-promises .promise-visual { width:40px; height:40px; }
 .home-promises .promise-copy strong { font-size:12.5px; font-weight:650; letter-spacing:-.1px; line-height:1.35; }
 .home-promises .promise-copy small { max-width:42ch; margin-top:3px; font-size:11px; line-height:1.45; }
 .home-promises .promise-arrow { width:18px; height:24px; }
 .home-promises .promise-arrow svg { width:15px; height:15px; }
}
@media(max-width:380px) {
 .home-promises>a.promise-card { grid-template-columns:36px minmax(0,1fr) 16px; gap:10px; padding-inline:12px; min-height:86px; }
 .home-promises .promise-visual { width:36px; height:36px; }
 .home-promises .promise-copy strong { font-size:12.2px; }
 .home-promises .promise-copy small { font-size:10.7px; }
 .home-promises .promise-arrow { width:16px; }
}
.store-reduced-motion .home-promises>a,
.store-reduced-motion .home-promises>a::after,
.store-reduced-motion .home-promises :is(.promise-copy,.promise-arrow,.promise-arrow svg,.promise-visual *) { animation:none!important; transition:none!important; }
.store-reduced-motion .home-promises>a,.store-reduced-motion .home-promises>a::after,
.store-reduced-motion .home-promises :is(.promise-copy,.promise-arrow,.promise-arrow svg,.art-package,.art-country,.art-orbits) { translate:none!important; transform:none!important; }
.store-reduced-motion .home-promises>a,.store-reduced-motion .home-promises :is(.promise-copy,.promise-arrow,.art-country,.art-orbits) { opacity:1!important; }
.store-reduced-motion .home-promises .art-trace { stroke-dasharray:none!important; stroke-dashoffset:0!important; }
@media(prefers-reduced-motion:reduce) {
 .home-promises>a,.home-promises>a::after,.home-promises :is(.promise-copy,.promise-arrow,.promise-arrow svg,.promise-visual *) { animation:none!important; transition:none!important; }
 .home-promises>a,.home-promises>a::after,.home-promises :is(.promise-copy,.promise-arrow,.promise-arrow svg,.art-package,.art-country,.art-orbits) { translate:none!important; transform:none!important; }
 .home-promises>a,.home-promises :is(.promise-copy,.promise-arrow,.art-country,.art-orbits) { opacity:1!important; }
 .home-promises .art-trace { stroke-dasharray:none!important; stroke-dashoffset:0!important; }
}
