/* === ASH BEAUTY — style.css === */

:root {
  --g:  #C9A84C;
  --gl: #E8C97A;
  --d:  #0A0A0A;
  --d2: #111111;
  --d3: #1A1A1A;
  --d4: #222222;
  --cr: #FAF6EE;
  --mt: #888;
  --t:  0.35s ease;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--d); color:var(--cr); font-family:'Montserrat',sans-serif; font-weight:300; overflow-x:hidden; line-height:1.6; }

/* === NAV === */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:20px 40px; display:flex; justify-content:space-between; align-items:center;
  transition:background var(--t), box-shadow var(--t);
}
#nav.scrolled { background:rgba(10,10,10,.95); backdrop-filter:blur(10px); box-shadow:0 1px 0 rgba(201,168,76,.15); }

.logo {
  font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:600;
  letter-spacing:4px; color:var(--gl); text-decoration:none; text-transform:uppercase;
}
#nav ul { display:flex; gap:32px; list-style:none; }
#nav ul a {
  font-family:'Tenor Sans',sans-serif; font-size:11px; letter-spacing:2.5px;
  text-transform:uppercase; color:rgba(255,255,255,.7); text-decoration:none;
  transition:color var(--t); position:relative;
}
#nav ul a::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0;
  height:1px; background:var(--g); transform:scaleX(0); transition:transform var(--t);
}
#nav ul a:hover { color:var(--gl); }
#nav ul a:hover::after { transform:scaleX(1); }
.cta { border:1px solid var(--g)!important; color:var(--gl)!important; padding:8px 20px; }
.cta::after { display:none!important; }
.cta:hover { background:var(--g)!important; color:var(--d)!important; }

/* Hamburger */
#burger {
  display:none; background:none; border:none; cursor:pointer;
  flex-direction:column; gap:5px; padding:4px;
}
#burger span { display:block; width:24px; height:1px; background:var(--gl); transition:all .3s; }
#burger.open span:nth-child(1) { transform:rotate(45deg) translate(4px,4px); }
#burger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
#burger.open span:nth-child(3) { transform:rotate(-45deg) translate(4px,-4px); }

/* Mobile menu */
#mob-menu {
  display:none; position:fixed; inset:0; background:rgba(0,0,0,.97);
  z-index:99; flex-direction:column; justify-content:center; align-items:center; gap:32px;
}
#mob-menu.open { display:flex; }
#mob-menu a {
  font-family:'Cormorant Garamond',serif; font-size:36px; font-weight:300;
  color:var(--cr); text-decoration:none; letter-spacing:2px;
  opacity:0; animation:fadeUp .4s ease forwards;
  transition:color var(--t);
}
#mob-menu.open a:nth-child(2){animation-delay:.05s}
#mob-menu.open a:nth-child(3){animation-delay:.1s}
#mob-menu.open a:nth-child(4){animation-delay:.15s}
#mob-menu.open a:nth-child(5){animation-delay:.2s}
#mob-menu a:hover { color:var(--gl); }
#mob-close { position:absolute; top:24px; right:24px; background:none; border:none; color:var(--g); font-size:28px; cursor:pointer; }

/* === HERO === */
.hero {
  min-height:100vh; display:flex; flex-direction:column; justify-content:center;
  align-items:center; text-align:center; padding:120px 24px 80px; position:relative; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 60% at 50% 40%,rgba(201,168,76,.09) 0%,transparent 70%),
    radial-gradient(ellipse 40% 40% at 20% 80%,rgba(201,168,76,.05) 0%,transparent 60%),
    linear-gradient(180deg,#0a0a0a 0%,#111108 50%,#0a0a0a 100%);
}
.ring {
  position:absolute; border-radius:50%; border:1px solid rgba(201,168,76,.08);
  top:50%; left:50%; transform:translate(-50%,-50%);
  animation:pulse 4s ease-in-out infinite; pointer-events:none;
}
.ring:nth-child(2){width:600px;height:600px}
.ring:nth-child(3){width:800px;height:800px;border-color:rgba(201,168,76,.05);animation-delay:1s}
.ring:nth-child(4){width:400px;height:400px;border-color:rgba(201,168,76,.06);animation-delay:2s}

