/* 랜딩 전용 스타일. 색·기본 타이포는 style.css 변수를 그대로 써요. */
.lp{--foil:linear-gradient(135deg,#ffb3e0,#c3a8ff 35%,#9be7d6 68%,#9ccfff);--disp:'Black Han Sans','IBM Plex Sans KR',sans-serif}
.lp .top-nav a[aria-current=page]{box-shadow:none;color:var(--mute)}
.lp .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:14px 26px;font-weight:700;font-size:16px;text-decoration:none;border:1px solid transparent;transition:transform .15s,box-shadow .15s}
.lp .btn-main{background:var(--acc);color:var(--acc-ink);box-shadow:0 6px 18px -6px var(--acc)}
.lp .btn-main:hover{transform:translateY(-1px)}
.lp .btn-line{border-color:var(--line-2);color:var(--ink);background:transparent}
.lp .top .btn{padding:8px 18px;font-size:14px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* hero */
.hero{padding:56px 0 24px}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:24px;align-items:center}
.hero h1{font-family:var(--disp);font-weight:400;font-size:clamp(38px,6.4vw,70px);line-height:1.14;letter-spacing:-.01em;margin:0 0 20px}
.hero p.lead{font-size:18px;color:var(--mute);margin:0 0 28px;max-width:30em}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.hero .note{margin:16px 0 0;font-size:14px;color:var(--mute)}
.hero-art{width:100%;height:auto;display:block;overflow:visible}
@media(max-width:860px){.hero{padding-top:32px}.hero .wrap{grid-template-columns:1fr}.hero-art{max-width:460px;margin:0 auto}}

@keyframes settle{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){
  .hero-art .a1{animation:settle .7s .05s both cubic-bezier(.2,.7,.2,1)}
  .hero-art .a2{animation:settle .7s .2s both cubic-bezier(.2,.7,.2,1)}
  .hero-art .a3{animation:settle .7s .35s both cubic-bezier(.2,.7,.2,1)}
  .hero-art .a4{animation:settle .7s .5s both cubic-bezier(.2,.7,.2,1)}
}

/* promises */
.promise{border-block:1px solid var(--line);margin-top:40px}
.promise ul{list-style:none;margin:0 auto;padding:0 20px;max-width:1080px;display:grid;grid-template-columns:repeat(3,1fr)}
.promise li{padding:22px 24px 22px 0;font-size:15px}
.promise li+li{padding-left:24px;border-left:1px solid var(--line)}
.promise b{display:block;font-size:16px;margin-bottom:2px}
.promise span{color:var(--mute)}
@media(max-width:720px){.promise ul{grid-template-columns:1fr}.promise li,.promise li+li{padding:16px 0;border-left:0}.promise li+li{border-top:1px solid var(--line)}}

section.blk{padding:84px 0 0}
.blk h2{font-size:clamp(24px,3.4vw,34px);line-height:1.3;letter-spacing:-.025em;margin:0 0 10px}
.blk .sub{color:var(--mute);margin:0 0 36px;max-width:36em;font-size:16px}

/* what we buy */
.buy{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.buy article{padding:0 28px;border-left:1px solid var(--line)}
.buy{margin-inline:-28px}
.buy article:first-child{border-left:0}
.buy svg{width:100%;height:auto;display:block;margin-bottom:12px}
.buy h3{margin:0 0 6px;font-size:19px;letter-spacing:-.02em}
.buy p{margin:0;color:var(--mute);font-size:15px}
.no-buy{margin-top:32px;padding:16px 20px;border-radius:12px;background:var(--warn-bg);color:var(--warn);font-size:14.5px}
@media(max-width:820px){.buy{grid-template-columns:1fr;gap:36px;margin-inline:0}.buy article,.buy article:first-child{padding:0;border:0}.buy svg{max-width:360px}}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s}
.steps li{counter-increment:s;position:relative;padding-top:56px}
.steps li::before{content:counter(s);position:absolute;top:0;left:0;width:40px;height:40px;border-radius:50%;background:var(--foil);display:grid;place-items:center;font-family:var(--disp);font-size:20px;color:#1a1530}
.steps li::after{content:"";position:absolute;top:19px;left:52px;right:-8px;height:2px;background:var(--line)}
.steps li:last-child::after{display:none}
.steps h3{margin:0 0 6px;font-size:17px}
.steps p{margin:0;color:var(--mute);font-size:14.5px}
@media(max-width:820px){.steps{grid-template-columns:1fr;gap:26px}.steps li{padding:0 0 0 56px}.steps li::after{display:none}}

/* grade */
.grade{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px;align-items:center}
.rows{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.rows li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
.rows .chip{white-space:nowrap}
.tear{width:100%;max-width:420px;height:auto;justify-self:center}
.fine{color:var(--mute);font-size:14px;margin:14px 0 0}
@media(max-width:820px){.grade{grid-template-columns:1fr}}

/* faq */
.faq{border-top:1px solid var(--line);max-width:760px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 36px 18px 0;font-weight:600;font-size:16.5px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:14px;font-size:24px;font-weight:400;color:var(--mute);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 18px;color:var(--mute);max-width:40em}

/* closing */
.closing{margin-top:96px;background:var(--ink);color:var(--bg)}
.closing .wrap{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;padding-block:56px}
.closing h2{font-family:var(--disp);font-weight:400;font-size:clamp(28px,4.4vw,46px);line-height:1.2;margin:0 0 8px}
.closing p{margin:0;opacity:.7}
.closing .btn-main{background:var(--bg);color:var(--ink);box-shadow:none}
@media(max-width:720px){.closing .wrap{grid-template-columns:1fr}}
.lp .foot{margin-top:0}
@media(max-width:720px){.lp .top-nav{display:none}.lp .top-in{justify-content:space-between}}

/* reviews */
.rv-wrap{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px;align-items:start}
.rv-sum{position:sticky;top:88px}
.rv-score{font-family:var(--disp);font-size:72px;line-height:1}
.rv-stars{color:#f5a524;letter-spacing:2px;font-size:17px}
.rv-count{margin:8px 0 0;color:var(--mute);font-size:14px}
.rv-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.rv{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px 22px 18px;overflow:hidden}
.rv::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--foil)}
.rv:nth-child(even){transform:translateY(22px)}
.rv-title{margin:10px 0 8px;font-weight:700;font-size:17px;line-height:1.4;letter-spacing:-.02em}
.rv-body{margin:0 0 14px;color:var(--ink);opacity:.82;font-size:15px}
.rv-meta{margin:0;color:var(--mute);font-size:13px}
.rv-sample{position:absolute;top:14px;right:14px;font-size:11px;font-weight:700;color:var(--warn);background:var(--warn-bg);border-radius:999px;padding:2px 9px}
@media(max-width:860px){.rv-wrap{grid-template-columns:1fr;gap:24px}.rv-sum{position:static;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}.rv-score{font-size:52px}.rv-count{margin:0}.rv-list{grid-template-columns:1fr}.rv:nth-child(even){transform:none}}
.rv-label{color:var(--acc);background:var(--acc-soft)}