/* ==========================================================================
   Adelaide Junk Co, Fresh Digital build
   theme.css, DESIGN TOKENS ONLY

   Three themes ship from one markup set.

     [data-theme="one"]    Christian's mockup direction. Ink black + the exact
                           AJC logo yellow (#FECB03), condensed uppercase
                           display, sharp corners, soft depth shadows.

     [data-theme="two"]    Golden Fields recoloured to AJC. Warm cream paper,
                           chunky ink borders, hard offset shadows, rounded
                           pills, friendly sentence case display.

     [data-theme="three"]  LendCon design language recoloured to AJC. Cool
                           grey paper, architectural grotesque, 4px radius,
                           hairline rules, spec-sheet eyebrows, no shadows.

   Brand colour is sampled directly from the supplied logo artwork:
   yellow #FECB03, black #000000.

   To recolour for another client, edit ONLY this file.
   Never edit values inside base.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   THEME ONE
   -------------------------------------------------------------------------- */
:root,
[data-theme="one"] {
  /* Brand, straight off the logo */
  --brand:        #FECB03;
  --brand-hi:     #FFD829;   /* lift for hover on dark */
  --brand-deep:   #E8B800;   /* pressed */
  --brand-soft:   #FFF2BC;   /* tint wash, warmer and brighter */
  --brand-wash:   #FFFAE3;
  --accent:       #FECB03;

  /* Ink and paper */
  --ink:          #08090A;   /* the logo black */
  --ink-2:        #14161A;
  --ink-3:        #262A31;
  --paper:        #FFFFFF;
  --paper-2:      #F6F6F4;
  --paper-3:      #EDEDE9;

  /* Type colours */
  --text:         #14161A;
  --text-muted:   #5E636B;
  --text-on-dark: #FFFFFF;
  --text-on-dark-muted: #ADB2B9;
  --on-brand:     #08090A;
  --eyebrow-fg:   #14161A;

  /* Lines */
  --line:         #E2E1DC;
  --line-strong:  #08090A;
  --border-w:     1px;
  --border-w-strong: 1.5px;

  /* Shape */
  --r-xs:  4px;  --r-sm: 6px;  --r-md: 10px;
  --r-lg: 14px;  --r-xl: 18px; --r-pill: 999px;

  /* Depth */
  --pop:       0 14px 38px rgba(8,9,10,.15);
  --pop-sm:    0 4px 16px rgba(8,9,10,.11);
  --pop-hover: 0 20px 48px rgba(8,9,10,.20);

  /* Type */
  --font-display: "Oswald", "Archivo", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;
  --display-weight: 600;
  --display-case:  uppercase;
  --display-track: .002em;
  --display-lh:    1.02;
  --eyebrow-case:  uppercase;
  --eyebrow-track: .16em;
  --eyebrow-weight: 700;
  --btn-case:      uppercase;
  --btn-track:     .06em;
  --btn-weight:    700;

  /* Scale */
  --h1: clamp(2.6rem, 6.2vw, 4.6rem);
  --h2: clamp(1.9rem, 3.9vw, 3.05rem);
  --h3: clamp(1.15rem, 1.7vw, 1.45rem);

  /* Rhythm */
  --sec-y: clamp(3.6rem, 7vw, 6.4rem);
  --gut:   clamp(1.15rem, 2.4vw, 1.9rem);
  --maxw:  1220px;

  /* Component behaviour */
  --hero-overlay: linear-gradient(90deg, rgba(6,7,8,.94) 0%, rgba(6,7,8,.80) 42%, rgba(6,7,8,.30) 100%);
  --tile-radius: var(--r-md);
  --card-border: var(--border-w) solid var(--line);
  --card-shadow: var(--pop-sm);
  --card-shadow-hover: var(--pop-hover);
  --card-lift: -4px;
  --marquee-bg: var(--ink);
  --marquee-fg: var(--brand);
  --header-bg: rgba(255,255,255,.95);
  --logo-h: 40px;
  --eyebrow-rule: 22px;
  --hero-photo-h: clamp(430px, 46vw, 560px);
}

