:root{
  --cream:#FBF6EF;
  --cream-2:#F5ECE0;
  --rose:#EBD6D1;
  --rose-soft:#F4E4E0;
  --rose-deep:#D9BDBB;
  --gold:#B58A57;
  --gold-soft:#C9A876;
  --espresso:#2C231D;
  --espresso-2:#3A2E27;
  --ink:#2C231D;
  --muted:#8C7C6E;
  --line:rgba(44,35,29,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Noto Sans KR',sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.serif{font-family:'Cormorant Garamond',serif}
.kserif{font-family:'Noto Serif KR',serif}
.logo-script{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;letter-spacing:.01em}
.logo-img-inline{height:.94em;width:auto;display:inline-block;vertical-align:-.25em}
.philo-logo-img{height:1.04em;width:auto;display:block}
.eyebrow{
  font-family:'Cormorant Garamond',serif;
  letter-spacing:.42em;text-transform:uppercase;
  font-size:.78rem;font-weight:600;color:var(--gold);
}
section{position:relative}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
img{display:block;max-width:100%}

/* ---- NAV ---- */
nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 40px;transition:.4s ease;
}
nav.scrolled{background:rgba(251,246,239,.86);backdrop-filter:blur(14px);padding:14px 40px;box-shadow:0 1px 0 var(--line)}
nav .brand{display:flex;align-items:center;gap:10px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.7rem;color:var(--ink);font-weight:600}
nav .navlinks{display:flex;gap:34px}
nav .navlinks a{
  font-family:'Cormorant Garamond',serif;letter-spacing:.22em;text-transform:uppercase;
  font-size:.82rem;font-weight:600;color:var(--ink);text-decoration:none;opacity:.72;transition:.25s;
}
nav .navlinks a:hover{opacity:1;color:var(--gold)}
nav.light .brand,nav.light .navlinks a{color:#fff}
nav.light.scrolled .brand,nav.light.scrolled .navlinks a{color:var(--ink)}
@media(max-width:760px){nav .navlinks{display:none}nav{padding:18px 24px}}

/* mark svg */
.mark{width:26px;height:34px;flex:none}
.mark path,.mark circle,.mark line{stroke:currentColor;fill:none;stroke-width:1.1}

/* brand logo */
nav .brand .logo{height:19px;width:auto;display:block}
nav .brand .logo-b{display:none}
nav:not(.light) .brand .logo-w{display:none}
nav:not(.light) .brand .logo-b{display:block}
nav.light.scrolled .brand .logo-w{display:none}
nav.light.scrolled .brand .logo-b{display:block}
.hero-logo-img{width:clamp(96px,13vw,168px);height:auto;opacity:.96;margin-bottom:16px}
.outro-logo-img{width:116px;height:auto;display:block;margin:0 auto 40px}

/* ---- HERO ---- */
.hero{min-height:100vh;display:flex;align-items:center;overflow:hidden;background:linear-gradient(120deg,#f0ddd0 0%,#e9cfc6 40%,#d8b7a6 100%)}
.hero .bg{position:absolute;inset:0;z-index:0}
.hero .bg img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(38,28,22,.58) 0%,rgba(38,28,22,.34) 40%,rgba(38,28,22,.08) 70%,rgba(38,28,22,0) 100%)}
.hero .wrap{position:relative;z-index:2;color:#fff;padding-top:60px}
.hero .mark-lg{width:56px;height:70px;color:#fff;opacity:.92;margin-bottom:30px}
.hero-logo{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:clamp(3.2rem,8vw,5.6rem);line-height:.9;letter-spacing:.01em}
.hero-tagline{font-family:'Cormorant Garamond',serif;letter-spacing:.4em;text-transform:uppercase;font-size:clamp(.8rem,1.8vw,1.05rem);font-weight:600;margin-top:18px;opacity:.95}
.hero h1{font-family:'Noto Serif KR',serif;font-weight:400;font-size:clamp(1.6rem,4.4vw,2.9rem);line-height:1.5;margin-top:38px;text-shadow:0 2px 24px rgba(30,20,15,.25);max-width:16em}
.hero h1 em{font-style:normal;color:#fbeee6;font-weight:600}
.hero .sub{margin-top:22px;font-size:1rem;font-weight:300;opacity:.9;letter-spacing:.02em}
.scrolldown{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);z-index:3;color:#fff;display:flex;flex-direction:column;align-items:center;gap:9px;font-family:'Cormorant Garamond',serif;letter-spacing:.3em;font-size:.7rem;text-transform:uppercase;opacity:.85}
.scrolldown .bar{width:1px;height:46px;background:#fff;animation:drop 2.1s infinite}
@keyframes drop{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---- MANIFESTO ---- */
.manifesto{background:var(--espresso);padding:150px 0;text-align:center;color:#F1E7DD}
.manifesto .lead{font-family:'Noto Serif KR',serif;font-weight:300;font-size:clamp(1.5rem,3.6vw,2.5rem);line-height:1.6}
.manifesto .strike{color:#9a8b7d;position:relative;display:inline-block}
.manifesto .strike::after{content:"";position:absolute;left:-4%;right:-4%;top:52%;height:1px;background:#9a8b7d}
.manifesto .arrow{margin:40px auto;width:1px;height:56px;background:linear-gradient(var(--gold),transparent)}
.manifesto .answer{font-family:'Noto Serif KR',serif;font-weight:600;font-size:clamp(1.9rem,5vw,3.3rem);line-height:1.5;color:#fff}
.manifesto .answer b{color:var(--gold-soft);font-weight:600}
.manifesto .note{margin-top:46px;font-size:1rem;font-weight:300;color:#b7a99c;letter-spacing:.02em}

/* ---- PHILOSOPHY ---- */
.philo{padding:140px 0;background:var(--cream)}
.philo .head{text-align:center;margin-bottom:74px}
.philo h2{font-family:'Noto Serif KR',serif;font-weight:600;font-size:clamp(1.9rem,4.4vw,2.8rem);margin-top:16px;line-height:1.4}
.philo-grid{display:grid;grid-template-columns:auto minmax(100px,1fr) calc((100% - 100px)/2);gap:0;align-items:stretch}
.philo-col{padding:44px;display:flex;flex-direction:column;justify-content:center;border-radius:8px}
.philo-col .tag{font-family:'Cormorant Garamond',serif;letter-spacing:.32em;text-transform:uppercase;font-size:.78rem;color:var(--gold);font-weight:600}
.philo-col .big{font-family:'Noto Serif KR',serif;font-size:clamp(2.4rem,5vw,3.4rem);font-weight:500;margin:18px 0 8px;height:1.75em;display:flex;align-items:center}
.philo-col .roman{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.3rem;color:var(--muted);letter-spacing:.04em}
.philo-col .quote{font-family:'Noto Serif KR',serif;font-weight:300;font-style:normal;font-size:1.15rem;line-height:1.7;margin-top:26px;color:var(--ink)}
.philo-col .cap{margin-top:20px;font-weight:500;font-size:.98rem}
.philo .mid{display:flex;align-items:center;justify-content:center;align-self:center}
.philo .mid .circle{width:74px;height:74px;border-radius:50%;background:var(--espresso);color:#fff;display:flex;align-items:center;justify-content:center}
.philo .mid .circle svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.philo-col.right{background:var(--rose-soft)}
.philo .banner{margin-top:56px;background:var(--espresso);color:#fff;text-align:center;padding:30px;border-radius:8px;font-family:'Noto Serif KR',serif;font-weight:500;font-size:clamp(1rem,2.4vw,1.35rem)}
@media(min-width:821px){.philo-col:not(.right){padding-right:0}}
@media(max-width:820px){.philo-grid{grid-template-columns:1fr}.philo .mid{padding:24px 0}.philo .mid .circle{transform:rotate(90deg)}}

/* ---- KEYWORDS ---- */
.keys{padding:130px 0;background:var(--cream-2)}
.keys .head{text-align:center;margin-bottom:70px}
.keys h2{font-family:'Noto Serif KR',serif;font-weight:600;font-size:clamp(1.9rem,4.4vw,2.8rem);margin-top:14px}
.keys .sub{color:var(--muted);margin-top:14px;font-weight:300}
.keys-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.kcard{background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:48px 38px;text-align:center;transition:.4s ease}
.kcard:hover{transform:translateY(-8px);box-shadow:0 24px 50px -28px rgba(60,40,30,.4);border-color:transparent}
.kcard .num{font-family:'Cormorant Garamond',serif;font-size:2.4rem;color:var(--gold-soft);font-weight:500}
.kcard .en{font-family:'Cormorant Garamond',serif;font-size:1.8rem;font-weight:600;letter-spacing:.02em;margin-top:6px}
.kcard .ko{font-family:'Noto Serif KR',serif;font-size:1.15rem;font-weight:600;color:var(--gold);margin-top:2px}
.kcard p{margin-top:20px;color:var(--muted);font-weight:300;font-size:.98rem;line-height:1.7}
@media(max-width:820px){.keys-grid{grid-template-columns:1fr;gap:18px}}

/* ---- PRODUCT ---- */
.prod{padding:0;background:var(--rose-soft)}
.prod-hero{display:grid;grid-template-columns:1.05fr 1fr;min-height:88vh}
.prod-hero .img{position:relative;overflow:hidden;background:#e9cfc6}
.prod-hero .img img{width:100%;height:100%;object-fit:cover}
.prod-hero .txt{display:flex;flex-direction:column;justify-content:center;padding:90px 8%}
.prod-hero .eyebrow{margin-bottom:18px}
.prod-hero h2{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(2.4rem,4.6vw,3.6rem);line-height:1.02;letter-spacing:.01em}
.prod-hero .ko-name{font-family:'Noto Serif KR',serif;font-size:1.35rem;font-weight:500;margin-top:12px;color:var(--gold)}
.prod-hero .tags{margin-top:16px;font-family:'Cormorant Garamond',serif;letter-spacing:.06em;color:var(--muted);font-size:1rem}
.prod-hero .desc{margin-top:26px;font-weight:300;line-height:1.85;font-size:1.05rem;max-width:30em}
.prod-hero .meta{margin-top:30px;display:grid;grid-template-columns:auto 1fr;gap:8px 24px;font-size:.95rem}
.prod-hero .meta dt{font-family:'Cormorant Garamond',serif;letter-spacing:.16em;text-transform:uppercase;font-size:.78rem;color:var(--gold);font-weight:600;align-self:center}
.prod-hero .meta dd{font-weight:400}
.prod-hero .price{font-family:'Noto Serif KR',serif;font-size:1.5rem;font-weight:600;margin-top:0}
.prod-hero .buy{margin-top:8px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.prod-hero .buy-btn{display:inline-block;padding:13px 30px;border-radius:12px;background:var(--espresso);color:#fff;text-decoration:none;font-size:.95rem;font-weight:500;letter-spacing:.02em;transition:background .3s ease,transform .3s ease}
.prod-hero .buy-btn:hover{background:var(--gold);transform:translateY(-2px)}
@media(max-width:820px){.prod-hero{grid-template-columns:1fr}.prod-hero .img{min-height:60vh}.prod-hero .txt{padding:64px 32px}}

.feat{padding:120px 0;background:var(--cream)}
.feat .head{text-align:center;margin-bottom:64px}
.feat h3{font-family:'Noto Serif KR',serif;font-weight:600;font-size:clamp(1.6rem,3.6vw,2.3rem);margin-top:12px;line-height:1.4}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.fcard{text-align:center;padding:20px}
.fcard .n{width:52px;height:52px;border-radius:50%;background:var(--rose);color:var(--espresso);display:flex;align-items:center;justify-content:center;margin:0 auto 22px;font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600}
.fcard h4{font-family:'Noto Serif KR',serif;font-size:1.2rem;font-weight:600;margin-bottom:12px}
.fcard p{color:var(--muted);font-weight:300;line-height:1.75;font-size:.98rem}
.ingredients{margin-top:70px;background:var(--espresso);color:#fff;border-radius:10px;padding:44px;text-align:center}
.ingredients .lab{font-family:'Cormorant Garamond',serif;letter-spacing:.3em;text-transform:uppercase;font-size:.76rem;color:var(--gold-soft);font-weight:600}
.ingredients .list{margin-top:18px;display:flex;flex-wrap:wrap;justify-content:center;gap:14px 30px;font-family:'Cormorant Garamond',serif;font-size:1.15rem;letter-spacing:.05em}
.ingredients .list span{position:relative}
.ingredients .list span:not(:last-child)::after{content:"·";position:absolute;right:-17px;color:var(--gold)}
@media(max-width:820px){.feat-grid{grid-template-columns:1fr;gap:20px}}

/* parallax band */
.parallax{position:relative;min-height:78vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.parallax .pbg{position:absolute;inset:0;background-size:cover;background-position:center;background-attachment:fixed}
.parallax .pbg::after{content:"";position:absolute;inset:0;background:rgba(30,20,15,.30)}
.parallax .pin{position:relative;z-index:2;color:#fff;padding:40px}
.parallax .eyebrow{color:var(--gold-soft)}
.parallax .pq{font-family:'Noto Serif KR',serif;font-weight:300;font-size:clamp(1.5rem,3.6vw,2.5rem);line-height:1.6;margin-top:20px;text-shadow:0 2px 30px rgba(20,12,8,.4)}
.parallax .pq b{font-weight:600;color:#fbeee6}
@media(max-width:760px){.parallax .pbg{background-attachment:scroll}}

/* split showcase */
.showcase{display:grid;grid-template-columns:1fr 1fr}
.showcase .cell{min-height:70vh;position:relative;overflow:hidden}
.showcase .cell img{width:100%;height:100%;object-fit:cover}
.showcase .cap{position:absolute;left:0;bottom:0;right:0;padding:40px;background:linear-gradient(transparent,rgba(30,20,15,.6));color:#fff}
.showcase .cap .t{font-family:'Noto Serif KR',serif;font-size:1.3rem;font-weight:500}
.showcase .cap .d{font-weight:300;font-size:.95rem;margin-top:6px;opacity:.9}
.showcase{background:#EBD9D3;padding:14px;gap:14px}
.showcase .cell{padding:0}
.showcase .cell img{border-radius:22px}
.showcase .cap{left:0;right:0;bottom:0;border-radius:0 0 22px 22px}
.showcase .cell.mat{background:transparent;border-radius:22px;padding:0}
.showcase .cell.mat img{border-radius:22px}
.showcase .cell.mat .cap{left:0;right:0;bottom:0;border-radius:0 0 22px 22px}
.showcase .cell.mat .crop{position:absolute;inset:0;border-radius:22px;overflow:hidden}
.showcase .cell.mat .crop img{width:100%;height:100%;object-fit:cover;border-radius:0;transform:scale(1.12)}
@media(max-width:760px){.showcase{grid-template-columns:1fr}.showcase .cell{min-height:60vh}}

/* positioning band */
.posband{padding:120px 0;background:var(--cream-2);text-align:center}
.posband .quote{font-family:'Noto Serif KR',serif;font-weight:300;font-size:clamp(1.5rem,3.4vw,2.3rem);line-height:1.6;max-width:20em;margin:0 auto}
.posband .quote b{font-weight:600;color:var(--gold)}
.posband .row{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:900px;margin-left:auto;margin-right:auto}
.posband .pc{padding:34px 20px;border-radius:8px;background:var(--cream);border:1px solid var(--line)}
.posband .pc.me{background:var(--rose);border-color:transparent}
.posband .pc .nm{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:600;color:var(--muted);display:flex;align-items:center;justify-content:center;min-height:1.7em}
.posband .pc.me .nm{font-style:italic;color:var(--espresso)}
.posband .pc .ds{margin-top:8px;font-size:.92rem;color:var(--muted);font-weight:300}
.posband .pc.me .ds{color:var(--espresso);font-weight:400}
@media(max-width:760px){.posband .row{grid-template-columns:1fr}}

/* ---- MOVEMENT ---- */
.move{padding:0;background:var(--espresso);color:#fff}
.move-grid{display:grid;grid-template-columns:1fr 1fr}
.move .img{position:relative;overflow:hidden;min-height:100%}
.move .img img{width:100%;height:100%;object-fit:cover;min-height:640px}
.move .txt{padding:110px 7%}
.move .eyebrow{color:var(--gold-soft)}
.move h2{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(2.2rem,4.4vw,3.2rem);margin:18px 0 10px;letter-spacing:.01em}
.move .khead{font-family:'Noto Serif KR',serif;font-size:1.2rem;color:#d8c8bb;font-weight:300;margin-bottom:40px}
.timeline{position:relative;padding-left:0}
.tl{display:flex;gap:24px;padding:20px 0;border-top:1px solid rgba(255,255,255,.13)}
.tl:last-child{border-bottom:1px solid rgba(255,255,255,.13)}
.tl .day{flex:none;width:58px;height:58px;border-radius:50%;background:rgba(201,168,118,.16);color:var(--gold-soft);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.05rem;border:1px solid rgba(201,168,118,.4)}
.tl .day.final{background:var(--gold);color:var(--espresso);border-color:var(--gold)}
.tl .info h4{font-family:'Noto Serif KR',serif;font-weight:600;font-size:1.1rem}
.tl .info p{color:#b7a99c;font-weight:300;font-size:.95rem;margin-top:2px}
.move .note{margin-top:36px;font-family:'Noto Serif KR',serif;font-style:normal;font-weight:300;color:#cdbdae;line-height:1.7}
@media(max-width:820px){.move-grid{grid-template-columns:1fr}.move .txt{padding:70px 32px}.move .img img{min-height:420px}}

/* ---- OUTRO ---- */
.outro{padding:180px 0;text-align:center;position:relative;overflow:hidden;background:#e7cbc2}
.outro .obg{position:absolute;inset:0;background-size:cover;background-position:center}
.outro .obg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(251,246,239,.72),rgba(247,232,224,.82))}
.outro .wrap{position:relative;z-index:2}
.outro .mark-lg{width:70px;height:88px;color:var(--gold);margin:0 auto 40px}
.outro .big{font-family:'Noto Serif KR',serif;font-weight:600;font-size:clamp(1.8rem,4.6vw,3rem);line-height:1.5;color:var(--espresso)}
.outro .oyf{font-family:'Cormorant Garamond',serif;letter-spacing:.34em;text-transform:uppercase;font-weight:600;font-size:clamp(1rem,2.4vw,1.35rem);margin-top:30px;color:var(--gold)}
.outro .cta{margin-top:50px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.btn{font-family:'Cormorant Garamond',serif;letter-spacing:.16em;text-transform:uppercase;font-size:.9rem;font-weight:600;padding:16px 40px;border-radius:40px;text-decoration:none;transition:.3s ease;display:inline-block}
.btn.solid{background:var(--espresso);color:#fff}
.btn.solid:hover{background:#000;transform:translateY(-2px)}
.btn.ghost{border:1px solid var(--espresso);color:var(--espresso)}
.btn.ghost:hover{background:var(--espresso);color:#fff}

/* ---- FOOTER ---- */
footer{background:var(--espresso);color:#cdbdae;padding:80px 0 44px}
.foot-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:40px;padding-bottom:44px}
.foot-brand .fl{display:flex;align-items:center;gap:12px;color:#fff}
.foot-brand .fl .logo-script{font-size:2.2rem}
.foot-brand .mark{width:26px;height:34px;color:var(--gold-soft)}
.foot-brand p{margin-top:16px;font-weight:300;font-size:.95rem;max-width:34em;line-height:1.7}
.foot-cols{display:flex;gap:70px;flex-wrap:wrap}
.foot-col h5{font-family:'Cormorant Garamond',serif;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft);font-size:.78rem;font-weight:600;margin-bottom:16px}
.foot-col a,.foot-col p{display:block;color:#cdbdae;text-decoration:none;font-weight:300;font-size:.92rem;line-height:2;transition:.2s}
.foot-col a:hover{color:#fff}
.foot-bottom{margin-top:34px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:.8rem;font-weight:300;color:#9a8b7d}
.foot-bottom .oyf{font-family:'Cormorant Garamond',serif;font-style:italic;letter-spacing:.04em}
.foot-brand .fl .foot-logo-img{height:32px;width:auto;display:block}
.foot-company{padding-top:34px;border-top:1px solid rgba(255,255,255,.12);display:grid;gap:9px}
.foot-company .fc-row{display:grid;grid-template-columns:180px 1fr;gap:16px;font-size:.86rem;font-weight:300;line-height:1.7}
.foot-company .k{font-family:'Cormorant Garamond',serif;letter-spacing:.18em;text-transform:uppercase;font-size:.72rem;font-weight:600;color:var(--gold-soft);padding-top:.28em}
.foot-company .v{color:#cdbdae}
.foot-company a{color:#cdbdae;text-decoration:none;transition:.2s}
.foot-company a:hover{color:#fff}
@media(max-width:640px){.foot-company .fc-row{grid-template-columns:1fr;gap:2px}}
.posband .pc.me .nm .pc-logo-img{height:1.5em;width:auto;display:block;margin:0 auto}

/* reveal — hidden state only applies when JS is active (progressive enhancement) */
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity 1s ease,transform 1s ease}
.js .reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.12s}.reveal.d2{transition-delay:.24s}.reveal.d3{transition-delay:.36s}
@media(prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

/* ---- 원본의 인라인 style 속성을 옮겨온 규칙 ---- */
.svg-defs{position:absolute}
.logo-img-inline.logo-img-heading{height:1.18em;vertical-align:-.30em;margin-right:.22em}
.prod-hero .meta dd.mood{font-style:italic;font-size:1.05rem}
.parallax .pbg{background-image:url('../images/parallax-snow.jpg')}
.tl .day .day-logo-img{width:23px;height:auto;display:block}
.outro .obg{background-image:url('../images/outro-bg.jpg')}