/* ============================================================
   CHUANWAN (川丸) — Youtiao & Deep-Frying Equipment Manufacturer
   Brand layer built on top of the Crafto HTML template.
   Loaded AFTER css/style.css, css/responsive.css,
   demos/green-energy/green-energy.css and chuanwan-ui.css.

   COLOUR RULE: this file introduces NO new brand hue and overrides NO component
   colour.  It only re-states the reference template's own palette (JIEBO orange
   #ff6b1a accent, navy #0b2a4a ink) so the cascade cannot drift, then adds the
   few layout helpers the Chuanwan pages need.

   Do NOT add `color` / `background-color` overrides for template components here
   (.btn-base-color, .jiebo-btn-outline, .jiebo-factory-tile span,
   .jiebo-footer a:hover, .jiebo-hero-badge, .jiebo-chip.is-accent, ...).
   The reference template already renders those correctly — several of them
   intentionally use white on dark tiles or the darker orange on tints. Forcing
   them to a single accent colour breaks the template's own contrast design.
   ============================================================ */

/* ---------- 1. brand variables (mirrors the reference template) ---------- */
:root {
    /* accent = reference orange (graphics: rules, borders, decorative fills) */
    --chuanwan-accent: #ff6b1a;
    /* darker orange, for anything that carries words (WCAG AA on white/tints) */
    --chuanwan-accent-dark: #c2410c;
    --chuanwan-accent-deep: #a33509;
    --chuanwan-accent-tint: #fff2e9;

    /* ink = reference navy */
    --chuanwan-ink: #0b2a4a;
    --chuanwan-ink-deep: #071e36;
    --chuanwan-ink-soft: #123a5e;

    /* neutrals */
    --chuanwan-surface: #f5f7fa;
    --chuanwan-surface-2: #eef3f9;
    --chuanwan-border: #e4ebf2;
    --chuanwan-muted: #5b7189;

    /* Crafto accent token, re-pointed to the reference orange */
    --base-color: var(--chuanwan-accent);

    /* reference-template tokens */
    --jiebo-orange: var(--chuanwan-accent);
    --jiebo-orange-dark: var(--chuanwan-accent-dark);
    --jiebo-orange-tint: var(--chuanwan-accent-tint);
    --jiebo-navy: var(--chuanwan-ink);
    --jiebo-navy-deep: var(--chuanwan-ink-deep);
    --jiebo-navy-soft: var(--chuanwan-ink-soft);
    --jiebo-surface: var(--chuanwan-surface);
    --jiebo-surface-2: var(--chuanwan-surface-2);
    --jiebo-border: var(--chuanwan-border);
    --jiebo-muted: var(--chuanwan-muted);

    /* keep Crafto greys in step with the navy */
    --dark-gray: var(--chuanwan-ink);
    --medium-gray: var(--chuanwan-muted);
    --very-light-gray: var(--chuanwan-surface);
}

/* ---------- 2. images ---------- */
.chuanwan-hero-media img,
.chuanwan-card-thumb img,
.chuanwan-factory-tile img,
.chuanwan-cert img {
    object-fit: cover;
}

.chuanwan-hero-media {
    background: var(--chuanwan-accent-tint);
    border-radius: 16px;
    padding: 30px;
}

.chuanwan-hero-media img {
    width: 100%;
    height: auto;
    border-radius: 12px;
}

/* ---------- 3. video ---------- */
.chuanwan-video-tile video {
    width: 100%;
    border-radius: 12px;
    background: var(--chuanwan-ink);
}

/* ---------- 4. certifications ---------- */
.chuanwan-cert {
    border: 1px solid var(--chuanwan-border);
    border-radius: 12px;
    padding: 20px;
    background: #fff;
    transition: box-shadow .25s ease;
}

.chuanwan-cert:hover {
    box-shadow: 0 12px 30px rgba(255, 107, 26, .14);
}

.chuanwan-cert img {
    width: 100%;
    height: auto;
    border-radius: 8px;
}

/* ---------- 5. product gallery ---------- */
.chuanwan-product-thumb {
    background: var(--chuanwan-surface);
    border-radius: 12px;
    padding: 20px;
    text-align: center;
}

.chuanwan-product-thumb img {
    max-height: 260px;
    width: auto;
    max-width: 100%;
}

.jiebo-value-card .fa-solid {
    font-size: 38px;
}