/* --------------------------------------------------------------------------
   THEME TWO, Golden Fields recoloured
   -------------------------------------------------------------------------- */
[data-theme="two"] {
  --brand:        #FECB03;
  --brand-hi:     #FFD829;
  --brand-deep:   #E0AF00;
  --brand-soft:   #FCE9A8;
  --brand-wash:   #FDF3D2;
  --accent:       #D2542F;   /* Golden Fields coral, kept as the secondary */

  --ink:          #221F1A;
  --ink-2:        #2E2A24;
  --ink-3:        #423D34;
  --paper:        #FDF6E9;
  --paper-2:      #F8EBD6;
  --paper-3:      #F1DFC2;

  --text:         #2A2620;
  --text-muted:   #6C6455;
  --text-on-dark: #FDF6E9;
  --text-on-dark-muted: #C6BDA8;
  --on-brand:     #221F1A;
  --eyebrow-fg:   #B03F1F;

  --line:         #221F1A;   /* GF signature: the ink IS the border */
  --line-strong:  #221F1A;
  --border-w:     2.5px;
  --border-w-strong: 2.5px;

  --r-xs:  8px;  --r-sm: 12px; --r-md: 18px;
  --r-lg: 24px;  --r-xl: 30px; --r-pill: 999px;

  --pop:       6px 6px 0 var(--ink);
  --pop-sm:    4px 4px 0 var(--ink);
  --pop-hover: 9px 9px 0 var(--ink);

  --font-display: "Poppins", system-ui, sans-serif;
  --font-body:    "Nunito Sans", system-ui, -apple-system, sans-serif;
  --display-weight: 700;
  --display-case:  none;
  --display-track: -.02em;
  --display-lh:    1.06;
  --eyebrow-case:  uppercase;
  --eyebrow-track: .18em;
  --eyebrow-weight: 800;
  --btn-case:      none;
  --btn-track:     0;
  --btn-weight:    700;

  --h1: clamp(2.4rem, 5.4vw, 4rem);
  --h2: clamp(1.8rem, 3.5vw, 2.75rem);
  --h3: clamp(1.1rem, 1.6vw, 1.4rem);

  --hero-overlay: linear-gradient(90deg, rgba(34,31,26,.93) 0%, rgba(34,31,26,.76) 44%, rgba(34,31,26,.26) 100%);
  --card-border: var(--border-w) solid var(--ink);
  --card-shadow: var(--pop-sm);
  --card-shadow-hover: var(--pop-hover);
  --card-lift: -3px;
  --header-bg: rgba(253,246,233,.96);
  --logo-h: 42px;
  --eyebrow-rule: 26px;
  --hero-photo-h: clamp(430px, 46vw, 560px);
}

/* --------------------------------------------------------------------------
   THEME THREE, LendCon design language recoloured to AJC
   Cool grey paper, architectural grotesque, 4px radius, hairline rules,
   no shadows, tight negative tracking. Brand colour stays AJC yellow because
   this is an AJC site, not a LendCon one.
   -------------------------------------------------------------------------- */