.badge {
  font-family:'Tenor Sans',sans-serif; font-size:10px; letter-spacing:5px;
  text-transform:uppercase; color:var(--g); border:1px solid rgba(201,168,76,.4);
  padding:8px 24px; margin-bottom:32px; position:relative; z-index:1;
  animation:fadeUp 1s ease both;
}
.hero h1 {
  font-family:'Cormorant Garamond',serif; font-size:clamp(64px,14vw,120px);
  font-weight:300; line-height:.9; letter-spacing:-2px; color:var(--cr);
  z-index:1; position:relative; animation:fadeUp 1s ease .2s both;
}
.hero h1 em { font-style:italic; color:var(--gl); display:block; }
.sub {
  font-family:'Tenor Sans',sans-serif; font-size:12px; letter-spacing:4px;
  text-transform:uppercase; color:rgba(255,255,255,.5); margin-top:24px;
  z-index:1; position:relative; animation:fadeUp 1s ease .4s both;
}
.divider {
  width:1px; height:60px; margin:32px auto;
  background:linear-gradient(to bottom,transparent,var(--g),transparent);
  z-index:1; position:relative; animation:fadeUp 1s ease .5s both;
}
.hero-info {
  display:flex; gap:48px; justify-content:center; flex-wrap:wrap;
  z-index:1; position:relative; animation:fadeUp 1s ease .6s both;
}
.hero-info div { text-align:center; }
.hero-info span { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--g); display:block; margin-bottom:4px; }
.hero-info b { font-family:'Cormorant Garamond',serif; font-size:16px; font-weight:400; color:var(--cr); }
.scroll-hint {
  position:absolute; bottom:32px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  color:var(--g); font-size:9px; letter-spacing:3px; text-transform:uppercase;
  animation:bounce 2s ease-in-out infinite; z-index:1;
}
.scroll-hint svg { opacity:.6; }

/* === EID BAR === */
.eid-bar {
  background:linear-gradient(135deg,#1a1500,#0f0f00 30%,#1a1500 60%,#111100);
  border-top:1px solid rgba(201,168,76,.3); border-bottom:1px solid rgba(201,168,76,.3);
  padding:24px; text-align:center; display:flex; align-items:center;
  justify-content:center; gap:16px; flex-wrap:wrap; position:relative; overflow:hidden;
}
.eid-bar::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center,rgba(201,168,76,.12) 0%,transparent 70%); pointer-events:none; }
.star { color:var(--g); font-size:18px; }
.eid-text { font-family:'Cormorant Garamond',serif; font-size:clamp(18px,4vw,26px); font-weight:600; color:var(--gl); letter-spacing:2px; }
.eid-pill { background:var(--g); color:var(--d); font-family:'Tenor Sans',sans-serif; font-size:12px; font-weight:bold; letter-spacing:2px; padding:6px 16px; text-transform:uppercase; }

/* === SHARED === */
.wrap { max-width:1200px; margin:0 auto; padding:100px 24px; }
.alt-bg { background:var(--d2); }
.center { text-align:center; }

.tag {
  font-family:'Tenor Sans',sans-serif; font-size:10px; letter-spacing:5px;
  text-transform:uppercase; color:var(--g); margin-bottom:16px;
  display:flex; align-items:center; gap:16px;
}
.tag::after { content:''; display:block; width:40px; height:1px; background:var(--g); opacity:.5; }
.center .tag { justify-content:center; }
.center .tag::after { display:none; }

h2 {
  font-family:'Cormorant Garamond',serif; font-size:clamp(38px,7vw,64px);
  font-weight:300; line-height:1.1; color:var(--cr); margin-bottom:24px;
}
h2 em { font-style:italic; color:var(--gl); }

/* === SERVICES === */
.grid-6 { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:2px; margin-top:56px; }

.card {
  background:var(--d3); padding:48px 36px; position:relative; overflow:hidden;
  opacity:0; transform:translateY(30px);
  transition:background var(--t), opacity .6s ease, transform .6s ease;
}
.card.in { opacity:1; transform:none; }
.card::before {
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:linear-gradient(to right,transparent,var(--g),transparent);
  transform:scaleX(0); transition:transform .4s;
}
.card:hover::before { transform:scaleX(1); }
.card:hover { background:var(--d4); }
.card svg { width:48px; height:48px; color:var(--g); opacity:.8; margin-bottom:24px; }
.card h3 { font-family:'Cormorant Garamond',serif; font-size:26px; font-weight:400; color:var(--cr); margin-bottom:12px; }
.card p { font-size:12px; line-height:1.9; color:var(--mt); }
.num { position:absolute; top:24px; right:24px; font-family:'Cormorant Garamond',serif; font-size:48px; font-weight:300; color:rgba(201,168,76,.08); line-height:1; }

/* === PRICING === */
.price-grid { display:grid; gap:2px; margin-top:56px; }
.p-col { background:var(--d3); padding:40px 32px; }
.p-col.featured { background:linear-gradient(160deg,#1a1500,#111100); border:1px solid rgba(201,168,76,.25); }
.p-col h4 { font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:600; color:var(--gl); margin-bottom:8px; letter-spacing:1px; }
.p-sub { font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--mt); margin-bottom:32px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.06); }
.p-row { display:flex; justify-content:space-between; align-items:baseline; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.04); gap:12px; }
.p-row:last-of-type { border:none; }
.p-row span { font-size:13px; color:rgba(255,255,255,.7); }
.p-row b { font-family:'Cormorant Garamond',serif; font-size:20px; font-weight:600; color:var(--gl); white-space:nowrap; }
.eid-note { font-size:10px; color:var(--g); margin-top:20px; letter-spacing:1px; text-align:center; padding:8px; border:1px dashed rgba(201,168,76,.3); }

