/* Soo:Tree v2: design from the approved mock-up (brandbook style).
   All classes are prefixed v- so the older inner-page styles (main.css) never collide. */
.v-site, .v-lp, .v-foot, .v-site *, .v-lp *, .v-foot * { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.v2-lp { background: var(--v-grey); color: var(--v-black); font-family: var(--v-body); font-size: 16px; line-height: 1.65; letter-spacing: -.01em; font-weight: 400; }
.v-lp img, header.v-site img, footer.v-foot img { display: block; max-width: 100%; height: auto; }
.v-lp a, header.v-site a, footer.v-foot a { color: inherit; }
:where(.v-lp, footer.v-foot) :is(h1, h2, h3, h4, p) { margin: 0; }
.v-lp h1, .v-lp h2, .v-lp h3 { text-wrap: balance; font-weight: 500; letter-spacing: -.035em; font-family: var(--v-body); }
.v-lp :focus-visible, header.v-site :focus-visible { outline: 2px solid var(--v-black); outline-offset: 3px; box-shadow: 0 0 0 5px var(--v-fresh); }
header.v-site, footer.v-foot { font-family: var(--v-body); }


:root{
  --v-black:#151C0D;   
  --v-moss:#809132;    
  --v-blue:#99B7CD;    
  --v-grey:#EDECE4;    
  --v-water:#A3D8FF;   
  --v-fresh:#C3E978;   
  --v-white:#FFFFFF;
  --v-ink-2:#4A5145;
  --v-line:#151C0D;
  --v-display:'Inter Tight', 'Helvetica Neue', Arial, sans-serif;
  --v-body:'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  color-scheme:light;
}








.v-wrap{max-width:1280px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.v-sec{padding-block:clamp(72px,9vw,128px)}

.v-slide-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline;border-bottom:1px solid var(--v-line);padding-bottom:12px;margin-bottom:clamp(40px,6vw,72px);font-family:var(--v-display);font-size:14px}
.v-slide-head b{font-weight:500}
.v-slide-head span{color:var(--v-ink-2)}
.v-on-dark .v-slide-head{border-color:rgba(255,255,255,.6)}
.v-on-dark .v-slide-head span{color:#C9CFBF}
.v-mega{font-family:var(--v-display);font-weight:300;letter-spacing:-.06em;line-height:.88;font-size:clamp(64px,13vw,200px)}
.v-h2{font-size:clamp(30px,4.4vw,56px);line-height:1.22}
.v-lead{font-size:17px;color:var(--v-ink-2);max-width:60ch}
.v-label{font-family:var(--v-display);font-size:14px;font-weight:500;letter-spacing:.01em}
.v-tags{display:flex;flex-wrap:wrap;gap:0}
.v-tags span{border:1px solid var(--v-black);border-radius:999px;padding:5px 16px;font-family:var(--v-display);font-size:14px;margin:0 -1px -1px 0;background:transparent}
.v-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 28px;border-radius:999px;font:inherit;font-weight:500;text-decoration:none;cursor:pointer;border:1px solid var(--v-black);transition:background .2s ease,color .2s ease}
.v-btn.v-solid{background:var(--v-black);color:var(--v-white)}
.v-btn.v-solid:hover{background:#2A3420}
.v-btn.v-line{background:transparent;color:var(--v-black)}
.v-btn.v-line:hover{background:var(--v-fresh)}
.v-btn.v-fresh{background:var(--v-fresh);border-color:var(--v-fresh);color:var(--v-black)}
.v-btn.v-fresh:hover{background:#B2DD5E}

.v-orb{position:absolute;border-radius:50%;filter:blur(36px);pointer-events:none}
.v-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}


header.v-site{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(237,236,228,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--v-line)}
.v-hdr{display:flex;align-items:center;justify-content:space-between;gap:10px 28px;flex-wrap:wrap;padding-block:12px}
.v-logo img{height:30px;width:auto}
nav.v-main{display:flex;gap:2px 26px;font-size:15px;font-weight:500;overflow-x:auto;max-width:100%;scrollbar-width:none}
nav.v-main a{text-decoration:none;padding:10px 0;white-space:nowrap;border-bottom:1px solid transparent}
nav.v-main a:hover{border-bottom-color:var(--v-black)}
.v-lang{display:flex;gap:0}
.v-lang button{font-family:var(--v-display);font-size:13px;font-weight:500;min-height:36px;padding:0 14px;border:1px solid var(--v-black);margin-left:-1px;background:transparent;color:var(--v-black);cursor:pointer}
.v-lang button:first-child{border-radius:999px 0 0 999px;margin-left:0}
.v-lang button:last-child{border-radius:0 999px 999px 0}
.v-lang button[aria-pressed="true"]{background:var(--v-black);color:var(--v-white)}


.v-hero{position:relative;overflow:hidden}
.v-hero-in{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:32px;align-items:center;padding-block:clamp(48px,7vw,96px) clamp(56px,8vw,104px)}
.v-hero h1{font-size:clamp(42px,6.4vw,84px);line-height:1.12;letter-spacing:-.045em;margin:20px 0 26px}
.v-hero h1 .v-rule{display:inline-block;width:clamp(56px,8vw,120px);height:1px;background:var(--v-black);vertical-align:middle;margin-left:14px}
.v-hero .v-sub{font-size:18px;color:var(--v-ink-2);max-width:30em;margin-bottom:34px}
.v-hero .v-ctas{display:flex;flex-wrap:wrap;gap:10px}
.v-hero .v-meta{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:40px;font-family:var(--v-display);font-size:14px;color:var(--v-ink-2)}
.v-hero-art{position:relative;min-height:560px;display:grid;place-items:center}
.v-hero-art .v-rings{position:absolute;inset:0;margin:auto;width:min(520px,100%);aspect-ratio:1;max-width:100%}
.v-hero-art .v-tube{position:relative;height:min(520px,70vw);width:auto;transform:rotate(-8deg);filter:drop-shadow(0 30px 40px rgba(21,28,13,.18))}
.v-spf{position:absolute;right:4%;bottom:10%;width:132px;height:132px;border-radius:50%;background:var(--v-fresh);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;font-family:var(--v-display);z-index:2}
.v-spf b{font-size:50px;font-weight:300;letter-spacing:-.05em}
.v-spf small{font-size:13px;font-weight:500}
.v-spf i{position:absolute;top:-2px;right:6px;font-style:normal;font-size:30px;line-height:1}


.v-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:48px;align-items:end}
.v-wordmark{width:min(520px,100%);margin-bottom:28px}
.v-circles{display:flex;justify-content:center;align-items:center}
.v-circle{position:relative;width:min(340px,46vw);aspect-ratio:1;border-radius:50%;border:1px solid var(--v-black);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.v-circle+.v-circle{margin-left:clamp(-60px,-6vw,-24px)}
.v-circle .v-ph{position:absolute;inset:14%;border-radius:50%;background-size:cover;background-position:center;opacity:.9}
.v-circle .v-cap{position:relative;background:rgba(237,236,228,.88);border-radius:999px;padding:8px 18px}
.v-circle .v-cap b{display:block;font-family:var(--v-display);font-weight:400;font-size:clamp(28px,4vw,44px);letter-spacing:-.04em;line-height:1}
.v-circle .v-cap small{font-size:13px}


.v-blue{background:var(--v-blue)}
.v-shade-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.v-shade{background:var(--v-grey);border-radius:120px 120px 28px 28px;padding:40px 36px 32px;position:relative;overflow:hidden}
.v-shade .v-tag{display:inline-block;font-family:var(--v-display);font-size:14px;font-weight:500;border:1px solid var(--v-black);border-radius:999px;padding:3px 14px}
.v-shade .v-smear{height:84px;width:min(300px,80%);border-radius:60px 80px 40px 90px;transform:rotate(-12deg);margin:38px auto 30px}
.v-shade h3{font-family:var(--v-display);font-weight:300;font-size:clamp(40px,5vw,64px);letter-spacing:-.05em;line-height:1}
.v-shade p{color:var(--v-ink-2);margin-top:10px}
.v-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--v-black);margin-top:56px}
.v-points div{padding:26px 24px 0 0}
.v-points .v-n{font-family:var(--v-display);font-weight:300;font-size:56px;line-height:1;letter-spacing:-.05em;color:var(--v-white);display:block;margin-bottom:18px}
.v-points b{display:block;font-size:18px;margin-bottom:6px}
.v-points p{font-size:15px;color:#27301E}
.v-ingr{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:56px}
.v-ingr div{background:rgba(237,236,228,.7);border-radius:24px;padding:22px}
.v-ingr b{display:block;font-size:17px}
.v-ingr small{font-size:14px;color:var(--v-ink-2)}


.v-line-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px;align-items:end}
.v-prod{display:flex;flex-direction:column;gap:10px}
.v-prod .v-pic{height:420px;display:flex;align-items:flex-end;justify-content:center}
.v-prod .v-pic img{max-height:100%;width:auto}
.v-prod h3{font-family:var(--v-display);font-weight:500;font-size:22px;letter-spacing:-.02em;margin-top:14px}
.v-prod p{color:var(--v-ink-2);font-size:15px;max-width:34ch}
.v-status{display:inline-block;font-family:var(--v-display);font-size:12px;font-weight:500;padding:3px 12px;border-radius:999px;background:var(--v-black);color:var(--v-white);align-self:flex-start}
.v-status.v-soon{background:transparent;color:var(--v-black);border:1px solid var(--v-black)}
.v-status.v-live{background:var(--v-fresh);color:var(--v-black)}
.v-seq{background:linear-gradient(100deg,var(--v-grey) 0%,#DCE3E2 45%,#B7CCDA 80%,var(--v-blue) 100%)}
.v-seq-top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:end;margin-bottom:56px}
.v-seq .v-mega{font-size:clamp(48px,8.6vw,124px);line-height:.95}
.v-seq-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;align-items:end}
.v-seq-grid .v-pic{height:360px}


