/* ============================================================
   Hardy Commodities — Fluid Typography
   Version 13 (Experimental Layer)
   ============================================================ */

/* Body text */
body {
  font-size: clamp(18px, 1.5vw, 20px); /* scales up to match 1366 baseline */
  line-height: 1.8;                     /* match Version 13 */
}

/* Headings */
h1 {
  font-size: clamp(24px, 2.2vw, 34px);
  line-height: 1.2;
}
h2 {
  font-size: clamp(20px, 1.8vw, 28px);
}
h3 {
  font-size: clamp(18px, 1.5vw, 24px);
}

/* Quote grid cells */
.quote-grid table th,
.quote-grid table td {
  font-size: clamp(16px, 1.2vw, 22px);
  padding: clamp(4px, 0.6vw, 12px) clamp(6px, 1vw, 16px);
}

/* ============================================================
   Navigation typography — single source of truth
   ============================================================ */

/* Desktop fluid nav sizing */
@media (min-width: 1025px) {
  #main-nav {
    --nav-font-size: clamp(20px, 1.4vw, 28px); /* cap to avoid wrapping */
    --nav-padding-y: clamp(8px, 0.6vw, 14px);
    --nav-padding-x: clamp(10px, 0.8vw, 18px);

    --sub-padding-y: clamp(6px, 0.5vw, 12px);
    --sub-padding-x: clamp(8px, 0.6vw, 14px);
  }
}

/* Mobile fixed nav sizing */
@media (max-width: 1024px) {
  #main-nav {
    --nav-font-size: 16px; /* keep hamburger menu modest */
    --nav-padding-y: 6px;
    --nav-padding-x: 10px;

    --sub-padding-y: 6px;
    --sub-padding-x: 12px;
  }
}

/* Root items (Home, About, …) */
#main-nav > ul > li > a,
#main-nav > ul > li > .menu-label {
  font-size: var(--nav-font-size);
  padding: var(--nav-padding-y) var(--nav-padding-x);
  line-height: 1.4;
}

/* Submenu items — match root item size exactly */
#main-nav li ul li a,
#main-nav li ul > li > .menu-label {
  font-size: var(--nav-font-size);
  padding: var(--sub-padding-y) var(--sub-padding-x);
  line-height: 1.4;
}


/* ============================================================
   Guard against global.css breakpoint upsizing
   ============================================================ */
@media (min-width: 1366px) {
  #main-nav > ul > li > a,
  #main-nav > ul > li > .menu-label,
  #main-nav li ul li a,
  #main-nav li ul > li > .menu-label {
    font-size: var(--nav-font-size);
  }
}
@media (min-width: 1600px) {
  #main-nav > ul > li > a,
  #main-nav > ul > li > .menu-label,
  #main-nav li ul li a,
  #main-nav li ul > li > .menu-label {
    font-size: var(--nav-font-size);
  }
}
@media (min-width: 1900px) {
  #main-nav > ul > li > a,
  #main-nav > ul > li > .menu-label,
  #main-nav li ul li a,
  #main-nav li ul > li > .menu-label {
    font-size: var(--nav-font-size);
  }
}
@media (min-width: 1920px) {
  #main-nav > ul > li > a,
  #main-nav > ul > li > .menu-label,
  #main-nav li ul li a,
  #main-nav li ul > li > .menu-label {
    font-size: var(--nav-font-size);
  }
}

@media (min-width: 1366px) {
  #main-nav {
    --nav-font-size: clamp(18px, 1.3vw, 28px); /* bigger baseline */
  }
}

@media (min-width: 1920px) {
  #main-nav {
    --nav-font-size: clamp(20px, 1.4vw, 30px); /* max out at 30px */
  }
}





/* ============================================================
   Hardy Commodities — Fluid Typography
   Version 13 (Experimental Layer)
   ============================================================ */

/* Dashboard headings — fluid but capped to match Version 13 */
.dashboard h1 {
  font-size: clamp(24px, 2vw, 34px); /* max 34px */
  line-height: 1.2;
}

.dashboard h2 {
  font-size: clamp(20px, 1.6vw, 28px); /* max 28px */
  line-height: 1.3;
}