/* =========================================================================
   Uniwasher Design System  v0.1
   Palette scaled from the existing brand globals (#016FAE / #B7F0F7).
   Mobile-first. Breakpoints: phone <768, tablet 768-1023, desktop >=1024.
   ========================================================================= */

:root{
  /* --- Brand palette (existing, kept) --- */
  --uw-primary:#016FAE;       /* brand blue */
  --uw-cyan:#B7F0F7;          /* light cyan */
  --uw-text:#7A7A7A;          /* body gray */
  --uw-muted:#C5C5C5;         /* light accent */

  /* --- Scaled extensions (same family, added depth/contrast) --- */
  --uw-navy:#013A5C;          /* dark navy: headers/footer/hero overlay */
  --uw-navy-900:#012A43;
  --uw-teal:#0FA0C0;          /* saturated CTA teal (pops on light) */
  --uw-teal-600:#0B86A1;
  --uw-ink:#14202B;           /* near-black headings */
  --uw-band:#F4F8FB;          /* off-white section band */
  --uw-band-2:#E9F1F6;
  --uw-line:#DfE7Ec;          /* hairlines/borders */
  --uw-white:#FFFFFF;

  /* --- Typography (Overlock brand font + clean body sans) --- */
  --uw-font-head:"Overlock",system-ui,sans-serif;
  --uw-font-body:"Inter","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;

  /* Fluid type scale (clamp: mobile -> desktop) */
  --uw-fs-base:clamp(1rem,0.95rem + 0.25vw,1.125rem);
  --uw-fs-sm:clamp(0.8125rem,0.78rem + 0.15vw,0.875rem);
  --uw-h1:clamp(2rem,1.4rem + 3vw,3.75rem);
  --uw-h2:clamp(1.6rem,1.2rem + 2vw,2.75rem);
  --uw-h3:clamp(1.25rem,1.05rem + 1vw,1.75rem);

  /* Spacing / rhythm (fluid section padding) */
  --uw-section-y:clamp(2.5rem,1.5rem + 5vw,6rem);
  --uw-gap:clamp(1rem,0.6rem + 1.5vw,2rem);
  --uw-radius:10px;
  --uw-radius-lg:16px;
  --uw-shadow:0 6px 24px rgba(1,42,67,.08);
  --uw-shadow-lg:0 14px 40px rgba(1,42,67,.14);
  --uw-container:1200px;
}

/* --- Map design tokens onto Elementor global colors so the editor stays in sync --- */
:root{
  --e-global-color-primary:var(--uw-primary);
  --e-global-color-secondary:var(--uw-cyan);
  --e-global-color-text:var(--uw-text);
  --e-global-color-accent:var(--uw-teal);
}

/* ---------------------------- Base ---------------------------- */
.uw body, body.uw-redesign{font-family:var(--uw-font-body);font-size:var(--uw-fs-base);color:var(--uw-text);}
.uw-redesign h1,.uw-redesign h2,.uw-redesign h3,.uw-redesign h4{font-family:var(--uw-font-head);color:var(--uw-ink);line-height:1.12;}
.uw-redesign img{max-width:100%;height:auto;}

/* --------------------- Layout helpers --------------------- */
.uw-container{width:100%;max-width:var(--uw-container);margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem);}
.uw-section{padding-block:var(--uw-section-y);}
.uw-band{background:var(--uw-band);}
.uw-navy-band{background:var(--uw-navy);color:#dCEaf2;}
.uw-navy-band h1,.uw-navy-band h2,.uw-navy-band h3{color:#fff;}

/* Responsive auto-grid: cards reflow 1 -> 2 -> 3/4 cols by width, no media queries needed */
.uw-grid{display:grid;gap:var(--uw-gap);grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));}
.uw-grid--2{grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));}

/* --------------------- Buttons --------------------- */
.uw-btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--uw-font-head);font-weight:700;
  padding:.85em 1.5em;border-radius:var(--uw-radius);text-decoration:none;line-height:1;cursor:pointer;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;min-height:48px;/* tap target */}
