/* =========================================================================
   MADAF ALL — Design System  (Industrial-Premium, RTL, navy + blue)
   ========================================================================= */

:root{
  /* Brand — navy (from logo) */
  --navy-900:#0B0E24;
  --navy-800:#121634;
  --navy-700:#1C214D;   /* primary brand */
  --navy-600:#272E68;
  --navy-500:#39417F;
  --navy-300:#8288B8;
  --navy-100:#E7E9F3;

  /* Accent — blue (original madaf-all.co.il identity) */
  --accent-800:#1E40AF;  /* deep — accent text on a tint */
  --accent-700:#1D4ED8;  /* hover / accent text on white */
  --accent-600:#2563EB;  /* primary CTA */
  --accent-500:#467FF7;  /* bright accent */
  --accent-100:#DBEAFE;  /* tint background */

  /* Neutrals */
  --ink:#0E1120;
  --slate-700:#343A4D;
  --slate-500:#666E85;
  --slate-400:#8A91A6;
  --slate-300:#C9CFDC;
  --slate-200:#E3E7EF;
  --cloud:#F5F7FB;
  --paper:#FFFFFF;

  --success:#12B76A;
  --danger:#E5484D;
  --star:#FF9F1C;

  /* Typography */
  --font-body:'Heebo', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --font-head:'Rubik', var(--font-body);

  /* Radius */
  --r-xs:8px; --r-sm:12px; --r:16px; --r-lg:22px; --r-xl:28px; --r-pill:999px;

  /* Shadows */
  --sh-sm:0 1px 2px rgba(16,17,32,.06), 0 1px 3px rgba(16,17,32,.05);
  --sh:0 6px 20px rgba(16,17,32,.08);
  --sh-md:0 14px 40px rgba(16,17,32,.12);
  --sh-lg:0 30px 70px rgba(11,14,36,.20);
  --sh-accent:0 8px 20px rgba(37,99,235,.26);   /* restrained — not a glow */

  /* Motion — strong custom easings (built-in CSS easings are too weak, per Emil) */
  --ease-out:cubic-bezier(0.23,1,0.32,1);       /* enter/exit + press */
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);   /* on-screen movement */

  --container:1240px;
  --gutter:clamp(16px, 4vw, 40px);

  /* Rebrand Kadence global palette so its buttons/links/accents follow us */
  --global-palette1:#2563EB;
  --global-palette2:#1D4ED8;
  --global-palette3:#1C214D;
  --global-palette4:#272E68;
  --global-palette5:#0E1120;
  --global-palette6:#343A4D;
  --global-palette7:#666E85;
  --global-palette8:#E3E7EF;
  --global-palette9:#F5F7FB;
  --global-palette-highlight:#2563EB;
}

