/* Owebia theme (all pages), on top of Zeste (public/css/zeste.css): tokens of the mockup (dev.owebia.com/store-mockup/),
   support tile, print. Colors as light-dark(light, dark) (Zeste). 1rem = 10 px (Zeste): the mockup rems
   are multiplied by 1.6 (105rem → 168rem), except in media queries, which refer to the browser default size. */
:root {
  /* Light: cool off-whites (2026-11-03; those of the mockup: #f7f7f4, #f0f0eb, #e2e2dc) and a petrol blue accent on
     trial (#2a56bc mixed at 65 % with #0b5d73, text 15 % darker; the original orange: #b05300, #a14b00, and the OW of
     images/owebia-light.svg). Dark: the yellow accent */
  --bg: light-dark(#f5f7f8, #111214); --surface: light-dark(#ffffff, #18191d); --surface2: light-dark(#eef1f3, #202126);
  --line: light-dark(#dfe4e8, #2d2f35); --ink: light-dark(#1c1d21, #f2f2f2); --muted: light-dark(#4f5663, #a0a3aa);
  --accent: light-dark(#165b8d, #ffd23f); --accent-ink: light-dark(#134d78, #ffd23f); --on-accent: light-dark(#fff, #1a1400);
  --danger: light-dark(#b3261e, #ff7b7b); --on-danger: light-dark(#fff, #2a0606); --ok: light-dark(#1d7a46, #6fd39b);
  /* Tile illustrations (images/art/*.svg): more contrast in dark mode (2026-11-04); devices, locker, open
     compartment and pickup point mini map */
  --art-bg: light-dark(#f1f2f4, #16171b); --art-line: light-dark(#ffffff, #2a2c33); --art-block: light-dark(#e4e6ea, #2b2e35);
  --art-card: light-dark(#ffffff, #3d4048); --art-text: light-dark(#1c1d21, #e4e6ea); --art-home: light-dark(#404040, #bfbfbf);
  --art-frame: light-dark(#1c1d21, #5a5f69); --art-edge: light-dark(#7b818c, #6a707b); --art-locker: light-dark(#c4c9d0, #262930);
  --art-device: light-dark(#50565f, #7d838e); --art-screen: light-dark(#ffffff, #4c5059); --art-hole: light-dark(#3b4049, #0d0d0f);
  --map-land: light-dark(#ebe7dd, #2a2c31); --map-block: light-dark(#dcd5c5, #35383f); --map-street: light-dark(#ffffff, #4b4f58);
  --map-park: light-dark(#cfe3c3, #2d3e31); --map-edge: light-dark(#cbc3b0, #1c1d22);
  /* Shell code of the READMEs (modules.css): comment, command, option, string, variable, operator */
  --code-comment: light-dark(#6b7280, #8b9099); --code-command: light-dark(#134d78, #ffd23f); --code-option: light-dark(#7c3aed, #c4a7ff);
  --code-string: light-dark(#1d7a46, #8fe0a8); --code-variable: light-dark(#b45309, #ffb070); --code-operator: light-dark(#9a3412, #ff9b7b);
  --wrap: 168rem;
}
/* Header (Zeste): --logo-k: 3.04rem / --logo-big; --logo-base: bottom of the « ebia » text (85 / 92.1 of the viewBox) */
:root { --hdr-big: 9.2rem; --hdr-small: 5.76rem; --logo-big: 4.6rem; --logo-k: .66; --logo-base: .923; --logo-ratio: 3.67; }
@media (max-width: 47.99rem) { :root { --hdr-big: 7.2rem; --logo-big: 3.68rem; --logo-k: .83; } }

/* ——— Technical support tile (views/partials/support-tile.phtml: FAQ, contact) ——— */
.support-tile { margin-top: 4rem; padding: 2.4rem; border-radius: var(--r); scroll-margin-top: 8.8rem; color: var(--ink);
  /* Without shadow, tinted with the accent (between the neutral card and the solid background) */
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line)); background: color-mix(in srgb, var(--accent) 12%, var(--surface)); }
.support-tile .kicker { display: flex; align-items: center; gap: .64rem; margin: 0 0 1.12rem; color: var(--accent-ink); font-size: 1.2rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.support-tile .kicker .i { width: 2.24rem; height: 2.24rem; }
.support-tile h2 { margin: 0 0 .8rem; color: var(--ink); font-size: 2.24rem; font-weight: 800; line-height: 1.2; letter-spacing: -.015em; }
.support-tile p { margin: 0 0 1.6rem; color: var(--muted); font-size: 1.44rem; line-height: 1.55; }
.support-tile .rate { display: flex; align-items: baseline; gap: .64rem; margin: 0 0 1.6rem; color: var(--muted); }
.support-tile .rate strong { color: var(--ink); font-size: 3.2rem; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.support-tile .action.primary { display: flex; justify-content: center; width: 100%; padding: 1.28rem 1.6rem; box-sizing: border-box; font-size: 1.52rem; text-decoration: none; }
.support-tile .note { margin: 1.12rem 0 0; font-size: 1.28rem; text-align: center; }
#support:target { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ——— Print (Zeste: white background, black text): the light theme accent, the illustrations in grey ——— */
@media print {
  html:root {
    --accent: #165b8d; --accent-ink: #134d78; --on-accent: #fff;
    --art-bg: #fff; --art-line: #ddd; --art-block: #eee; --art-card: #fff; --art-text: #000; --art-home: #404040; --art-frame: #000; --art-edge: #888;
    --art-locker: #ccc; --art-device: #555; --art-screen: #fff; --art-hole: #555;
    --map-land: #fff; --map-block: #eee; --map-street: #fff; --map-park: #eee; --map-edge: #ccc;
  }
  /* No support panel (FAQ, contact): nothing useful on paper */
  .support-tile { display: none !important; }
}
[data-page="home"] .page-main { max-width: none; padding: 0; }