/* ForgeInt — flattened theme (styles.css + tokens) for standalone export */

/* ===== tokens/fonts.css ===== */
/* ForgeInt webfonts.
   SUBSTITUTION: brief specifies "Inter Display" + "Geist Mono"; no font binaries
   were provided. Nearest hosted matches: Google Fonts "Inter" variable (its opsz
   axis reaches the Display optical size at large settings) and Google Fonts
   "Geist Mono". Replace with licensed Inter Display files when available. */
/* SELF-HOSTED (2026-08-20). This line used to be an @import from Google Fonts, so
   every visitor's IP reached Google before the first paint — with no DPA and
   no way to consent first (LG Munchen I, 20.01.2022, 3 O 17493/20). The exact
   same faces are now served from forgeint.gr: identical family names, weights,
   styles, unicode-ranges and font-display, so nothing shifts. All subsets are
   kept (incl. greek) so Greek text still renders in Inter and does not fall
   back. Both faces are SIL OFL 1.1 (fonts/LICENSE-*.txt).
   NB: Geist Mono ships NO greek subset upstream either -- Greek in
   var(--font-mono) falls back to ui-monospace, exactly as it did before. */
/* cyrillic-ext */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/geist-mono-cyrillic-ext-normal.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/geist-mono-cyrillic-normal.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* symbols2 */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/geist-mono-symbols2-normal.woff2) format('woff2');
  unicode-range: U+2000-2001, U+2004-2008, U+200A, U+23B8-23BD, U+2500-259F;
}
/* vietnamese */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/geist-mono-vietnamese-normal.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/geist-mono-latin-ext-normal.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;
}
/* latin */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/geist-mono-latin-normal.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-cyrillic-ext-italic.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-cyrillic-italic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-greek-ext-italic.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-greek-italic.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-vietnamese-italic.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-latin-ext-italic.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;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-latin-italic.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-cyrillic-ext-normal.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-cyrillic-normal.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-greek-ext-normal.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-greek-normal.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-vietnamese-normal.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-latin-ext-normal.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;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-latin-normal.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;
}


/* ===== tokens/colors.css ===== */
/* ForgeInt color system — monochrome dark editorial.
   One hue: none. Hierarchy is carried entirely by opacity of a warm off-white
   over near-black. No purple, no gradients on text, no colored accents. */
:root {
  /* Base scale */
  --black: #09090A;
  --white: #FFFFFF;
  --off-white: #F2F2F0;

  --bg-0: #09090A;   /* page */
  --bg-1: #0E0E10;   /* alternate band */
  --bg-2: #131316;   /* card / raised */
  --bg-3: #19191D;   /* hover / pressed surface */

  --fg-1: #F2F2F0;                      /* primary text */
  --fg-2: rgba(242, 242, 240, 0.64);    /* secondary text */
  --fg-3: rgba(242, 242, 240, 0.42);    /* muted / captions */
  --fg-4: rgba(242, 242, 240, 0.26);    /* faint / disabled */

  --line-1: rgba(242, 242, 240, 0.10);  /* hairline borders */
  --line-2: rgba(242, 242, 240, 0.06);  /* faintest dividers */
  --line-strong: rgba(242, 242, 240, 0.24); /* focused / active borders */

  /* Semantic aliases */
  --surface-page: var(--bg-0);
  --surface-band: var(--bg-1);
  --surface-card: var(--bg-2);
  --surface-raised: var(--bg-3);
  --surface-inverse: var(--off-white);  /* primary buttons, inverse blocks */

  --text-heading: var(--fg-1);
  --text-body: var(--fg-2);
  --text-muted: var(--fg-3);
  --text-faint: var(--fg-4);
  --text-inverse: var(--bg-0);

  --border-hairline: var(--line-1);
  --border-faint: var(--line-2);
  --border-strong: var(--line-strong);

  --accent: var(--off-white);           /* the "accent" is white */

  /* States — desaturated, used sparingly (form validation, system status) */
  --ok: #86A88B;
  --warn: #BFA36F;
  --danger: #C0736C;

  --scrim: rgba(9, 9, 10, 0.72);        /* dialog backdrop */
}


/* ===== tokens/typography.css ===== */
/* ForgeInt typography — typography-first system.
   Display: Inter (Display optical size), LIGHT weights at large sizes.
   Labels/eyebrows/data: Geist Mono, uppercase, wide tracking. */