.uw-btn--primary{background:var(--uw-teal);color:#fff;}
.uw-btn--primary:hover{background:var(--uw-teal-600);transform:translateY(-2px);box-shadow:var(--uw-shadow);}
.uw-btn--ghost{background:transparent;color:var(--uw-primary);border:2px solid var(--uw-primary);}
.uw-btn--ghost:hover{background:var(--uw-primary);color:#fff;}
.uw-btn--lg{font-size:1.05rem;padding:1em 1.8em;}

/* --------------------- Cards --------------------- */
.uw-card{background:#fff;border:1px solid var(--uw-line);border-radius:var(--uw-radius-lg);overflow:hidden;
  box-shadow:var(--uw-shadow);transition:transform .18s ease,box-shadow .18s ease;}
.uw-card:hover{transform:translateY(-4px);box-shadow:var(--uw-shadow-lg);}
.uw-card__body{padding:clamp(1rem,3vw,1.5rem);}
.uw-chip{display:inline-block;font-size:var(--uw-fs-sm);font-weight:600;color:var(--uw-teal-600);
  background:var(--uw-band-2);border-radius:999px;padding:.25em .75em;}

/* --- Reliable responsive grid for Elementor card rows (overrides inline flex) --- */
/* Reflows 1 col (phone) -> 2 (tablet) -> 3-4 (desktop) automatically. */
.uw-elgrid{display:grid !important;gap:var(--uw-gap) !important;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));align-items:stretch;}
.uw-elgrid--wide{grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));}
.uw-elgrid > .e-con, .uw-elgrid > .elementor-element{width:auto !important;max-width:none !important;margin:0 !important;}

/* --- Hero --- */
.uw-hero{min-height:clamp(420px,58vh,640px);display:flex;align-items:center;}
.uw-eyebrow{display:inline-block;font-family:var(--uw-font-head);font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;font-size:var(--uw-fs-sm);color:var(--uw-cyan);margin-bottom:.5rem;}
.uw-lead{font-size:clamp(1.05rem,1rem + .4vw,1.3rem);line-height:1.5;}

/* --- Value / segment card inner --- */
.uw-feature{display:flex;flex-direction:column;gap:.4rem;height:100%;}
.uw-feature__title{font-family:var(--uw-font-head);font-weight:700;color:var(--uw-ink);font-size:1.15rem;}
.uw-card a.uw-card__link{color:var(--uw-teal-600);font-weight:700;text-decoration:none;}
.uw-card a.uw-card__link:hover{text-decoration:underline;}

/* --------------------- Spec table (model pages) --------------------- */
.uw-specs{width:100%;border-collapse:collapse;}
.uw-specs th,.uw-specs td{text-align:left;padding:.7em 1em;border-bottom:1px solid var(--uw-line);font-size:var(--uw-fs-sm);}
.uw-specs th{width:42%;color:var(--uw-ink);font-weight:600;}

/* --------------------- Brand trust strip --------------------- */
.uw-brandstrip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(1.5rem,5vw,3.5rem);}
.uw-brandstrip img{max-height:42px;width:auto;filter:grayscale(1);opacity:.7;transition:.2s;}
.uw-brandstrip img:hover{filter:none;opacity:1;}

/* --------------------- Sticky mobile action bar (call/whatsapp/quote) --------------------- */
.uw-mobilebar{display:none;}
@media (max-width:767px){
  .uw-mobilebar{display:grid;grid-template-columns:1fr 1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:999;
    background:var(--uw-navy);box-shadow:0 -4px 18px rgba(0,0,0,.25);}
  .uw-mobilebar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    padding:.55rem;color:#fff;text-decoration:none;font-size:.72rem;min-height:56px;border-right:1px solid rgba(255,255,255,.12);}
  .uw-mobilebar a:last-child{border-right:0;background:var(--uw-teal);}
  body{padding-bottom:56px;} /* clear the bar */
}

/* --------------------- Responsive tuning --------------------- */
/* Tablet */
@media (min-width:768px) and (max-width:1023px){
  .uw-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));}
}
/* Phone: tighten section rhythm, stack hero text */
@media (max-width:767px){
  .uw-hero__cta{flex-direction:column;align-items:stretch;}
  .uw-hero__cta .uw-btn{width:100%;justify-content:center;}
  .uw-specs th{width:50%;}
}