[data-theme="three"] {
  --brand:        #FECB03;
  --brand-hi:     #FFD829;
  --brand-deep:   #E8B800;
  --brand-soft:   #FBF3D0;
  --brand-wash:   #FDF9E7;
  --accent:       #FECB03;

  --ink:          #0E1116;
  --ink-2:        #161A21;
  --ink-3:        #262C36;
  --paper:        #F4F4F1;
  --paper-2:      #ECECE7;
  --paper-3:      #E3E3DC;

  --text:         #0E1116;
  --text-muted:   #6C7280;
  --text-on-dark: #F4F4F1;
  --text-on-dark-muted: #9AA0A9;
  --on-brand:     #0E1116;
  --eyebrow-fg:   #0E1116;

  --line:         #DADAD3;
  --line-strong:  #0E1116;
  --border-w:     1px;
  --border-w-strong: 1px;

  --r-xs:  2px;  --r-sm: 4px;  --r-md: 4px;
  --r-lg:  4px;  --r-xl:  4px; --r-pill: 4px;   /* squared, no pills */

  --pop:       none;
  --pop-sm:    none;
  --pop-hover: none;

  --font-display: "Archivo", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;
  --display-weight: 800;
  --display-case:  uppercase;
  --display-track: -.022em;
  --display-lh:    .94;
  --eyebrow-case:  uppercase;
  --eyebrow-track: .18em;
  --eyebrow-weight: 600;
  --btn-case:      uppercase;
  --btn-track:     .1em;
  --btn-weight:    600;

  --h1: clamp(2.6rem, 7vw, 5.6rem);
  --h2: clamp(2rem, 5vw, 3.9rem);
  --h3: clamp(1.15rem, 2vw, 1.6rem);

  --maxw: 1290px;

  --hero-overlay: linear-gradient(90deg, rgba(14,17,22,.95) 0%, rgba(14,17,22,.82) 44%, rgba(14,17,22,.32) 100%);
  --tile-radius: var(--r-md);
  --card-border: var(--border-w) solid var(--line);
  --card-shadow: none;
  --card-shadow-hover: none;
  --card-lift: 0px;
  --marquee-bg: var(--ink);
  --marquee-fg: var(--brand);
  --header-bg: rgba(244,244,241,.96);
  --logo-h: 38px;
  --eyebrow-rule: 42px;

  /* The alternating band flips to near black, which changes the whole page
     rhythm rather than just its colour. This is what separates it from 1. */
  --paper-2:    #101319;
  --surface-2:  #E6E6E1;
  --sand-fg:    #E7E7E2;
  --sand-head:  #FFFFFF;
  --sand-muted: #9AA0A9;
  --hero-photo-h: clamp(430px, 46vw, 560px);
}

/* Theme three drops the soft-UI affordances entirely. */
[data-theme="three"] .card:hover,
[data-theme="three"] .item:hover,
[data-theme="three"] .tile:hover,
[data-theme="three"] .rev:hover { transform: none; }
[data-theme="three"] .card:hover,
[data-theme="three"] .item:hover { border-color: var(--ink); }
[data-theme="three"] .btn { border-radius: var(--r-sm); }
[data-theme="three"] .btn:hover { transform: none; }
[data-theme="three"] .btn--primary:hover { background: var(--brand-hi); }
[data-theme="three"] .chip { border-radius: var(--r-sm); }
[data-theme="three"] .step__n { border-radius: var(--r-sm); }
[data-theme="three"] .rev__av { border-radius: var(--r-sm); }
[data-theme="three"] .trustbar .ic { border-radius: var(--r-sm); }
[data-theme="three"] h2, [data-theme="three"] h1 { max-width: 18ch; }