:root {
  --font-display: 'Inter', 'Inter Display', system-ui, sans-serif;
  --font-sans: 'Inter', system-ui, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SF Mono', monospace;

  /* Display — light weight, tight leading, negative tracking */
  --type-display-xl: 200 clamp(56px, 7.5vw, 96px) / 1.02 var(--font-display);
  --type-display-lg: 200 clamp(44px, 5vw, 64px) / 1.06 var(--font-display);
  --type-display-md: 300 clamp(32px, 3.4vw, 44px) / 1.12 var(--font-display);
  --type-heading: 400 24px / 1.3 var(--font-sans);
  --type-heading-sm: 500 17px / 1.4 var(--font-sans);

  --tracking-display: -0.035em;
  --tracking-heading: -0.015em;

  /* Body */
  --type-body-lg: 300 19px / 1.6 var(--font-sans);
  --type-body: 400 15.5px / 1.65 var(--font-sans);
  --type-body-sm: 400 13.5px / 1.55 var(--font-sans);

  /* Mono labels — the signature secondary voice */
  --type-label: 400 12px / 1.4 var(--font-mono);
  --type-label-sm: 400 10.5px / 1.4 var(--font-mono);
  --type-data: 300 15px / 1.5 var(--font-mono);
  --tracking-label: 0.14em;   /* always paired with uppercase */
  --tracking-data: 0.01em;
}


/* ===== tokens/spacing.css ===== */
/* ForgeInt spacing & layout — generous, editorial. 4px base. */
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --space-11: 176px;  /* section rhythm on marketing pages */

  --container-max: 1240px;
  --gutter: clamp(24px, 4vw, 56px); /* @kind spacing */
  --section-pad: clamp(96px, 12vh, 176px);
}


/* ===== tokens/effects.css ===== */
/* ForgeInt effects — radii, shadows, motion, blur. Restraint by default. */
:root {
  /* Radii — near-sharp. Editorial surfaces stay rectangular. */
  --radius-control: 2px;   /* buttons, inputs */
  --radius-card: 4px;      /* cards, dialogs */
  --radius-pill: 999px;    /* tags, badges only */

  /* Shadows — dark UI relies on borders, not shadows.
     Only floating layers (dialog, toast, tooltip, menus) cast one. */
  --shadow-float: 0 16px 48px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.4);
  --shadow-none: none;

  /* Motion — fades and small translates only. No bounces, no springs. */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 140ms; /* @kind other */
  --dur-base: 240ms; /* @kind other */
  --dur-slow: 520ms; /* @kind other */

  /* Blur — fixed header only */
  --blur-header: saturate(1.1) blur(14px); /* @kind other */
}


/* ===== tokens/base.css ===== */
/* ForgeInt base element styles. */
* { box-sizing: border-box; }

html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

body {
  margin: 0;
  background: var(--surface-page);
  color: var(--text-body);
  font: var(--type-body);
  font-family: var(--font-sans);
}

h1, h2, h3, h4 { margin: 0; color: var(--text-heading); }

a {
  color: var(--fg-1);
  text-decoration: none;
  text-underline-offset: 4px;
  text-decoration-color: var(--line-strong);
  transition: color var(--dur-fast) var(--ease-out),
              text-decoration-color var(--dur-fast) var(--ease-out);
}
a:hover { color: var(--white); text-decoration: underline; text-decoration-color: var(--fg-2); }

::selection { background: var(--off-white); color: var(--bg-0); }

input::placeholder, textarea::placeholder { color: var(--fg-4); }

/* Utility voices */
.fi-label {
  font: var(--type-label);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-muted);
}
.fi-display {
  font: var(--type-display-lg);
  letter-spacing: var(--tracking-display);
  color: var(--text-heading);
}


/* ===== styles.css (root, tokens inlined above) ===== */


/* ===== tokens/ember.css (2026-09-01) =====
   ΜΙΑ ΠΗΓΗ ΑΛΗΘΕΙΑΣ ΓΙΑ ΤΟ ΠΟΡΤΟΚΑΛΙ.

   Ευρημα: το `--accent` παραπανω δηλωνει `var(--off-white)` -- "το accent ειναι
   λευκο" -- ενω τα πορτοκαλι της μαρκας ζουσαν HARDCODED σε 11 σημεια του
   site.css (.lit, .zone-label::first-letter, .pill-cta:hover, .svc-icon, ...)
   και ξανα στο onboarding.css/page.css. Δηλαδη λειτουργουσαν ως χρωμα μαρκας
   χωρις να εχουν δηλωθει ποτε. Αυτο ειναι ο λογος που το demo και το site
   αποκλιναν: δεν υπηρχε κοινη πηγη να αποκλινουν ΑΠΟ αυτην.

   Απο εδω και περα το ember δηλωνεται ΕΔΩ. Τα υπαρχοντα hardcoded literals
   μενουν ως εχουν σε αυτο το commit -- η αντικατασταση τους ειναι ξεχωριστο,
   οπτικα ελεγξιμο βημα, οχι λαθρεπιβατης σε νεα σελιδα.

   ΠΡΟΣΘΕΤΙΚΟ: καμια υπαρχουσα τιμη δεν αλλαζει, καμια οπτικη μεταβολη live. */