/* --------------------- Elementor native widget theming (redesign only) --------------------- */
.uw-redesign .elementor-button{font-family:var(--uw-font-head);font-weight:700;border-radius:var(--uw-radius);
  padding:.95em 1.7em;min-height:48px;background:var(--uw-teal);color:#fff;transition:background .15s,transform .15s;}
.uw-redesign .elementor-button:hover{background:var(--uw-teal-600);transform:translateY(-2px);}
.uw-redesign .uw-btnwrap--ghost .elementor-button{background:transparent;border:2px solid #fff;color:#fff;}
.uw-redesign .uw-btnwrap--ghost .elementor-button:hover{background:#fff;color:var(--uw-navy);}
.uw-redesign .uw-section{padding-block:var(--uw-section-y);}
.uw-redesign .uw-heading-accent{color:var(--uw-primary);}
.uw-redesign .e-con-inner,.uw-redesign .uw-boxed{max-width:var(--uw-container);margin-inline:auto;}

/* ========================== CONVERSION COMPONENTS ========================== */
/* Section intro (lead paragraph under an H2) */
.uw-intro{max-width:760px;}
.uw-intro p{font-size:clamp(1.02rem,0.98rem + .35vw,1.2rem);line-height:1.6;color:#52606D;}
.uw-center{text-align:center;margin-inline:auto;}

/* Trust / stats band — row of proof points */
.uw-stats{display:grid;gap:var(--uw-gap);grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));text-align:center;}
.uw-stat{padding:1rem;}
.uw-stat__num{font-family:var(--uw-font-head);font-weight:900;font-size:clamp(1.6rem,1.2rem+1.6vw,2.4rem);color:var(--uw-cyan);line-height:1;}
.uw-navy-band .uw-stat__label,.uw-stat__label{display:block;margin-top:.4rem;font-size:var(--uw-fs-sm);letter-spacing:.02em;}
.uw-navy-band .uw-stat__num{color:var(--uw-cyan);}

/* How-it-works steps */
.uw-steps{display:grid;gap:var(--uw-gap);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));counter-reset:uwstep;}
.uw-step{position:relative;background:#fff;border:1px solid var(--uw-line);border-radius:var(--uw-radius-lg);padding:1.5rem 1.25rem 1.25rem;box-shadow:var(--uw-shadow);}
.uw-step::before{counter-increment:uwstep;content:counter(uwstep);display:flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:50%;background:var(--uw-teal);color:#fff;font-family:var(--uw-font-head);font-weight:900;font-size:1.2rem;margin-bottom:.75rem;}
.uw-step__title{font-family:var(--uw-font-head);font-weight:700;color:var(--uw-ink);margin-bottom:.25rem;}

/* Checklist (benefit bullets) */
.uw-checklist{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;}
.uw-checklist li{position:relative;padding-left:1.9rem;line-height:1.5;}
.uw-checklist li::before{content:"";position:absolute;left:0;top:.15em;width:1.2rem;height:1.2rem;border-radius:50%;
  background:var(--uw-teal);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/72% no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/72% no-repeat;}

/* Two-column split (text + media), stacks on mobile */
.uw-split{display:grid;gap:clamp(1.5rem,4vw,3rem);grid-template-columns:1fr 1fr;align-items:center;}
@media (max-width:860px){.uw-split{grid-template-columns:1fr;}}

/* Testimonial / quote */
.uw-quote{background:var(--uw-band);border-left:4px solid var(--uw-teal);border-radius:var(--uw-radius);
  padding:clamp(1.25rem,3vw,2rem);font-size:1.1rem;line-height:1.6;color:#3E4C59;}
.uw-quote cite{display:block;margin-top:.75rem;font-style:normal;font-weight:700;color:var(--uw-ink);font-size:.95rem;}

/* FAQ — styles Elementor's native accordion/toggle widget */
.uw-faq .elementor-accordion .elementor-accordion-item{border:1px solid var(--uw-line);border-radius:var(--uw-radius);margin-bottom:.6rem;overflow:hidden;background:#fff;}
.uw-faq .elementor-tab-title{font-family:var(--uw-font-head);font-weight:700;color:var(--uw-ink);padding:1rem 1.1rem;cursor:pointer;}
.uw-faq .elementor-tab-title.elementor-active{color:var(--uw-primary);}
.uw-faq .elementor-tab-content{padding:0 1.1rem 1rem;line-height:1.6;color:#52606D;}

/* Pill / eyebrow accent for section tops */
.uw-pill{display:inline-block;font-family:var(--uw-font-head);font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  font-size:.72rem;color:var(--uw-teal-600);background:var(--uw-band-2);border-radius:999px;padding:.3em .9em;margin-bottom:.6rem;}

/* Respect reduced motion */
@media (prefers-reduced-motion:reduce){
  .uw-btn,.uw-card{transition:none;}
  .uw-btn--primary:hover,.uw-card:hover{transform:none;}
}