/* Cards sitting on the dark band invert with it. */
[data-theme="three"] .sec--sand .card,
[data-theme="three"] .sec--sand .item,
[data-theme="three"] .sec--sand .faq-item,
[data-theme="three"] .sec--sand .rev,
[data-theme="three"] .sec--sand .regioncard,
[data-theme="three"] .sec--sand .hold { background: #171B22; border-color: #2A303A; }
[data-theme="three"] .sec--sand .card h3, [data-theme="three"] .sec--sand .item h3,
[data-theme="three"] .sec--sand .rev p, [data-theme="three"] .sec--sand .faq-item summary,
[data-theme="three"] .sec--sand .regioncard h3 { color: #FFFFFF; }
[data-theme="three"] .sec--sand .card p, [data-theme="three"] .sec--sand .item p,
[data-theme="three"] .sec--sand .faq-item .ans p, [data-theme="three"] .sec--sand .rev__who small,
[data-theme="three"] .sec--sand .regioncard p { color: #9AA0A9; }
[data-theme="three"] .sec--sand .rev__who { border-top-color: #2A303A; }
[data-theme="three"] .sec--sand .faq-item[open] summary { background: #1F242D; }
[data-theme="three"] .sec--sand .faq-item summary::after { border-color: var(--brand); }
[data-theme="three"] .sec--sand .regioncard li { background: #101319; border-color: #2A303A; color: #C9CDD4; }
[data-theme="three"] .sec--sand .btn--ghost { color: #fff; border-color: #3A4149; }
[data-theme="three"] .sec--sand .eyebrow { color: #fff; }
[data-theme="three"] .sec--sand .item__ic { border-bottom-color: #2A303A; }
[data-theme="three"] .steps .step__n { border-radius: 0; }
[data-theme="three"] .eyebrow::before { height: 1px; }

/* --------------------------------------------------------------------------
   THEME FOUR, Active Conductors design language recoloured to AJC
   Editorial and light. The hero stops being a dark photo overlay and becomes
   a full bleed photo band with ink type on white beneath it, there is a solid
   full width stat band, buttons are thin squared outlines, and the footer
   splits black and brand. Structurally the furthest from theme one.
   -------------------------------------------------------------------------- */
[data-theme="four"] {
  --brand:        #FECB03;
  --brand-hi:     #FFD829;
  --brand-deep:   #D9A800;
  --brand-soft:   #FFF6D2;
  --brand-wash:   #FFFBEA;
  --accent:       #FECB03;

  --ink:          #111114;
  --ink-2:        #1B1B20;
  --ink-3:        #2C2C33;
  --paper:        #FFFFFF;
  --paper-2:      #F5F5F6;
  --paper-3:      #EBEBED;

  --text:         #111114;
  --text-muted:   #6A6A73;
  --text-on-dark: #FFFFFF;
  --text-on-dark-muted: #B0B0B8;
  --on-brand:     #111114;
  --eyebrow-fg:   #8A6B00;

  --line:         #E4E4E7;
  --line-strong:  #111114;
  --border-w:     1px;
  --border-w-strong: 1px;

  --r-xs: 0px;  --r-sm: 0px;  --r-md: 0px;
  --r-lg: 0px;  --r-xl: 0px;  --r-pill: 0px;

  --pop:       none;
  --pop-sm:    none;
  --pop-hover: none;

  --font-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;
  --display-weight: 800;
  --display-case:  none;
  --display-track: -.03em;
  --display-lh:    1.1;
  --eyebrow-case:  uppercase;
  --eyebrow-track: .14em;
  --eyebrow-weight: 600;
  --btn-case:      uppercase;
  --btn-track:     .09em;
  --btn-weight:    600;

  --h1: clamp(2.1rem, 4.4vw, 3.5rem);
  --h2: clamp(1.7rem, 3.1vw, 2.5rem);
  --h3: clamp(1.05rem, 1.5vw, 1.3rem);

  --sec-y: clamp(3.2rem, 6vw, 5.4rem);
  --maxw: 1240px;

  --tile-radius: 0px;
  --card-border: var(--border-w) solid var(--line);
  --card-shadow: none;
  --card-shadow-hover: none;
  --card-lift: 0px;
  --header-bg: #FFFFFF;
  --logo-h: 40px;
  --eyebrow-rule: 0px;
}

/* Light hero: photo band on top, ink type on white underneath. */
[data-theme="four"] .hero { background: var(--paper); color: var(--text); }
[data-theme="four"] { --hero-photo-h: clamp(260px, 30vw, 420px); }
[data-theme="four"] .hero { min-height: 0; }
[data-theme="four"] .hero__bg { position: relative; inset: auto; height: var(--hero-photo-h); }
[data-theme="four"] .hero__bg::after { display: none; }
[data-theme="four"] .hero__bg img { position: absolute; inset: 0; }
[data-theme="four"] .hero__in { padding-block: clamp(2.2rem, 4vw, 3.4rem); align-items: start; }
[data-theme="four"] .hero h1 { color: var(--ink); }
[data-theme="four"] .hero h1 {
  display: flex; flex-direction: column; align-items: flex-start; gap: .18em;
}
[data-theme="four"] .hero h1 .hl {
  display: block; width: fit-content; max-width: 100%;
  background: var(--brand); color: var(--ink); padding: .02em .22em;
}
[data-theme="four"] .hero__sub { color: var(--text-muted); }
[data-theme="four"] .hero__pagetype { color: var(--eyebrow-fg); }
[data-theme="four"] .hero .btn--on-dark { color: var(--ink); border-color: var(--line-strong); }
[data-theme="four"] .hero .btn--on-dark:hover { background: var(--paper-2); }
[data-theme="four"] .stars { color: #C98F00; }
[data-theme="four"] .hero .grate__txt { color: var(--text); }
[data-theme="four"] .hero .chip { color: var(--text); border-color: var(--line); background: var(--paper-2); }
[data-theme="four"] .hero .chip .ic { color: var(--brand-deep); }
[data-theme="four"] .hero__chips .chip { border-color: var(--line); }
[data-theme="four"] .crumb { color: var(--text-muted); background: var(--paper); }
[data-theme="four"] .crumb .cur { color: var(--text); }
[data-theme="four"] .formcard { border: var(--border-w) solid var(--line-strong); }

/* Thin squared outline buttons, their signature. */
[data-theme="four"] .btn { border-radius: 0; }
[data-theme="four"] .btn:hover { transform: none; }
[data-theme="four"] .btn--ghost { border-color: var(--line-strong); }
[data-theme="four"] .btn--primary { border-color: var(--brand); }
[data-theme="four"] .btn--primary:hover { background: var(--brand-hi); border-color: var(--brand-hi); }
[data-theme="four"] .chip { border-radius: 0; }

/* Full bleed solid stat band. */
[data-theme="four"] .stats {
  background: var(--brand); border: 0; border-radius: 0;
  box-shadow: 0 0 0 100vmax var(--brand); clip-path: inset(0 -100vmax);
}
[data-theme="four"] .stat + .stat { border-left: 1px solid rgba(17,17,20,.16); }
[data-theme="four"] .stat b { color: var(--ink); }
[data-theme="four"] .stat span, [data-theme="four"] .stat small { color: rgba(17,17,20,.7); }

/* Square image tiles with a corner arrow, no rounding anywhere. */
[data-theme="four"] .tile, [data-theme="four"] .item, [data-theme="four"] .card,
[data-theme="four"] .plate, [data-theme="four"] .rev, [data-theme="four"] .faq-item { border-radius: 0; }
[data-theme="four"] .tile::after {
  content: "\2197"; position: absolute; right: 1rem; bottom: 1rem; z-index: 5;
  color: #fff; font-size: 1.5rem; line-height: 1; opacity: .9;
}
[data-theme="four"] .card__ic { border-radius: 0; }
[data-theme="four"] .rev__av { border-radius: 0; }
[data-theme="four"] .trustbar .ic { border-radius: 0; }
[data-theme="four"] .item__ic { background: var(--paper-2); }
[data-theme="four"] .item__ic::after { opacity: .95; }
[data-theme="four"] .eyebrow::before { display: none; }

/* Split footer: black block beside a brand block. */
[data-theme="four"] .ftr { background: var(--brand); color: var(--ink); padding-block: 0 1.4rem; }
[data-theme="four"] .ftr__grid { align-items: start; padding-top: clamp(2.4rem, 4.5vw, 3.6rem); }
[data-theme="four"] .ftr__grid > div:first-child {
  background: var(--ink); color: var(--text-on-dark);
  padding: 1.7rem 1.6rem 1.9rem; align-self: stretch;
}
[data-theme="four"] .ftr__grid > div:first-child .ftr__tag,
[data-theme="four"] .ftr__grid > div:first-child .ftr__badge { color: var(--text-on-dark-muted); }
[data-theme="four"] .ftr__grid > div:not(:first-child) h4 { color: var(--ink); opacity: .62; }
[data-theme="four"] .ftr__grid > div:not(:first-child) a:not(.btn) { color: var(--ink); }
[data-theme="four"] .ftr__grid > div:not(:first-child) a:not(.btn):hover { text-decoration: underline; }
[data-theme="four"] .ftr__base { color: var(--ink); border-top-color: rgba(17,17,20,.22); }
[data-theme="four"] .ftr__base a:hover { color: var(--ink); }
[data-theme="four"] .ftr .btn--primary { background: var(--ink); color: var(--brand); border-color: var(--ink); }