/*
Theme Name:   Facey's Party Rentals
Theme URI:    https://faceys-rentals.com
Description:  Custom Astra child theme for Facey's Party Rentals — Celebrate Big, Rent Smart. Built on Astra (https://wpastra.com) with the Facey's brand identity layered on top.
Author:       Facey's Party Rentals
Author URI:   https://faceys-rentals.com
Template:     astra
Version:      1.0.0
License:      GPL-2.0-or-later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  faceys-astra-child
*/

/* ============================================================
   FACEY'S PARTY RENTALS — Astra Child Theme
   Brand Profile v1.0
   Tagline: "Celebrate Big, Rent Smart"
   ============================================================ */


/* ---- 1. WEB FONTS ----------------------------------------- */
/* Loaded via functions.php — no @import needed.
   Cormorant Garamond, Inter, Dancing Script, Montserrat. */


/* ---- 2. BRAND TOKENS -------------------------------------- */

:root {
  /* Gold gradient stops */
  --facey-gold-highlight: #FFFB76;
  --facey-gold-light:     #FABE32;
  --facey-gold:           #F0AA32;   /* PRIMARY */
  --facey-gold-mid:       #E6A032;
  --facey-gold-shadow:    #B7881E;

  /* Neutrals */
  --facey-black:    #000000;
  --facey-ink:      #0A0A0A;
  --facey-charcoal: #1A1A1A;
  --facey-slate:    #2A2A2A;
  --facey-gray:     #6B6B6B;
  --facey-mist:     #DCD7D7;
  --facey-paper:    #FAFAFA;
  --facey-white:    #FFFFFF;

  /* Signature gradients */
  --facey-grad-warm:
    linear-gradient(135deg, #FFFB76 0%, #F0AA32 100%);
  --facey-grad-deep:
    linear-gradient(180deg, #FABE32 0%, #B7881E 100%);
  --facey-grad-text:
    linear-gradient(135deg, #FFFB76 0%, #F0AA32 45%, #B7881E 100%);
  --facey-grad-metallic:
    linear-gradient(90deg,
      #B7881E 0%, #F0AA32 35%, #FFFB76 50%,
      #F0AA32 65%, #B7881E 100%);

  /* Override Astra's primary theme color */
  --ast-global-color-0: #F0AA32;     /* primary */
  --ast-global-color-1: #B7881E;     /* secondary / hover */
  --ast-global-color-2: #0A0A0A;     /* heading text */
  --ast-global-color-3: #6B6B6B;     /* body text */
  --ast-global-color-4: #FFFFFF;     /* background */
  --ast-global-color-5: #FAFAFA;     /* alt background */
  --ast-global-color-6: #DCD7D7;     /* borders */
  --ast-global-color-7: #F0AA32;     /* link */
  --ast-global-color-8: #B7881E;     /* link hover */
}


/* ---- 3. BASE TYPOGRAPHY ----------------------------------- */

body,
.ast-container,
input, textarea, select, button {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--facey-charcoal);
  background: var(--facey-white);
  font-size: 16px;
  line-height: 1.65;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 600;
  color: var(--facey-ink);
  letter-spacing: -0.01em;
  line-height: 1.15;
}

h1 { font-size: clamp(40px, 6vw, 64px); font-weight: 500; }
h2 { font-size: clamp(32px, 4vw, 48px); font-weight: 500; }
h3 { font-size: clamp(24px, 2.5vw, 32px); }
h4 { font-size: 22px; }


/* ---- 4. SITE TITLE / LOGO --------------------------------- */
/* If you upload a logo image in the customizer, this won't apply.
   But if Astra is using text for the site title, give it the brand script. */

.site-title,
.site-title a {
  font-family: 'Dancing Script', cursive;
  font-weight: 700;
  font-size: 36px;
  line-height: 1;
  background-color: transparent;
  background-image: var(--facey-grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent !important;
  isolation: isolate;
}

.site-description {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--facey-gold-shadow) !important;
  font-weight: 500;
  margin-top: 4px;
}


/* ---- 5. NAVIGATION ---------------------------------------- */

.main-header-menu > .menu-item > a,
.ast-primary-header-bar .ast-builder-menu .menu-item > .menu-link {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--facey-charcoal);
  transition: color .2s ease;
}

.main-header-menu > .menu-item > a:hover,
.main-header-menu > .menu-item.current-menu-item > a,
.ast-builder-menu .menu-item > .menu-link:hover {
  color: var(--facey-gold-shadow);
}


/* ---- 6. BUTTONS — METALLIC GOLD CTAs --------------------- */

.wp-block-button__link,
.button,
button:not(.menu-toggle):not(.search-submit),
input[type="submit"],
.ast-button,
.ast-custom-button,
.elementor-button {
  background: var(--facey-grad-warm);
  color: var(--facey-ink) !important;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  border: none;
  border-radius: 3px;
  padding: 16px 32px;
  box-shadow: 0 2px 8px rgba(183, 136, 30, 0.25);
  transition: all .25s ease;
  text-decoration: none;
  display: inline-block;
}

.wp-block-button__link:hover,
.button:hover,
button:not(.menu-toggle):not(.search-submit):hover,
input[type="submit"]:hover,
.ast-button:hover,
.ast-custom-button:hover,
.elementor-button:hover {
  background: var(--facey-ink);
  color: var(--facey-gold-light) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

/* Outlined button variant — for secondary CTAs */
.wp-block-button.is-style-outline .wp-block-button__link,
.button.outline,
.ast-custom-button.outline {
  background: transparent;
  border: 1.5px solid var(--facey-gold);
  color: var(--facey-gold-shadow) !important;
  box-shadow: none;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover,
.button.outline:hover {
  background: var(--facey-gold);
  color: var(--facey-ink) !important;
  border-color: var(--facey-gold);
}


/* ---- 7. LINKS --------------------------------------------- */

a {
  color: var(--facey-gold-shadow);
  text-decoration: none;
  transition: color .2s ease;
}

a:hover {
  color: var(--facey-ink);
}

.entry-content a:not(.wp-block-button__link):not(.button) {
  text-decoration: underline;
  text-decoration-color: var(--facey-gold);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}


/* ---- 8. HEADER ------------------------------------------- */

.site-header,
.ast-primary-header-bar {
  background: var(--facey-white);
  border-bottom: 1px solid var(--facey-mist);
}


/* ---- 9. FOOTER ------------------------------------------- */

.site-footer,
.footer-sml-layout-2,
.site-below-footer-wrap {
  background: var(--facey-black);
  color: var(--facey-mist);
  border-top: 1px solid var(--facey-gold-shadow);
}

.site-footer h1, .site-footer h2, .site-footer h3,
.site-footer h4, .site-footer h5, .site-footer h6 {
  color: var(--facey-white);
  font-family: 'Cormorant Garamond', Georgia, serif;
}

.site-footer a {
  color: var(--facey-gold);
}

.site-footer a:hover {
  color: var(--facey-gold-light);
}


/* ---- 10. UTILITY CLASSES — drop into Custom CSS class field
              of any block to apply Facey's brand treatments
   ------------------------------------------------------------ */

/* Metallic gold text — for hero phrases, "Facey's" wordmark, etc. */
.facey-gold-text {
  background-color: transparent;
  background-image: var(--facey-grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  isolation: isolate;
  display: inline-block;
}

/* Eyebrow label — small uppercase tag above headlines */
.facey-eyebrow {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--facey-gold-shadow);
  display: block;
  margin-bottom: 14px;
}

/* Tagline rhythm — italic serif subheads */
.facey-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 300;
  color: var(--facey-gray);
  line-height: 1.55;
}

/* Dark hero section */
.facey-section-dark {
  background: var(--facey-black);
  color: var(--facey-mist);
  padding: 100px 0;
  position: relative;
}

.facey-section-dark h1,
.facey-section-dark h2,
.facey-section-dark h3,
.facey-section-dark h4 {
  color: var(--facey-white);
}

.facey-section-dark .facey-eyebrow {
  color: var(--facey-gold);
}

/* Card style for inventory grid */
.facey-card {
  background: var(--facey-white);
  border: 1px solid var(--facey-mist);
  border-radius: 4px;
  padding: 36px 32px;
  transition: all .3s ease;
  height: 100%;
}

.facey-card:hover {
  border-color: var(--facey-gold);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.06);
  transform: translateY(-3px);
}

/* Numbered step (for How It Works) */
.facey-step-number {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 64px;
  font-weight: 300;
  color: var(--facey-gold);
  line-height: 1;
  display: block;
  margin-bottom: 14px;
}


/* ---- 11. WOOCOMMERCE (light styling, in case you add it later) --- */

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--facey-gold-shadow);
  font-weight: 600;
}

.woocommerce span.onsale {
  background: var(--facey-grad-warm);
  color: var(--facey-ink);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 0.1em;
}


/* ---- 12. RESPONSIVE TWEAKS ------------------------------- */

@media (max-width: 768px) {
  .facey-section-dark {
    padding: 60px 0;
  }

  .wp-block-button__link,
  .button,
  input[type="submit"] {
    font-size: 11px;
    padding: 14px 24px;
    letter-spacing: 0.15em;
  }
}

/* === END FACEY'S CHILD THEME === */
