/* icomoon — Journal3 icon font, reuse the same codepoints as v1 modules.
   Same-origin via our v2 listener's URL rewrite; no CORS issues on dev. */
@font-face {
    font-family: 'j3icomoon';
    src: url('../../icons/fonts/icomoon.woff2') format('woff2'),
         url('../../icons/fonts/icomoon.woff') format('woff'),
         url('../../icons/fonts/icomoon.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
.j3i {
    font-family: 'j3icomoon' !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    speak: never;
    -webkit-font-smoothing: antialiased;
}
/* Journal3 icomoon codepoints used on .com home */
.j3i-award::before   { content: "\e97e"; }  /* iconmonstr-award-23-badge */
.j3i-natural::before { content: "\eb51"; }  /* np_natural (leaf + drops) */
.j3i-eye::before     { content: "\eb54"; }  /* eye2 */
.j3i-leaf::before    { content: "\ea53"; }  /* np_fresh (leaf divider) */

/* Codepoints used on product page (matching v1 button-group icons) */
.j3i-cart::before    { content: "\e9f8"; }  /* shopping-bag (v1 .btn-cart in product-info) */
.j3i-flash::before   { content: "\eb31"; }  /* lightning bolt (v1 Buy Now / btn-extra-46) */
.j3i-heart::before   { content: "\ea93"; }  /* heart outline (v1 .btn-wishlist) */
.j3i-minus::before   { content: "\eb85"; }  /* stepper down (v1 .stepper .fa-angle-down) */
.j3i-plus::before    { content: "\eba0"; }  /* stepper up (v1 .stepper .fa-angle-up) */

/* v2 design tokens — extracted from v1 Journal3 computed styles */
:root {
    --brand-teal: #4A8FA8;         /* rgb(74,143,168) — primary buttons, links */
    --brand-teal-dark: #3F81A0;    /* rgb(63,129,160) — cart btn, focus */
    --brand-teal-muted: #4D7F95;   /* rgb(77,127,149) — marquee, subtle accents */
    --brand-teal-deep: #365F6E;    /* rgb(54,95,110) — wholesale dark band */
    --brand-green: #4F9436;
    --hot-pink: #E51768;

    --ink: #1C2021;                /* rgb(28,32,33) — primary text */
    --ink-secondary: #5A5E60;      /* rgb(90,94,96) — body copy */
    --ink-muted: #6E7275;          /* rgb(110,114,117) — captions, meta */

    --bg-page: #FAFAF7;            /* rgb(250,250,247) — global bg */
    --bg-white: #FFFFFF;
    --bg-section: #F5F3EE;
    --bg-footer-dark: #232829;

    --border: #E5E2D9;
    --radius: 4px;                 /* v1 uses 4px radii, not 10px */
    --container: 1440px;
    --content-pad: 5%;             /* v1 container uses 90% of viewport */

    --ff-body: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --ff-head: "Roboto Condensed", "Helvetica Neue", Arial, sans-serif;

    --space-1: 8px;
    --space-2: 16px;
    --space-3: 24px;
    --space-4: 32px;
    --space-5: 48px;
    --space-6: 72px;
}

.v2-scope {
    color: var(--ink-secondary);
    background: var(--bg-page);
    font-family: var(--ff-body);
    font-size: 15px;
    line-height: 1.7;
}

.v2-scope .v2-container {
    max-width: var(--container);
    width: 90%;
    margin: 0 auto;
}

.v2-scope h1,
.v2-scope h2,
.v2-scope h3 {
    font-family: var(--ff-head);
    color: var(--ink);
    margin: 0;
    line-height: 1.2;
    font-weight: 600;
}

.v2-scope a:not(.v2-btn) {
    color: var(--brand-teal);
    text-decoration: none;
}
.v2-scope a:not(.v2-btn):hover {
    color: var(--brand-teal-dark);
    text-decoration: underline;
}

/* Button — used across sections, must override Journal3 link color */
.v2-btn,
a.v2-btn,
button.v2-btn {
    display: inline-block;
    padding: 16px 32px;
    background: var(--brand-teal);
    color: #fff !important;
    border: 1px solid transparent;
    border-radius: var(--radius);
    font-family: var(--ff-body);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s;
}
.v2-btn:hover,
a.v2-btn:hover,
button.v2-btn:hover {
    background: var(--brand-teal-dark);
    color: #fff !important;
    text-decoration: none;
}

/* Hide Journal3 footer newsletter module — we render our own on v2 pages */
.module.module-newsletter { display: none !important; }