:root{
  --brand:'Oswald','Pretendard',sans-serif;
  --sans:'Pretendard','Malgun Gothic',sans-serif;
  --ivory:#f7f3ee; --graphite:#2e2d2b; --coral:#eb8d69;
  --stone:#b7aea3; --rose:#d6b5aa; --sage:#aab2a6; --cocoa:#51463f; --white:#fff;
  --ink:#2e2d2b; --muted:#8c8377; --line:#e8e1d7; --paper:#ffffff;
  --maxw:1500px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
     font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;
     overflow-x:clip;width:100%;max-width:100%}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.eyebrow{font-size:12.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin:0 0 16px}
.link-u{display:inline-block;font-size:13.5px;letter-spacing:.16em;text-transform:uppercase;
        border-bottom:1px solid currentColor;padding-bottom:3px}
.btn{display:inline-block;background:var(--graphite);color:var(--ivory);font-size:13px;letter-spacing:.12em;
     text-transform:uppercase;padding:14px 30px;border-radius:1px}
.btn:hover{background:#413f3c}
.grain{position:relative}
.grain::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.1;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* announcement */
.anno{background:var(--coral);color:#000;font-size:12px;font-weight:500;
      letter-spacing:.14em;text-transform:uppercase;padding:9px 0;overflow:hidden;white-space:nowrap;position:relative;z-index:30}
.anno-track{display:flex;width:max-content;will-change:transform;animation:annoMarq 30s linear infinite}
.anno:hover .anno-track{animation-play-state:paused}
.anno-item{flex:0 0 auto}
.anno-item::after{content:"·";padding:0 clamp(22px,4vw,60px);opacity:.5}
@keyframes annoMarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.anno{text-align:center}.anno-track{width:auto;display:block;animation:none}.anno-item:not(:first-child){display:none}.anno-item::after{display:none}}
.anno .c{opacity:.45}

/* header */
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);
       border-bottom:1px solid var(--line);padding-top:18px}
.hbar{max-width:var(--maxw);margin:0 auto;padding:0 26px;height:89px;
      display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.nav-left{display:flex;align-items:center;gap:22px}
nav.main{display:flex;gap:24px;font-size:15px}
nav.main a{color:var(--ink);opacity:.72;padding:6px 0}
nav.main a:hover,nav.main a.active{opacity:1}
.brand{font-family:var(--brand);font-weight:450;font-size:31px;letter-spacing:.10em;
       text-align:center;text-transform:uppercase;color:var(--ink)}
.reg{font-size:.32em;vertical-align:baseline;position:relative;top:-.10em;margin-left:.02em;letter-spacing:0;font-weight:400}
.brand-logo{display:block;height:35px;width:auto;margin:0 auto}
.mm-logo-img{height:22px;margin:0}
.fbrand .flogo-img{display:block;height:22px;width:auto;filter:invert(1);margin-bottom:10px}
.icons{display:none;gap:19px;justify-content:flex-end;align-items:center}  /* 검색·로그인·장바구니 임시 숨김 */
.icons svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.4}

/* hamburger */
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:4px;cursor:pointer}
.burger span{display:block;width:22px;height:1.6px;background:var(--ink)}
@media (max-width:900px){ nav.main{display:none} .burger{display:flex} }

/* mobile menu */
.mobile-menu{display:none;position:fixed;inset:0;z-index:40;background:var(--ivory);padding:22px 26px}
.mobile-menu.open{display:block}
body.menu-open{overflow:hidden}
.mm-top{display:flex;justify-content:space-between;align-items:center;height:44px}
.mm-logo{font-family:var(--brand);font-weight:450;font-size:24px;letter-spacing:.1em;text-transform:uppercase}
.mm-close{background:none;border:0;font-size:30px;line-height:1;cursor:pointer;color:var(--ink)}
.mobile-menu nav{display:flex;flex-direction:column;margin-top:22px}
.mobile-menu nav a{font-size:23px;padding:18px 0;border-bottom:1px solid var(--line);color:var(--ink)}
.mobile-menu nav a.sub{font-size:15px;color:var(--muted);padding:13px 0;border:0;letter-spacing:.02em}

