/* ========================================================================== Polices Inter auto-hébergées (RGPD : aucun appel à Google Fonts). Sous-ensembles latin + latin-ext, graisses 300/400/600/700. ========================================================================== */ @font-face { font-family: "Inter"; font-style: normal; /* Police VARIABLE : un seul fichier couvre 300 a 700. Les 8 regles precedentes pointaient vers des fichiers identiques sous des noms differents, ce qui faisait retelecharger les memes octets (cache par URL). */ font-weight: 300 700; font-display: swap; src: url("../fonts/inter-400-latin.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; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 300 700; font-display: swap; src: url("../fonts/inter-400-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* ========================================================================== TRYANA SCAN — Design tokens Système Apple (DESIGN-apple.md) remappé sur la palette Tryana Scan. Un seul accent : rouge laser #E30613. Tiles alternées clair / quasi-noir façon DJI Terra. Échelle de profondeur dédiée au rendu nuage de points. Ne jamais écrire une valeur hex en dur ailleurs : toujours via var(--ts-*). ========================================================================== */ :root { /* ----- Accent unique (rôle du "Action Blue" Apple) ----------------------- */ --ts-red: #E30613; /* accent de marque — rouge laser (réf. Leica) */ --ts-red-focus: #FF1F2B; /* anneau de focus clavier (outline 2px) */ --ts-red-on-dark: #FF2D3B; /* liens/accent dans le texte sur fond sombre */ --ts-red-deep: #B3050F; /* état pressé / rouge profond */ --ts-red-tint-08: rgba(227, 6, 19, 0.08); --ts-red-tint-16: rgba(227, 6, 19, 0.16); /* Halo rouge « laser » — EXCEPTION assumée à la règle d'ombre unique : signature Leica/DJI, tokenisé, réservé au viewer et au point de mesure. */ --ts-red-glow: rgba(227, 6, 19, 0.35); /* ----- Encre & texte ----------------------------------------------------- */ --ts-ink: #0A0A0A; /* noir Tryana — titres & corps sur fond clair */ --ts-body: #1D1D1F; /* corps de texte */ --ts-ink-80: #2A2A2C; /* texte légèrement adouci */ --ts-ink-48: #6E6E73; /* texte désactivé, mentions légales */ --ts-on-dark: #FFFFFF; /* texte sur tiles sombres */ --ts-on-dark-strong: #EDEDEF; /* blanc cassé (lead héro) */ --ts-on-dark-muted: #A1A1A6; /* texte secondaire sur sombre */ --ts-on-dark-faint: #9A9AA0; /* légendes sur sombre (AA ≥4.5:1 à 14px) */ /* ----- Surfaces ---------------------------------------------------------- */ --ts-canvas: #FFFFFF; /* canvas dominant */ --ts-parchment: #F5F5F7; /* off-white de rythme (tile clair alt.) */ --ts-pearl: #FAFAFC; /* fill des boutons fantômes */ --ts-tile-1: #101012; /* tile sombre primaire */ --ts-tile-2: #16161A; /* micro-pas plus clair (séparation faible) */ --ts-tile-3: #0B0B0D; /* micro-pas plus sombre (bas de pile / vidéo) */ --ts-black: #000000; /* vrai noir — nav, viewer, vidéo plein cadre */ /* ----- Filets & bordures ------------------------------------------------- */ --ts-hairline: #E0E0E0; /* filet 1px sur cartes claires */ --ts-hairline-dark: rgba(255, 255, 255, 0.12); /* filet sur fond sombre */ --ts-divider-soft: #F0F0F0; /* anneau doux des boutons secondaires */ --ts-chip-translucent: rgba(210, 210, 215, 0.64); /* chip sur photo */ --ts-field-border: #6A6A70; /* bordure de champ sur noir (≥3:1 non-texte) */ /* ----- Couleurs d'état (fonctionnelles, NON des accents de marque) -------- * * La charte n'autorise qu'un accent (rouge). L'état OK reste neutre pour ne * * pas introduire un 2e accent ; l'info ne dépend jamais de la seule couleur. */ --ts-state-ok: #FFFFFF; /* succès : texte blanc + libellé explicite */ --ts-state-err: var(--ts-red-on-dark); /* ----- Échelle de profondeur — rendu nuage de points --------------------- * * Monochrome + accent rouge laser. Codes "data-viz" (jamais gaming). */ --ts-pc-near: #FFFFFF; /* points proches */ --ts-pc-mid: #8A8A8F; /* profondeur médiane */ --ts-pc-far: #3A3A40; /* points lointains */ --ts-pc-bg: #060608; /* fond du viewer */ --ts-pc-accent: var(--ts-red); /* balayage laser / points d'intérêt */ --ts-pc-grid: rgba(255, 255, 255, 0.05); /* grille de sol */ /* ----- Typographie — Inter en substitut SF Pro (cf. DESIGN-apple.md) ------ */ --ts-font-display: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --ts-font-text: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --ts-font-mono: "SFMono-Regular", ui-monospace, "JetBrains Mono", Menlo, monospace; /* Tailles (px) — reprises de l'échelle Apple */ --ts-fs-hero: 56px; --ts-fs-display-lg: 40px; --ts-fs-display-md: 34px; --ts-fs-lead: 28px; --ts-fs-lead-airy: 24px; --ts-fs-tagline: 21px; --ts-fs-body-lg: 19px; --ts-fs-body: 17px; /* corps à 17px, pas 16 (rythme de lecture) */ --ts-fs-caption: 14px; --ts-fs-fine: 12px; --ts-fs-micro: 10px; /* Graisses — échelle 300 / 400 / 600 / 700 (500 délibérément absente) */ --ts-fw-light: 300; --ts-fw-regular: 400; --ts-fw-semi: 600; --ts-fw-bold: 700; /* Interlignes */ --ts-lh-tight: 1.07; --ts-lh-display: 1.10; --ts-lh-snug: 1.19; --ts-lh-body: 1.47; /* Letter-spacing — négatif aux grandes tailles (« Apple tight »), nudge -0.01em pour compenser le tracking plus large d'Inter */ --ts-ls-hero: -0.03em; --ts-ls-display: -0.02em; --ts-ls-tight: -0.011em; --ts-ls-caption: -0.006em; --ts-ls-wide: 0.04em; /* eyebrows / kicker en capitales */ /* ----- Espacement — base 8px -------------------------------------------- */ --ts-space-xxs: 4px; --ts-space-xs: 8px; --ts-space-sm: 12px; --ts-space-md: 17px; --ts-space-lg: 24px; --ts-space-xl: 32px; --ts-space-2xl: 48px; --ts-space-3xl: 64px; --ts-section: 80px; /* padding vertical d'une tile produit */ --ts-section-lg: 120px; /* respiration cinématique (héros / viewer) */ /* ----- Rayons ----------------------------------------------------------- */ --ts-radius-none: 0px; /* tiles pleine largeur — jamais arrondies */ --ts-radius-xs: 5px; --ts-radius-sm: 8px; /* boutons utilitaires sombres, imagerie inline */ --ts-radius-md: 11px; --ts-radius-lg: 18px; /* cartes utilitaires, items de galerie */ --ts-radius-pill: 9999px;/* CTA rouge, chips, champ de recherche */ /* ----- Élévation — UNE seule vraie ombre (imagerie de scan/nuage) -------- */ --ts-shadow-media: rgba(0, 0, 0, 0.22) 0 8px 40px; /* média posé sur surface */ --ts-shadow-media-soft: rgba(0, 0, 0, 0.14) 0 4px 24px; --ts-shadow-card: 0 1px 0 rgba(0, 0, 0, 0.04); /* quasi-filet, pas ombre */ /* ----- Filtres verre (sub-nav / barre flottante) ------------------------ */ --ts-blur-frosted: saturate(180%) blur(20px); --ts-nav-bg-scrolled: rgba(0, 0, 0, 0.72); /* ----- Mouvement -------------------------------------------------------- */ --ts-ease-out: cubic-bezier(0.16, 1, 0.3, 1); --ts-ease-standard: cubic-bezier(0.4, 0, 0.2, 1); --ts-dur-fast: 200ms; --ts-dur: 400ms; --ts-dur-slow: 700ms; --ts-reveal-y: 28px; /* translation d'apparition au scroll */ --ts-press: scale(0.96); /* état active système */ /* ----- Conteneurs ------------------------------------------------------- */ --ts-container-text: 720px; /* sections très textuelles */ --ts-container: 980px; /* défaut lisible */ --ts-container-wide: 1280px; /* grilles / galeries */ --ts-container-max: 1440px; /* verrou de contenu (marges absorbent >1440) */ /* ----- Chrome ----------------------------------------------------------- */ --ts-nav-height: 72px; --ts-z-nav: 1000; --ts-z-sticky-cta: 900; --ts-z-viewer-ui: 50; } /* Substituts de police non-Apple : ss03 approxime le "a" arrondi de SF Pro */ @supports (font-feature-settings: "ss03") { :root { --ts-font-features: "ss03" 1, "cv11" 1; } } /* Respect des préférences de mouvement réduit */ @media (prefers-reduced-motion: reduce) { :root { --ts-dur-fast: 1ms; --ts-dur: 1ms; --ts-dur-slow: 1ms; --ts-reveal-y: 0px; } }