/*
Theme Name: AC Direct Supply
Theme URI: https://acdirectsupply.com/
Description: Custom Astra child theme for AC Direct Supply — Goodman HVAC equipment and installation
Author: Zanga Holdings
Author URI: https://zanga.ai/
Template: astra
Version: 1.2.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: acdirect-child
*/

/* v1.1.1 — removed legacy Storefront layout CSS (.main-navigation red bar,
   .site-header/.site-footer/.main-header structural overrides) that collided
   with Astra's markup; added brand type scale and unified button system. */

/* ============================================
   COLOR VARIABLES
   ============================================ */
:root {
    --primary-color: #dc2626;
    --primary-dark: #b91c1c;
    --primary-light: #ef4444;
    --secondary-color: #1f2937;
    --accent-color: #f59e0b;
    --accent-hover: #d97706;
    --bg-white: #ffffff;
    --bg-light: #f8f9fa;
    --bg-gray: #e9ecef;
    --bg-dark: #343a40;
    --text-primary: #2c3e50;
    --text-secondary: #6c757d;
    --text-light: #ffffff;
    --text-muted: #adb5bd;
    --border-color: #dee2e6;
    --border-light: #e9ecef;
    --woocommerce-color: #dc2626;
    --woocommerce-green: #7ad03a;
    --woocommerce-red: #dc2626;
    --woocommerce-orange: #f59e0b;
}

* { box-sizing: border-box; }

/* ============================================
   TYPE SCALE — tame oversized display headings
   ============================================ */
.entry-content h1 { font-size: clamp(2rem, 4.5vw, 2.9rem); line-height: 1.15; }
.entry-content h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.2; }
.entry-content h3 { font-size: clamp(1.2rem, 2.2vw, 1.5rem); line-height: 1.3; }

/* Hide Astra's duplicate entry title on service landers (content provides the H1) */
.page-id-2298 .entry-header .entry-title,
.page-id-2299 .entry-header .entry-title,
.page-id-2300 .entry-header .entry-title,
.page-id-2301 .entry-header .entry-title,
.page-id-2302 .entry-header .entry-title,
.page-id-2303 .entry-header .entry-title,
.page-id-2304 .entry-header .entry-title,
.page-id-2305 .entry-header .entry-title,
.page-id-2281 .entry-header .entry-title { display: none; }

/* Eyebrow style used on landers */
.acds-eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.85rem;
    color: var(--primary-color);
    margin-bottom: 0.25em;
}

/* Trust strip on landers */
.acds-trust-strip {
    background: var(--bg-light);
    border: 1px solid var(--border-light);
    border-radius: 6px;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
}

/* ============================================
   UNIFIED BUTTON SYSTEM (Gutenberg blocks)
   ============================================ */
.entry-content .wp-block-button__link {
    background-color: var(--primary-color);
    color: var(--text-light);
    border-radius: 6px;
    font-weight: 600;
    padding: 0.85rem 1.9rem;
    transition: background-color 0.2s ease;
}
.entry-content .wp-block-button__link:hover {
    background-color: var(--primary-dark);
    color: var(--text-light);
}
.entry-content .is-style-outline .wp-block-button__link {
    background: transparent;
    color: var(--primary-color);
    border: 2px solid var(--primary-color);
}
.entry-content .is-style-outline .wp-block-button__link:hover {
    background: var(--primary-color);
    color: var(--text-light);
}

/* ============================================
   PRODUCT GRID (CH6 — responsive 4→3→2→1)
   ============================================ */
.products {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 40px;
}

.product {
    background-color: var(--bg-white);
    border: 1px solid var(--border-light);
    border-radius: 8px;
    overflow: hidden;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    position: relative;
}

.product:hover {
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
    transform: translateY(-5px);
}