.v-dark{background:var(--v-black);color:var(--v-white)}
.v-vision{font-size:clamp(24px,3vw,40px);line-height:1.5;font-weight:500;letter-spacing:-.03em;text-align:center;max-width:24em;margin:0 auto}
.v-vision-label{font-family:var(--v-display);font-weight:300;font-size:clamp(24px,2.6vw,34px);text-align:center;margin-bottom:24px;color:#DDE2D4}
.v-tabs{display:flex;gap:0;justify-content:center;margin:72px 0 32px;flex-wrap:wrap}
.v-tabs button{font:inherit;font-size:15px;font-weight:500;min-height:46px;padding:0 22px;border:1px solid rgba(255,255,255,.7);margin-left:-1px;background:transparent;color:var(--v-white);cursor:pointer}
.v-tabs button:first-child{border-radius:999px 0 0 999px;margin-left:0}
.v-tabs button:last-child{border-radius:0 999px 999px 0}
.v-tabs button[aria-selected="true"]{background:var(--v-fresh);border-color:var(--v-fresh);color:var(--v-black)}
.v-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0;border-top:1px solid rgba(255,255,255,.5)}
.v-step{padding:26px 22px 26px 0;border-right:1px solid rgba(255,255,255,.18);display:flex;flex-direction:column;gap:8px;padding-left:22px}
.v-step:first-child{padding-left:0}
.v-step:last-child{border-right:0}
.v-step .v-top{display:flex;justify-content:space-between;align-items:baseline}
.v-step .v-n{font-family:var(--v-display);font-weight:300;font-size:52px;letter-spacing:-.05em;line-height:1;color:var(--v-water)}
.v-step .v-t{font-family:var(--v-display);font-size:14px;color:#C9CFBF}
.v-step .v-lbl{font-size:13px;color:#B9C0AE;margin-top:14px}
.v-step h3{font-size:19px;font-weight:500;letter-spacing:-.02em}
.v-step p{font-size:14px;color:#C9CFBF}
.v-step .v-status{margin-top:12px}
.v-step .v-status.v-soon{color:var(--v-white);border-color:rgba(255,255,255,.7)}
.v-total{text-align:center;margin-top:32px;font-size:18px}


.v-dna{background:var(--v-blue)}
.v-dna-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.v-dna-card{background:var(--v-grey);border-radius:150px 150px 0 0;padding:64px clamp(24px,3vw,44px) 44px;min-height:520px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.v-dna-card:nth-child(n+4){border-radius:0 0 150px 150px;padding-bottom:72px}
.v-dna-card.v-first{background:var(--v-fresh)}
.v-dna-card .v-num{font-family:var(--v-display);font-weight:300;font-size:clamp(64px,7vw,104px);letter-spacing:-.05em;line-height:1;color:var(--v-blue)}
.v-dna-card.v-first .v-num{color:var(--v-white)}
.v-dna-card .v-k{font-family:var(--v-display);font-size:14px;font-weight:500;margin-top:10px}
.v-dna-card p{margin-top:auto;padding-top:40px;font-size:15px;color:#2E3528}
.v-dna-card p+p{margin-top:16px;padding-top:0;color:var(--v-black)}
.v-dna-card p strong{font-weight:700}


.v-slogan{background:var(--v-black);color:var(--v-white);position:relative;overflow:hidden}
.v-slogan h2{font-size:clamp(32px,5vw,68px);text-align:center;line-height:1.2}
.v-slogan .v-en{font-family:var(--v-display);font-weight:300;text-align:center;font-size:clamp(20px,2.4vw,30px);margin-top:12px;color:#DDE2D4}
.v-roots{display:block;width:100%;height:auto;margin-top:64px}


.v-reviews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.v-rv{background:var(--v-white);border-radius:28px;padding:30px;display:flex;flex-direction:column;gap:14px}
.v-rv .v-stars{font-size:15px;letter-spacing:4px;color:var(--v-moss)}
.v-rv p{font-size:16px}
.v-rv small{font-family:var(--v-display);color:var(--v-ink-2);font-size:13px;margin-top:auto}


.v-where{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--v-black)}
.v-where div{padding:22px 20px 0 0}
.v-where .v-c{font-family:var(--v-display);font-size:14px;font-weight:500;color:var(--v-ink-2);margin-bottom:10px}
.v-shop{display:flex;justify-content:space-between;align-items:center;min-height:54px;border-bottom:1px solid var(--v-black);text-decoration:none;font-size:18px;font-weight:500;gap:10px}
.v-shop:hover{background:var(--v-fresh)}
.v-partners{background:var(--v-moss)}
.v-partners .v-copy{user-select:all;font-family:var(--v-display);font-size:clamp(20px,2.4vw,28px);font-weight:500}


.v-nl{display:flex;flex-wrap:wrap;gap:8px;border:1px solid var(--v-black);border-radius:999px;padding:5px;background:var(--v-white)}
.v-nl input[type=email]{flex:1 1 200px;min-width:0;min-height:50px;border:0;background:transparent;padding:0 20px;font:inherit;color:var(--v-black);border-radius:999px}
.v-nl input::placeholder{color:#6E7466}
.v-toast{font-size:14px;font-weight:500;min-height:1.5em}

footer.v-foot{background:var(--v-black);color:#C9CFBF}
footer.v-foot .v-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;margin-bottom:48px}
footer.v-foot h4{margin:0 0 12px;font-family:var(--v-display);font-weight:500;font-size:13px;color:var(--v-fresh)}
footer.v-foot a{text-decoration:none}
footer.v-foot a:hover{color:var(--v-white)}
footer.v-foot .v-biz{border-top:1px solid #39412F;padding-top:22px;font-size:12px;line-height:1.9;color:#9EA592}


.v-pd{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:start}
.v-stage{position:relative;border-radius:200px 200px 32px 32px;background:var(--v-blue);min-height:640px;display:grid;place-items:center;overflow:hidden}
.v-stage .v-smear{position:absolute;left:8%;bottom:12%;width:min(300px,58%);height:96px;border-radius:60px 80px 40px 90px;transform:rotate(-14deg);transition:background .35s ease}
.v-stage img.t{position:relative;height:540px;width:auto;transform:rotate(8deg);filter:drop-shadow(0 30px 40px rgba(21,28,13,.2))}
.v-buy{border-top:1px solid var(--v-black);padding-top:22px}
.v-price{font-family:var(--v-display);font-size:34px;font-weight:400;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.v-shade-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.v-shade-pick button{display:flex;align-items:center;gap:14px;min-height:72px;padding:12px 16px;border-radius:999px;font:inherit;color:var(--v-black);cursor:pointer;text-align:left;background:transparent;border:1px solid var(--v-black)}
.v-shade-pick button[aria-pressed="true"]{background:var(--v-white);box-shadow:inset 0 0 0 1px var(--v-black)}
.v-shade-pick .v-dot{flex:0 0 auto;width:40px;height:40px;border-radius:50%}
.v-shade-pick small{display:block;font-family:var(--v-display);font-size:12px;color:var(--v-ink-2)}
.v-shade-pick span.nm{font-family:var(--v-display);font-size:20px;font-weight:400;letter-spacing:-.02em}
.v-chips{display:flex;flex-wrap:wrap}
.v-chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--v-black);border-radius:999px;margin:0 -1px -1px 0;text-decoration:none;font-size:14px;font-weight:500}
.v-chips a:hover{background:var(--v-fresh)}
.v-howto{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--v-black)}
.v-howto div{padding:22px 22px 0 0}
.v-howto .v-n{font-family:var(--v-display);font-weight:300;font-size:44px;letter-spacing:-.05em;line-height:1;display:block;margin-bottom:12px;color:var(--v-moss)}
.v-lp details{border-bottom:1px solid var(--v-black);padding:20px 0}
.v-lp details:first-of-type{border-top:1px solid var(--v-black)}
.v-lp summary{cursor:pointer;font-size:17px;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:16px}
.v-lp summary::-webkit-details-marker{display:none}
.v-lp summary::after{content:"+";font-family:var(--v-display);font-weight:300;font-size:24px;line-height:1}
.v-lp details[open] summary::after{content:"–"}
.v-lp details p{margin-top:12px;color:var(--v-ink-2)}
.v-tbl{overflow-x:auto}
.v-tbl table{width:100%;border-collapse:collapse;font-size:14px;min-width:480px}
.v-tbl th{text-align:left;font-weight:500;color:var(--v-ink-2);width:36%}
.v-tbl th,.v-tbl td{padding:14px 8px 14px 0;border-bottom:1px solid #C9C8BE}
.v-todo{background:var(--v-fresh);font-weight:500;padding-left:10px!important}

@media (max-width:900px){
  .v-hero-in,.v-intro,.v-pd,.v-seq-top{grid-template-columns:minmax(0,1fr)}
  .v-hero-art{min-height:440px}
  .v-line-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .v-seq-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .v-points,.v-howto{grid-template-columns:minmax(0,1fr)}
  .v-ingr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-dna-grid{grid-template-columns:minmax(0,1fr)}
  .v-dna-card,.v-dna-card:nth-child(n+4){border-radius:120px 120px 28px 28px;min-height:0;margin-bottom:12px;padding-bottom:40px}
  .v-reviews{grid-template-columns:minmax(0,1fr)}
  .v-where{grid-template-columns:repeat(2,minmax(0,1fr))}
  footer.v-foot .v-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-stage{min-height:520px;border-radius:160px 160px 28px 28px}
  .v-stage img.t{height:440px}
}
@media (max-width:600px){
  .v-line-grid,.v-seq-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-prod .v-pic{height:300px}.v-seq-grid .v-pic{height:260px}
  .v-shade-row{grid-template-columns:minmax(0,1fr)}
  .v-where,footer.v-foot .v-cols{grid-template-columns:minmax(0,1fr)}
  .v-step{border-right:0;border-bottom:1px solid rgba(255,255,255,.18);padding-left:0}
  .v-spf{width:104px;height:104px}.v-spf b{font-size:38px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* ---- additions for the WordPress build ---- */
.v-lp [hidden] { display: none !important; }
.v-lp .v-intro img.v-wordmark { max-width: 360px; }
.v-circle .v-ph { background-size: cover; background-position: center; }
.v-pic img { object-fit: contain; }
.v-prod h3 a, .v-prod .v-pic a { text-decoration: none; }
.v-nl-note { font-size: 13px; color: var(--v-ink-2); }
.v-toast--ok { color: #2d5a12; } .v-toast--err { color: #9b2c1d; }
.v-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (prefers-reduced-motion: no-preference) {
  .v-lp .v-reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
  .v-lp .v-reveal.is-in { opacity: 1; transform: none; }
}

/* ---- language links, hero tube, footer company info, anchors ---- */
.v-lp section[id] { scroll-margin-top: 84px; }
.v-lang a { display: inline-flex; align-items: center; font-family: var(--v-display); font-size: 13px; font-weight: 500; min-height: 36px; padding: 0 14px; border: 1px solid var(--v-black); margin-left: -1px; background: transparent; color: var(--v-black); text-decoration: none; }
.v-lang a:first-child { border-radius: 999px 0 0 999px; margin-left: 0; }
.v-lang a:last-child { border-radius: 0 999px 999px 0; }
.v-lang a[aria-pressed="true"] { background: var(--v-black); color: var(--v-white); }
.v-tube { position: relative; display: block; height: min(520px, 70vw); width: auto; transform: rotate(-8deg); filter: drop-shadow(0 30px 40px rgba(21,28,13,.18)); }
.v-tube img { height: 100%; width: auto; max-width: none; }
.v-hero-art { min-height: 560px; }
.v-logo img { height: 30px; width: auto; }
.v-intro .v-wordmark img { width: min(360px, 100%); height: auto; margin-bottom: 28px; }
.v-prod .v-pic img { max-height: 100%; width: auto; max-width: 100%; }
.v-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
footer.v-foot .v-biz .footer-links { display: flex; gap: 20px; flex-wrap: wrap; font-size: 13px; margin-bottom: 14px; }
footer.v-foot .v-biz .footer-links__privacy strong { color: var(--v-fresh); }
footer.v-foot .v-biz dl.company { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 28px; margin: 0 0 14px; }
footer.v-foot .v-biz dl.company > div { display: flex; gap: 10px; }
footer.v-foot .v-biz dt { color: #7F876F; flex: 0 0 auto; }
footer.v-foot .v-biz dd { margin: 0; }
footer.v-foot .v-biz .company__escrow { margin: 8px 0; }
.v-site .v-logo { display: inline-flex; }

header.v-site .v-logo img { height: 30px; width: auto; max-width: none; }
.skip-link { position: absolute; left: -9999px; top: 0; background: var(--v-black); color: var(--v-white); padding: 10px 16px; z-index: 100; }
.skip-link:focus { left: 8px; top: 8px; }
.v-pic > a { display: flex; align-items: flex-end; justify-content: center; height: 100%; width: 100%; }

/* ---- product page (v2) ---- */
.v-lp { font-family: var(--v-body); color: var(--v-black); font-size: 16px; line-height: 1.65; letter-spacing: -.01em; }
.v-pdp .v-stage { align-content: start; }
.v-stage__pic { position: relative; width: 100%; display: grid; place-items: center; padding: 64px 0 0; }
.v-stage__pic .shade-gallery, .v-stage__pic .v-stage__single { width: 100%; }
.v-stage__single { max-height: 560px; object-fit: contain; padding-bottom: 40px; }
.v-stage .shade-gallery__stage .shade-img { mix-blend-mode: normal; }
.v-stage__tag { position: absolute; left: 22px; top: 22px; background: var(--v-white); padding: 6px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; }
.v-shade-pick__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.v-shade-opt { display: flex; align-items: center; gap: 14px; min-height: 72px; padding: 12px 16px; border-radius: 999px; cursor: pointer; background: transparent; border: 1px solid var(--v-black); position: relative; }
.v-shade-opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.v-shade-opt:has(input:checked) { background: var(--v-white); box-shadow: inset 0 0 0 1px var(--v-black); }
.v-shade-opt:has(input:focus-visible) { outline: 2px solid var(--v-black); outline-offset: 3px; }
.v-shade-opt .v-dot { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; }
.v-shade-opt small { display: block; font-family: var(--v-display); font-size: 12px; color: var(--v-ink-2); }
.v-shade-opt .v-nm { font-family: var(--v-display); font-size: 20px; font-weight: 400; letter-spacing: -.02em; }
.v-pdp .v-howto p { margin: 0; }
.v-pdp .v-tbl .product-notice { border: 0; padding: 0; }
.v-pdp .v-tbl .product-notice h2 { display: none; }
.v-pdp .v-tbl table { width: 100%; border-collapse: collapse; font-size: 14px; background: transparent; border-radius: 0; }
.v-pdp .v-tbl th, .v-pdp .v-tbl td { padding: 14px 8px 14px 0; border: 0; border-bottom: 1px solid #C9C8BE; background: transparent; text-align: left; vertical-align: top; }
.v-pdp .v-tbl th { color: var(--v-ink-2); font-weight: 500; width: 36%; }
.v-pdp .pending { background: var(--v-fresh); font-weight: 500; padding: 1px 8px; }
footer.v-foot .v-cols img { width: 180px; height: auto; }
.v-stage__tag { left: 50%; transform: translateX(-50%); top: 24px; z-index: 3; white-space: nowrap; }
.v-shade-pick__list { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.v-shade-opt { min-width: 0; padding: 10px 14px; gap: 12px; }
.v-shade-opt .v-dot { width: 36px; height: 36px; }

.v-shade .v-swatch { height: clamp(150px, 16vw, 220px); margin: 24px auto 14px; display: grid; place-items: center; }
.v-shade .v-swatch img { height: 100%; width: auto; max-width: 100%; object-fit: contain; }
/* shade cards: swatch sits between the tag and the name, never overlapping the text */
.v-shade { display: flex; flex-direction: column; min-height: clamp(400px, 36vw, 500px); }
.v-shade .v-swatch { flex: 1 1 auto; width: 100%; margin: 0; padding: 9px 0 15px; display: grid; place-items: center; }
.v-shade .v-swatch img { width: min(78%, 420px); height: auto; max-height: clamp(160px, 16vw, 240px); object-fit: contain; }
.v-shade .v-smear { margin: 38px auto 30px; }

/* tone number sits next to the shade name */
.v-shade-name { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.v-shade-name .v-tag { align-self: center; margin-top: .4em; }
.v-shade .v-swatch { padding: 18px 0 14px; }

/* Sequoia forest banner under the slogan: picture only */
.v-forest { min-height: clamp(320px, 38vw, 540px); margin-top: 64px; background: #0f1409 center / cover no-repeat; }

/* ===================== scroll animations ===================== */
.v-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 60; pointer-events: none; }
.v-progress span { display: block; height: 100%; background: var(--v-fresh); transform-origin: 0 50%; transform: scaleX(0); will-change: transform; }

/* parallax variables (set by v2.js) */
.v-hero .v-orb { transform: translate3d(0, var(--py, 0px), 0); }
.v-tube { transform: translate3d(0, var(--py, 0px), 0) rotate(-8deg); }
.v-hero .v-spf { transform: translate3d(0, var(--py, 0px), 0); }
.v-rings { transform: rotate(var(--pr, 0deg)); }
.v-prod .v-pic img { transform: translate3d(0, var(--py, 0px), 0); will-change: transform; }
.v-stage .v-orb { transform: translate3d(0, var(--py, 0px), 0); }
.v-forest { background-position: center 40%; }

@media (prefers-reduced-motion: no-preference) {
	/* hero entrance */
	html.js .v-hero h1:not(.is-split) { visibility: hidden; }
	html.js .v-hero .v-hline { display: block; overflow: hidden; padding-bottom: .1em; margin-bottom: -.1em; }
	html.js .v-hero .v-hline > span { display: block; transform: translateY(108%); transition: transform 1.05s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--i, 0) * .1s + .1s); }
	html.js .v-hero.is-ready .v-hline > span { transform: none; }
	html.js .v-hero .v-anim { opacity: 0; translate: 0 26px; transition: opacity .9s ease, translate 1.1s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--d, 0s); }
	html.js .v-hero .v-tube.v-anim { translate: 0 70px; transition-duration: 1.1s, 1.4s; }
	html.js .v-hero .v-spf.v-anim { translate: 0 0; scale: .6; transition: opacity .6s ease, scale .8s cubic-bezier(.3, 1.5, .5, 1); transition-delay: var(--d, 0s); }
	html.js .v-hero.is-ready .v-anim { opacity: 1; translate: 0 0; scale: 1; }
	/* failsafe: if the script never runs, nothing stays hidden */
	html.js .v-hero .v-anim { animation: vFailsafe .01s 3.5s forwards; }
	html.js .v-hero .v-hline > span { animation: vFailsafeLine .01s 3.5s forwards; }
	html.js .v-hero h1:not(.is-split) { animation: vShow .01s 3.5s forwards; }
	@keyframes vFailsafe { to { opacity: 1; translate: 0 0; scale: 1; } }
	@keyframes vFailsafeLine { to { transform: none; } }
	@keyframes vShow { to { visibility: visible; } }

	/* rings draw themselves */
	html.js .v-hero .v-rings circle { stroke-dasharray: 1260; stroke-dashoffset: 1260; transition: stroke-dashoffset 2.4s cubic-bezier(.5, 0, .2, 1); transition-delay: calc(var(--c, 0) * .15s + .3s); }
	html.js .v-hero.is-ready .v-rings circle { stroke-dashoffset: 0; }

	/* sections */
	.v-lp .v-reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s ease, transform .9s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--rd, 0s); }
	.v-lp .v-reveal.is-in { opacity: 1; transform: none; }
	.v-lp .v-dna-card.v-reveal { transform: translateY(56px) scale(.96); }
	.v-lp .v-shade.v-reveal { transform: translateY(40px) scale(.98); }
	.v-lp .v-forest.v-reveal { transform: none; }
	.v-lp .v-prod.v-reveal .v-pic img { transition: filter .8s ease; }

	/* slide-head line draws from left to right */
	html.js .v-lp .v-slide-head { position: relative; border-bottom-color: transparent; }
	html.js .v-lp .v-slide-head::after { content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%; background: var(--v-line); transform: scaleX(0); transform-origin: left; transition: transform 1.3s cubic-bezier(.5, 0, .2, 1) .1s; }
	html.js .v-lp .v-slide-head.is-in::after { transform: scaleX(1); }
	html.js .v-lp .v-on-dark .v-slide-head::after, html.js .v-lp .v-dark .v-slide-head::after { background: rgba(255, 255, 255, .6); }

	/* routine steps */
	.v-step { animation: vStep .7s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--i, 0) * .09s); }
	@keyframes vStep { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }

	/* buttons and cards: small touches */
	.v-btn { transition: background .2s ease, color .2s ease, transform .25s ease; }
	.v-btn:hover { transform: translateY(-2px); }
	.v-dna-card { transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s ease; }
	.v-dna-card:hover { transform: translateY(-6px); }
	.v-shade { transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
}

/* Lenis (smooth scroll) base rules */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }

/* soo / tree: two interlocking rings (as in the brandbook) */
.v-rings2 { position: relative; width: 100%; aspect-ratio: 1808 / 920; container-type: inline-size; }
.v-rings2__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.v-rings2__item { position: absolute; top: 24%; display: flex; flex-direction: column; align-items: center; text-align: center; transform: translateX(-50%); }
.v-rings2__item--soo { left: 29.2%; }
.v-rings2__item--tree { left: 72.9%; }
.v-rings2__icon { width: clamp(44px, 8.4cqw, 150px); height: auto; display: block; overflow: visible; }
.v-rings2__word { font-family: var(--v-display); font-weight: 400; letter-spacing: -.05em; line-height: 1; font-size: clamp(34px, 6.2cqw, 118px); margin-top: clamp(8px, 2.4cqw, 44px); }
.v-rings2__cap { margin-top: clamp(4px, 1cqw, 18px); font-size: clamp(11px, 1.75cqw, 30px); line-height: 1.35; max-width: 24cqw; }
.v-rings2__cap strong { font-weight: 700; }
@media (prefers-reduced-motion: no-preference) {
	html.js .v-rings2__svg path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 2.2s cubic-bezier(.5, 0, .2, 1); }
	html.js .v-rings2.is-in .v-rings2__svg path { stroke-dashoffset: 0; }
	html.js .v-rings2 .v-rings2__item { opacity: 0; transition: opacity 1s ease .5s; }
	html.js .v-rings2.is-in .v-rings2__item { opacity: 1; }
}

/* slogan sits on the forest photo (no separate dark block) */
.v-slogan { padding: 0; background: none; }
.v-slogan .v-forest { position: relative; display: grid; place-items: center; margin-top: 0; min-height: clamp(420px, 46vw, 680px); }
.v-slogan .v-forest::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at center, rgba(8, 12, 5, .55) 0%, rgba(8, 12, 5, .25) 60%, rgba(8, 12, 5, .35) 100%); }
.v-slogan__text { position: relative; text-align: center; color: var(--v-white); padding-block: 48px; }
.v-slogan__text h2 { font-size: clamp(36px, 6vw, 84px); line-height: 1.1; color: var(--v-white); text-shadow: 0 2px 24px rgba(0, 0, 0, .35); }
.v-slogan__text .v-en { font-family: var(--v-display); font-weight: 300; font-size: clamp(20px, 2.4vw, 32px); margin-top: 14px; color: #EDF1E3; text-shadow: 0 2px 18px rgba(0, 0, 0, .4); }