:root {
  /* Η κλιμακα, ζεστη -> βαθια. Κλειδωμενη (ACTIVE-GOAL 2026-09-01). */
  --ember-100: #FFB65C;  /* amber, ψηλοτερος τονος */
  --ember-200: #FF8A4C;  /* το ▨ marker, mono micro-labels */
  --ember-300: #FF6A2E;  /* το σημα -- η προεπιλογη */
  --ember-400: #FF5A1E;  /* == --molten του site.css */
  --ember-500: #E8480F;  /* hover */
  --ember-600: #C23A12;  /* == --molten-press, active */

  /* Ρολοι. Χρησιμοποιειτε ΑΥΤΑ, οχι τα σκαλοπατια. */
  --accent-ember: var(--ember-300);
  --accent-ember-hover: var(--ember-500);
  --accent-ember-press: var(--ember-600);

  /* Επιφανειες/γραμμες ember. Ενταση, οχι νεα χρωματα. */
  --ember-line: rgba(255, 106, 46, 0.70);
  --ember-line-soft: rgba(255, 106, 46, 0.34);
  --ember-wash: rgba(255, 90, 30, 0.16);

  /* Ελληνικο monospace. Το Geist Mono ΔΕΝ εχει ελληνικο subset (δες σχολιο
     fonts παραπανω), οποτε καθε ελληνικο σε var(--font-mono) επεφτε σιωπηλα
     σε ο,τι ειχε το μηχανημα. Για log/πινακες που ΠΡΕΠΕΙ να στοιχιζονται, η
     στοιχιση δεν μπορει να ειναι θεμα τυχης -- δηλωνεται ρητα. */
  --font-mono-el: ui-monospace, "DejaVu Sans Mono", "Liberation Mono",
                  "Noto Sans Mono", Consolas, "Courier New", monospace;
}

/* ===== brand mark — header glyph (BRANDKIT §1.1, §1.4, §2.5) =====
   ΒΑΘΜΙΔΑ. Τρεις υπάρχουν· εδώ επιτρέπεται μόνο μία. ≤32px ⇒ header glyph.
   ΟΧΙ 9B (μετρημένο μέχρι 32px, τίποτα κάτω από αυτό) και ΟΧΙ 9A (λάσπη σε
   24-48px). Το προηγούμενο FAIL ήταν ακριβώς λάθος βαθμίδα σε λάθος μέγεθος —
   και πλακίδιο, που γινόταν μαύρο τετράγωνο μόλις η μπάρα αντιστρεφόταν.

   ΓΙΑΤΙ INLINE SVG ΚΑΙ ΟΧΙ <img>. Το fill είναι `currentColor`. Σε <img> το
   currentColor λύνεται μέσα στο ΔΙΚΟ ΤΟΥ document — δηλαδή μαύρο, ό,τι κι αν
   κάνει η μπάρα. Inline, κληρονομεί το `color` του .wordmark, που το site
   γυρίζει ήδη σε #060606 στο `nav.fi-nav.inv`. Το σήμα αλλάζει χρώμα μαζί με
   το λεκτικό, χωρίς δεύτερο κανόνα. Πηγή αλήθειας μένει το αρχείο
   assets/brand/forgeint-mark-header.svg — από εκεί παράγεται το inline.

   ΣΤΟΙΧΙΣΗ (§2.5). Το προηγούμενο 1,25-1,5px offset ερχόταν από padding μέσα
   στο ίδιο το asset (πλακίδιο) συν vertical-align. Το glyph έχει tight bbox,
   μηδέν εσωτερικό κενό, οπότε η στοίχιση γίνεται ΜΟΝΟ με flex centering στον
   γονέα — ποτέ με σταθερά px που υποθέτουν ύψος μπάρας. */
.fi-mark {
  width: 18px;
  height: 18px;
  display: block;
  flex: 0 0 auto;
  /* ΧΡΩΜΑ ΣΗΜΑΤΟΣ, ΟΧΙ ΚΛΗΡΟΝΟΜΙΑ. Το `color: inherit` έκανε το glyph να πάρει
     το off-white του λεκτικού — δηλαδή λευκό σήμα, που το BRANDKIT §6
     απαγορεύει ρητά («μην αλλάζεις το χρώμα του σήματος εκτός #C96A3C»).
     Το #C96A3C είναι σκόπιμα ΕΚΤΟΣ των ember tokens (§4): ο Βασίλης ενέκρινε
     το σήμα με αυτό ακριβώς το χρώμα, και δεν το προσαρμόζουμε στο UI.
     Δουλεύει και στα δύο φόντα χωρίς αλλαγή (§3): 5,32:1 σε #09090A,
     3,74:1 σε λευκό — πάνω από το 3:1 που ζητά το WCAG για μη-κείμενο. */
  color: #C96A3C;
}
@media (min-width: 721px) {
  .fi-mark { width: 22px; height: 22px; }
}