/* ==========================================================
   라비유(LABIEU) 공통 스타일
   Ivory & Pink 톤앤매너
   ========================================================== */

:root{
  --ivory:        #FCF6EF;
  --ivory-deep:   #F6EAE0;
  --pink:         #E8A9B6;
  --pink-deep:    #D6828F;
  --pink-light:   #F7DEE3;
  --pink-pale:    #FBEEF1;
  --brown:        #4A322E;
  --brown-soft:   #7C5B54;
  --white:        #FFFFFF;
  --gold:         #C7A46B;
  --shadow:       0 10px 30px rgba(214,130,143,0.15);
}

*{ box-sizing: border-box; }

html{ scroll-behavior: smooth; }

html, body{ max-width: 100%; overflow-x: hidden; }

body{
  font-family:'Noto Sans KR', sans-serif;
  color: var(--brown);
  background: var(--ivory);
  line-height: 1.7;
  word-break: keep-all;
}

img{ max-width: 100%; height: auto; }

.font-serif-kr{ font-family:'Noto Serif KR', serif; }

/* ---------- Logo ---------- */
.logo-mark{
  font-family:'Playfair Display','Noto Serif KR', serif;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.logo-sub{
  font-size: 0.6rem;
  letter-spacing: 0.35em;
  color: var(--pink-deep);
  font-weight: 500;
}

/* ---------- Header / Nav ---------- */
#site-header{
  background: rgba(252,246,239,0.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--pink-light);
}
.nav-link{
  position: relative;
  color: var(--brown-soft);
  font-weight: 500;
  transition: color .25s;
}
.nav-link:hover, .nav-link.active{ color: var(--pink-deep); }
.nav-link.active::after{
  content:"";
  position:absolute; left:0; bottom:-6px;
  width:100%; height:2px;
  background: var(--pink-deep);
}

.btn-primary{
  background: var(--pink-deep);
  color: #fff;
  padding: .65rem 1.5rem;
  border-radius: 999px;
  font-weight: 600;
  transition: all .25s;
  box-shadow: var(--shadow);
  display:inline-flex;
  align-items:center;
  gap:.4rem;
}
.btn-primary:hover{ background: var(--brown); transform: translateY(-2px); }

.btn-outline{
  border: 1.5px solid var(--pink-deep);
  color: var(--pink-deep);
  padding: .6rem 1.4rem;
  border-radius: 999px;
  font-weight: 600;
  transition: all .25s;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
}
.btn-outline:hover{ background: var(--pink-deep); color:#fff; }

/* ---------- Section helpers ---------- */
.section-eyebrow{
  color: var(--pink-deep);
  letter-spacing: .25em;
  font-weight: 600;
  font-size: .78rem;
}

.divider-flower::before{
  content:"❁";
  color: var(--pink);
  display:block;
  font-size:1.1rem;
  margin-bottom:.6rem;
}

/* ---------- Cards ---------- */
.card{
  background:#fff;
  border-radius: 22px;
  box-shadow: var(--shadow);
  border: 1px solid var(--pink-light);
  transition: transform .3s, box-shadow .3s;
}
.card:hover{ transform: translateY(-6px); box-shadow: 0 18px 40px rgba(214,130,143,0.25); }

.price-tag{
  color: var(--pink-deep);
  font-weight: 700;
}

.pill{
  background: var(--pink-pale);
  color: var(--pink-deep);
  border-radius: 999px;
  font-size: .78rem;
  padding: .25rem .8rem;
  font-weight: 600;
}

/* ---------- Menu table ---------- */
.menu-table th{
  background: var(--pink-light);
  color: var(--brown);
}
.menu-table tr:nth-child(even){ background: var(--pink-pale); }
.menu-table td, .menu-table th{
  padding: .85rem 1rem;
  white-space: nowrap;
}
@media (max-width: 640px){
  .menu-table{ min-width: 560px; }
  .menu-table td, .menu-table th{
    padding: .65rem .7rem;
    font-size: .85rem;
  }
}

/* ---------- Hero ---------- */
.hero-bg{
  position:relative;
  background-size: cover;
  background-position:center;
}
.hero-overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(74,50,46,.35) 0%, rgba(74,50,46,.55) 60%, rgba(252,246,239,1) 100%);
}

/* ---------- Notice box ---------- */
.notice-box{
  background: var(--pink-pale);
  border: 1px dashed var(--pink);
  border-radius: 16px;
  color: var(--brown-soft);
  font-size: .92rem;
}

/* ---------- Footer ---------- */
#site-footer{
  background: var(--brown);
  color: #EFE1DC;
}
#site-footer a{ color:#EFE1DC; }
#site-footer a:hover{ color: var(--pink); }
.sns-icon{
  width:38px; height:38px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%;
  background: rgba(255,255,255,0.08);
  transition: all .25s;
}
.sns-icon:hover{ background: var(--pink-deep); transform: translateY(-3px); }

/* ---------- Mobile nav ---------- */
#mobile-menu{ display:none; }
#mobile-menu.open{ display:block; }

/* ---------- Animations ---------- */
.fade-up{
  opacity:0; transform: translateY(24px);
  transition: opacity .7s ease, transform .7s ease;
}
.fade-up.in-view{ opacity:1; transform: translateY(0); }

/* Scrollbar accent */
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-thumb{ background: var(--pink); border-radius:10px; }
::-webkit-scrollbar-track{ background: var(--ivory-deep); }
