.elementor-kit-8{--e-global-color-primary:#052659;--e-global-color-secondary:#5483B3;--e-global-color-text:#0B1220;--e-global-color-accent:#C1E8FF;--e-global-color-e7dd5c7:#FFFFFF;--e-global-color-db053b9:#F7FAFC;--e-global-color-4ce92ca:#E6EEF5;--e-global-color-88a513a:#0B1220;--e-global-color-d8d146a:#5B6B80;--e-global-color-59a7a9d:#7B8AA0;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Source Sans 3";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"IBM Plex Sans";--e-global-typography-accent-font-weight:500;font-size:1.125rem;line-height:1.7em;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-kit-8 h1{font-size:3.25rem;line-height:1.08em;letter-spacing:-0.02em;}.elementor-kit-8 h2{font-size:2.375rem;line-height:1.14em;letter-spacing:-0.02em;}.elementor-kit-8 h3{font-size:1.75rem;line-height:1.2em;letter-spacing:-0.015em;}.elementor-kit-8 h4{font-size:1.375rem;line-height:1.25em;letter-spacing:-0.01em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1366px){.elementor-kit-8{font-size:1.125rem;line-height:1.7em;}.elementor-kit-8 h1{line-height:1.08em;letter-spacing:-0.02em;}.elementor-kit-8 h2{font-size:2.125rem;line-height:1.16em;letter-spacing:-0.02em;}.elementor-kit-8 h3{font-size:1.625rem;line-height:1.21em;letter-spacing:-0.015em;}.elementor-kit-8 h4{font-size:1.3125rem;line-height:1.26em;letter-spacing:-0.01em;}}@media(max-width:1024px){.elementor-kit-8{font-size:1.0625rem;line-height:1.7em;}.elementor-kit-8 h1{font-size:2.625rem;line-height:1.1em;letter-spacing:-0.02em;}.elementor-kit-8 h2{font-size:2rem;line-height:1.18em;letter-spacing:-0.02em;}.elementor-kit-8 h3{font-size:1.5rem;line-height:1.22em;letter-spacing:-0.015em;}.elementor-kit-8 h4{font-size:1.25rem;line-height:1.28em;letter-spacing:-0.01em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-8{font-size:1rem;line-height:1.7em;}.elementor-kit-8 h1{font-size:2.125rem;line-height:1.12em;letter-spacing:-0.02em;}.elementor-kit-8 h2{font-size:1.75rem;line-height:1.2em;letter-spacing:-0.02em;}.elementor-kit-8 h3{font-size:1.375rem;line-height:1.24em;letter-spacing:-0.015em;}.elementor-kit-8 h4{font-size:1.125rem;line-height:1.3em;letter-spacing:-0.01em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}@media(min-width:2400px){.elementor-kit-8{font-size:1.125rem;line-height:1.7em;}.elementor-kit-8 h1{font-size:3.5rem;line-height:1.08em;letter-spacing:-0.02em;}.elementor-kit-8 h2{font-size:2.625rem;line-height:1.14em;letter-spacing:-0.02em;}.elementor-kit-8 h3{font-size:2rem;line-height:1.2em;letter-spacing:-0.015em;}.elementor-kit-8 h4{font-size:1.5rem;line-height:1.25em;letter-spacing:-0.01em;}}/* Start custom CSS *//* =========================================================
   ALLI COMPUTERS — Elementor CSS Style Guide (5 Breakpoints)
   Fonts (Brand System):
     - Primary / Body:   Manrope
     - Sub-Headings:     Montserrat (section + card titles)
     - Accent / UI:      DM Sans (buttons, nav, labels)

   Breakpoints (expected Elementor setup):
     - Mobile:     0–767px
     - Tablet:     768–1024px
     - Laptop:     1025–1279px
     - Desktop:    1280–1439px
     - Widescreen: 1440px+

   Units:
     - Sizes use rem (scales cleanly)
     - Line-height uses em (e.g., 1.7em)
     - Letter-spacing uses em (e.g., -0.02em)

   How to use in Elementor (CSS Classes):
     Sections:   ac-section / ac-section-tight / ac-surface-bg / ac-dark / ac-grid-bg
     Cards:      ac-card / ac-card--soft
     Buttons:    ac-btn-primary / ac-btn-secondary (+ optional ac-btn-lg / ac-btn-sm)
     Forms:      ac-form
     FAQ:        ac-faq
     Divider:    <div class="ac-divider"></div>
     Header:     ac-header   (sticky header glass)
     Icons:      ac-icon
     Max width:  ac-max-1200 / ac-max-1440
   ========================================================= */


/* -----------------------------
   1) Design Tokens
------------------------------ */
:root{
  /* Brand Colors (Given) */
  --ac-navy:      #021024;  /* Primary Dark */
  --ac-primary:   #052659;  /* Primary Blue */
  --ac-secondary: #5483b3;  /* Secondary Blue */
  --ac-soft:      #7da0ca;  /* Soft Blue */
  --ac-accent:    #c1e8ff;  /* Light Accent */

  /* Neutrals (Recommended for light premium UI) */
  --ac-bg:        #ffffff;  /* dominant background */
  --ac-surface:   #f7fafc;  /* subtle section background */
  --ac-border:    #e6eef5;  /* borders */
  --ac-text:      #0b1220;  /* readable dark text */
  --ac-muted:     #5b6b80;  /* paragraphs */
  --ac-muted2:    #7b8aa0;  /* secondary muted */

  /* On-dark */
  --ac-on-dark:        #ffffff;
  --ac-on-dark-muted:  rgba(255,255,255,0.78);
  --ac-on-dark-muted2: rgba(255,255,255,0.62);

  /* Fonts */
  --ac-font-primary: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --ac-font-sub:     "Montserrat", "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --ac-font-ui:      "DM Sans", "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Typography — Mobile defaults */
  --ac-h1: 2.125rem;  --ac-h1-lh: 1.12em;  --ac-h1-ls: -0.02em;
  --ac-h2: 1.750rem;  --ac-h2-lh: 1.20em;  --ac-h2-ls: -0.02em;
  --ac-h3: 1.375rem;  --ac-h3-lh: 1.24em;  --ac-h3-ls: -0.015em;
  --ac-h4: 1.125rem;  --ac-h4-lh: 1.30em;  --ac-h4-ls: -0.01em;
  --ac-h5: 1.000rem;  --ac-h5-lh: 1.40em;  --ac-h5-ls: -0.005em;
  --ac-h6: 0.9375rem; --ac-h6-lh: 1.45em;  --ac-h6-ls: 0em;

  --ac-body: 1.000rem; --ac-body-lh: 1.70em; --ac-body-ls: 0em;       /* Manrope 400 */
  --ac-lead: 1.000rem; --ac-lead-lh: 1.65em; --ac-lead-ls: 0em;       /* Manrope 500 */
  --ac-small:0.8125rem;--ac-small-lh:1.55em; --ac-small-ls: 0.01em;    /* UI supporting */
  --ac-ui:   0.9375rem;--ac-ui-lh:   1.20em; --ac-ui-ls: 0.01em;       /* DM Sans UI */

  /* Radius */
  --ac-radius-lg: 1.125rem; /* 18px */
  --ac-radius-md: 0.875rem; /* 14px */
  --ac-radius-sm: 0.625rem; /* 10px */
  --ac-radius-pill: 999px;

  /* Spacing — Mobile defaults */
  --ac-section-y: 3.5rem;       /* 56px */
  --ac-section-y-tight: 2.75rem;/* 44px */
  --ac-gap: 0.875rem;           /* 14px */
  --ac-card-pad: 1.125rem;      /* 18px */

  /* Layout helpers */
  --ac-max-1200: 75rem;         /* 1200px */
  --ac-max-1440: 90rem;         /* 1440px */
  --ac-gutter: clamp(1rem, 3.5vw, 2rem);

  /* Shadows (very minimal / premium) */
  --ac-shadow-sm: 0 10px 28px rgba(2,16,36,0.08);
  --ac-shadow-md: 0 16px 45px rgba(2,16,36,0.10);

  /* Motion */
  --ac-ease: 180ms ease;
}

/* Tablet (>=768px) */
@media (min-width: 768px){
  :root{
    --ac-h1: 2.625rem;  --ac-h1-lh: 1.10em;  --ac-h1-ls: -0.02em;
    --ac-h2: 2.000rem;  --ac-h2-lh: 1.18em;  --ac-h2-ls: -0.02em;
    --ac-h3: 1.500rem;  --ac-h3-lh: 1.22em;  --ac-h3-ls: -0.015em;
    --ac-h4: 1.250rem;  --ac-h4-lh: 1.28em;  --ac-h4-ls: -0.01em;
    --ac-h5: 1.0625rem; --ac-h5-lh: 1.38em;  --ac-h5-ls: -0.005em;
    --ac-h6: 1.000rem;  --ac-h6-lh: 1.42em;  --ac-h6-ls: 0em;

    --ac-body: 1.0625rem; --ac-body-lh: 1.70em;
    --ac-lead: 1.125rem;  --ac-lead-lh: 1.65em;
    --ac-small:0.875rem;  --ac-small-lh: 1.60em;

    --ac-ui:   0.9375rem; --ac-ui-lh: 1.20em; --ac-ui-ls: 0.01em;

    --ac-section-y: 4.5rem;        /* 72px */
    --ac-section-y-tight: 3.5rem;  /* 56px */
    --ac-gap: 1.125rem;            /* 18px */
    --ac-card-pad: 1.375rem;       /* 22px */
  }
}

/* Laptop (>=1025px) */
@media (min-width: 1025px){
  :root{
    --ac-h1: 3.000rem;  --ac-h1-lh: 1.08em;  --ac-h1-ls: -0.02em;
    --ac-h2: 2.125rem;  --ac-h2-lh: 1.16em;  --ac-h2-ls: -0.02em;
    --ac-h3: 1.625rem;  --ac-h3-lh: 1.21em;  --ac-h3-ls: -0.015em;
    --ac-h4: 1.3125rem; --ac-h4-lh: 1.26em;  --ac-h4-ls: -0.01em;
    --ac-h5: 1.125rem;  --ac-h5-lh: 1.36em;  --ac-h5-ls: -0.005em;
    --ac-h6: 1.000rem;  --ac-h6-lh: 1.40em;  --ac-h6-ls: 0em;

    --ac-body: 1.125rem;  --ac-body-lh: 1.70em;
    --ac-lead: 1.1875rem; --ac-lead-lh: 1.65em;
    --ac-small:0.875rem;  --ac-small-lh: 1.60em;

    --ac-ui:   1.000rem;  --ac-ui-lh: 1.20em; --ac-ui-ls: 0.01em;

    --ac-section-y: 6.0rem;        /* 96px */
    --ac-section-y-tight: 4.0rem;  /* 64px */
    --ac-gap: 1.5rem;              /* 24px */
    --ac-card-pad: 1.75rem;        /* 28px */
  }
}

/* Desktop (>=1280px) */
@media (min-width: 1280px){
  :root{
    --ac-h1: 3.25rem;   --ac-h1-lh: 1.08em;  --ac-h1-ls: -0.02em;
    --ac-h2: 2.375rem;  --ac-h2-lh: 1.14em;  --ac-h2-ls: -0.02em;
    --ac-h3: 1.75rem;   --ac-h3-lh: 1.20em;  --ac-h3-ls: -0.015em;
    --ac-h4: 1.375rem;  --ac-h4-lh: 1.25em;  --ac-h4-ls: -0.01em;

    --ac-body: 1.125rem; --ac-body-lh: 1.70em;
    --ac-lead: 1.25rem;  --ac-lead-lh: 1.65em;
    --ac-ui:   1.000rem; --ac-ui-lh: 1.20em; --ac-ui-ls: 0.01em;
  }
}

/* Widescreen (>=1440px) */
@media (min-width: 1440px){
  :root{
    --ac-h1: 3.5rem;    --ac-h1-lh: 1.08em;  --ac-h1-ls: -0.02em;
    --ac-h2: 2.625rem;  --ac-h2-lh: 1.14em;  --ac-h2-ls: -0.02em;
    --ac-h3: 2.0rem;    --ac-h3-lh: 1.20em;  --ac-h3-ls: -0.015em;
    --ac-h4: 1.5rem;    --ac-h4-lh: 1.25em;  --ac-h4-ls: -0.01em;

    --ac-body: 1.125rem; --ac-body-lh: 1.70em;
    --ac-lead: 1.25rem;  --ac-lead-lh: 1.65em;
  }
}


/* -----------------------------
   2) Global Base Styling
------------------------------ */
html{ scroll-padding-top: clamp(4rem, 5vw, 6rem); }

body{
  font-family: var(--ac-font-primary);
  font-size: var(--ac-body);
  line-height: var(--ac-body-lh);
  letter-spacing: var(--ac-body-ls);
  color: var(--ac-text);
  background: var(--ac-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Headings hierarchy:
   - H1: Manrope (primary)
   - H2–H6: Montserrat (sub-headings / section titles)
*/
h1,h2,h3,h4,h5,h6{
  color: var(--ac-navy);
  margin: 0 0 0.45em 0;
}
h1{
  font-family: var(--ac-font-primary);
  font-size: var(--ac-h1);
  line-height: var(--ac-h1-lh);
  letter-spacing: var(--ac-h1-ls);
  font-weight: 650;
}
h2{
  font-family: var(--ac-font-sub);
  font-size: var(--ac-h2);
  line-height: var(--ac-h2-lh);
  letter-spacing: var(--ac-h2-ls);
  font-weight: 650;
}
h3{
  font-family: var(--ac-font-sub);
  font-size: var(--ac-h3);
  line-height: var(--ac-h3-lh);
  letter-spacing: var(--ac-h3-ls);
  font-weight: 650;
}
h4{
  font-family: var(--ac-font-sub);
  font-size: var(--ac-h4);
  line-height: var(--ac-h4-lh);
  letter-spacing: var(--ac-h4-ls);
  font-weight: 600;
}
h5{
  font-family: var(--ac-font-sub);
  font-size: var(--ac-h5);
  line-height: var(--ac-h5-lh);
  letter-spacing: var(--ac-h5-ls);
  font-weight: 600;
}
h6{
  font-family: var(--ac-font-sub);
  font-size: var(--ac-h6);
  line-height: var(--ac-h6-lh);
  letter-spacing: var(--ac-h6-ls);
  font-weight: 600;
}

p{
  margin: 0 0 1em 0;
  color: var(--ac-muted);
  font-family: var(--ac-font-primary);
}

/* Helper text class (apply via CSS class on a widget) */
.ac-small{
  font-family: var(--ac-font-primary);
  font-size: var(--ac-small);
  line-height: var(--ac-small-lh);
  letter-spacing: var(--ac-small-ls);
  font-weight: 600;
  color: var(--ac-muted2);
}

/* Lead paragraph class (apply to hero subtitles) */
.ac-lead{
  font-family: var(--ac-font-primary);
  font-size: var(--ac-lead);
  line-height: var(--ac-lead-lh);
  letter-spacing: var(--ac-lead-ls);
  font-weight: 500;
  color: var(--ac-muted);
}

/* UI helper class */
.ac-ui{
  font-family: var(--ac-font-ui);
  font-size: var(--ac-ui);
  line-height: var(--ac-ui-lh);
  letter-spacing: var(--ac-ui-ls);
  font-weight: 600;
  color: var(--ac-navy);
}

/* Links */
a{ color: var(--ac-primary); text-decoration: none; }
a:hover{ color: var(--ac-secondary); }

/* Focus accessibility */
:focus-visible{
  outline: 2px solid rgba(5,38,89,0.65);
  outline-offset: 3px;
}

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* Images */
img{ max-width: 100%; height: auto; }


/* -----------------------------
   3) Utility Sections / Backgrounds
------------------------------ */
.ac-section{
  padding-top: var(--ac-section-y);
  padding-bottom: var(--ac-section-y);
}

.ac-section-tight{
  padding-top: var(--ac-section-y-tight);
  padding-bottom: var(--ac-section-y-tight);
}

/* Light surface section */
.ac-surface-bg{
  background: var(--ac-surface);
}

/* Dark attention section */
.ac-dark{
  background: var(--ac-navy);
  color: var(--ac-on-dark);
}
.ac-dark h1, .ac-dark h2, .ac-dark h3, .ac-dark h4, .ac-dark h5, .ac-dark h6{ color: var(--ac-on-dark); }
.ac-dark p{ color: var(--ac-on-dark-muted); }
.ac-dark a{ color: var(--ac-accent); }
.ac-dark a:hover{ color: #ffffff; }

/* Premium minimal "grid + glow" background (use sparingly, e.g., hero) */
.ac-grid-bg{
  position: relative;
  background:
    radial-gradient(1200px 650px at 20% 0%, rgba(193,232,255,0.55), transparent 58%),
    radial-gradient(900px 520px at 80% 18%, rgba(125,160,202,0.28), transparent 55%),
    var(--ac-bg);
}
.ac-grid-bg::before{
  content:"";
  position:absolute; inset:0;
  background-image:
    linear-gradient(to right, rgba(5,38,89,0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(5,38,89,0.06) 1px, transparent 1px);
  background-size: 64px 64px;
  opacity: 0.35;
  pointer-events:none;
  mask-image: radial-gradient(circle at 35% 10%, black 0%, transparent 60%);
}
.ac-grid-bg > *{ position: relative; }

/* Divider */
.ac-divider{
  height: 1px;
  width: 100%;
  background: linear-gradient(90deg, transparent, rgba(5,38,89,0.45), rgba(84,131,179,0.25), transparent);
}


/* -----------------------------
   4) Cards
------------------------------ */
.ac-card{
  background: var(--ac-bg);
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-lg);
  padding: var(--ac-card-pad);
  transition: transform var(--ac-ease), border-color var(--ac-ease), box-shadow var(--ac-ease);
  box-shadow: 0 8px 22px rgba(2,16,36,0.05);
}
.ac-card:hover{
  transform: translateY(-2px);
  border-color: rgba(84,131,179,0.45);
  box-shadow: var(--ac-shadow-sm);
}

/* Soft card variant */
.ac-card--soft{
  background: var(--ac-surface);
}


/* -----------------------------
   5) Pills / Badges
------------------------------ */
.ac-pill{
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--ac-radius-pill);
  border: 1px solid rgba(5,38,89,0.20);
  background: rgba(193,232,255,0.35);
  color: var(--ac-navy);
  font-size: var(--ac-small);
  line-height: 1.2em;
  letter-spacing: 0em;
  font-family: var(--ac-font-ui);
  font-weight: 700;
}


/* -----------------------------
   6) Buttons (Elementor Button widget + Woo buttons)
------------------------------ */
.ac-btn-primary .elementor-button,
.elementor-button.ac-btn-primary,
.woocommerce a.button.ac-btn-primary,
.woocommerce button.button.ac-btn-primary,
.woocommerce input.button.ac-btn-primary{
  font-family: var(--ac-font-ui) !important;
  font-size: var(--ac-ui) !important;
  line-height: var(--ac-ui-lh) !important;
  letter-spacing: var(--ac-ui-ls) !important;

  background: var(--ac-primary) !important;
  color: #ffffff !important;
  border-radius: var(--ac-radius-md) !important;
  border: 1px solid rgba(5,38,89,0.55) !important;

  padding: clamp(0.78rem, 0.68rem + 0.25vw, 0.95rem) clamp(1.05rem, 0.95rem + 0.35vw, 1.35rem) !important;
  font-weight: 700 !important;

  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.ac-btn-primary .elementor-button:hover,
.elementor-button.ac-btn-primary:hover,
.woocommerce a.button.ac-btn-primary:hover,
.woocommerce button.button.ac-btn-primary:hover,
.woocommerce input.button.ac-btn-primary:hover{
  background: var(--ac-navy) !important;
  border-color: var(--ac-navy) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 30px rgba(5,38,89,0.18);
}

.ac-btn-secondary .elementor-button,
.elementor-button.ac-btn-secondary,
.woocommerce a.button.ac-btn-secondary,
.woocommerce button.button.ac-btn-secondary{
  font-family: var(--ac-font-ui) !important;
  font-size: var(--ac-ui) !important;
  line-height: var(--ac-ui-lh) !important;
  letter-spacing: var(--ac-ui-ls) !important;

  background: transparent !important;
  color: var(--ac-primary) !important;
  border-radius: var(--ac-radius-md) !important;
  border: 1px solid rgba(5,38,89,0.35) !important;

  padding: clamp(0.78rem, 0.68rem + 0.25vw, 0.95rem) clamp(1.05rem, 0.95rem + 0.35vw, 1.35rem) !important;
  font-weight: 700 !important;

  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease, border-color .16s ease;
}
.ac-btn-secondary .elementor-button:hover,
.elementor-button.ac-btn-secondary:hover,
.woocommerce a.button.ac-btn-secondary:hover,
.woocommerce button.button.ac-btn-secondary:hover{
  background: rgba(193,232,255,0.35) !important;
  color: var(--ac-navy) !important;
  border-color: rgba(5,38,89,0.55) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(2,16,36,0.08);
}

/* Optional: button size helpers */
.ac-btn-lg .elementor-button{ padding: 1.05rem 1.55rem !important; }
.ac-btn-sm .elementor-button{ padding: 0.65rem 0.95rem !important; font-size: 0.875rem !important; }


/* -----------------------------
   7) Forms (Elementor Forms)
   Add CSS class "ac-form" on the Form widget
------------------------------ */
.ac-form .elementor-field-group{ margin-bottom: 0.875rem; }

.ac-form .elementor-field-label{
  font-family: var(--ac-font-ui);
  font-size: 0.875rem;
  line-height: 1.2em;
  letter-spacing: var(--ac-ui-ls);
  color: var(--ac-navy);
  font-weight: 700;
  margin-bottom: 0.4rem;
}

.ac-form input.elementor-field,
.ac-form textarea.elementor-field,
.ac-form select.elementor-field{
  font-family: var(--ac-font-primary);
  font-size: 1rem;
  line-height: 1.40em;
  letter-spacing: 0em;

  background: #ffffff;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-md);
  color: var(--ac-text);
  padding: 0.875rem 0.875rem;

  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.ac-form input.elementor-field::placeholder,
.ac-form textarea.elementor-field::placeholder{
  color: rgba(91,107,128,0.70);
}

.ac-form input.elementor-field:focus,
.ac-form textarea.elementor-field:focus,
.ac-form select.elementor-field:focus{
  border-color: rgba(84,131,179,0.70);
  box-shadow: 0 0 0 3px rgba(84,131,179,0.20);
  outline: none;
}

/* Submit button styling (if you don't add ac-btn-primary to the button) */
.ac-form .elementor-button{
  font-family: var(--ac-font-ui);
  font-size: var(--ac-ui);
  line-height: var(--ac-ui-lh);
  letter-spacing: var(--ac-ui-ls);
  background: var(--ac-primary);
  color: #ffffff;
  border-radius: var(--ac-radius-md);
  padding: 0.875rem 1.25rem;
  font-weight: 800;
  border: 1px solid rgba(5,38,89,0.55);
}
.ac-form .elementor-button:hover{ background: var(--ac-navy); }


/* -----------------------------
   8) Icon emphasis (optional)
------------------------------ */
.ac-icon i,
.ac-icon svg{
  color: var(--ac-primary) !important;
  fill: var(--ac-primary) !important;
}


/* -----------------------------
   9) FAQ Accordion polish
   Add class to widget: ac-faq
------------------------------ */
.ac-faq .elementor-tab-title{
  background: #ffffff;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-md);
  padding: 1rem 1rem;
  margin-bottom: 0.625rem;

  font-family: var(--ac-font-ui);
  font-size: var(--ac-ui);
  line-height: var(--ac-ui-lh);
  letter-spacing: var(--ac-ui-ls);
  font-weight: 700;
  color: var(--ac-navy);

  transition: border-color var(--ac-ease), box-shadow var(--ac-ease);
}
.ac-faq .elementor-tab-title.elementor-active{
  border-color: rgba(84,131,179,0.70);
  box-shadow: 0 10px 28px rgba(2,16,36,0.06);
}

.ac-faq .elementor-tab-content{
  background: var(--ac-surface);
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-md);
  padding: 1rem 1rem;
  margin-top: -0.35rem;
  margin-bottom: 0.875rem;

  color: var(--ac-muted);
  font-family: var(--ac-font-primary);
  font-size: var(--ac-body);
  line-height: var(--ac-body-lh);
}


/* -----------------------------
   10) Sticky header glass
   Add class to header container: ac-header
------------------------------ */
.ac-header{
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(10px);
  background: rgba(230, 238, 245, 0.70);
  border-bottom: 1px solid rgba(230,238,245,0.90);
}


/* -----------------------------
   11) Utility: max-width helpers
------------------------------ */
.ac-max-1200{ max-width: var(--ac-max-1200); margin-left: auto; margin-right: auto; padding-left: var(--ac-gutter); padding-right: var(--ac-gutter); }
.ac-max-1440{ max-width: var(--ac-max-1440); margin-left: auto; margin-right: auto; padding-left: var(--ac-gutter); padding-right: var(--ac-gutter); }


/* -----------------------------
   12) WooCommerce Essentials (Clean + Minimal)
------------------------------ */

/* Woo buttons default (match brand even without classes) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.add_to_cart_button,
.woocommerce a.single_add_to_cart_button{
  font-family: var(--ac-font-ui);
  font-size: var(--ac-ui);
  line-height: var(--ac-ui-lh);
  letter-spacing: var(--ac-ui-ls);
  font-weight: 800;

  background: var(--ac-primary);
  color: #fff;
  border-radius: var(--ac-radius-md);
  border: 1px solid rgba(5,38,89,0.55);
  padding: clamp(0.70rem, 0.62rem + 0.2vw, 0.90rem) clamp(1.00rem, 0.92rem + 0.25vw, 1.30rem);

  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover{
  background: var(--ac-navy);
  border-color: var(--ac-navy);
  transform: translateY(-1px);
  box-shadow: 0 10px 30px rgba(5,38,89,0.18);
}

/* Product grid -> clean card grid */
.woocommerce ul.products{
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ac-gap);
  list-style: none;
  padding: 0;
  margin: 0;
}
@media (min-width: 768px){
  .woocommerce ul.products{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 1025px){
  .woocommerce ul.products{ grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--ac-gap); }
}
@media (min-width: 1280px){
  .woocommerce ul.products{ grid-template-columns: repeat(4, minmax(0,1fr)); }
}

/* Remove float styles Woo adds in some themes */
.woocommerce ul.products li.product{
  float: none !important;
  width: auto !important;
  margin: 0 !important;

  background: #fff;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-lg);
  padding: var(--ac-card-pad);
  transition: transform var(--ac-ease), border-color var(--ac-ease), box-shadow var(--ac-ease);
}
.woocommerce ul.products li.product:hover{
  transform: translateY(-2px);
  border-color: rgba(84,131,179,0.45);
  box-shadow: var(--ac-shadow-sm);
}

/* Product image */
.woocommerce ul.products li.product a img{
  border-radius: var(--ac-radius-md);
  margin: 0 0 0.85rem 0;
}

/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family: var(--ac-font-sub);
  font-size: 1rem;
  line-height: 1.30em;
  letter-spacing: -0.01em;
  font-weight: 650;
  color: var(--ac-navy);
  margin: 0.25rem 0 0.4rem 0;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.6em;
}

/* Price */
.woocommerce ul.products li.product .price{
  color: var(--ac-primary);
  font-weight: 900;
  font-size: 1.05rem;
  margin-bottom: 0.85rem;
}

/* Sale badge */
.woocommerce span.onsale{
  background: var(--ac-navy);
  color: #fff;
  border-radius: var(--ac-radius-pill);
  padding: 0.35em 0.70em;
  font-family: var(--ac-font-ui);
  font-weight: 900;
  font-size: 0.75rem;
}

/* Breadcrumbs */
.woocommerce-breadcrumb{
  font-family: var(--ac-font-ui);
  font-size: var(--ac-small);
  line-height: var(--ac-small-lh);
  color: var(--ac-muted2);
}

/* Notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error{
  border-radius: var(--ac-radius-lg);
  border: 1px solid var(--ac-border);
  background: var(--ac-surface);
  padding: 1rem 1.25rem;
  color: var(--ac-text);
}

/* Tables (cart/checkout) */
.woocommerce table.shop_table{
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-lg);
  overflow: hidden;
}
.woocommerce table.shop_table th{
  font-family: var(--ac-font-ui);
  font-weight: 900;
  color: var(--ac-navy);
  background: var(--ac-surface);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td{
  padding: 1rem;
  border-bottom: 1px solid var(--ac-border);
}
.woocommerce table.shop_table tr:last-child td{ border-bottom: none; }

/* Checkout input polish (Woo forms) */
.woocommerce form .form-row label{
  font-family: var(--ac-font-ui);
  font-weight: 800;
  color: var(--ac-navy);
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea{
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-md);
  padding: 0.875rem 0.875rem;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus{
  border-color: rgba(84,131,179,0.70);
  box-shadow: 0 0 0 3px rgba(84,131,179,0.20);
  outline: none;
}/* End custom CSS */