/*
 * Style 2 — House (Richard's shared styling system, 30 Sep 2026). Loaded ONLY on a Page Builder page whose
 * page style is Style 2 (app/includes/page-styles.php), and scoped to that page's content wrapper
 * (.pb-style-v2), so the header, footer, basket, checkout and account never change.
 *
 * The reference is the brand hubs (Arte, Pierre Frey, Linwood): ink #1f2330 headings and buttons, body
 * #41444b at 1.65, muted #666a73, warm lines #e5e2dd, soft panels #f5f3ef. Those pages NAME Inter but never
 * load it (Windows shows Arial Bold); here it is self-hosted, one variable file for every weight.
 *
 * Block renderers switch their own utility classes on Style 2 and read the colours below as variables; this
 * file only (1) sets the variables, (2) re-points them to white inside a dark band (any .text-white wrapper),
 * and (3) gives raw HTML (Rich text, HTML blocks) the same type, in @layer base so any utility class an
 * editor types still wins.
 */
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/inter-latin-var.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.pb-style-v2 {
    --ds-ink: #1f2330;
    --ds-body: #41444b;
    --ds-muted: #666a73;
    --ds-line: #e5e2dd;
    --ds-soft: #f5f3ef;
    --ds-soft2: #ece8e1;
    --ds-on-ink: #ffffff;
    /* Form controls (form-controls.functions.php) and the calculator: ink accent, square corners. */
    --fc-accent: #1f2330;
    --fc-btn-bg: #1f2330;
    --fc-btn-hover: #3a3f4d;
    --fc-line: #e5e2dd;
    --fc-soft: #f5f3ef;
    --fc-radius: 0px;
    --fc-card-radius: 0px;
    --fc-pill-radius: 0px;
    --fc-btn-case: none;
    --fc-btn-track: 0.01em;
    --fc-btn-weight: 500;
    --ds-font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-family: var(--ds-font);
    font-feature-settings: "cv11", "ss01";
    color: var(--ds-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* A dark band (a Div or Hero band with a background colour, which adds text-white): headings, copy and
 * buttons flip to white-on-ink without a second set of classes. */
.pb-style-v2 .text-white {
    --ds-ink: #ffffff;
    --ds-body: rgb(255 255 255 / 0.84);
    --ds-muted: rgb(255 255 255 / 0.68);
    --ds-line: rgb(255 255 255 / 0.22);
    --ds-on-ink: #1f2330;
}

@layer base {
    .pb-style-v2 h1, .pb-style-v2 h2, .pb-style-v2 h3, .pb-style-v2 h4, .pb-style-v2 h5, .pb-style-v2 h6 {
        /* named, not inherited: the site base sets font-sans on h1-h6 directly (input.css) */
        font-family: var(--ds-font);
        color: var(--ds-ink);
        font-weight: 600;
    }
    .pb-style-v2 h1 { font-size: clamp(2.25rem, 1.35rem + 3.3vw, 4.125rem); line-height: 1.05; letter-spacing: -0.028em; }
    .pb-style-v2 h2 { font-size: clamp(1.75rem, 1.3rem + 1.7vw, 2.625rem); line-height: 1.12; letter-spacing: -0.022em; }
    .pb-style-v2 h3 { font-size: 1.25rem; line-height: 1.3; letter-spacing: -0.01em; }
    .pb-style-v2 h4 { font-size: 1.0625rem; line-height: 1.4; }
    .pb-style-v2 h5, .pb-style-v2 h6 { font-size: 1rem; line-height: 1.45; }
    .pb-style-v2 p, .pb-style-v2 li { color: var(--ds-body); line-height: 1.65; }
    .pb-style-v2 strong { color: var(--ds-ink); }
    .pb-style-v2 p a, .pb-style-v2 li a, .pb-style-v2 td a {
        color: var(--ds-ink);
        text-decoration: underline;
        text-decoration-color: var(--ds-line);
        text-decoration-thickness: 1px;
        text-underline-offset: 3px;
    }
    .pb-style-v2 p a:hover, .pb-style-v2 li a:hover, .pb-style-v2 td a:hover { text-decoration-color: currentColor; }
    .pb-style-v2 blockquote { border-left-color: var(--ds-line); color: var(--ds-ink); }
    .pb-style-v2 hr { border-color: var(--ds-line); }
    .pb-style-v2 table, .pb-style-v2 th, .pb-style-v2 td { border-color: var(--ds-line); }
    .pb-style-v2 th { background: var(--ds-soft); color: var(--ds-ink); }
    .pb-style-v2 tbody tr:nth-child(even) { background: #faf9f7; }
    .pb-style-v2 img { border-radius: 0; }
}
