/*
Theme Name: LunaGlow Skincare
Author: Krepling
Version: 1.0.0
Text Domain: lunaglow
*/

:root {
  --lg-gold: #C9A96E;
  --lg-ink: #2D2D2D;
  --lg-cream: #FAF8F5;
  --lg-sand: #E8D5B7;
  --lg-white: #FFFFFF;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--lg-ink); background: var(--lg-cream); font-family: Inter, Arial, sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; }
.site-shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.announcement { padding: 8px 20px; text-align: center; color: #fff; background: var(--lg-ink); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.site-header { position: sticky; top: 0; z-index: 20; background: rgba(250,248,245,.96); border-bottom: 1px solid rgba(45,45,45,.1); backdrop-filter: blur(12px); }
.header-inner { min-height: 86px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; }
.brand { text-align: center; line-height: 1; }
.brand-name { display: block; font-family: Georgia, 'Times New Roman', serif; font-size: 27px; font-weight: 700; letter-spacing: .14em; }
.brand-subtitle { display: block; margin-top: 8px; color: var(--lg-gold); font-size: 9px; letter-spacing: .56em; padding-left: .56em; }
.main-nav { display: flex; gap: 24px; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; }
.header-actions { justify-self: end; display: flex; gap: 18px; align-items: center; font-size: 13px; }
.cart-link { padding: 9px 14px; border: 1px solid var(--lg-gold); border-radius: 999px; }
.hero { min-height: 650px; display: grid; place-items: center; text-align: center; padding: 96px 20px; background: radial-gradient(circle at 50% 25%, #fff 0, rgba(255,255,255,.74) 28%, transparent 60%), linear-gradient(135deg, #f4eadb 0%, #faf8f5 48%, #ead7bd 100%); overflow: hidden; position: relative; }
.hero::before, .hero::after { content: ''; position: absolute; width: 340px; height: 340px; border: 1px solid rgba(201,169,110,.35); border-radius: 50%; }
.hero::before { left: -150px; top: 100px; }
.hero::after { right: -130px; bottom: -80px; }
.eyebrow { color: #8d7246; font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.hero h1 { max-width: 850px; margin: 18px auto; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(48px, 7vw, 88px); font-weight: 400; line-height: 1.04; }
.hero p { max-width: 610px; margin: 0 auto 32px; color: #625d56; font-size: 18px; }
.button, button, input[type='submit'], .wp-element-button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { display: inline-block; padding: 14px 25px; border: 1px solid var(--lg-ink); border-radius: 0; color: #fff; background: var(--lg-ink); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; transition: .2s ease; }
.button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover { color: var(--lg-ink); background: transparent; }
.section { padding: 92px 0; }
.section-heading { max-width: 680px; margin: 0 auto 48px; text-align: center; }
.section-heading h2 { margin: 10px 0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(34px, 5vw, 52px); font-weight: 400; }
.section-heading p { color: #726c64; }
.ritual { background: #fff; }
.ritual-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #ded5ca; border: 1px solid #ded5ca; }
.ritual-card { padding: 38px; background: #fff; }
.ritual-card span { color: var(--lg-gold); font-family: Georgia, serif; font-size: 32px; }
.ritual-card h3 { margin: 18px 0 8px; font-family: Georgia, serif; font-size: 24px; font-weight: 400; }
.values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; text-align: center; }
.value { padding: 20px; }
.value-mark { width: 42px; height: 42px; display: grid; place-items: center; margin: 0 auto 16px; border: 1px solid var(--lg-gold); border-radius: 50%; color: #8d7246; }
.site-main { min-height: 60vh; }
.content-page { padding: 70px 0 100px; }
.page-title, .woocommerce-products-header__title { font-family: Georgia, serif; font-size: clamp(38px, 6vw, 62px); font-weight: 400; text-align: center; }
.woocommerce ul.products { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 28px 20px; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product { float: none !important; width: auto !important; margin: 0 !important; text-align: center; }
.woocommerce ul.products li.product img { margin: 0 0 18px; aspect-ratio: 1; object-fit: cover; background: #f1e8dc; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { padding: 0; font-family: Georgia, serif; font-size: 20px; font-weight: 400; }
.woocommerce ul.products li.product .price { color: #7d653f; font-size: 15px; }
.woocommerce ul.products li.product .button { margin-top: 10px; }
.woocommerce div.product { padding: 70px 0; }
.woocommerce div.product .product_title { font-family: Georgia, serif; font-size: 48px; font-weight: 400; }
.woocommerce div.product p.price { color: #7d653f; }
.woocommerce-message, .woocommerce-info { border-top-color: var(--lg-gold); background: #fff; }
.woocommerce-message::before, .woocommerce-info::before { color: var(--lg-gold); }
.site-footer { padding: 56px 0 28px; color: #f5efe7; background: var(--lg-ink); }
.footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 48px; }
.footer-brand .brand-subtitle { text-align: left; }
.footer-copy { max-width: 360px; color: #c9c1b7; font-size: 14px; }
.footer-title { margin: 0 0 15px; color: var(--lg-sand); font-size: 12px; letter-spacing: .15em; text-transform: uppercase; }
.footer-links { display: grid; gap: 8px; color: #d6d0c9; font-size: 14px; }
.copyright { margin-top: 44px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); color: #928b83; font-size: 12px; }

@media (max-width: 850px) {
  .header-inner { grid-template-columns: auto 1fr; }
  .main-nav { display: none; }
  .brand { text-align: left; }
  .header-actions { justify-self: end; }
  .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .ritual-grid, .values, .footer-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .site-shell { width: min(100% - 28px, 1180px); }
  .header-actions a:first-child { display: none; }
  .brand-name { font-size: 21px; }
  .hero { min-height: 560px; padding-block: 70px; }
  .hero p { font-size: 16px; }
  .section { padding: 64px 0; }
  .woocommerce ul.products { gap: 24px 12px; }
}