/* === ABOUT === */
.about-grid { display:grid; gap:60px; align-items:center; margin-top:40px; }
.about-grid p { font-size:14px; line-height:2; color:rgba(255,255,255,.6); margin-bottom:20px; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-top:40px; }
.stats div { background:var(--d3); padding:28px 20px; text-align:center; }
.stats b { font-family:'Cormorant Garamond',serif; font-size:42px; font-weight:300; color:var(--gl); line-height:1; display:block; }
.stats span { font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--mt); margin-top:8px; display:block; }

.vis-box {
  background:var(--d3); aspect-ratio:4/5; position:relative; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end; padding:40px;
}
.vis-box::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.8) 0%,transparent 60%),
    radial-gradient(ellipse at 60% 30%,rgba(201,168,76,.07) 0%,transparent 60%);
}
.corner { position:absolute; top:-20px; right:-20px; width:120px; height:120px; border:1px solid rgba(201,168,76,.2); z-index:0; }
.vis-deco {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-60%);
  display:flex; flex-direction:column; align-items:center; gap:16px; z-index:1;
}
.dline { width:80px; height:1px; background:var(--g); opacity:.35; }
.dstar { font-size:72px; color:rgba(201,168,76,.15); line-height:1; }
.vis-quote { position:relative; z-index:1; }
.vis-quote q { font-family:'Cormorant Garamond',serif; font-size:32px; font-style:italic; font-weight:300; color:var(--cr); line-height:1.3; display:block; margin-bottom:16px; quotes:none; }
.vis-quote cite { font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--g); font-style:normal; }

/* === CONTACT === */
.contact { background:linear-gradient(160deg,#0f0f00,#0a0a0a 50%,#0f0f00); border-top:1px solid rgba(201,168,76,.15); position:relative; overflow:hidden; }
.contact::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 50% at 50% 50%,rgba(201,168,76,.05) 0%,transparent 70%); pointer-events:none; }
.contact .wrap { position:relative; z-index:1; max-width:700px; }
.c-intro { font-size:13px; color:var(--mt); margin-top:16px; line-height:2; }
.c-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:2px; margin:56px 0; }
.c-item { background:rgba(255,255,255,.03); border:1px solid rgba(201,168,76,.1); padding:32px 24px; transition:border-color var(--t); }
.c-item:hover { border-color:rgba(201,168,76,.4); }
.c-item div { font-size:24px; margin-bottom:12px; }
.c-item span { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--g); display:block; margin-bottom:8px; }
.c-item b { font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:400; color:var(--cr); }
.btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

.btn-g {
  display:inline-block; background:var(--g); color:var(--d);
  font-family:'Tenor Sans',sans-serif; font-size:11px; letter-spacing:3px;
  text-transform:uppercase; padding:18px 48px; text-decoration:none;
  position:relative; overflow:hidden;
}
.btn-g::before { content:''; position:absolute; inset:0; background:var(--gl); transform:scaleX(0); transform-origin:left; transition:transform var(--t); }
.btn-g:hover::before { transform:scaleX(1); }
.btn-g span { position:relative; z-index:1; }
.btn-o {
  display:inline-block; border:1px solid var(--g); color:var(--gl);
  font-family:'Tenor Sans',sans-serif; font-size:11px; letter-spacing:3px;
  text-transform:uppercase; padding:18px 48px; text-decoration:none;
  transition:background var(--t);
}
.btn-o:hover { background:rgba(201,168,76,.1); }

/* === FOOTER === */
footer { background:#050505; border-top:1px solid rgba(201,168,76,.12); padding:40px 24px; text-align:center; }
.f-logo { font-family:'Cormorant Garamond',serif; font-size:28px; font-weight:600; color:var(--gl); letter-spacing:4px; text-transform:uppercase; margin-bottom:16px; }
footer p { font-size:10px; letter-spacing:4px; text-transform:uppercase; color:var(--mt); margin-bottom:24px; }
.f-ig { display:inline-flex; align-items:center; gap:8px; color:var(--g); text-decoration:none; font-size:12px; letter-spacing:2px; margin-bottom:24px; transition:color var(--t); }
.f-ig:hover { color:var(--gl); }
footer small { font-size:10px; color:rgba(255,255,255,.2); letter-spacing:1px; display:block; }

/* === KEYFRAMES === */
@keyframes fadeUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:none} }
@keyframes pulse { 0%,100%{opacity:1;transform:translate(-50%,-50%) scale(1)} 50%{opacity:.4;transform:translate(-50%,-50%) scale(1.03)} }
@keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(8px)} }

/* === RESPONSIVE === */
@media(min-width:768px) { .price-grid{grid-template-columns:repeat(3,1fr)} }
@media(min-width:900px) { .about-grid{grid-template-columns:1fr 1fr} }

@media(max-width:768px) {
  #nav{padding:16px 20px}
  #nav ul{display:none}
  #burger{display:flex}
  .hero h1{letter-spacing:-1px}
  .hero-info{gap:24px}
  .wrap{padding:60px 20px}
  .grid-6{grid-template-columns:1fr}
  .card{padding:36px 28px}
  .stats b{font-size:30px}
  .btns{flex-direction:column;align-items:center}
  .btn-g,.btn-o{width:100%;max-width:300px;text-align:center}
  .eid-bar{flex-direction:column;gap:8px}
}