@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap');

:root{--ink:#151512;--paper:#f5f1e9;--warm:#ebe3d6;--orange:#f6a800;--muted:#6e6a62;--line:rgba(21,21,18,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:"Noto Sans KR",sans-serif;word-break:keep-all}a{color:inherit;text-decoration:none}p{line-height:1.7}.site-header{position:absolute;z-index:20;top:0;left:0;width:100%;height:88px;padding:0 6vw;display:flex;align-items:center;justify-content:space-between}.brand{font-family:"DM Sans",sans-serif;font-size:25px;font-weight:600;letter-spacing:.04em}.brand span{font-family:"Noto Sans KR",sans-serif;font-size:10px;margin-left:7px;font-weight:500;color:var(--muted)}nav{display:flex;gap:28px;align-items:center;font-size:13px;font-weight:600}nav a:not(.nav-cta){opacity:.75}.nav-cta{border:1px solid var(--ink);padding:9px 17px;border-radius:99px}.hero{min-height:800px;display:grid;grid-template-columns:49% 51%;background:linear-gradient(115deg,#f8f5ee,#eee8de);overflow:hidden}.hero-copy{padding:190px 5vw 100px 7vw;z-index:3}.eyebrow{font-family:"DM Sans",sans-serif;letter-spacing:.16em;font-size:11px;font-weight:600;margin:0 0 22px}.hero h1{font-size:clamp(42px,4.5vw,70px);line-height:1.25;letter-spacing:-.055em;margin:0 0 27px}.hero h1 span{position:relative;z-index:1}.hero h1 span:after{content:"";position:absolute;z-index:-1;height:15px;bottom:3px;left:0;width:100%;background:var(--orange)}.hero-description{font-size:17px;margin-bottom:36px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:42px;border-radius:3px;font-weight:700;padding:17px 24px;min-width:235px;transition:transform .25s,box-shadow .25s}.button:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(0,0,0,.14)}.button-dark{background:var(--ink);color:white}.button span{font-size:20px}.hero-visual{position:relative;min-height:800px}.sun-disc{position:absolute;width:540px;height:540px;border-radius:50%;background:#e8dfd1;top:80px;right:-85px;box-shadow:inset 30px 20px 80px rgba(255,255,255,.8)}.bottle{position:absolute;z-index:5}.bottle-cap{position:absolute;left:22%;width:56%;height:22%;border-radius:25% 25% 10% 10%;background:linear-gradient(90deg,rgba(255,255,255,.3),rgba(110,105,92,.18),rgba(255,255,255,.7));border:1px solid rgba(30,30,25,.3);z-index:2;backdrop-filter:blur(2px)}.bottle-pump{position:absolute;z-index:1;left:34%;top:11%;width:32%;height:19%;background:#22231c;border-radius:12% 12% 0 0}.bottle-pump:before{content:"";position:absolute;width:85%;height:24%;background:#1b1c17;top:-14%;left:8%;border-radius:5px}.bottle-pump i{position:absolute;width:35%;height:25%;background:#1b1c17;right:-20%;top:-14%;border-radius:0 4px 3px 0}.bottle-body{position:absolute;top:25%;width:100%;height:75%;border-radius:10% 10% 14% 14%;background:linear-gradient(90deg,#161712,#323328 42%,#12130f);box-shadow:10px 18px 30px rgba(0,0,0,.24),inset 5px 0 12px rgba(255,255,255,.07);color:#d9d6ca;display:flex;flex-direction:column;align-items:center;padding-top:50%}.bottle-body span{font-family:"DM Sans";font-size:17px;letter-spacing:.09em}.bottle-body small{font-family:"DM Sans";font-size:6px;text-align:center;opacity:.6;letter-spacing:.08em;margin-top:6px}.bottle-hero{width:190px;height:415px;left:37%;top:190px;filter:drop-shadow(60px 40px 16px rgba(40,35,26,.2))}.coming-badge{z-index:7;position:absolute;top:185px;right:11%;width:128px;height:128px;border-radius:50%;background:var(--orange);border:1px solid var(--ink);outline:1px solid var(--orange);outline-offset:4px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(6deg)}.coming-badge small{font-size:10px;line-height:1.4}.coming-badge strong{font-family:"DM Sans";font-size:18px;line-height:1.15;margin-top:6px}.vertical-note{position:absolute;right:4%;bottom:16%;writing-mode:vertical-rl;font-family:"DM Sans";font-size:9px;letter-spacing:.18em}.leaf-shadow{position:absolute;background:#908d7e;filter:blur(7px);opacity:.22;border-radius:100% 0 100% 0;transform-origin:bottom right}.leaf-one{width:190px;height:72px;top:40px;left:5%;transform:rotate(38deg)}.leaf-two{width:230px;height:82px;top:110px;left:9%;transform:rotate(65deg)}
.problem{padding:85px 6vw 70px;background:#f8f5ef}.section-heading{text-align:center}.section-heading h2{font-size:clamp(28px,3vw,40px);line-height:1.4;letter-spacing:-.04em;margin:0 0 14px}.section-heading>p:last-child{font-size:14px;color:var(--muted)}.problem-grid{max-width:1120px;margin:55px auto 0;display:grid;grid-template-columns:repeat(4,1fr) 1.2fr}.problem-grid article{text-align:center;padding:5px 20px;border-right:1px solid var(--line)}.line-icon{position:relative;margin:auto;width:72px;height:72px;color:#aaa59b;font:48px/72px "DM Sans"}.line-icon b:before,.line-icon b:after{content:"";position:absolute;width:62px;height:2px;background:var(--orange);left:5px;top:35px}.line-icon b:before{transform:rotate(45deg)}.line-icon b:after{transform:rotate(-45deg)}.problem-grid h3{font-size:14px;margin:12px 0 4px}.problem-grid article p{font-size:11px;color:var(--muted);line-height:1.5}.problem-grid aside{padding:5px 0 0 44px}.problem-grid aside span{display:block;color:var(--orange);font-weight:800;font-size:16px}.problem-grid aside strong{display:block;font-size:27px;line-height:1.45;margin-top:4px}
.promise{display:grid;grid-template-columns:55% 45%;min-height:520px}.promise-copy{padding:70px 6vw 60px 8vw;background:#f6f3ed}.promise h2,.transparency h2{font-size:clamp(28px,3vw,44px);line-height:1.4;letter-spacing:-.04em;margin:0 0 25px}.promise ul{padding:0;margin:0;list-style:none}.promise li{margin:10px 0;font-size:14px}.promise li i{display:inline-flex;align-items:center;justify-content:center;background:var(--orange);color:white;border-radius:50%;font-style:normal;width:18px;height:18px;margin-right:10px}.promise-end{font-weight:700;margin-top:28px;border-top:1px solid var(--line);padding-top:24px}.promise-end u{text-decoration-color:var(--orange);text-decoration-thickness:5px;text-underline-offset:-3px}.texture{position:relative;background:radial-gradient(circle at 60% 30%,#f8f4e9,#ddd3c3);overflow:hidden}.serum-blob{position:absolute;width:65%;height:51%;left:15%;top:22%;border-radius:58% 42% 48% 52% / 58% 46% 54% 42%;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(224,214,195,.65));box-shadow:inset 20px 20px 40px rgba(255,255,255,.8),15px 20px 32px rgba(98,84,61,.2);transform:rotate(8deg)}.serum-blob i{position:absolute;width:5px;height:5px;border-radius:50%;background:rgba(160,140,110,.3);box-shadow:inset 1px 1px 2px #fff}.serum-blob i:nth-child(1){left:30%;top:35%}.serum-blob i:nth-child(2){left:62%;top:58%}.serum-blob i:nth-child(3){left:70%;top:26%}.texture>span{position:absolute;bottom:30px;right:35px;font-family:"DM Sans";font-size:9px;letter-spacing:.16em}
.product-intro{height:540px;display:grid;grid-template-columns:48% 52%;background:#d7d0c3;overflow:hidden}.product-copy{z-index:2;padding:90px 5vw 40px 9vw}.product-copy h2{font-size:clamp(38px,4vw,56px);line-height:1.2;margin:0 0 24px;letter-spacing:-.05em}.product-copy>p:not(.eyebrow){font-size:15px}.product-copy dl{display:flex;gap:35px;margin-top:38px}.product-copy dl div{border-top:1px solid rgba(0,0,0,.25);padding-top:10px;min-width:100px}.product-copy dt{font-size:10px;color:var(--muted)}.product-copy dd{margin:3px 0;font-size:13px;font-weight:600}.product-stage{position:relative;background:radial-gradient(circle at 45% 36%,#f2ede3,#c4bdaf)}.arch{position:absolute;bottom:-80px;left:12%;width:430px;height:500px;border-radius:215px 215px 0 0;background:rgba(248,243,233,.48);box-shadow:inset 30px 0 60px rgba(255,255,255,.25)}.bottle-product{width:185px;height:410px;left:33%;top:70px}.measure{position:absolute;right:9%;top:185px;border-left:1px solid rgba(0,0,0,.3);height:230px;padding:95px 0 0 20px;font-size:11px}.measure:before,.measure:after{content:"";position:absolute;left:0;width:30px;height:1px;background:rgba(0,0,0,.3)}.measure:before{top:0}.measure:after{bottom:0}.measure span{display:block;color:var(--muted);margin-top:5px}
.features{padding:80px 6vw 55px;background:#f8f4ed}.feature-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1180px;margin:50px auto 0}.feature-card{position:relative;min-height:410px;border-radius:4px;padding:260px 26px 25px;overflow:hidden;background:#e9e2d7}.feature-card:nth-child(2){background:#e1e5d6}.feature-card:nth-child(3){background:#e7dfd3}.feature-card h3{font-size:19px;margin:0 0 7px}.feature-card p{font-size:12px;color:#535047;line-height:1.6}.num{position:absolute;z-index:3;left:22px;top:230px;background:var(--orange);width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:600 12px "DM Sans"}.feature-art{position:absolute;inset:0 0 auto 0;height:245px}.dropper{background:radial-gradient(circle at 58% 52%,#faf7ef 0 23%,transparent 24%)}.dropper:before{content:"";position:absolute;width:14px;height:210px;background:linear-gradient(90deg,#a07744,#ead3a4,#9b7040);left:43%;top:-55px;transform:rotate(-40deg);border-radius:8px}.dropper i{position:absolute;width:28px;height:45px;border-radius:50% 50% 55% 55%;background:rgba(230,200,145,.6);left:58%;top:170px;box-shadow:inset 5px 5px 12px white}.leaf{width:180px;height:180px;left:calc(50% - 90px);top:35px;background:radial-gradient(circle at 55% 48%,#9eb16c,#587445 58%,#344e31);border-radius:100% 0 100% 100%;transform:rotate(20deg);box-shadow:8px 12px 25px rgba(41,63,32,.2)}.leaf:after{content:"";position:absolute;width:2px;height:150px;background:rgba(240,240,190,.5);left:50%;top:15px;transform:rotate(42deg)}.cream{margin:42px auto 0;width:65%;height:145px;border-radius:59% 41% 52% 48%;background:rgba(250,248,240,.8);box-shadow:12px 15px 25px rgba(80,65,45,.16),inset 12px 12px 30px white;transform:rotate(-8deg)}.cream i{position:absolute;width:5px;height:5px;border-radius:50%;background:#d1c5b0;left:40%;top:30%}.cream i+ i{left:67%;top:60%}.disclaimer{text-align:center;color:#99938a;font-size:10px;margin-top:24px}
.transparency{min-height:510px;display:grid;grid-template-columns:43% 57%;background:#f1ece3}.research-art{position:relative;overflow:hidden;background:linear-gradient(145deg,#cac3b7,#f1ece3)}.paper{position:absolute;width:70%;height:110%;left:-8%;top:-10%;background:#faf9f4;transform:rotate(-14deg);box-shadow:12px 15px 40px rgba(0,0,0,.12);padding:50px}.paper span{display:block;height:4px;background:#aaa59b;margin:11px;width:80%;opacity:.5}.paper mark{display:block;width:65%;height:8px;margin:20px;background:rgba(246,168,0,.55)}.magnifier{position:absolute;width:150px;height:150px;border:15px solid #24241f;border-radius:50%;left:48%;top:33%;box-shadow:8px 13px 20px rgba(0,0,0,.3)}.magnifier:after{content:"";position:absolute;width:20px;height:180px;background:#24241f;bottom:-150px;right:-65px;transform:rotate(-43deg);border-radius:8px}.transparency-copy{padding:75px 7vw 50px}.transparency-copy>p:not(.eyebrow){font-size:14px}.principles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:48px}.principles span{text-align:center;font-size:10px;font-weight:600}.principles i{display:block;font-size:30px;font-style:normal;margin-bottom:10px;font-family:serif}
.final-cta{position:relative;background:var(--orange);padding:62px 8vw 54px;display:grid;grid-template-columns:1fr 390px;align-items:center}.final-cta h2{font-size:clamp(30px,3.3vw,49px);line-height:1.35;letter-spacing:-.04em;margin:0 0 12px}.final-cta>div>p:last-child{margin:0;font-size:14px}.button-light{background:#fff;min-width:360px;padding:22px 28px;border-radius:2px}.final-cta ul{grid-column:1/-1;display:flex;justify-content:flex-end;gap:50px;margin:35px 0 0;list-style:none;font-size:11px}.final-cta li:before{content:"◇";margin-right:9px}footer{height:90px;background:#11110f;color:white;display:flex;align-items:center;padding:0 6vw;gap:30px}footer .brand{font-size:20px}footer p{font-size:10px;color:#999;flex:1}footer small{font-size:9px;color:#777}footer>a:last-child{font:11px "DM Sans";color:#bbb}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s ease}.reveal.visible{opacity:1;transform:none}
@media (max-width:900px){.site-header{height:70px;padding:0 22px}.site-header nav a:not(.nav-cta){display:none}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:125px 25px 65px}.hero h1{font-size:43px}.hero-visual{min-height:510px}.sun-disc{width:440px;height:440px;right:-130px;top:15px}.bottle-hero{left:38%;top:75px;width:150px;height:340px}.coming-badge{width:100px;height:100px;top:80px;right:7%}.problem{padding:70px 20px}.problem-grid{grid-template-columns:repeat(2,1fr);gap:30px 0}.problem-grid article:nth-child(2){border-right:0}.problem-grid aside{grid-column:1/-1;text-align:center;padding:25px 0 0;border-top:1px solid var(--line)}.problem-grid aside strong br{display:none}.promise{grid-template-columns:1fr}.promise-copy{padding:65px 25px}.texture{height:400px}.product-intro{height:auto;grid-template-columns:1fr}.product-copy{padding:70px 25px 20px}.product-stage{height:480px}.feature-cards{grid-template-columns:1fr;max-width:500px}.transparency{grid-template-columns:1fr}.research-art{height:380px}.transparency-copy{padding:65px 25px}.principles{grid-template-columns:repeat(2,1fr);gap:28px}.final-cta{grid-template-columns:1fr;padding:55px 25px}.button-light{margin-top:32px;min-width:0;width:100%}.final-cta ul{justify-content:flex-start;gap:14px;flex-wrap:wrap;padding:0}.final-cta li{width:45%}footer{height:auto;padding:35px 25px;flex-wrap:wrap}footer p{flex:0 0 100%;order:3;margin:0}}
@media (max-width:480px){.brand{font-size:22px}.nav-cta{font-size:11px}.hero h1{font-size:37px}.hero-description{font-size:15px}.problem-grid article{padding:5px 10px}.problem-grid h3{font-size:13px}.promise li{font-size:12px}.product-stage{height:420px}.bottle-product{left:27%;width:160px;height:360px}.measure{right:4%}.feature-card{min-height:390px}.transparency h2{font-size:31px}.final-cta h2{font-size:32px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.button{transition:none}}

/* Asset-backed imagery */
.hero{position:relative;background:#f8f5ee}
.hero-copy{position:relative}
.hero-visual{position:absolute;inset:0;min-height:0;background:url("assets/Asset_2.png") center center/cover no-repeat}
.coming-badge,.vertical-note{position:absolute}
.texture{background:url("assets/Asset_4.png") center center/cover no-repeat}
.product-stage{background:url("assets/Asset_3.png") 62% center/cover no-repeat}
.research-art{background:url("assets/Asset_8.png") center center/cover no-repeat}
.feature-art{display:block;inset:0;width:100%;height:245px;object-fit:cover}
.feature-card:nth-child(1) .feature-art{object-position:center 38%}
.feature-card:nth-child(2) .feature-art{object-position:center 43%}
.feature-card:nth-child(3) .feature-art{object-position:center center}
.icon-placeholder{width:70px;height:70px;margin:0 auto;border:1px dashed #aaa49a;color:#999289;display:flex;align-items:center;justify-content:center;font:9px "DM Sans",sans-serif;letter-spacing:.12em;background:rgba(255,255,255,.35)}
.asset-placeholder{border:1px dashed #a49e93;background:#e7e1d8;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#8a847a;font-family:"DM Sans",sans-serif;letter-spacing:.14em}
.asset-placeholder span{font-size:12px}.asset-placeholder small{margin-top:9px;font-size:8px;letter-spacing:.1em}
.mini-placeholder{width:40px;height:40px;margin:0 auto 10px;border:1px dashed #989289;display:flex!important;align-items:center;justify-content:center;font:10px "DM Sans",sans-serif!important;color:#898278}

@media (max-width:900px){
  .hero{display:block}
  .hero-copy{background:#f8f5ee}
  .hero-visual{position:relative;inset:auto;min-height:560px;background-image:url("assets/Asset_1.png");background-position:center 48%;background-size:cover}
  .product-stage{background-position:68% center}
  .product-stage .measure{top:auto;right:0;bottom:0;left:0;height:76px;padding:0 25px;border-left:0;border-top:1px solid rgba(0,0,0,.16);background:rgba(238,232,222,.96);display:flex;align-items:center;gap:14px}
  .product-stage .measure:before,.product-stage .measure:after{display:none}
  .product-stage .measure span{margin:0;padding-left:14px;border-left:1px solid rgba(0,0,0,.16)}
}

@media (max-width:480px){
  .hero-visual{min-height:520px}
  .coming-badge{right:5%}
  .feature-art{height:245px}
}

/* Typography hierarchy and reference-design alignment */
:root{
  --text-xs:12px;
  --text-sm:14px;
  --text-md:16px;
  --text-lg:18px;
}
.header-brand{display:inline-flex;align-items:baseline;gap:7px;letter-spacing:0}
.header-brand strong{font-family:"Noto Sans KR",sans-serif;font-size:24px;font-weight:800;letter-spacing:-.06em}
.header-brand span{margin:0;font-family:"DM Sans",sans-serif;font-size:11px;font-weight:600;letter-spacing:.06em;color:#656159}
.header-note{margin:0;font-size:14px;font-weight:500;letter-spacing:-.02em;line-height:1.4}
.eyebrow{font-size:12px}
.hero-description{font-size:18px}
.button{font-size:16px;border-radius:18px;padding:18px 25px}
.button-dark{background:var(--orange);color:var(--ink);box-shadow:none}
.button-dark:hover{box-shadow:0 12px 28px rgba(246,168,0,.28)}
.coming-badge small{font-size:11px}
.vertical-note{font-size:11px}
.section-heading>p:last-child{font-size:15px}
.problem-grid h3{font-size:16px}
.problem-grid article p{font-size:13px;line-height:1.65}
.problem-grid aside span{font-size:18px}
.promise li{font-size:15px}
.promise-end{font-size:16px}
.product-copy>p:not(.eyebrow){font-size:16px}
.product-copy dt{font-size:12px}
.product-copy dd{font-size:14px}
.measure{font-size:12px}
.feature-card h3{font-size:20px}
.feature-card p{font-size:14px;line-height:1.65}
.disclaimer{font-size:12px}
.transparency-copy>p:not(.eyebrow){font-size:15px}
.principles span{font-size:12px;line-height:1.5}
.final-cta>div>p:last-child{font-size:15px}
.button-light{border-radius:20px;font-size:16px;padding:21px 29px}
.final-cta ul{font-size:13px}
footer p,footer small,footer>a:last-child{font-size:11px}
.num{top:216px}

@media (max-width:900px){
  .site-header{align-items:center}
  .header-brand strong{font-size:22px}
  .header-note{font-size:12px}
  .hero-description{font-size:16px}
  .problem-grid article p{font-size:13px}
  .final-cta ul{font-size:12px}
}