/* hero */
.hero{position:relative;height:84vh;min-height:540px;overflow:hidden;display:flex;align-items:flex-end;
      background:linear-gradient(160deg,#f3ece0 0%,#e6d9c9 46%,#cdbdaa 100%)}
.hero .wrap{max-width:var(--maxw);margin:0 auto;width:100%;padding:0 26px 60px;position:relative;z-index:2}
.hero .copy{max-width:680px}
.hero h1{font-weight:400;font-size:clamp(38px,6vw,74px);line-height:1.08;letter-spacing:-.01em;margin:0 0 18px;color:var(--graphite)}
.hero p{font-size:17px;max-width:440px;margin:0 0 28px;color:#5a534a}
.hero .actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
/* 히어로 슬라이드쇼 (이미지 있을 때) */
.hero.has-slides{width:100%;height:auto;aspect-ratio:16/9;min-height:440px;background:#141210}
.hero-slides,.hero-slides .hslide{position:absolute;inset:0;z-index:0}
.hero-m{display:none}
.hslide{background-size:cover;background-position:center;opacity:0;transition:opacity 1.1s ease}
.hslide.on{opacity:1}
.hero-veil{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(20,18,16,.5) 0%,rgba(20,18,16,.12) 22%,rgba(20,18,16,.1) 55%,rgba(20,18,16,.62) 100%)}
.hero.has-slides h1{color:#fff;margin-bottom:34px}
.hero.has-slides .copy>p{color:rgba(255,255,255,.92);line-height:1.95}
.hero.has-slides .eyebrow{color:#fff;opacity:.9}
.hero.has-slides .link-u{color:#fff}
.hero.has-slides .wrap{padding-bottom:310px}
.hero.has-slides .actions{margin-top:70px}
@media (max-width:760px){
  header{padding-top:4px}
  .hbar{height:56px}
  .brand-logo{height:24px}
  .hero.has-slides{aspect-ratio:auto;min-height:86vh}
  .hero.has-slides.has-m{aspect-ratio:4/5;min-height:0;max-height:none}
  .hero.has-slides .wrap{padding-bottom:44px}
  .hero.has-slides .eyebrow{font-size:11px;letter-spacing:.16em}
  .hero.has-slides h1{font-size:29px;margin-bottom:12px}
  .hero.has-slides .copy>p{font-size:13.5px;line-height:1.7}
  .hero.has-slides .actions{margin-top:24px;gap:8px}
  .hero.has-slides .btn{padding:12px 22px;font-size:12px}
  .hero.has-slides .link-u{font-size:12px}
  .hero.has-m .hero-d{display:none}
  .hero.has-m .hero-m{display:block}
}
/* 홈 투명 헤더 → 스크롤 시 불투명 (히어로 이미지 있을 때만) */
body.home.hero-img .hero.has-slides{margin-top:-108px}
body.home.hero-img header{background:transparent;border-bottom-color:transparent;backdrop-filter:none;transition:background .3s ease,border-color .3s ease}
body.home.hero-img header .brand-logo{filter:invert(1)}
body.home.hero-img nav.main a{color:#fff;opacity:.9}
body.home.hero-img nav.main a:hover,body.home.hero-img nav.main a.active{opacity:1}
body.home.hero-img .burger span{background:#fff}
body.home.hero-img header.scrolled{background:rgba(0,0,0,.42);border-bottom-color:transparent;backdrop-filter:blur(8px)}
/* 모바일: 헤더 높이(61px)에 맞춰 히어로 오버랩 축소 (기본 -108 뒤에 배치해 우선) */
@media (max-width:760px){ body.home.hero-img .hero.has-slides{margin-top:-61px} }

section.pad{max-width:var(--maxw);margin:0 auto;padding:clamp(72px,9vw,120px) 26px}
.center{text-align:center}
.sec-head{margin-bottom:44px}
.sec-head h2{font-size:clamp(24px,3.2vw,36px);font-weight:400;letter-spacing:-.01em;margin:0}

.oneline{background:var(--ivory);text-align:center;padding:clamp(64px,9vw,112px) 26px}
.oneline p{font-size:clamp(22px,3.4vw,38px);line-height:1.32;font-weight:400;letter-spacing:-.005em;
           max-width:860px;margin:0 auto;color:var(--graphite)}

/* product cards / collection */
.coll{background:var(--paper)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:820px){ .grid3{grid-template-columns:1fr} }
.pcard{display:block}
.pcard .img{aspect-ratio:3/4;border-radius:2px;overflow:hidden;position:relative}
.pcard .img::after{content:"";position:absolute;inset:0;background:rgba(46,45,43,0);transition:background .3s}
.pcard:hover .img::after{background:rgba(46,45,43,.05)}
.pcard .name{font-size:16.5px;margin:16px 2px 3px;color:var(--graphite)}
.pcard .price{font-size:14px;color:var(--muted)}
.ph-tank{background:linear-gradient(150deg,#e7ded2,#cbbfb0)}
.ph-legging{background:linear-gradient(150deg,#d9cdc0,#b7aea3)}
.ph-sleeve{background:linear-gradient(150deg,#e3d5cd,#d6b5aa)}
.ph-bra{background:linear-gradient(150deg,#e0d6ca,#c3b7a6)}
.ph-socks{background:linear-gradient(150deg,#d7cfc4,#b3a795)}
.ph-cardigan{background:linear-gradient(150deg,#e5dacd,#d0b9a6)}

/* hero product (home) */
.feat{background:var(--white)}
.feat .in{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:0}
@media (max-width:860px){ .feat .in{grid-template-columns:1fr} }
.feat .art{min-height:560px;background:linear-gradient(150deg,#e6dccf,#c9b8a6)}
@media (max-width:860px){ .feat .art{min-height:0;aspect-ratio:4/5} }
.feat .txt{padding:clamp(48px,6vw,92px)}
.feat .txt .eyebrow{color:var(--coral)}
.feat h2{font-size:clamp(26px,3.4vw,42px);font-weight:400;line-height:1.14;letter-spacing:-.01em;margin:0 0 8px;color:var(--graphite)}
.feat .kr{font-size:15px;color:var(--muted);margin:0 0 22px}
.feat p{font-size:16.5px;color:#4d473f;max-width:440px;margin:0 0 20px}
.feat ul{list-style:none;padding:0;margin:0 0 30px;font-size:15px;color:#4d473f;line-height:1.9}
.feat ul li{padding-left:18px;position:relative}
.feat ul li::before{content:"";position:absolute;left:0;top:12px;width:6px;height:6px;border-radius:50%;background:var(--coral)}

.pillars{background:var(--ivory)}
.pillars .grid3{gap:40px}
.pillar{text-align:center}
.pillar .k{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--coral);margin-bottom:12px}
.pillar h3{font-size:20px;font-weight:400;margin:0 0 10px;color:var(--graphite)}
.pillar p{font-size:15px;color:var(--muted);line-height:1.65;max-width:320px;margin:0 auto}

.banner{position:relative;height:64vh;min-height:440px;overflow:hidden;
        background:linear-gradient(120deg,#c9bcab 0%,#a99a89 100%)}
.banner .veil{position:absolute;inset:0;background:linear-gradient(to top,rgba(46,45,43,.42),transparent 58%)}
.banner .copy{position:absolute;right:0;left:auto;bottom:52px;padding:0 clamp(26px,5vw,80px);color:var(--ivory);z-index:2;max-width:560px;text-align:left}
.banner h2{font-size:clamp(26px,4vw,48px);font-weight:400;line-height:1.1;letter-spacing:-.01em;margin:0 0 16px}
.banner p{font-size:16px;opacity:.94;margin:0 0 22px;max-width:400px}

.philo{background:var(--cocoa);color:#e9e0d6;text-align:center;padding:clamp(88px,13vw,160px) 26px}
.philo .eyebrow{color:rgba(233,224,214,.6)}
.philo p{font-size:clamp(22px,3.2vw,34px);line-height:1.4;font-weight:400;letter-spacing:-.005em;
         max-width:780px;margin:0 auto;color:#f2ebe1}

.reviews{background:var(--paper)}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:820px){ .rgrid{grid-template-columns:1fr} }
.review{background:var(--white);border:1px solid var(--line);border-radius:3px;padding:28px 26px}
.review .stars{color:var(--coral);font-size:13px;letter-spacing:.2em;margin-bottom:14px}
.review p{font-size:15.5px;line-height:1.7;margin:0 0 16px;color:#453f38}
.review .who{font-size:13px;color:var(--muted)}

.journal-sec{background:var(--ivory)}
.jgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:820px){ .jgrid{grid-template-columns:1fr} }
.jcard .img{aspect-ratio:3/2;border-radius:2px;overflow:hidden}
.jcard .cat{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--coral);margin:16px 0 6px}
.jcard .t{font-size:17px;color:var(--graphite);line-height:1.4}
.jm1{background:linear-gradient(150deg,#dfd4c6,#b7aea3)}
.jm2{background:linear-gradient(150deg,#e3d3cb,#d6b5aa)}
.jm3{background:linear-gradient(150deg,#d3d6cd,#aab2a6)}

.news{background:var(--paper);padding:84px 26px;text-align:center;border-top:1px solid var(--line)}
.news h3{font-size:clamp(22px,3vw,30px);font-weight:400;margin:0 0 10px}
.news p{color:var(--muted);font-size:16px;margin:0 auto 24px;max-width:480px}
.news form{display:flex;max-width:440px;margin:0 auto;border:1px solid var(--graphite)}
.news input{flex:1;border:0;padding:15px 16px;font:inherit;background:transparent;outline:none;color:var(--ink)}
.news button{border:0;background:var(--coral);color:#fff;padding:0 24px;font-size:14px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.news .fine{font-size:12px;color:var(--muted);margin-top:14px}

/* ============ inner pages ============ */
.page-head{max-width:var(--maxw);margin:0 auto;padding:52px 26px 6px;text-align:center}
.page-head .eyebrow{margin-bottom:12px}
.page-head h1{font-size:clamp(26px,3.4vw,42px);font-weight:400;letter-spacing:-.01em;margin:0;color:var(--graphite)}
.page-head p{color:var(--muted);margin:14px auto 0;max-width:560px}

/* breadcrumb */
.crumb{max-width:var(--maxw);margin:0 auto;padding:22px 26px 0;font-size:12.5px;color:var(--muted);letter-spacing:.02em}
.crumb a:hover{color:var(--ink)}
.crumb span{margin:0 9px;opacity:.5}

/* sold-out / colors */
.pcard-media{position:relative}
.pcard-media .soldtag{position:absolute;top:12px;left:12px;background:rgba(46,45,43,.82);color:#fff;
       font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border-radius:2px}
.soldbadge{display:inline-block;font-size:12px;letter-spacing:.04em;color:#b4460f;background:#fbeae3;
       padding:3px 11px;border-radius:20px;vertical-align:middle;margin-left:10px}
.pcolors{font-size:13.5px;color:var(--muted);margin:-8px 0 22px;letter-spacing:.01em}
/* variants (color swatches / thumbs / size stock) */
.pdp-media .main{background-color:#e7ded2}
.vthumb{aspect-ratio:1;border:1px solid var(--line);border-radius:2px;cursor:pointer;background:#eee center/cover;padding:0}
.vthumb.on{border-color:var(--graphite)}
.pvar-label{font-size:12.5px;letter-spacing:.04em;color:var(--graphite);margin:0 0 9px}
.swatches{display:flex;gap:8px;flex-wrap:wrap}
.sw{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);cursor:pointer;background:#e7ded2 center/cover;padding:0}
.sw.on{outline:2px solid var(--graphite);outline-offset:2px}
.sizes button.soldout{color:#c3bcb2;text-decoration:line-through;cursor:not-allowed;border-color:var(--line)}
.gthumb{aspect-ratio:1;border:1px solid var(--line);border-radius:2px;cursor:pointer;background:#eee center/cover;padding:0}
.gthumb.on{border-color:var(--graphite)}
.pdp-detail{max-width:760px;margin:0 auto 70px;padding:0 26px;line-height:1.85;color:#3a352d;font-size:16px}
.pdp-detail img{max-width:100%;border-radius:2px;margin:8px 0}
.pdp-detail h2{font-size:clamp(21px,2.6vw,27px);font-weight:400;letter-spacing:-.01em;margin:34px 0 12px;color:var(--graphite)}
.pdp-detail h1{font-size:clamp(15px,1.6vw,17px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--coral);margin:40px 0 14px}
.pdp-detail p{margin:0 0 16px}
.pdp-detail ul{list-style:none;margin:0 0 22px;padding:0}
.pdp-detail li{position:relative;padding-left:18px;margin:0 0 15px;line-height:1.7}
.pdp-detail li::before{content:"";position:absolute;left:1px;top:11px;width:5px;height:5px;border-radius:50%;background:var(--coral)}
.pdp-detail li strong{display:block;font-weight:600;color:#1a1a1a;margin-bottom:2px}
.pdp-detail strong{font-weight:600;color:#1a1a1a}
.pdp-detail:first-child,.pdp-detail>*:first-child{margin-top:0}

/* shop list */
.plist{max-width:var(--maxw);margin:0 auto;padding:38px 26px 104px;
       display:grid;grid-template-columns:repeat(3,1fr);gap:26px 18px}
@media (max-width:860px){ .plist{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .plist{grid-template-columns:1fr} }

/* product detail */
.pdp{max-width:var(--maxw);margin:0 auto;padding:22px 26px 90px;display:grid;
     grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,72px);align-items:start}
@media (max-width:860px){ .pdp{grid-template-columns:1fr;gap:32px} }
.pdp-media .main{aspect-ratio:4/5;border-radius:3px}
.pdp-media .thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px}
.pdp-media .thumbs div{aspect-ratio:1;border-radius:2px;opacity:.9}
.pdp-info{padding-top:6px}
.pdp-info h1{font-size:clamp(24px,3vw,34px);font-weight:400;letter-spacing:-.01em;margin:0 0 6px;color:var(--graphite)}
.pdp-info .oneword{color:var(--muted);font-size:15px;margin:0 0 18px}
.pdp-info .price{font-size:22px;margin:0 0 26px;color:var(--graphite)}
.pdp-desc{font-size:16px;color:#4d473f;line-height:1.85;margin:0 0 28px}
.sizes{display:flex;gap:10px;margin:0 0 10px;flex-wrap:wrap}
.sizes button{min-width:54px;padding:12px 14px;border:1px solid var(--line);background:#fff;font:inherit;
              cursor:pointer;border-radius:1px;transition:border-color .15s}
.sizes button:hover,.sizes button.on{border-color:var(--graphite)}
.size-note{font-size:12.5px;color:var(--muted);margin:0 0 24px}
.buy{display:block;text-align:center;background:var(--graphite);color:var(--ivory);padding:17px;font-size:14px;
     letter-spacing:.12em;text-transform:uppercase;border-radius:1px}
.buy:hover{background:#413f3c}
.buy-sub{font-size:12.5px;color:var(--muted);text-align:center;margin:12px 0 30px}
.spec{border-top:1px solid var(--line)}
.spec .row{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:13px 2px;border-bottom:1px solid var(--line);font-size:14.5px}
.spec .row .k{color:var(--muted)}

/* simple content page */
.simple{max-width:760px;margin:0 auto;padding:16px 26px 110px}
.simple h2{font-size:20px;font-weight:400;margin:34px 0 12px;color:var(--graphite)}
.simple p{color:#4d473f;line-height:1.9;margin:0 0 16px}
.simple .muted{color:var(--muted);font-size:14px}
.simple ul{color:#4d473f;line-height:1.9;padding-left:20px}

/* footer */
footer{background:var(--graphite);color:#c9c0b5;padding:64px 26px 30px}
.fgrid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
@media (max-width:820px){ .fgrid{grid-template-columns:1fr 1fr;gap:32px 20px} .fbrand{grid-column:1 / -1} }
.fbrand .logo{font-family:var(--brand);font-weight:450;font-size:24px;letter-spacing:.10em;color:var(--ivory);margin-bottom:10px;text-transform:uppercase}
.fbrand .slogan{font-size:15px;color:#a49a8d;max-width:300px;line-height:1.7}
.social{display:flex;gap:16px;margin-top:16px}
.social svg{width:19px;height:19px;fill:#b8ab9d}
.social a:hover svg{fill:var(--coral)}
footer h4{font-size:12.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin:0 0 15px}
footer ul{list-style:none;margin:0;padding:0;font-size:14.5px;line-height:2.15}
footer ul a{color:#b8ab9d}
footer ul a:hover{color:var(--coral)}
.legal{max-width:var(--maxw);margin:42px auto 0;padding-top:22px;border-top:1px solid #45433f;
       display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:center;font-size:12px;
       letter-spacing:.08em;text-transform:uppercase;color:#8b8175}
.legal a{color:#8b8175} .legal a:hover{color:var(--coral)}