/*
Theme Name: Aria Storefront
Template: storefront
Version: 1.0
Description: Warm, artisan luxury child theme for Crochet by Aria
*/

:root{
  --aria-cream: #FBF6EF;
  --aria-cream-dark: #F3EAD9;
  --aria-terracotta: #C1673C;
  --aria-terracotta-dark: #A8532E;
  --aria-sage: #7C8B6F;
  --aria-sage-dark: #61695A;
  --aria-charcoal: #3A2E27;
  --aria-gold: #B08D57;
  --aria-white: #FFFFFF;
}

body{
  background-color: var(--aria-cream);
  color: var(--aria-charcoal);
  font-family: 'Jost', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  line-height: 1.7;
}

h1,h2,h3,h4,h5,h6,
.site-title,
.storefront-primary-navigation .menu-toggle,
.woocommerce ul.products li.product .price{
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--aria-charcoal);
}

a{ color: var(--aria-terracotta); }
a:hover{ color: var(--aria-terracotta-dark); }

/* Header */
#masthead{
  background: var(--aria-cream);
  border-bottom: 1px solid var(--aria-cream-dark);
}
.site-branding .site-title a{
  font-size: 2rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--aria-charcoal);
}
.site-branding .site-description{
  font-family: 'Jost', sans-serif;
  font-style: italic;
  color: var(--aria-sage-dark);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.75rem;
}
.main-navigation ul li a{
  font-family: 'Jost', sans-serif;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  color: var(--aria-charcoal);
}
.main-navigation ul li a:hover{ color: var(--aria-terracotta); }

/* Buttons */
.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.wp-block-button__link{
  background-color: var(--aria-terracotta) !important;
  color: var(--aria-white) !important;
  border-radius: 999px !important;
  padding: 0.9em 2.1em !important;
  font-family: 'Jost', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.8rem;
  border: none !important;
  transition: all 0.25s ease;
  box-shadow: none !important;
}
.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.wp-block-button__link:hover{
  background-color: var(--aria-terracotta-dark) !important;
  transform: translateY(-2px);
}
.button.alt{ background-color: var(--aria-charcoal) !important; }

/* Product cards */
.woocommerce ul.products li.product{
  background: var(--aria-white);
  border-radius: 14px;
  padding: 1.1rem 1.1rem 1.6rem;
  box-shadow: 0 2px 18px rgba(58,46,39,0.06);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.woocommerce ul.products li.product:hover{
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(58,46,39,0.12);
}
.woocommerce ul.products li.product img{
  border-radius: 10px;
  margin-bottom: 0.8rem;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size: 1.05rem;
  margin: 0.3rem 0;
}
.woocommerce span.onsale{
  background: var(--aria-terracotta);
  font-family: 'Jost', sans-serif;
  text-transform: uppercase;
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  border-radius: 999px;
  min-height: auto;
  min-width: auto;
  padding: 0.4em 0.9em;
  line-height: normal;
  top: 0.6em;
  left: 0.6em;
}
.woocommerce ul.products li.product .price{
  color: var(--aria-terracotta-dark);
  font-size: 1.05rem;
}
.woocommerce ul.products li.product .price del{
  color: var(--aria-charcoal);
  opacity: 0.45;
}

/* Single product */
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color: var(--aria-terracotta-dark);
  font-size: 1.6rem;
}
.woocommerce div.product .product_title{
  font-size: 2.2rem;
}
.woocommerce-tabs ul.tabs li a{
  font-family: 'Jost', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.85rem;
}

/* Hero / homepage sections */
.aria-hero{
  background: linear-gradient(180deg, var(--aria-cream-dark) 0%, var(--aria-cream) 100%);
  padding: 5rem 1.5rem;
  text-align: center;
  border-radius: 0 0 32px 32px;
}
.aria-hero .aria-eyebrow{
  text-transform: uppercase;
  letter-spacing: 0.25em;
  font-size: 0.75rem;
  color: var(--aria-sage-dark);
  font-family: 'Jost', sans-serif;
  margin-bottom: 1rem;
}
.aria-hero h1{
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  max-width: 900px;
  margin: 0 auto 1.2rem;
}
.aria-hero p{
  max-width: 600px;
  margin: 0 auto 2rem;
  font-size: 1.15rem;
  color: var(--aria-charcoal);
  opacity: 0.85;
}

.aria-section{ padding: 4rem 1.5rem; max-width: 1200px; margin: 0 auto; }
.aria-section-title{
  text-align: center;
  margin-bottom: 0.5rem;
}
.aria-section-sub{
  text-align: center;
  color: var(--aria-sage-dark);
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.75rem;
  margin-bottom: 2.5rem;
  font-family: 'Jost', sans-serif;
}

.aria-trust-row{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2.5rem;
  padding: 2.5rem 1.5rem;
  background: var(--aria-white);
  border-radius: 20px;
  max-width: 1100px;
  margin: 0 auto;
}
.aria-trust-item{
  text-align: center;
  max-width: 220px;
  font-size: 0.9rem;
  color: var(--aria-charcoal);
}
.aria-trust-item strong{
  display:block;
  font-family: 'Playfair Display', serif;
  font-size: 1.05rem;
  margin-bottom: 0.3rem;
  color: var(--aria-terracotta-dark);
}

.aria-testimonials{
  background: var(--aria-charcoal);
  color: var(--aria-cream);
  border-radius: 28px;
  padding: 3.5rem 2rem;
}
.aria-testimonials h2{ color: var(--aria-cream); }
.aria-testimonial-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
  gap: 2rem;
  max-width: 1000px;
  margin: 2rem auto 0;
}
.aria-testimonial-card{
  background: rgba(255,255,255,0.06);
  padding: 1.8rem;
  border-radius: 16px;
}
.aria-testimonial-card p{ font-style: italic; opacity: 0.9; }
.aria-testimonial-stars{ color: var(--aria-gold); letter-spacing: 0.2em; margin-bottom: 0.8rem; }

.aria-newsletter{
  background: var(--aria-sage);
  color: var(--aria-white);
  border-radius: 28px;
  padding: 3rem 2rem;
  text-align: center;
}
.aria-newsletter h2{ color: var(--aria-white); }

/* Footer */
#colophon{
  background: var(--aria-charcoal);
  color: var(--aria-cream);
}
#colophon a{ color: var(--aria-cream); }
#colophon .widget-title{
  font-family: 'Playfair Display', serif;
  color: var(--aria-cream);
}

@media (max-width: 768px){
  .aria-hero{ padding: 3.5rem 1.2rem; }
  .aria-section{ padding: 2.5rem 1.2rem; }
}