@media (max-width: 1024px) {
    .products { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
    .products { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 480px) {
    .products { grid-template-columns: 1fr; }
}

/* ============================================
   WOOCOMMERCE OVERRIDES
   ============================================ */
.woocommerce button.button,
.woocommerce a.button {
    background-color: var(--primary-color);
    color: var(--text-light);
    border-radius: 4px;
    font-weight: 600;
}

.woocommerce button.button:hover,
.woocommerce a.button:hover {
    background-color: var(--primary-dark);
}

.woocommerce .price {
    color: var(--primary-color);
    font-size: 18px;
    font-weight: 700;
}

.woocommerce .star-rating { color: #ffc107; }

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info {
    border-top-color: var(--primary-color);
}

.woocommerce .woocommerce-message:before,
.woocommerce .woocommerce-info:before {
    color: var(--primary-color);
}

/* ============================================
   WPForms polish (quote form)
   ============================================ */
.wpforms-container .wpforms-submit {
    background-color: var(--primary-color) !important;
    border: none !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    padding: 0.85rem 1.9rem !important;
}
.wpforms-container .wpforms-submit:hover {
    background-color: var(--primary-dark) !important;
}

/* ============================================================
   v1.2.0 — PREMIUM DESIGN SYSTEM (2026-07-03)
   Additive layer: tokens, section rhythm, premium components.
   Element-ID rules target homepage 883 containers only.
   ============================================================ */

:root {
    --navy-900: #0b1728;
    --navy-800: #10203a;
    --navy-700: #16294a;
    --ink: #16212e;
    --paper: #f6f8fb;
    --line: #e4e9f0;
    --radius: 12px;
    --shadow-sm: 0 1px 2px rgba(11,23,40,.06), 0 1px 3px rgba(11,23,40,.08);
    --shadow-md: 0 4px 14px rgba(11,23,40,.08), 0 2px 4px rgba(11,23,40,.05);
    --shadow-lg: 0 14px 34px rgba(11,23,40,.14);
    --ease: cubic-bezier(.2,.6,.2,1);
}

body { -webkit-font-smoothing: antialiased; }
.entry-content h1, .entry-content h2, .elementor-heading-title { letter-spacing: -0.015em; }
.elementor-widget-text-editor p { line-height: 1.75; }

.elementor-button, .woocommerce button.button, .woocommerce a.button,
.wpforms-container .wpforms-submit {
    border-radius: 10px !important;
    font-weight: 600;
    letter-spacing: .01em;
    box-shadow: var(--shadow-sm);
    transition: transform .18s var(--ease), box-shadow .18s var(--ease), background-color .18s var(--ease) !important;
}
.elementor-button:hover, .woocommerce button.button:hover, .woocommerce a.button:hover,
.wpforms-container .wpforms-submit:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}
.elementor-button:active { transform: translateY(0); }

.product, ul.products li.product {
    border: 1px solid var(--line) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow-sm);
    background: #fff !important;
}
.product:hover, ul.products li.product:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-4px);
    border-color: #d3dce8 !important;
}
.product img { background: #fff; }
.woocommerce ul.products li.product .onsale, .products .onsale {
    background: var(--navy-800); color: #fff; border-radius: 999px;
    font-weight: 600; padding: .35em 1em; box-shadow: var(--shadow-sm);
}
.woocommerce ul.products li.product .price { color: var(--ink); }
.woocommerce ul.products li.product .price bdi { font-size: 1.15em; font-weight: 700; }

.site-header, .ast-primary-header-bar { box-shadow: 0 1px 0 var(--line), 0 6px 18px rgba(11,23,40,.05); }

.site-footer a { transition: color .15s ease; }
.site-footer .widget-title, .site-footer h2 { letter-spacing: .02em; }

.elementor-883 .elementor-element-29db1e6 {
    background: linear-gradient(180deg, #fbfcfe 0%, var(--paper) 100%);
    padding-top: 72px; padding-bottom: 72px;
}
@media (prefers-reduced-motion: no-preference) {
    .elementor-883 .elementor-element-29db1e6 .elementor-widget-container { animation: acdsRise .7s var(--ease) both; }
    @keyframes acdsRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
}
.elementor-883 .elementor-element-29db1e6 img {
    border-radius: 16px; box-shadow: var(--shadow-lg);
}

.elementor-883 .elementor-element-48305b2 { padding-top: 56px; padding-bottom: 40px; }
.elementor-883 .elementor-element-48305b2 .elementor-widget-icon-box .elementor-widget-container {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
    padding: 28px 24px; box-shadow: var(--shadow-sm); height: 100%;
    transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.elementor-883 .elementor-element-48305b2 .elementor-widget-icon-box .elementor-widget-container:hover {
    transform: translateY(-3px); box-shadow: var(--shadow-md);
}

.elementor-883 .elementor-element-c88fea9 { padding-top: 0; padding-bottom: 56px; }
.elementor-883 .elementor-element-c88fea9 .elementor-widget-divider { display: none; }

.elementor-883 .elementor-element-f0870d6 {
    background: var(--paper) !important; padding-top: 72px; padding-bottom: 72px;
}

.elementor-883 .elementor-element-7d30053 { padding-top: 64px; padding-bottom: 72px; }

.elementor-883 .elementor-element-b8799e9 {
    background: var(--navy-900) !important; margin-top: 0;
    padding: 64px 24px 8px;
}
.elementor-883 .elementor-element-b8799e9 .elementor-heading-title { color: #fff; }
.elementor-883 .elementor-element-bd5f4c9 {
    background: var(--navy-900) !important; padding: 8px 24px 64px;
}
.elementor-883 .elementor-element-bd5f4c9 .elementor-icon-box-title, .elementor-883 .elementor-element-bd5f4c9 .elementor-icon-box-title span,
.elementor-883 .elementor-element-bd5f4c9 h2 { color: #fff !important; }
.elementor-883 .elementor-element-bd5f4c9 .elementor-icon-box-description { color: #c8d2e0 !important; max-width: 720px; margin: 0 auto; }
.elementor-883 .elementor-element-3dc9165 { display: none; }
.elementor-883 .elementor-element-ace0498 { display: none; }

.elementor-883 .elementor-element-37582e1 { background: #fff; padding-top: 72px; padding-bottom: 72px; }
.elementor-883 .elementor-element-37582e1 .elementor-widget-icon-box .elementor-widget-container {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
    padding: 30px 26px; box-shadow: var(--shadow-sm); height: 100%;
    transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.elementor-883 .elementor-element-37582e1 .elementor-widget-icon-box .elementor-widget-container:hover {
    transform: translateY(-3px); box-shadow: var(--shadow-md);
}

.elementor-883 .elementor-element-2aeaa22 { background: var(--navy-800) !important; padding-top: 40px; padding-bottom: 40px; }

@media (max-width: 768px) {
    .elementor-883 .elementor-element-29db1e6 { padding-top: 40px; padding-bottom: 40px; }
    .elementor-883 .elementor-element-f0870d6,
    .elementor-883 .elementor-element-37582e1 { padding-top: 48px; padding-bottom: 48px; }
    .elementor-button, .woocommerce a.button, .woocommerce button.button { min-height: 46px; }
}

@media (prefers-reduced-motion: reduce) {
    .elementor-883 * { animation: none !important; transition: none !important; }
}



/* Trust row on product pages (2026-07-07) */
.acds-trust-row { list-style:none; margin:14px 0 6px; padding:0; display:flex; flex-wrap:wrap; gap:6px 18px; font-size:14px; color:#333; }
.acds-trust-row li { margin:0; }
.acds-trust-row li::before { content:"\2713"; margin-right:6px; font-weight:700; }
@media (max-width: 480px) { .acds-trust-row { flex-direction:column; gap:4px; } }

/* Homepage "Professional HVAC Equipment Supply" section height trim (2026-07-08):
   right column stacked a 600px image over the two tiles (982px total) and flex-stretch
   dragged the text column to match. Cap the illustration; columns tighten together. */
.elementor-883 .elementor-element-7558e44 img { max-height: 400px; width: auto; object-fit: contain; }
@media (max-width: 768px) {
    .elementor-883 .elementor-element-7558e44 img { max-height: 300px; }
}
