/*
Theme Name: Jozef Aerts — Brisk Brand
Template: hello-elementor
Version: 1.0.67
Text Domain: jozef-brand
Description: Minimal sitewide brand foundation for Elementor and WooCommerce. No Novamira dependency.
*/

@font-face {
  font-family: "Source Sans 3";
  src: url("assets/fonts/SourceSans3.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
}

@font-face {
  font-family: "Barlow Condensed";
  src: url("assets/fonts/BarlowCondensed.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --ja-navy: var(--e-global-color-primary, #022a5b);
  --ja-orange: var(--e-global-color-secondary, #eda340);
  --ja-ink: var(--e-global-color-text, #172b41);
  --ja-paper: #faf9f6;
  --ja-white: #fff;
  --ja-muted: #4e5c68;
  --ja-line: #c5c8c8;
  --ja-border: #7b858e;
  --ja-navy-hover: #173f70;
  --ja-orange-hover: #f6b858;
  --ja-surface: #f0efeb;
  --ja-error: #9d2828;
  --ja-success: #236044;
  --ja-warning: #795100;
  --ja-font-display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --ja-font-body: "Source Sans 3", Arial, sans-serif;
  --ja-font-math: "Cambria Math", "STIX Two Math", serif;
  --ja-space-1: 4px;
  --ja-space-2: 8px;
  --ja-space-3: 12px;
  --ja-space-4: 16px;
  --ja-space-6: 24px;
  --ja-space-8: 32px;
  --ja-space-12: 48px;
  --ja-space-16: 64px;
  --ja-space-24: 96px;
  --ja-container: 1320px;
  --ja-reading: 68ch;
  --ja-control-height: 50px;
  --ja-field-height: 52px;
  --ja-field-radius: 6px;
  --ja-button-padding: 12px 22px;
  --ja-button-gap: 20px;
  --ja-button-icon: 21px;
  --ja-type-title: 25px;
  --ja-type-body: 20px;
  --ja-type-action: 18px;
  --ja-body-leading: 1.55;
  --ja-copy-gap: 12px;
  --ja-paragraph-gap: 16px;
  --ja-action-gap: 24px;
  --ja-type-small: 15px;
  --ja-gutter: clamp(24px, 5vw, 76px);
  --ja-section-space: 52px;
  --ja-type-section: clamp(38px, 3.45vw, 50px);
  --ja-section-leading: 1.04;
  --ja-book-shadow: 8px 12px 24px #172b4120;
  --ja-hero-book-shadow: 12px 18px 24px #00173150;
  --ja-focus-width: 3px;
  --ja-focus-offset: 4px;
  --ja-ease: cubic-bezier(.16, 1, .3, 1);
  --ja-feedback: 240ms;
  --ja-change: 220ms;
}

html { scroll-behavior: smooth; }
body {
  background: var(--ja-paper);
  color: var(--ja-ink);
  font: 400 var(--ja-type-body)/var(--ja-body-leading) var(--ja-font-body);
  text-rendering: optimizeLegibility;
  caret-color: var(--ja-navy);
}
h1, h2 { color: var(--ja-navy); font-family: var(--ja-font-display); font-weight: 700; text-transform: uppercase; text-wrap: balance; }
h1 { font-size: clamp(58px, 6.1vw, 86px); line-height: .97; }
h2 { font-size: clamp(39px, 4vw, 58px); line-height: 1.15; }
h3, h4, h5, h6 { color: var(--ja-navy); font-family: var(--ja-font-body); font-weight: 650; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a { color: var(--ja-navy); text-underline-offset: .18em; }
a:hover { color: var(--ja-navy-hover); }
button, input, select, textarea { font-family: var(--ja-font-body); }
button, [type="button"], [type="submit"], .elementor-button, .woocommerce a.button, .woocommerce button.button {
  border-radius: 0;
}
.elementor-button, .woocommerce a.button, .woocommerce button.button, .ja-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ja-button-gap);
  min-height: var(--ja-control-height);
  padding: var(--ja-button-padding);
  color: var(--ja-navy);
  background-color: var(--ja-orange);
  border-radius: 0;
  font-family: var(--ja-font-body);
  font-size: var(--ja-type-action);
  font-weight: 650;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  transition: background-color var(--ja-feedback) var(--ja-ease), color var(--ja-feedback) var(--ja-ease), border-color var(--ja-feedback) var(--ja-ease);
}
.ja-icon { width: var(--ja-button-icon); height: var(--ja-button-icon); flex: none; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  min-height: var(--ja-field-height);
  border-radius: var(--ja-field-radius);
  color: var(--ja-ink);
  background-color: var(--ja-white);
  caret-color: var(--ja-navy);
}
.ja-reading { max-width: var(--ja-reading); }
.ja-numerals { font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
  :root { --ja-type-body: 18px; --ja-section-space: 44px; --ja-type-section: clamp(34px, 9vw, 42px); }
}
#site-header .custom-logo { display: block; width: 190px; max-width: 100%; height: auto; }
#site-footer .custom-logo { display: block; width: 150px; max-width: 100%; height: auto; }
:focus-visible { outline: var(--ja-focus-width) solid var(--ja-navy); outline-offset: var(--ja-focus-offset); }
::selection { background: var(--ja-orange); color: var(--ja-navy); }
@media (hover: hover) and (pointer: fine) {
  .elementor-button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .ja-button:hover { background-color: var(--ja-orange-hover); }
}
@media (prefers-reduced-motion: reduce) {
  :root { --ja-feedback: 0ms; --ja-change: 0ms; }
  html, html:focus-within { scroll-behavior: auto; }
  .elementor-button, .ja-button, .woocommerce a.button, .woocommerce button.button { transition:none; }
}









@media (min-width:641px) and (max-width:1024px) { :root { --ja-section-space:50px; } }

/* Keep the cart's tablet table until its own phone layout starts at 700px.
   WooCommerce's small-screen stylesheet otherwise stacks the 701–768px gap. */
@media (min-width:701px) and (max-width:768px) {
  .ja-cart-page.ja-commerce-page .woocommerce table.shop_table_responsive thead { display:table-header-group; }
  .ja-cart-page.ja-commerce-page .woocommerce table.shop_table_responsive tr { display:table-row; }
  .ja-cart-page.ja-commerce-page .woocommerce table.shop_table_responsive :is(th,td) { display:table-cell; }
  .ja-cart-page.ja-commerce-page .woocommerce table.shop_table_responsive td::before { display:none; }
  .ja-cart-page.ja-commerce-page .woocommerce .ja-cart-items td { text-align:left!important; }
  .ja-cart-page.ja-commerce-page .woocommerce .ja-cart-items td:last-child { text-align:right!important; }
  .ja-cart-page.ja-commerce-page .woocommerce .cart_totals td { text-align:right!important; }
  .ja-cart-page.ja-commerce-page .woocommerce .cart_totals tr:nth-child(2n) td { background:transparent; }
}