/* ---------- Base ---------- */
body{ font-family:var(--font-body); color:var(--slate-700); background:var(--paper); font-size:17px; line-height:1.7; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4,h5,.madaf-h{ font-family:var(--font-head); color:var(--navy-700); font-weight:800; line-height:1.15; letter-spacing:-.01em; }
a{ color:var(--navy-700); text-decoration:none; }
a:hover{ color:var(--accent-600); }
img{ max-width:100%; height:auto; }
::selection{ background:var(--accent-100); color:var(--navy-700); }

.madaf-container{ max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.madaf-section{ padding-block:clamp(48px, 7vw, 96px); }
.madaf-section--cloud{ background:var(--cloud); }
.madaf-section--navy{ background:linear-gradient(160deg,var(--navy-800),var(--navy-700)); color:#fff; }
.madaf-section--navy h2, .madaf-section--navy h3{ color:#fff; }

.madaf-eyebrow{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-head); font-weight:700; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; color:#1E40AF; background:var(--accent-100); padding:6px 14px; border-radius:var(--r-pill); }
.madaf-section--navy .madaf-eyebrow{ color:var(--accent-500); background:rgba(37,99,235,.14); }
.madaf-title{ font-size:clamp(1.8rem, 3.4vw, 2.9rem); margin:.5em 0 .3em; }
.madaf-lead{ font-size:clamp(1.02rem,1.6vw,1.2rem); color:var(--slate-500); max-width:60ch; }
.madaf-section--navy .madaf-lead{ color:var(--navy-100); }
.madaf-head-center{ text-align:center; }
.madaf-head-center .madaf-lead{ margin-inline:auto; }

/* ---------- Buttons ---------- */
.madaf-btn, .wp-child-theme-madaf-child .button, body.wp-child-theme-madaf-child .woocommerce a.button, body.wp-child-theme-madaf-child .woocommerce button.button.alt{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-head); font-weight:700; font-size:1.02rem; line-height:1;
  padding:15px 30px; border-radius:var(--r-sm); border:0; cursor:pointer;
  transition:transform .16s var(--ease-out), background-color .18s ease,
             box-shadow .2s ease, filter .18s ease, border-color .18s ease;
}
.madaf-btn--primary, body.wp-child-theme-madaf-child .woocommerce button.button.alt, body.wp-child-theme-madaf-child .woocommerce #respond input#submit.alt{
  background:linear-gradient(180deg,var(--accent-500),var(--accent-600)); color:#fff; box-shadow:var(--sh-accent);
}
.madaf-btn--primary:hover, body.wp-child-theme-madaf-child .woocommerce button.button.alt:hover{ transform:translateY(-1px); color:#fff; filter:saturate(1.05); box-shadow:0 12px 26px rgba(37,99,235,.32); }
.madaf-btn--ghost{ background:transparent; color:#fff; border:2px solid rgba(255,255,255,.5); }
.madaf-btn--ghost:hover{ background:#fff; color:var(--navy-700); border-color:#fff; }
.madaf-btn--navy{ background:var(--navy-700); color:#fff; }
.madaf-btn--navy:hover{ background:var(--navy-600); color:#fff; transform:translateY(-1px); }
/* Press feedback — must come last so :active wins over any :hover transform. */
.madaf-btn:active, body.wp-child-theme-madaf-child .woocommerce a.button:active, body.wp-child-theme-madaf-child .woocommerce button.button.alt:active{ transform:scale(0.97); }
.madaf-btn--lg{ padding:18px 38px; font-size:1.12rem; }
.madaf-btn--block{ width:100%; }

/* Global press feedback — subtle scale-down on tap/click, ~150ms (Emil Kowalski
   tip). Branded buttons already do this; here we extend it to every other button
   on the site. The transition uses element selectors (low specificity) so it
   never overrides the richer transitions on branded buttons. Reduced-motion safe. */
@media (prefers-reduced-motion: no-preference) {
  button, input[type="submit"], input[type="button"], input[type="reset"] {
    transition: transform .15s cubic-bezier(0.23, 1, 0.32, 1);
  }
  /* burger has a background-only transition in nav.css — add transform so it glides */
  .madaf-nav-burger { transition: transform .15s cubic-bezier(0.23, 1, 0.32, 1), background .15s ease; }
  button:active, a.button:active, .button:active, input[type="submit"]:active,
  input[type="button"]:active, [role="button"]:active, .wp-element-button:active,
  .wc-block-components-button:active, .kadence-btn:active,
  .madaf-nav-burger:active, .madaf-nav-searchbtn:active, .madaf-qty__btn:active,
  #a11y-btn:active, .madaf-spt button:active, .madaf-drawer button:active,
  .wpcf7-submit:active {
    transform: scale(0.97);
  }
}

/* ---------- Top utility bar — fixed strip above the madaf-nav-pro bar ---------- */
:root{ --madaf-topbar-h:34px; }
.madaf-topbar{ position:fixed; top:0; right:0; left:0; z-index:99999; height:var(--madaf-topbar-h); background:var(--navy-900); color:#eef; font-size:.85rem; }
.madaf-topbar__inner{ display:flex; align-items:center; justify-content:center; gap:16px; height:100%; white-space:nowrap; overflow:hidden; padding-inline:12px; }
.madaf-topbar__item a{ color:#fff; font-weight:600; }
.madaf-topbar__sep{ width:1px; height:14px; background:rgba(255,255,255,.2); flex:none; }
@media(max-width:720px){
  :root{ --madaf-topbar-h:30px; }
  .madaf-topbar{ font-size:.76rem; }
  .madaf-topbar__item--wide, .madaf-topbar__sep--wide{ display:none; }
}
/* The nav-pro bar is fixed at top:0 — shift it below the topbar and clear both. */
#madaf-nav{ top:var(--madaf-topbar-h) !important; }
body{ padding-top:calc(var(--madaf-topbar-h) + var(--nav-h, 68px)); }
html{ scroll-padding-top:calc(var(--madaf-topbar-h) + var(--nav-h, 68px) + 12px); }
/* Brand the nav bar: blue accent (site identity), brand fonts, accent cart badge. */
#madaf-nav{ --nav-hover-color:var(--accent-600); font-family:var(--font-body); }
#madaf-nav .madaf-menu > li > a{ font-family:var(--font-head); font-weight:600; }
#madaf-nav .madaf-cart-badge, .madaf-cart-count.madaf-cart-badge{ background:var(--accent-600) !important; color:#fff !important; }

/* ---------- Header polish (Kadence) ---------- */
#masthead, .site-header-row-container{ box-shadow:var(--sh-sm); }
.site-branding img.custom-logo{ max-height:54px; width:auto; }
/* Logo (with alt="Madaf All") carries the brand name — remove the duplicate text title */
.site-branding .site-title, .site-header .site-title{ display:none!important; }
.header-navigation .menu-item>a, .header-menu-container .menu-item>a{ font-family:var(--font-head); font-weight:600; }
.header-navigation .menu-item>a:hover{ color:var(--accent-600); }
/* Cart + header action icons in brand navy */
.header-account-button, .header-cart-button, .header-navigation a{ color:var(--navy-700); }
.header-cart-total, .kadence-cart-total{ background:var(--accent-600)!important; }

/* ==========================================================================
   HERO
   ========================================================================== */
.madaf-hero{ position:relative; overflow:hidden; background:radial-gradient(120% 120% at 85% 10%, var(--navy-600) 0%, var(--navy-700) 40%, var(--navy-800) 100%); color:#fff; }
.madaf-hero::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:44px 44px; mask:radial-gradient(80% 80% at 80% 20%,#000,transparent 75%); opacity:.5; }
.madaf-hero__inner{ position:relative; display:grid; grid-template-columns:1fr 1.12fr; gap:40px; align-items:center; padding-block:clamp(40px,6vw,84px); }
.madaf-hero__title{ font-size:clamp(2.1rem,5vw,4rem); color:#fff; line-height:1.06; }
.madaf-hero__title .hl{ color:var(--accent-500); position:relative; white-space:nowrap; }
.madaf-hero__title-sub{ display:block; margin-top:.5em; font-size:.42em; font-weight:600; line-height:1.35; letter-spacing:normal; color:var(--navy-100); }
.madaf-hero__sub{ font-size:clamp(1.05rem,1.8vw,1.32rem); color:var(--navy-100); margin:22px 0 30px; max-width:52ch; }
.madaf-hero__cta{ display:flex; gap:14px; flex-wrap:wrap; }
.madaf-hero__chips{ display:flex; gap:14px; flex-wrap:wrap; margin-top:34px; }
.madaf-hero__chip{ display:flex; align-items:center; gap:7px; font-weight:600; color:#fff; font-size:.88rem; white-space:nowrap; }
.madaf-hero__chip svg, .madaf-hero__chip span.ic{ color:var(--accent-500); font-size:1.2rem; }
.madaf-hero__media{ position:relative; }
.madaf-hero__media img{ border-radius:var(--r-lg); box-shadow:var(--sh-lg); }
/* Crop the 16:9 clip to 4:3 so it fills the column like the old 1400×1000 image
   instead of sitting as a short letterboxed strip ("small cube" on desktop). */
.madaf-hero__video{ display:block; width:100%; aspect-ratio:4/3; height:auto; object-fit:cover; object-position:center; border-radius:var(--r-lg); box-shadow:var(--sh-lg); background:var(--navy-800); }
.madaf-hero__float{ position:absolute; inset-block-end:18px; inset-inline-start:-14px; background:#fff; color:var(--navy-700); border-radius:var(--r); padding:14px 18px; box-shadow:var(--sh-md); display:flex; align-items:center; gap:12px; }
.madaf-hero__float b{ font-family:var(--font-head); font-size:1.4rem; color:var(--accent-700); display:block; line-height:1; }
.madaf-hero__float small{ color:var(--slate-500); }
@media(max-width:900px){ .madaf-hero__inner{ grid-template-columns:1fr; text-align:center; } .madaf-hero__sub{ margin-inline:auto; } .madaf-hero__cta,.madaf-hero__chips{ justify-content:center; } .madaf-hero__media{ order:-1; } }
/* Wide desktop: deepen the crop for extra height/presence. */
@media(min-width:1200px){ .madaf-hero__video{ aspect-ratio:5/4; } }
/* Small screens: keep the rating badge proportionate to the smaller video and
   inside the viewport (the negative offset would poke out of the screen edge). */
@media(max-width:720px){
  .madaf-hero__float{ inset-inline-start:10px; inset-block-end:10px; padding:8px 12px; gap:8px; border-radius:var(--r-sm); }
  .madaf-hero__float b{ font-size:1.02rem; }
  .madaf-hero__float small{ font-size:.72rem; }
}

/* ==========================================================================
   USP strip
   ========================================================================== */
.madaf-usp{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.madaf-usp__item{ display:flex; align-items:center; gap:14px; background:var(--paper); border:1px solid var(--slate-200); border-radius:var(--r); padding:18px 20px; box-shadow:var(--sh-sm); }
.madaf-usp__ic{ flex:0 0 46px; width:46px; height:46px; display:grid; place-items:center; border-radius:12px; background:var(--accent-100); color:var(--accent-700); font-size:1.5rem; }
.madaf-usp__t{ font-family:var(--font-head); font-weight:700; color:var(--navy-700); }
.madaf-usp__s{ font-size:.9rem; color:var(--slate-500); }
@media(max-width:900px){ .madaf-usp{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .madaf-usp{ grid-template-columns:1fr; } }

/* ==========================================================================
   Planner teaser
   ========================================================================== */
.madaf-planner-cta{ position:relative; overflow:hidden; border-radius:var(--r-xl); background:linear-gradient(150deg,var(--navy-700),var(--navy-800)); color:#fff; padding:clamp(28px,5vw,60px); display:grid; grid-template-columns:1.2fr .8fr; gap:30px; align-items:center; box-shadow:var(--sh-lg); }
.madaf-planner-cta::after{ content:""; position:absolute; inset-block:0; inset-inline-end:0; width:45%; background:linear-gradient(90deg,transparent,rgba(37,99,235,.14)); pointer-events:none; }
.madaf-planner-cta h2{ color:#fff; font-size:clamp(1.6rem,3vw,2.5rem); }
.madaf-planner-cta p{ color:var(--navy-100); font-size:1.1rem; margin:14px 0 26px; }
.madaf-planner-cta__steps{ display:flex; gap:22px; margin-top:22px; flex-wrap:wrap; }
.madaf-planner-cta__step{ display:flex; align-items:center; gap:10px; font-weight:600; }
.madaf-planner-cta__step b{ width:30px; height:30px; border-radius:50%; background:var(--accent-600); color:#fff; display:grid; place-items:center; font-family:var(--font-head); }
.madaf-planner-cta__visual{ position:relative; z-index:1; background:rgba(255,255,255,.06); border:1px dashed rgba(255,255,255,.28); border-radius:var(--r-lg); aspect-ratio:4/3; display:grid; place-items:center; text-align:center; color:var(--navy-100); }
@media(max-width:820px){ .madaf-planner-cta{ grid-template-columns:1fr; } }
/* Live variant (homepage teaser) — clean & spacious, NOT a dark box. A softly
   blue-tinted heading band gives brand character while the planner card stays
   light and roomy, like a real tool (structure of the clean version + a touch
   of branding, per user 2026-07-11). */
.madaf-planner-cta--live{
  grid-template-columns:1fr;
  background:transparent; color:inherit;
  padding:0; border-radius:0; box-shadow:none; overflow:visible;
  gap:clamp(18px,3vw,28px);
}
.madaf-planner-cta--live::after{ display:none; }
/* Branded heading band: subtle blue tint fading into the light section. */
.madaf-planner-cta--live .madaf-planner-cta__copy{
  text-align:center; max-width:840px; margin-inline:auto;
  padding:clamp(20px,3vw,34px) 24px clamp(16px,2vw,22px);
  border-radius:var(--r-lg);
  background:radial-gradient(130% 150% at 50% -8%, var(--accent-100) 0%, rgba(219,234,254,.34) 42%, transparent 78%);
}
.madaf-planner-cta--live h2{ color:var(--navy-700); font-size:clamp(1.7rem,3.4vw,2.7rem); line-height:1.12; margin:.35em 0 .4em; }
.madaf-planner-cta--live p{ color:var(--slate-600); font-size:clamp(1.02rem,1.5vw,1.18rem); margin:0 auto 4px; max-width:60ch; }
/* Planner card — the star: roomy, light, elevated. */
.madaf-planner-cta--live .madaf-planner-cta__teaser{ max-width:980px; margin-inline:auto; width:100%; border:1px solid var(--slate-200); }
.madaf-planner-cta--live .madaf-planner-cta__more{ text-align:center; }
/* The "full planner" link is a --ghost (white, for dark bg) → recolor for light. */
.madaf-planner-cta--live .madaf-btn--ghost{ color:var(--navy-700); border-color:var(--slate-300); background:transparent; }
.madaf-planner-cta--live .madaf-btn--ghost:hover{ background:var(--navy-700); color:#fff; border-color:var(--navy-700); }

/* Base teaser card + CTA row (shared). */
.madaf-planner-cta__teaser{ position:relative; z-index:1; background:#fff; border-radius:var(--r-lg); padding:clamp(12px,2vw,22px); box-shadow:var(--sh-md); }
.madaf-planner-cta__more{ text-align:center; position:relative; z-index:1; }
/* Brand the teaser (its default accent is generic blue). Scoped selector so it
   wins regardless of stylesheet load order. */
.madaf-planner-cta__teaser .madaf-spt{ --accent:var(--accent-600); --accent-d:var(--accent-700); }
.madaf-planner-cta__teaser .madaf-spt-start,
.madaf-planner-cta__teaser .madaf-spt-add:not(:disabled){
  background:linear-gradient(180deg,var(--accent-500),var(--accent-600))!important;
  box-shadow:var(--sh-accent)!important;
}
/* Phones: heading band + planner card use full container width, tighter padding. */
@media(max-width:600px){
  .madaf-planner-cta--live .madaf-planner-cta__copy{ padding:20px 14px 14px; border-radius:var(--r); }
  .madaf-planner-cta--live .madaf-planner-cta__teaser{ padding:8px; }
}

/* ==========================================================================
   Category grid
   ========================================================================== */
.madaf-cats{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.madaf-cat{ position:relative; display:block; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:3/4; background:var(--navy-700); box-shadow:var(--sh); }
.madaf-cat img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:.4s ease; }
.madaf-cat::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(11,14,36,.85) 8%,rgba(11,14,36,.15) 55%,transparent); }
.madaf-cat:hover img{ transform:scale(1.06); }
.madaf-cat__label{ position:absolute; inset-block-end:0; inset-inline:0; z-index:2; padding:20px; color:#fff; }
.madaf-cat__label h3{ color:#fff; font-size:1.3rem; margin:0; }
.madaf-cat__label span{ font-size:.9rem; color:var(--navy-100); display:inline-flex; align-items:center; gap:6px; margin-top:4px; }
.madaf-cat__label span::after{ content:"←"; color:var(--accent-500); transition:.2s; }
.madaf-cat:hover .madaf-cat__label span::after{ transform:translateX(-4px); }
@media(max-width:900px){ .madaf-cats{ grid-template-columns:repeat(2,1fr); } }

/* ==========================================================================
   Product cards (loop + custom)
   ========================================================================== */
.madaf-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
@media(max-width:1000px){ .madaf-grid{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:760px){ .madaf-grid{ grid-template-columns:repeat(2,1fr); } }
/* Phones: two cards per row, full width (user request, 2026-07-11). The in-card
   quantity stepper + add-to-cart stack vertically so nothing overflows. */
@media(max-width:600px){
  .madaf-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  /* WooCommerce archive grid (Kadence grid-cols) → two columns too. */
  .woocommerce ul.products.grid-cols{ grid-template-columns:repeat(2,1fr)!important; gap:12px!important; }
  /* Denser card chrome for the narrow 2-up cell. */
  .madaf-pcard__body{ padding:12px 12px 14px; gap:4px; }
  .madaf-pcard__title{ font-size:.92rem; }
  .madaf-pcard__price{ font-size:1.12rem; }
  /* Stack the actions: compact centered qty stepper above a full-width
     add-to-cart button (mirrors madaf-all.co.il). nowrap + explicit flex reset
     stop the button wrapping into a side column on very narrow cards. */
  .madaf-pcard__actions{ flex-direction:column; flex-wrap:nowrap; align-items:center; gap:8px; margin-top:10px; }
  .madaf-pcard__actions .madaf-qty{ flex:0 0 auto; width:auto; }
  .madaf-pcard__actions .madaf-atc{ flex:0 0 auto; width:100%; }
}

.madaf-pcard{ display:flex; flex-direction:column; background:var(--paper); border:1px solid var(--slate-200); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm); transition:.2s ease; position:relative; }
.madaf-pcard:hover{ transform:translateY(-4px); box-shadow:var(--sh-md); border-color:var(--slate-300); }
.madaf-pcard__badge{ position:absolute; inset-block-start:12px; inset-inline-start:12px; z-index:2; background:var(--accent-600); color:#fff; font-family:var(--font-head); font-weight:700; font-size:.8rem; padding:5px 11px; border-radius:var(--r-pill); }
.madaf-pcard__img{ aspect-ratio:1; background:var(--cloud); overflow:hidden; }
.madaf-pcard__img img{ width:100%; height:100%; object-fit:contain; padding:10px; mix-blend-mode:multiply; transition:.3s; }
.madaf-pcard:hover .madaf-pcard__img img{ transform:scale(1.05); }
.madaf-pcard__body{ padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px; flex:1; }
.madaf-pcard__title{ font-size:1.05rem; color:var(--navy-700); margin:0; line-height:1.3; text-align:center; }
.madaf-pcard__dims{ font-size:.85rem; color:#5A6172; text-align:center; }
.madaf-pcard__price{ margin-top:auto; font-family:var(--font-head); font-weight:800; font-size:1.3rem; color:var(--navy-700); font-variant-numeric:tabular-nums; text-align:center; }
.madaf-pcard__price del{ color:var(--slate-400); font-size:.9rem; font-weight:500; }
.madaf-pcard__price ins{ color:var(--accent-700); text-decoration:none; }
.madaf-pcard__cta{ color:#1E40AF; font-weight:700; font-size:.92rem; margin-top:6px; }
/* Grid card — links + inline add-to-cart / quantity */
.madaf-pcard__img{ display:block; }
.madaf-pcard__title a{ color:inherit; }
.madaf-pcard__title a:hover{ color:var(--accent-600); }
.madaf-pcard__actions{ display:flex; align-items:stretch; gap:10px; margin-top:12px; }
.madaf-qty{ display:inline-flex; align-items:center; flex:0 0 auto; border:1px solid var(--slate-300); border-radius:var(--r-sm); background:var(--paper); overflow:hidden; }
.madaf-qty__btn{ width:34px; height:42px; border:0; background:transparent; color:var(--navy-700); font-family:var(--font-head); font-size:1.25rem; font-weight:700; line-height:1; cursor:pointer; transition:.15s ease; }
.madaf-qty__btn:hover:not(:disabled){ background:var(--cloud); color:var(--accent-600); }
.madaf-qty__btn:disabled{ color:var(--slate-300); cursor:default; }
.madaf-qty__val{ min-width:30px; text-align:center; font-family:var(--font-head); font-weight:700; color:var(--navy-700); }
.madaf-atc{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:0 14px; border:0; border-radius:var(--r-sm); cursor:pointer; font-family:var(--font-head); font-weight:700; font-size:.98rem; color:#fff; background:linear-gradient(180deg,var(--accent-500),var(--accent-600)); box-shadow:0 6px 16px rgba(37,99,235,.24); transition:transform .16s var(--ease-out), box-shadow .18s ease, filter .18s ease, background-color .18s ease; }
.madaf-atc:hover{ transform:translateY(-1px); filter:saturate(1.05); box-shadow:0 9px 20px rgba(37,99,235,.3); }
.madaf-atc:active{ transform:scale(0.97); }
.madaf-atc.loading{ opacity:.7; cursor:default; }
.madaf-atc.added{ background:var(--success); box-shadow:none; }
/* After add-to-cart, WooCommerce injects a "מעבר לסל הקניות" link into the actions
   row. Wrap it onto its own line as a clean full-width secondary button. */
.madaf-pcard__actions{ flex-wrap:wrap; }
.madaf-pcard__actions .added_to_cart{
  width:100%; order:3; margin-top:2px; text-align:center;
  padding:9px 12px; border:1.5px solid var(--slate-300); border-radius:var(--r-sm);
  font-family:var(--font-head); font-weight:700; font-size:.9rem; color:var(--navy-700);
  transition:transform .16s var(--ease-out), background-color .18s ease, border-color .18s ease, color .18s ease;
}
.madaf-pcard__actions .added_to_cart::after{ content:" ←"; }
.madaf-pcard__actions .added_to_cart:hover{ background:var(--navy-700); color:#fff; border-color:var(--navy-700); }
.madaf-pcard__actions .added_to_cart:active{ transform:scale(.98); }
/* (≤600px actions now stack via flex-direction:column — the old ≤420 wrap
   rule was removed; it fought the column layout and pushed the button aside.) */
/* Shop / category archive — branded card inside Kadence's product grid cell */
.woocommerce ul.products li.product.madaf-pcard-li{ display:flex; margin:0; padding:0; border:0; background:none; box-shadow:none; }
.woocommerce ul.products li.product.madaf-pcard-li::before,
.woocommerce ul.products li.product.madaf-pcard-li::after{ content:none; display:none; }
.woocommerce ul.products li.product.madaf-pcard-li > .madaf-pcard{ width:100%; }

/* Kadence loop card touch-ups */
.madaf-card__dims{ font-size:.84rem; color:#5A6172; margin:4px 0; }
.madaf-sale, .woocommerce span.onsale.madaf-sale{ background:var(--accent-600); color:#fff; font-family:var(--font-head); font-weight:700; min-height:auto; min-width:auto; border-radius:var(--r-pill); padding:5px 11px; line-height:1; }
.woocommerce ul.products li.product .price{ color:var(--navy-700); font-family:var(--font-head); font-weight:800; font-variant-numeric:tabular-nums; }

/* ==========================================================================
   Social proof / stats
   ========================================================================== */
.madaf-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; text-align:center; }
.madaf-stat b{ font-family:var(--font-head); font-weight:800; font-size:clamp(2rem,4vw,3rem); color:var(--accent-500); display:block; }
.madaf-stat span{ color:var(--navy-100); font-weight:600; }
@media(max-width:700px){ .madaf-stats{ grid-template-columns:repeat(2,1fr); } }
/* Text-based stats (phrases instead of big numbers): smaller, balanced, top-aligned. */
.madaf-stats--text{ align-items:start; gap:18px 22px; }
.madaf-stats--text .madaf-stat{ display:flex; flex-direction:column; gap:6px; }
.madaf-stats--text .madaf-stat b{ font-size:clamp(1.35rem,2.2vw,1.7rem); line-height:1.2; text-wrap:balance; }
.madaf-stats--text .madaf-stat span{ font-size:.95rem; line-height:1.35; text-wrap:balance; }

.madaf-testi{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.madaf-testi__card{ background:var(--paper); border:1px solid var(--slate-200); border-radius:var(--r-lg); padding:26px; box-shadow:var(--sh-sm); }
.madaf-testi__stars{ color:var(--star); font-size:1.05rem; letter-spacing:2px; }
.madaf-testi__q{ color:var(--slate-700); margin:12px 0; font-size:1.02rem; }
.madaf-testi__who{ font-family:var(--font-head); font-weight:700; color:var(--navy-700); }
@media(max-width:820px){ .madaf-testi{ grid-template-columns:1fr; } }

/* ==========================================================================
   Real customer gallery (WhatsApp screenshots + install photos)
   ========================================================================== */
.madaf-realgal{ columns:3 260px; column-gap:16px; }
.madaf-realgal__item{ position:relative; display:block; margin-bottom:16px; border-radius:var(--r); overflow:hidden; border:1px solid var(--slate-200); box-shadow:var(--sh-sm); transition:.2s; break-inside:avoid; background:var(--cloud); cursor:zoom-in; }
.madaf-realgal__item:hover{ transform:translateY(-3px); box-shadow:var(--sh-md); }
.madaf-realgal__item img{ display:block; width:100%; height:auto; }
/* Hover: magnifier + "לחצו להגדלה" overlay. */
.madaf-realgal__zoom{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; background:rgba(11,14,36,.5); color:#fff; font-family:var(--font-head); font-weight:700; font-size:.95rem; opacity:0; transition:opacity .2s ease; pointer-events:none; }
.madaf-realgal__zoom svg{ width:26px; height:26px; }
.madaf-realgal__item:hover .madaf-realgal__zoom, .madaf-realgal__item:focus-visible .madaf-realgal__zoom{ opacity:1; }
.madaf-realgal--full{ columns:3 280px; }
@media(max-width:560px){ .madaf-realgal{ columns:2 150px; column-gap:10px; } .madaf-realgal__item{ margin-bottom:10px; } }

/* Lightbox for the customer gallery (built in madaf.js). */
.madaf-lightbox{ position:fixed; inset:0; z-index:100060; display:none; align-items:center; justify-content:center; padding:clamp(16px,4vw,40px); background:rgba(8,10,26,.92); }
.madaf-lightbox.open{ display:flex; animation:madafLbFade .2s ease; }
.madaf-lightbox__img{ max-width:min(94vw,860px); max-height:88vh; border-radius:var(--r-sm); box-shadow:0 30px 90px rgba(0,0,0,.55); }
.madaf-lightbox__close{ position:absolute; inset-block-start:clamp(14px,3vw,26px); inset-inline-end:clamp(14px,3vw,26px); width:46px; height:46px; display:grid; place-items:center; border:0; border-radius:50%; background:rgba(255,255,255,.16); color:#fff; font-size:1.4rem; line-height:1; cursor:pointer; transition:background .15s ease, transform .15s var(--ease-out); }
.madaf-lightbox__close:hover{ background:rgba(255,255,255,.3); }
@keyframes madafLbFade{ from{ opacity:0 } to{ opacity:1 } }

/* ==========================================================================
   CTA band
   ========================================================================== */
.madaf-ctaband{ background:linear-gradient(120deg,var(--accent-600),var(--accent-700)); color:#fff; border-radius:var(--r-xl); padding:clamp(28px,5vw,54px); text-align:center; box-shadow:var(--sh-md); }
.madaf-ctaband h2{ color:#fff; font-size:clamp(1.6rem,3vw,2.4rem); }
.madaf-ctaband p{ color:#fff; opacity:.95; font-size:1.1rem; margin:12px 0 26px; }
.madaf-ctaband .madaf-btn--navy{ background:#fff; color:var(--navy-700); }
.madaf-ctaband .madaf-btn--navy:hover{ background:var(--navy-900); color:#fff; }

/* ==========================================================================
   Single product conversion
   ========================================================================== */
.madaf-trust{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px 18px; margin:22px 0; padding:18px; background:var(--cloud); border-radius:var(--r); }
.madaf-trust__item{ display:flex; align-items:center; gap:10px; font-size:.94rem; color:var(--slate-700); font-weight:500; }
.madaf-trust__item span{ font-size:1.2rem; }
.madaf-ask{ display:inline-flex; align-items:center; gap:8px; margin-top:14px; color:var(--success); font-weight:700; }

.madaf-sticky-atc{ position:fixed; inset-block-end:0; inset-inline:0; z-index:940; background:#fff; border-top:1px solid var(--slate-200); box-shadow:0 -8px 24px rgba(16,17,32,.12); transform:translateY(110%); transition:.25s ease; }
.madaf-sticky-atc.is-visible{ transform:none; }
.madaf-sticky-atc__inner{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding-block:10px; }
.madaf-sticky-atc__name{ font-family:var(--font-head); font-weight:700; color:var(--navy-700); display:block; font-size:.95rem; }
.madaf-sticky-atc__price{ color:var(--accent-700); font-weight:700; font-variant-numeric:tabular-nums; }
.madaf-sticky-atc__btn{ white-space:nowrap; }
@media(min-width:992px){ .madaf-sticky-atc{ display:none; } }
/* When the mobile sticky add-to-cart bar is showing, lift the floating
   accessibility button above it so it stops covering "הוספה לסל".
   --madaf-atc-h is set to the bar's live height by madaf.js. The double-id
   selector + !important out-specifies the plugin's own ≤400px position rule. */
@media(max-width:991px){
  #a11y-widget-root #a11y-btn{
    bottom:calc(var(--madaf-atc-h, 0px) + 18px) !important;
    transition:opacity .2s ease, transform .2s ease;
  }
  /* Tucked away while the shopper scrolls down the grid (JS toggles it). */
  #a11y-widget-root #a11y-btn.madaf-a11y-tuck{
    opacity:0; pointer-events:none; transform:translateY(140%);
  }
}

/* ==========================================================================
   WhatsApp float
   ========================================================================== */
.madaf-wa{ position:fixed; inset-block-end:22px; inset-inline-start:22px; z-index:950; width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow:0 10px 26px rgba(37,211,102,.5); transition:.2s; }
.madaf-wa:hover{ transform:scale(1.08); color:#fff; }
@media(max-width:992px){ .madaf-wa{ inset-block-end:78px; } } /* clear sticky ATC */

/* ==========================================================================
   Footer polish
   ========================================================================== */
.madaf-foot{ background:var(--navy-800); color:var(--navy-100); padding-block:clamp(40px,6vw,72px) 24px; }
.madaf-foot a{ color:var(--navy-100); }
.madaf-foot a:hover{ color:var(--accent-500); }
.madaf-foot__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:34px; }
.madaf-foot h3{ color:#fff; font-size:1.05rem; margin-bottom:14px; font-family:var(--font-head); }
.madaf-foot ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.madaf-foot__brand img{ max-height:46px; margin-bottom:14px; filter:brightness(0) invert(1); }
.madaf-foot__pay{ display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.madaf-foot__pay span{ background:rgba(255,255,255,.1); border-radius:8px; padding:6px 10px; font-size:.8rem; }
.madaf-foot__bottom{ border-top:1px solid rgba(255,255,255,.12); margin-top:34px; padding-top:20px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:.85rem; color:var(--navy-300); }
@media(max-width:900px){ .madaf-foot__grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .madaf-foot__grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   Shelf Planner — brand overrides (navy + orange) for conversion
   ========================================================================== */
/* Primary CTAs → brand orange */
.madaf-sp-wrap .madaf-sp-add-btn,
.madaf-sp-wrap .madaf-sp-add-btn--bar,
.madaf-sp-wiz-build{
  background:linear-gradient(180deg,var(--accent-500),var(--accent-600))!important;
  color:#fff!important; border:0!important; font-family:var(--font-head)!important;
  font-weight:700!important; box-shadow:var(--sh-accent)!important; border-radius:var(--r-sm)!important;
}
.madaf-sp-wrap .madaf-sp-add-btn:not(:disabled):hover,
.madaf-sp-wiz-build:hover{ filter:saturate(1.08) brightness(1.02); transform:translateY(-1px); }
.madaf-sp-wrap .madaf-sp-add-btn:disabled{ opacity:.5; }

/* Step numbers, wizard emoji ring, active accents → navy/orange */
.madaf-sp-steps .madaf-sp-step-num{ background:var(--navy-700)!important; color:#fff!important; }
.madaf-sp-step-sep{ color:var(--accent-600)!important; }
.madaf-sp-wiz-emoji{ background:var(--accent-100)!important; }
.madaf-sp-summary-title, .madaf-sp-wiz-card h3{ color:var(--navy-700)!important; font-family:var(--font-head)!important; }
.madaf-sp-total{ color:var(--navy-700)!important; font-family:var(--font-head)!important; }

/* Catalog filter chips active state → navy */
.madaf-sp-wrap .madaf-sp-filter-chip.is-active,
.madaf-sp-wrap .madaf-sp-chip.is-active{ background:var(--navy-700)!important; color:#fff!important; border-color:var(--navy-700)!important; }

/* Trust row + share/copy buttons → subtle brand tint */
.madaf-sp-trust span{ color:var(--slate-700); }
.madaf-sp-copy-link{ color:var(--navy-700)!important; }

/* Full-bleed planner: let it use the page width comfortably */
.madaf-sp-wrap{ --sp-accent:var(--accent-600); }

/* SEO section below planner — align with site type scale */
.madaf-sp-seo-section{ max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); padding-block:40px; }
.madaf-sp-seo-section h2, .madaf-sp-seo-section h3{ color:var(--navy-700); font-family:var(--font-head); }

/* ==========================================================================
   One-page-checkout drawer (madaf-nav-pro) — brand alignment
   ========================================================================== */
#madaf-drawer{
  --mc-navy:   var(--navy-700);
  --mc-blue:   var(--navy-600);
  --mc-orange: var(--accent-700);
  --mc-orange-lt: var(--accent-100);
  font-family:var(--font-body);
}
/* Class collision: the theme's page-level `.madaf-section` (48-96px padding)
   must not inflate the drawer's compact sections of the same name. */
#madaf-drawer .madaf-section{ padding:16px 20px; }
#madaf-drawer .madaf-drawer-title{ font-family:var(--font-head); }
#madaf-drawer #madaf-pay-btn{
  background:linear-gradient(180deg,var(--accent-500),var(--accent-600)) !important;
  font-family:var(--font-head) !important; font-weight:700 !important;
  box-shadow:var(--sh-accent) !important; border-radius:var(--r-sm) !important;
}
#madaf-drawer #madaf-pay-btn:not(:disabled):hover{ background:linear-gradient(180deg,var(--accent-600),var(--accent-700)) !important; }

/* ==========================================================================
   Sticky top utility row (lives inside Kadence header top row)
   ========================================================================== */
.site-top-header-wrap{ background:var(--navy-900); color:#EEF; }
.site-top-header-wrap .site-header-row{ min-height:34px; }
.madaf-topbar__inner{ display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; padding-block:7px; font-size:.86rem; color:#EEF; }
.madaf-topbar__inner a{ color:#fff; font-weight:600; }
.madaf-topbar__sep{ width:1px; height:14px; background:rgba(255,255,255,.2); display:inline-block; }
@media(max-width:720px){ .madaf-topbar__sep{ display:none; } .madaf-topbar__inner{ font-size:.78rem; padding-block:6px; gap:10px; } }

/* ==========================================================================
   Contact + About pages
   ========================================================================== */
.madaf-contact__grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:34px; margin-top:40px; align-items:start; }
.madaf-contact__info, .madaf-contact__form{ background:var(--paper); border:1px solid var(--slate-200); border-radius:var(--r-lg); padding:30px; box-shadow:var(--sh-sm); }
.madaf-contact__info h2, .madaf-contact__form h2{ font-size:1.4rem; margin-bottom:18px; }
.madaf-contact__list{ list-style:none; margin:0 0 22px; padding:0; display:flex; flex-direction:column; gap:16px; }
.madaf-contact__list li{ display:flex; gap:14px; align-items:flex-start; }
.madaf-contact__list li span{ font-size:1.4rem; flex:0 0 auto; }
.madaf-contact__list b{ color:var(--navy-700); font-family:var(--font-head); }
@media(max-width:820px){ .madaf-contact__grid{ grid-template-columns:1fr; } }

/* ── CF7 form → brand (CF7's own stylesheet is dequeued; everything below owns the look) ── */
/* The hidden-fields fieldset otherwise renders as an empty browser-styled box above the form */
.wpcf7 fieldset.hidden-fields-container{ border:0; margin:0; padding:0; }

/* Card head: chat chip + title + subtitle */
.madaf-cf-head{ display:flex; align-items:center; gap:14px; margin-bottom:22px; }
.madaf-cf-head h2{ margin-bottom:0; }
.madaf-cf-sub{ margin:2px 0 0; font-size:.9rem; color:var(--slate-500); line-height:1.4; }
.madaf-cf-chip{ flex:0 0 auto; width:46px; height:46px; border-radius:14px; background:var(--accent-100); position:relative; }
.madaf-cf-chip::before{ content:""; position:absolute; inset:12px; background:var(--accent-600); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E") center/contain no-repeat; }

/* Fields: fixed labels above, two-column name+phone row */
.wpcf7-form .madaf-cf-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px; }
.wpcf7-form .madaf-cf-row .madaf-cf-field{ margin-bottom:0; }
.madaf-cf-field{ margin-bottom:16px; }
.madaf-cf-field label{ display:block; font-family:var(--font-body); font-weight:700; font-size:.87rem; color:var(--slate-700); margin-bottom:6px; line-height:1.4; }
.madaf-cf-req{ color:var(--accent-600); font-weight:700; font-style:normal; }
.madaf-cf-opt{ color:var(--slate-400); font-weight:400; font-size:.8rem; }
.wpcf7-form .wpcf7-form-control-wrap{ position:relative; display:block; }
.wpcf7-form input:not([type=submit]):not([type=checkbox]), .wpcf7-form textarea{ width:100%; box-sizing:border-box; padding:12px 14px; border:1.5px solid var(--slate-200); border-radius:var(--r-sm); font-family:var(--font-body); font-size:1rem; color:var(--slate-700); background:var(--cloud); transition:border-color .15s, background .15s, box-shadow .15s; }
.wpcf7-form input::placeholder, .wpcf7-form textarea::placeholder{ color:var(--slate-400); opacity:1; }
.wpcf7-form input:not([type=submit]):not([type=checkbox]):hover, .wpcf7-form textarea:hover{ border-color:var(--slate-300); }
.wpcf7-form input:not([type=submit]):not([type=checkbox]):focus, .wpcf7-form textarea:focus{ outline:none; border-color:var(--accent-600); background:#fff; box-shadow:0 0 0 3px rgba(37,99,235,.13); }
.wpcf7-form textarea{ resize:vertical; min-height:104px; line-height:1.6; }
@media(max-width:520px){ .wpcf7-form .madaf-cf-row{ grid-template-columns:1fr; gap:0; margin-bottom:0; } .wpcf7-form .madaf-cf-row .madaf-cf-field{ margin-bottom:16px; } }

/* In-field icons — masked, so they inherit brand colors and flip to accent on focus */
.wpcf7-form-control-wrap[data-name="your-name"]{ --cf-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E"); }
.wpcf7-form-control-wrap[data-name="your-phone"]{ --cf-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E"); }
.wpcf7-form-control-wrap[data-name="your-email"]{ --cf-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E"); }
.wpcf7-form-control-wrap[data-name="your-name"] input, .wpcf7-form-control-wrap[data-name="your-phone"] input, .wpcf7-form-control-wrap[data-name="your-email"] input{ padding-inline-end:44px; }
/* Phone + email hold LTR content; Chrome forces direction:ltr on type=tel, which flips
   the logical padding to the wrong side and collides with the icon — pin physical sides */
.wpcf7-form-control-wrap[data-name="your-phone"] input, .wpcf7-form-control-wrap[data-name="your-email"] input{ direction:ltr; text-align:right; padding-left:44px; padding-right:14px; }
.wpcf7-form-control-wrap[data-name="your-name"]::before, .wpcf7-form-control-wrap[data-name="your-phone"]::before, .wpcf7-form-control-wrap[data-name="your-email"]::before{ content:""; position:absolute; inset-inline-end:15px; top:50%; transform:translateY(-50%); width:18px; height:18px; background:var(--slate-400); pointer-events:none; transition:background .15s; -webkit-mask:var(--cf-icon) center/contain no-repeat; mask:var(--cf-icon) center/contain no-repeat; }
.wpcf7-form-control-wrap[data-name="your-name"]:focus-within::before, .wpcf7-form-control-wrap[data-name="your-phone"]:focus-within::before, .wpcf7-form-control-wrap[data-name="your-email"]:focus-within::before{ background:var(--accent-600); }

/* Privacy-policy consent — custom checkbox */
.wpcf7-form .madaf-cf-consent{ margin:2px 0 4px; font-size:.88rem; color:var(--slate-500); }
.wpcf7-form .madaf-cf-consent .wpcf7-list-item{ margin:0; display:block; }
.wpcf7-form .madaf-cf-consent label{ display:flex; align-items:flex-start; gap:10px; cursor:pointer; line-height:1.55; }
.wpcf7-form .madaf-cf-consent input[type=checkbox]{ appearance:none; -webkit-appearance:none; width:19px; height:19px; flex:0 0 auto; margin:3px 0 0; padding:0; border:1.5px solid var(--slate-300); border-radius:6px; background:var(--cloud); cursor:pointer; transition:background .15s, border-color .15s; }
.wpcf7-form .madaf-cf-consent input[type=checkbox]:checked{ background:var(--accent-600) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat; border-color:var(--accent-600); }
.wpcf7-form .madaf-cf-consent input[type=checkbox]:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(37,99,235,.2); }
.wpcf7-form .madaf-cf-consent a{ color:var(--accent-700); text-decoration:underline; text-underline-offset:2px; }

/* Submit + trust microcopy (CF7 disables the button until the consent box is ticked) */
.wpcf7-form input[type=submit]{ width:100%; margin-top:14px; }
.wpcf7-form input[type=submit]:disabled{ opacity:.5; cursor:not-allowed; box-shadow:none; transform:none; }
.madaf-cf-note{ display:flex; align-items:center; justify-content:center; gap:7px; margin:14px 0 0; font-size:.8rem; color:var(--slate-400); text-align:center; line-height:1.4; }
.madaf-cf-note::before{ content:""; flex:0 0 auto; width:13px; height:13px; background:var(--slate-400); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E") center/contain no-repeat; }

/* Validation + AJAX states (replaces CF7's defaults) */
.wpcf7-form .wpcf7-not-valid{ border-color:var(--danger); }
.wpcf7-form .wpcf7-not-valid-tip{ display:block; margin:5px 2px 0; font-size:.8rem; color:var(--danger); line-height:1.4; }
.wpcf7 .wpcf7-response-output{ border:0; border-radius:var(--r-sm); margin:16px 0 0; padding:13px 16px; font-size:.93rem; font-weight:500; line-height:1.5; }
.wpcf7 form.sent .wpcf7-response-output{ background:#E9F9F1; color:#0E9B5C; }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output{ background:#FDECED; color:var(--danger); }
.wpcf7-form .wpcf7-response-output:empty{ display:none; }
.wpcf7-spinner{ visibility:hidden; display:block; width:20px; height:20px; margin:10px auto 0; border-radius:50%; border:2.5px solid var(--accent-100); border-top-color:var(--accent-600); background:none; padding:0; }
.wpcf7-spinner::before{ content:none; }
.wpcf7-form.submitting .wpcf7-spinner{ visibility:visible; animation:madaf-cf-spin .7s linear infinite; }
@keyframes madaf-cf-spin{ to{ transform:rotate(360deg); } }

.madaf-about__lead{ max-width:70ch; margin-inline:auto; text-align:center; font-size:1.12rem; color:var(--slate-700); }
.madaf-about__lead p{ margin-bottom:18px; }
.madaf-about__stats{ margin:50px 0; }
.madaf-about__stats .madaf-stat b{ color:var(--accent-700); }
.madaf-about__stats .madaf-stat span{ color:var(--slate-500); }
.madaf-about__values{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:20px; }
@media(max-width:900px){ .madaf-about__values{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .madaf-about__values{ grid-template-columns:1fr; } }

/* ==========================================================================
   Utilities / motion
   ========================================================================== */
.madaf-mt-sm{ margin-top:14px; } .madaf-mt{ margin-top:26px; } .madaf-mt-lg{ margin-top:44px; }
@media (prefers-reduced-motion:reduce){ *{ transition:none!important; animation:none!important; } }

/* ==========================================================================
   Cookie / privacy notice banner (accept-only)
   ========================================================================== */
.madaf-cookie{ position:fixed; inset-inline:0; bottom:0; z-index:9990; background:var(--navy-700); color:#fff; box-shadow:0 -8px 30px rgba(11,14,36,.28); transform:translateY(100%); transition:transform .35s ease; }
.madaf-cookie.is-in{ transform:translateY(0); }
.madaf-cookie__inner{ max-width:1180px; margin-inline:auto; padding:16px 22px; display:flex; align-items:center; gap:22px; }
.madaf-cookie__text{ font-size:.92rem; line-height:1.55; color:rgba(255,255,255,.9); }
.madaf-cookie__text strong{ color:#fff; }
.madaf-cookie__text a{ color:var(--accent-500); text-decoration:underline; font-weight:600; }
.madaf-cookie__text a:hover{ color:#fff; }
.madaf-cookie__btn{ flex:0 0 auto; background:var(--accent-600); color:#fff; border:none; border-radius:var(--r-sm); padding:12px 34px; font-family:var(--font-head); font-weight:700; font-size:1rem; cursor:pointer; transition:transform .16s var(--ease-out), background-color .16s ease; box-shadow:var(--sh-accent); }
.madaf-cookie__btn:hover{ background:var(--accent-700); transform:translateY(-1px); }
.madaf-cookie__btn:active{ transform:scale(0.97); }
@media(max-width:720px){
  .madaf-cookie__inner{ flex-direction:column; align-items:stretch; gap:12px; padding:14px 18px calc(14px + env(safe-area-inset-bottom)); }
  .madaf-cookie__text{ font-size:.86rem; }
  .madaf-cookie__btn{ width:100%; padding:13px; }
}

/* ==========================================================================
   FAQ accordion  ([madaf_faq])
   ========================================================================== */
.madaf-faq{ max-width:820px; margin-inline:auto; }
.madaf-faq__item{ background:#fff; border:1.5px solid var(--slate-300); border-radius:var(--r-md); margin-bottom:14px; overflow:hidden; transition:border-color .15s, box-shadow .15s; }
.madaf-faq__item[open]{ border-color:var(--accent-600); box-shadow:0 6px 22px rgba(28,33,77,.08); }
.madaf-faq__q{ list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 22px; font-family:var(--font-head); font-weight:700; font-size:1.06rem; color:var(--navy-700); }
.madaf-faq__q::-webkit-details-marker{ display:none; }
.madaf-faq__q:hover{ color:var(--accent-700); }
.madaf-faq__icon{ flex:0 0 auto; position:relative; width:20px; height:20px; }
.madaf-faq__icon::before, .madaf-faq__icon::after{ content:""; position:absolute; inset-inline-start:0; top:9px; width:20px; height:2.5px; background:var(--accent-600); border-radius:2px; transition:transform .25s ease; }
.madaf-faq__icon::after{ transform:rotate(90deg); }
.madaf-faq__item[open] .madaf-faq__icon::after{ transform:rotate(0); }
.madaf-faq__a{ padding:0 22px 20px; color:var(--slate-700); line-height:1.7; font-size:1rem; }
.madaf-faq__a p{ margin:0; }
.madaf-faq__cta{ text-align:center; margin-top:34px; padding:26px; background:var(--navy-100); border-radius:var(--r-md); }
.madaf-faq__cta p{ margin:0 0 16px; font-family:var(--font-head); font-weight:600; color:var(--navy-700); font-size:1.1rem; }
@media(max-width:520px){
  .madaf-faq__q{ padding:15px 16px; font-size:.98rem; }
  .madaf-faq__a{ padding:0 16px 16px; font-size:.95rem; }
}

/* Dimension filter (width / height / depth) — industrial shelving archive
   Design-engineered per Emil Kowalski's principles: Linear-style segmented
   control (elevated white pill on a neutral track), accent reserved for CTAs,
   crisp <200ms micro-interactions, scale(0.97) press feedback, tabular-nums.
   Deliberately NO entrance animation: the bar reloads on every pill click, so
   an entrance would replay constantly — "how often will users see it?" → skip. */
.madaf-dfilter{
  --dfx-ease-out:cubic-bezier(0.23,1,0.32,1);   /* strong ease-out for press */
  display:flex; flex-wrap:wrap; align-items:center; gap:16px 30px;
  margin:0 0 28px; padding:16px 20px;
  background:var(--paper); border:1px solid var(--slate-200);
  border-radius:var(--r); box-shadow:var(--sh-sm);
}
.madaf-dfilter__head{
  flex:0 0 100%;
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
}
.madaf-dfilter__title{
  font-family:var(--font-head); font-weight:700; color:var(--navy-700);
  font-size:1rem; letter-spacing:-.01em;
}
.madaf-dfilter__title small{ color:var(--slate-400); font-weight:500; margin-inline-start:2px; }
.madaf-dfilter__clear{
  display:inline-flex; align-items:center; gap:5px;
  font-family:var(--font-head); font-weight:600; font-size:.85rem;
  color:var(--slate-500); transition:color .16s ease;
}
.madaf-dfilter__clear:hover{ color:var(--accent-700); }
/* Each dimension is a self-contained group; groups flow inline as a toolbar. */
.madaf-drow{
  display:inline-flex; align-items:center; gap:11px;
}
.madaf-drow__label{
  font-family:var(--font-head); font-weight:600;
  color:var(--slate-500); font-size:.92rem; white-space:nowrap;
}
/* The track — a neutral surface the selected segment sits proud of. */
.madaf-drow__pills{
  display:inline-flex; flex-wrap:wrap; gap:3px;
  padding:4px; background:var(--cloud);
  border:1px solid var(--slate-200); border-radius:11px;
}
.madaf-dpill{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:46px; min-height:34px; padding:6px 15px;
  font-family:var(--font-head); font-weight:600; font-size:.94rem; line-height:1;
  font-variant-numeric:tabular-nums;
  color:var(--slate-500); background:transparent;
  border:0; border-radius:7px; cursor:pointer;
  transition:color .16s ease, background-color .16s ease, box-shadow .16s ease,
             transform .14s var(--dfx-ease-out);
}
.madaf-dpill:active{ transform:scale(0.97); }
.madaf-dpill:focus-visible{ outline:2px solid var(--accent-600); outline-offset:2px; }
@media (hover:hover) and (pointer:fine){
  .madaf-dpill:hover{ color:var(--navy-700); }
}
/* Selected — the elevated white pill (Linear/Sonner segmented look). */
.madaf-dpill.is-active{
  color:var(--navy-700); font-weight:700;
  background:var(--paper); box-shadow:var(--sh-sm);
}
@media(max-width:760px){
  .madaf-dfilter{ gap:12px; }
  .madaf-drow{ flex:0 0 100%; justify-content:space-between; }
}
@media(max-width:520px){
  .madaf-dfilter{ padding:15px; }
  .madaf-drow{ align-items:center; }
  .madaf-drow__label{ min-width:40px; }
  .madaf-dpill{ min-width:44px; padding:6px 13px; font-size:.9rem; }
}
@media (prefers-reduced-motion:reduce){
  .madaf-dpill{ transition:color .16s ease, background-color .16s ease; }
  .madaf-dpill:active{ transform:none; }
}

/* ==========================================================================
   Video facade (click-to-load YouTube) + product assembly section
   ========================================================================== */
.madaf-video{ max-width:320px; margin-inline:auto; }
.madaf-video__facade{ position:relative; display:block; width:100%; aspect-ratio:9/16; padding:0; border:none; border-radius:var(--r-md); overflow:hidden; cursor:pointer; background:#000; box-shadow:0 12px 34px rgba(11,14,36,.22); }
.madaf-video__thumb{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .4s ease, filter .2s; }
.madaf-video__facade:hover .madaf-video__thumb{ transform:scale(1.05); filter:brightness(.9); }
.madaf-video__play{ position:absolute; inset:0; margin:auto; width:60px; height:42px; display:flex; align-items:center; justify-content:center; }
.madaf-video__play-bg{ fill:#212121; opacity:.85; transition:fill .2s, opacity .2s; }
.madaf-video__facade:hover .madaf-video__play-bg{ fill:var(--accent-600); opacity:1; }
.madaf-video__label{ position:absolute; inset-inline:0; bottom:0; padding:26px 14px 12px; background:linear-gradient(transparent,rgba(11,14,36,.82)); color:#fff; font-family:var(--font-head); font-weight:700; font-size:.95rem; text-align:center; }
.madaf-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:var(--r-md); }

.madaf-assembly{ display:grid; grid-template-columns:1fr 320px; gap:40px; align-items:center; max-width:var(--container,1180px); margin:46px auto; padding:34px; background:var(--cloud); border:1.5px solid var(--slate-200,#e9edf3); border-radius:var(--r-lg,18px); }
.madaf-assembly__text h2{ font-size:1.5rem; margin-bottom:14px; }
.madaf-assembly__text p{ color:var(--slate-700); line-height:1.7; margin-bottom:18px; }
.madaf-assembly__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.madaf-assembly__list li{ position:relative; padding-inline-start:30px; color:var(--navy-700); font-weight:500; }
.madaf-assembly__list li::before{ content:"✓"; position:absolute; inset-inline-start:0; top:0; width:20px; height:20px; display:flex; align-items:center; justify-content:center; background:var(--accent-600); color:#fff; border-radius:50%; font-size:.72rem; font-weight:700; }
@media(max-width:820px){
  .madaf-assembly{ grid-template-columns:1fr; gap:26px; padding:24px; }
  .madaf-assembly__video{ order:-1; }
}

/* ── Page / product-archive header (Kadence hero) — brand navy gradient + subtle
   grid + accent underline, replacing the flat grey banner. All .entry-hero. ── */
.entry-hero .entry-hero-container-inner{
  background:radial-gradient(120% 130% at 85% 12%, var(--navy-600) 0%, var(--navy-700) 45%, var(--navy-800) 100%) !important;
  position:relative; overflow:hidden;
}
.entry-hero .entry-hero-container-inner::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask:radial-gradient(80% 80% at 82% 18%,#000,transparent 75%);
          mask:radial-gradient(80% 80% at 82% 18%,#000,transparent 75%);
}
.entry-hero .hero-container{ position:relative; z-index:1; padding-block:clamp(30px,5vw,58px); }
.entry-hero .page-title, .entry-hero .entry-title{ color:#fff !important; font-size:clamp(1.9rem,3.6vw,2.9rem); margin-bottom:0; }
.entry-hero .page-title::after{
  content:""; display:block; width:64px; height:4px; border-radius:2px;
  background:var(--accent-500); margin:16px auto 0;
}
.entry-hero .archive-description{
  color:var(--navy-100) !important; max-width:68ch; margin:16px auto 0;
  font-size:clamp(1rem,1.4vw,1.15rem); line-height:1.7;
}
.entry-hero .archive-description p{ margin:0; }

/* ==========================================================================
   Smart live search (header modal #search-drawer)
   ========================================================================== */
.search-toggle-open{ color:var(--navy-700); }
#search-drawer .drawer-inner{ background:rgba(11,14,36,.97); }
#search-drawer .drawer-content{ max-width:760px; margin-inline:auto; padding-top:8vh; }
#search-drawer form{ position:relative; }
#search-drawer .search-field{
  width:100%; font-size:1.25rem; font-family:var(--font-body); color:var(--ink);
  background:#fff; border:0; border-radius:var(--r); padding:20px 24px;
  box-shadow:var(--sh-lg);
}
#search-drawer .search-field:focus{ outline:3px solid var(--accent-600); outline-offset:2px; }
#search-drawer .search-submit, #search-drawer button[type="submit"]{
  position:absolute; inset-inline-end:10px; inset-block-start:50%; transform:translateY(-50%);
  background:linear-gradient(180deg,var(--accent-500),var(--accent-600)); color:#fff; border:0;
  border-radius:var(--r-sm); padding:12px 20px; font-family:var(--font-head); font-weight:700; cursor:pointer;
}
.madaf-ls{ margin-top:14px; background:#fff; border-radius:var(--r); box-shadow:var(--sh-lg); overflow:hidden; max-height:min(62vh,560px); overflow-y:auto; }
.madaf-ls__loading, .madaf-ls__empty{ padding:22px; text-align:center; color:var(--slate-500); }
.madaf-ls__empty a{ color:var(--accent-700); font-weight:700; }
.madaf-ls__cats{ display:flex; gap:8px; flex-wrap:wrap; padding:12px 14px 0; }
.madaf-ls__cat{ background:var(--accent-100); color:#1E40AF; font-weight:700; font-size:.85rem; border-radius:var(--r-pill); padding:6px 14px; }
.madaf-ls__cat:hover{ background:var(--accent-600); color:#fff; }
.madaf-ls__items{ padding:8px; }
.madaf-ls__item{ display:grid; grid-template-columns:56px 1fr auto; gap:14px; align-items:center; padding:10px 12px; border-radius:var(--r-sm); }
.madaf-ls__item:hover, .madaf-ls__item:focus{ background:var(--cloud); outline:none; }
.madaf-ls__item img{ width:56px; height:56px; object-fit:contain; border-radius:var(--r-xs); background:var(--cloud); }
.madaf-ls__noimg{ width:56px; height:56px; display:grid; place-items:center; font-size:1.5rem; background:var(--cloud); border-radius:var(--r-xs); }
.madaf-ls__txt{ min-width:0; }
.madaf-ls__name{ display:block; font-weight:600; color:var(--navy-700); font-size:.98rem; line-height:1.35; }
.madaf-ls__name mark{ background:var(--accent-100); color:inherit; border-radius:3px; padding:0 1px; }
.madaf-ls__cat-lbl{ display:block; color:var(--slate-400); font-size:.8rem; }
.madaf-ls__price{ font-family:var(--font-head); font-weight:700; color:var(--accent-700); white-space:nowrap; text-align:end; font-variant-numeric:tabular-nums; }
.madaf-ls__price del{ color:var(--slate-400); font-weight:400; margin-inline-end:6px; }
.madaf-ls__oos{ display:block; color:var(--danger); font-size:.75rem; }
.madaf-ls__more{ display:block; text-align:center; padding:13px; background:var(--navy-700); color:#fff; font-weight:700; }
.madaf-ls__more:hover{ background:var(--navy-600); color:#fff; }
@media(max-width:720px){
  #search-drawer .drawer-content{ padding-top:12px; }
  #search-drawer .search-field{ font-size:1.05rem; padding:15px 16px; }
  .madaf-ls{ max-height:70vh; }
  .madaf-ls__item{ grid-template-columns:48px 1fr auto; gap:10px; }
  .madaf-ls__item img, .madaf-ls__noimg{ width:48px; height:48px; }
}
/* Kadence lays drawer-content out as a flex row — stack the form and results. */
#search-drawer .drawer-content{ display:flex!important; flex-direction:column!important; align-items:stretch!important; }
#search-drawer .drawer-content form{ width:100%; }
.madaf-ls{ width:100%; }
#search-drawer .drawer-content form{ max-width:760px; margin-inline:auto; }
.madaf-ls{ max-width:760px; margin-inline:auto; }
/* Injected search button in the nav-pro bar */
.madaf-nav-searchbtn{ display:inline-flex; align-items:center; justify-content:center; flex:none; width:46px; height:46px; border:0; background:transparent; color:#1C214D; cursor:pointer; border-radius:10px; transition:.15s; }
.madaf-nav-searchbtn svg{ display:block; flex:none; width:26px; height:26px; stroke-width:2.2; }
.madaf-nav-searchbtn:hover{ color:var(--accent-600); background:rgba(28,33,77,.06); }
#madaf-nav.madaf-search-open .madaf-nav-searchbtn{ color:var(--accent-600); background:rgba(28,33,77,.08); }
/* Top-bar action icons — reversed order (right→left): burger · cart · whatsapp ·
   search. Overrides the nav-pro plugin's inline order (whatsapp 2, cart 3) with
   !important; all stay below the menu (order 4) so they cluster on the right. */
#madaf-nav .madaf-nav-inner > .madaf-nav-burger{ order:0 !important; }
#madaf-nav .madaf-nav-inner > .madaf-wc-cart{ order:1 !important; }
#madaf-nav .madaf-nav-inner > .madaf-nav-wa--bar{ order:2 !important; }
#madaf-nav .madaf-nav-searchbtn{ order:3 !important; }
@media(max-width:767px){
  #madaf-nav .madaf-nav-searchbtn{ width:44px; height:44px; }
  #madaf-nav .madaf-nav-searchbtn svg{ width:26px; height:26px; }
}

/* ── Nav search dropdown — drops from the bar (replaces the full-screen modal) ── */
.madaf-search{ position:absolute; top:100%; inset-inline:0; background:#fff; border-top:1px solid var(--slate-200); box-shadow:var(--sh-md); padding:14px var(--gutter) 18px; z-index:40; }
.madaf-search[hidden]{ display:none; }
#madaf-nav.madaf-search-open .madaf-search{ animation:madafSearchDrop .18s var(--ease-out); }
@keyframes madafSearchDrop{ from{ opacity:0; transform:translateY(-8px); } to{ opacity:1; transform:none; } }
.madaf-search__inner{ max-width:680px; margin-inline:auto; }
.madaf-search__form{ display:flex; align-items:center; gap:10px; background:var(--cloud); border:1.5px solid var(--slate-300); border-radius:var(--r-sm); padding:11px 14px; transition:.15s; }
.madaf-search__form:focus-within{ border-color:var(--accent-600); background:#fff; box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.madaf-search__icon{ width:20px; height:20px; color:var(--slate-400); flex:none; }
.madaf-search__field{ flex:1 1 auto; min-width:0; border:0; background:transparent; font-family:var(--font-body); font-size:1.05rem; color:var(--ink); outline:none; }
.madaf-search__field::-webkit-search-cancel-button{ -webkit-appearance:none; }
.madaf-search__close{ flex:none; width:32px; height:32px; display:grid; place-items:center; border:0; background:transparent; color:var(--slate-400); cursor:pointer; border-radius:8px; transition:.15s; }
.madaf-search__close:hover{ color:var(--navy-700); background:var(--slate-200); }
.madaf-search .madaf-ls{ margin-top:12px; border:1px solid var(--slate-200); box-shadow:var(--sh); }
@media(max-width:600px){
  /* Phones: tighter side gutters so sections/cards use (near) full page width. */
  :root{ --gutter:12px; }
  .madaf-search{ padding:10px 12px 14px; }
  .madaf-search__inner{ max-width:none; }
  .madaf-search__field{ font-size:16px; } /* ≥16px stops iOS auto-zoom on focus */
}

/* ==========================================================================
   404 — page not found
   ========================================================================== */
.madaf-404{ padding:clamp(48px,9vw,110px) 0; }
.madaf-404__inner{ max-width:640px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:14px; }
.madaf-404__code{ font-family:var(--font-head); font-weight:800; font-size:clamp(4.5rem,16vw,9rem); line-height:.9; color:var(--accent-500); letter-spacing:-2px; }
.madaf-404__title{ font-family:var(--font-head); font-weight:800; font-size:clamp(1.4rem,4vw,2.1rem); color:var(--navy-700); margin:0; }
.madaf-404__text{ color:var(--slate-700); font-size:1.05rem; line-height:1.6; margin:0 0 8px; }
.madaf-404__actions{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
/* On the light 404 page the ghost button needs a dark outline to be visible. */
.madaf-404 .madaf-btn--ghost{ color:var(--navy-700); border-color:var(--slate-300); background:transparent; }
.madaf-404 .madaf-btn--ghost:hover{ background:var(--navy-700); color:#fff; border-color:var(--navy-700); }
@media(max-width:480px){ .madaf-404__actions{ flex-direction:column; width:100%; } .madaf-404__actions .madaf-btn{ width:100%; } }

/* === Bulletproof contact-form field styling (live-site resets override guard) ===
   GoDaddy Site Designer / Kadence / Elementor sitewide input resets were winning
   over the .wpcf7-form rules. Scope to the contact section + !important so nothing
   can strip the borders/background again. */
.madaf-contact .wpcf7-form input:not([type=submit]):not([type=checkbox]),
.madaf-contact .wpcf7-form textarea{
  border:1.5px solid var(--slate-200) !important;
  border-radius:var(--r-sm) !important;
  background:var(--cloud) !important;
  padding:12px 14px !important;
  width:100% !important;
  box-sizing:border-box !important;
  color:var(--slate-700) !important;
  font-family:var(--font-body) !important;
  font-size:1rem !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}
.madaf-contact .wpcf7-form input:not([type=submit]):not([type=checkbox]):focus,
.madaf-contact .wpcf7-form textarea:focus{
  border-color:var(--accent-600) !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.13) !important;
  outline:none !important;
}
.madaf-contact .wpcf7-form-control-wrap[data-name="your-phone"] input,
.madaf-contact .wpcf7-form-control-wrap[data-name="your-email"] input{ padding-left:44px !important; padding-right:14px !important; }
.madaf-contact .wpcf7-form-control-wrap[data-name="your-name"] input{ padding-inline-end:44px !important; }
.madaf-contact .wpcf7-form input[type=submit]{
  width:100% !important; margin-top:14px !important;
  background:var(--accent-600) !important; color:#fff !important;
  border:none !important; border-radius:var(--r-md,10px) !important;
  padding:14px 22px !important; font-weight:700 !important; font-size:1rem !important;
  cursor:pointer !important; -webkit-appearance:none !important; appearance:none !important;
  transition:background-color .16s ease, transform .16s ease !important;
}
.madaf-contact .wpcf7-form input[type=submit]:hover{ background:#1D4ED8 !important; }
.madaf-contact .wpcf7-form input[type=submit]:disabled{ opacity:.5 !important; cursor:not-allowed !important; }

/* ==========================================================================
   USP cards animation — added 2026-07-12 (reversible: delete this whole block)
   Applies to the existing .madaf-usp cards. Respects prefers-reduced-motion.
   ========================================================================== */
.madaf-usp__item{
  position:relative; overflow:hidden;
  transition:transform .34s cubic-bezier(.34,1.4,.5,1), box-shadow .34s ease, border-color .34s ease;
  animation:madafUspIn .7s cubic-bezier(.16,1,.3,1) both;
}
.madaf-usp__item:nth-child(1){ animation-delay:0s; }
.madaf-usp__item:nth-child(2){ animation-delay:.09s; }
.madaf-usp__item:nth-child(3){ animation-delay:.18s; }
.madaf-usp__item:nth-child(4){ animation-delay:.27s; }
@keyframes madafUspIn{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:translateY(0); } }

/* accent line drawn across the top on hover */
.madaf-usp__item::before{
  content:""; position:absolute; inset-block-start:0; inset-inline:0; height:3px;
  background:linear-gradient(90deg,#467FF7,#2563EB);
  transform:scaleX(0); transform-origin:right;
  transition:transform .4s cubic-bezier(.16,1,.3,1); z-index:2;
}
/* soft glow */
.madaf-usp__item::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0; z-index:0;
  background:radial-gradient(240px circle at 30% 0%, rgba(70,127,247,.14), transparent 62%);
  transition:opacity .32s ease;
}
.madaf-usp__item:hover{
  transform:translateY(-7px);
  box-shadow:0 20px 45px -18px rgba(37,99,235,.42), 0 8px 20px -12px rgba(28,33,77,.28);
  border-color:#CFDAF3;
}
.madaf-usp__item:hover::before{ transform:scaleX(1); }
.madaf-usp__item:hover::after{ opacity:1; }

/* keep content above the glow layer */
.madaf-usp__ic, .madaf-usp__item > div:last-child{ position:relative; z-index:1; }

/* icon micro-interaction */
.madaf-usp__ic{ transition:transform .34s cubic-bezier(.34,1.5,.5,1), box-shadow .34s ease; }
.madaf-usp__item:hover .madaf-usp__ic{
  transform:translateY(-3px) scale(1.07) rotate(-3deg);
  box-shadow:0 8px 18px -8px rgba(37,99,235,.55);
}

@media (prefers-reduced-motion: reduce){
  .madaf-usp__item{ animation:none !important; }
  .madaf-usp__item, .madaf-usp__ic{ transition:none !important; }
  .madaf-usp__item:hover{ transform:none; }
  .madaf-usp__item:hover .madaf-usp__ic{ transform:none; }
}
/* ===== end USP cards animation ===== */
.madaf-usp__ic svg{ width:26px; height:26px; display:block; }
