/* ------------------------------------------------------------------
   SECTOR — Georgian typography

   Body copy deliberately uses the site's own Latin stack: system-ui /
   Segoe UI / Roboto all carry Georgian, and at small sizes they read
   better than BPG Nino Medium.

   Only display surfaces use the BPG face. It is declared with
   unicode-range U+10A0-10FF, so naming it first affects Georgian glyphs
   only — Latin headings keep the site's own font on every page.
   ------------------------------------------------------------------ */

:root {
  --sc-latin-stack: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6,
.sc-h1, .sc-h2, .sc-h3, .sc-h1-light, .sc-h2-light, .sc-h3-light,
.sc-hero-mark, .sc-brand-sub,
.sc-eyebrow, .sc-eyebrow-dark, .sc-label, .sc-label-light,
.sc-nav-link, .sc-nav-link-active, .sc-mobile-link,
.sc-btn-primary, .sc-btn-ghost-dark, .sc-btn-ghost-light, .sc-header-cta,
.sc-steps-title, .sc-steps-num,
.sc-s2sp-eyebrow, .sc-s2sp-line, .sc-s2sp-accent,
.sc-close-h2, .sc-prin-eyebrow, .sc-prin-title,
.sc-j-title, .sc-cap-title, .sc-plat-title, .sc-proj-title, .sc-ins-title, .sc-tool-title,
.sc-closing-title, .sc-plat-strip-head, .sc-cap-num, .sc-plat-num, .sc-tool-num, .sc-sap-step-num {
  font-family: "BPG Nino Mtavruli", InterLocal, var(--sc-latin-stack);
}

/* ------------------------------------------------------------------
   Georgian pages only: kill text-transform.
   Unicode 11 gave Georgian a real uppercase mapping (mkhedruli U+10D0
   -> mtavruli U+1C90), which these fonts do not contain, so a browser
   honouring text-transform:uppercase renders tofu. The mtavruli face
   already draws capital forms, so the effect is kept without the
   transform. !important is deliberate: Oxygen emits per-element
   uppercase rules that outrank a plain html[lang] descendant selector.
   ------------------------------------------------------------------ */

html[lang^="ka"] body,
html[lang^="ka"] body * {
  text-transform: none !important;
}

/* Georgian hero heading: "მოდელი" is short enough to sit on the same
   line as the S2S mark, while the English "Framework" wraps to a second
   line. Force the same two-line shape by making the mark a block. */
html[lang^="ka"] .sc-hero-mark .sc-s2s-logo { display: block; margin-bottom: 14px; }

/* Georgian hero copy runs ~2x the lines of the English original at the same
   column width, which pushed the section far taller. Let the Georgian text
   block extend right, stopping a constant 40px short of the banner artwork
   (the artwork sits at 57% - 24px from the section's left edge). Never
   narrower than the English 640px. English is untouched. */
html[lang^="ka"] .sc-hero-s2s .sc-hero-inner {
  max-width: max(640px, calc(57% - 12px - var(--sc-hero-gutter) + 4vw));
}

/* Georgian hero body: tighter leading so the longer copy loses height
   without shrinking the type. English keeps 1.65. */
html[lang^="ka"] .sc-hero-s2s .sc-hero-text {
  line-height: 1.5;
  /* The paragraphs carry their own max-width:540px, so widening the block
     alone changed nothing. Let them fill the widened Georgian column. */
  max-width: none;
}

/* ------------------------------------------------------------------
   Georgian header: the six mtavruli nav labels are longer than the
   English ones, so between the burger breakpoint (1119px) and the
   width where they finally clear the wordmark the menu ran straight
   into the logo. Georgian therefore switches to the compact (burger)
   header earlier. The English header is untouched — it clears the
   logo by 45px even at 1121px.

   Re-measured after the nav labels were shortened (Framework ->
   მოდელი, Tools -> ინსტრუმენტები): the Georgian nav now
   measures 583px and clears the wordmark by 42px at 1280px, 28px at
   1260 and 0px at 1220, so the burger band ends at 1279px instead of
   the old 1439px.
   ------------------------------------------------------------------ */

@media (min-width: 1119.02px) and (max-width: 1279px) {

  html[lang^="ka"] .sc-nav { display: none; }

  /* With the nav gone its margin-left:auto goes with it, so the CTA now
     carries the push that keeps the right-hand group against the edge. */
  html[lang^="ka"] .sc-header-cta { margin-left: auto; }

  /* .sc-burger only gets its column layout at the tablet breakpoints, so
     restate it here or the three bars stack sideways. */
  html[lang^="ka"] .sc-burger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-left: clamp(20px, var(--sc-hdr-gap-raw), 40px);
  }

  /* The header is 103px tall in this band, not the 92px of the tablet one. */
  html[lang^="ka"] .sc-mobile-panel { top: 103px; }
}

/* ------------------------------------------------------------------
   Capabilities cards, Georgian only: at 1200px each of the six columns
   is 119px of text, and single Georgian words run longer than that
   (a 18-character word needs 157px), so they spilled into the next
   column. break-word splits only a word that cannot fit a line on its
   own, so every other line is untouched.
   ------------------------------------------------------------------ */

html[lang^="ka"] .sc-c2-li,
html[lang^="ka"] .sc-c2-sub,
html[lang^="ka"] .sc-c2-title,
html[lang^="ka"] .sc-c2-stxt-a,
html[lang^="ka"] .sc-c2-stxt-b {
  overflow-wrap: break-word;
}

/* ------------------------------------------------------------------
   Capabilities hero, Georgian only: match the English line count
   (headline on 2 lines, lead on 3). Measured at 48px/15px, the
   Georgian headline needs 636px to fall to two lines and the lead
   524px to fall to three, against the 480-600px the 711fr/977fr grid
   gives the copy column. Widening the copy column to 56.2% brings its
   right edge to where the artwork starts (41.5% wide, 2.25% from the
   right = 56.25%), so the 60px padding-right stays as the visible gap
   and nothing moves on the artwork side. Scoped above the 1023px
   breakpoint, where the hero is still two columns.
   ------------------------------------------------------------------ */

@media (min-width: 1023.02px) {
  html[lang^="ka"] .sc-c2-hero { grid-template-columns: 562fr 438fr; }
  html[lang^="ka"] .sc-c2-hero-copy { max-width: 780px; }
  html[lang^="ka"] .sc-c2-h1 { max-width: 700px; }
  html[lang^="ka"] .sc-c2-hero .sc-c2-lead { max-width: 560px; }
}

/* ------------------------------------------------------------------
   Insights hero, Georgian only: match the English line count
   (headline on 2 lines, lead on 3). The headline is two <br>-split
   segments; the longer one measures 742px at the 46px the type
   reaches from 1440px up, while .sc-h2's own max-width:12em gave it
   552px and the 45.5% copy column 552px of text. Both had to grow.

   Column: the needed text width tracks the font, which tracks 3.2vw,
   so 742/1440 = 51.6% of the viewport plus the 96px of side padding,
   rounded up to 52% + 108px for a ~16px margin at every width. Capped
   at 1060px, which is 16.5em of the 58px the heading maxes out at
   plus that padding, so ultra-wide viewports stop stealing width from
   the artwork. The artwork's left edge follows the same value.

   Headline: 16.5em (759px at 46px, against the 742px needed).
   Lead: 34em, which puts the Georgian lead on 3 lines like English.

   Verified 2 lines / 3 lines at 1024, 1120, 1200, 1366, 1440, 1600,
   1920 and 2560. Scoped above 1023px, where the band is still two
   columns; below that the copy is full width and already fits.
   ------------------------------------------------------------------ */

@media (min-width: 1023.02px) {
  html[lang^="ka"] .sc-ins-band-copy { width: min(calc(52% + 108px), 1060px); }
  html[lang^="ka"] .sc-ins-band-media { left: min(calc(52% + 108px), 1060px); }
  html[lang^="ka"] .sc-ins-band-copy .sc-h2 { max-width: 16.5em; }
  html[lang^="ka"] .sc-ins-band-copy .sc-lead { max-width: 34em; }
}

/* ------------------------------------------------------------------
   Tools subtitle: the client wants every named page heading to render
   in the mtavruli face in Georgian. Fifteen of the sixteen already did
   — they are h1/h2 elements, or classes already listed above. This one
   is a <p class="sc-tool-subtitle"> and was falling through to the
   site's own Latin face, so Georgian rendered in mkhedruli there and
   nowhere else. Same unicode-range logic as the block at the top of
   this file: naming the face first only affects Georgian glyphs.
   ------------------------------------------------------------------ */

.sc-tool-subtitle {
  font-family: "BPG Nino Mtavruli", InterLocal, var(--sc-latin-stack);
}


/* ------------------------------------------------------------------
   Tools hero, Georgian only: the two <br> segments measure 603px and
   682px against the 507px of text the copy column gives, so the
   Georgian heading ran to 4 lines where the English sits on 2.

   Widening the column is NOT available here, unlike the Insights hero.
   This artwork is sized by HEIGHT (auto 78%) and anchored 56px from the
   band's right edge, so its width tracks the band height rather than
   the box: measured at 1200px the image is already 667px inside a 683px
   box. Moving the column right by even 2% clips the artwork's left edge
   (verified: at 48% the image lost 51px at 1200 and 3px at 1440).

   So the Georgian heading is sized down instead: 2.2vw against the
   English 3.2vw. Verified 2 lines at 1024, 1200, 1440 and 1920, where
   the longer segment needs 329 / 386 / 464 / 620px inside boxes of
   371 / 405 / 507 / 710px. English and the artwork are untouched.
   ------------------------------------------------------------------ */

@media (min-width: 1023.02px) {
  html[lang^="ka"] .sc-tool-band-copy .sc-h2 {
    /* font-size removed RUN-38: the site type scale now owns it (--sc-fs-h1). */
    max-width: 16em;
  }
}

/* ------------------------------------------------------------------
   Start a Project hero, Georgian only: the heading is three spans, the
   first a block and the other two inline, so it reads on two lines.
   In Georgian the second line, „თქვენი მომდევნო პროექტი“,
   measures 13em against the 12em .sc-h2 allows, so it wrapped to a
   third line. The copy column is full width here (the black slanted
   panel beside it was removed), so there is nothing to collide with —
   the cap is simply raised to 13.5em. Scales with the type, so it
   holds at every width. English is untouched at 12em.
   ------------------------------------------------------------------ */

html[lang^="ka"] .sc-sap-h2 { max-width: 13.5em; }

/* ------------------------------------------------------------------
   About, ecosystem band, Georgian only: the second <br> segment,
   „ერთი ინტეგრირებული პლატფორმა.“, measures 17.23em against
   the 13.5em the English heading needs (17.23 vs 12.83em) — so it fell
   to a third line. The block is centred and full width since the
   decorative panel beside it was removed, so nothing is in the way:
   the Georgian cap simply goes to 18em. Both scale with the type, so
   this holds at every width; below phone size the container binds
   first and it wraps, which is correct there.
   ------------------------------------------------------------------ */

@media (min-width: 1023.02px) {
  html[lang^="ka"] .sc-plat-band-copy .sc-h2 { max-width: 18em; }
}

/* Home block 2 heading: the Georgian sentence runs 35.5em on one line against
   the English uppercase 27em, so the 15em column that keeps English on two
   lines pushes Georgian to three. 20em is the measured two-line width; below
   ~479px the viewport itself is the limit and it wraps to three. */
html[lang^="ka"] .sc-band:not(.sc-band-solution) .sc-h2 {
  max-width: 20em;
}
/* ------------------------------------------------------------------
   RUN-41 (audit) - site-wide typographic baseline.

   The body face was declared once, on `.sc-page`. Three places never
   received it:
     - the header and the footer, which sit OUTSIDE `.sc-page` on every
       page, so the wordmark, the footer links and the language switcher
       rendered in the OS UI font;
     - the whole Framework page, the only page with no `.sc-page`
       wrapper at all (its six sections are direct children of <main>).
   Declaring the same values on `body` covers all of them. `.sc-page`
   still wins wherever it exists - the values are identical, so nothing
   moves on the seven pages that already had it.
   ------------------------------------------------------------------ */

body {
  color: var(--sc-lead);
  font-family: InterLocal, "Noto Sans Georgian", var(--sc-latin-stack);
  font-size: 15px;
  line-height: 1.65;
  background-color: var(--sc-bone);
}

/* The accessibility skip link was the one control on the site still
   painted by the browser: rgb(0,0,238) on all eight pages. It is hidden
   until a keyboard user tabs to it, and then appeared unstyled. */
.oxy-skip-link {
  color: var(--sc-ink);
  font-family: InterLocal, var(--sc-latin-stack);
  background-color: var(--sc-bone);
}


/* ------------------------------------------------------------------
   RUN-42 — Georgian typography: exactly two faces, no third.

   The brief: in Georgian there must be TWO fonts and only two —
   BPG Nino Mtavruli for every heading and label surface, one single
   face for every piece of body text.

   Before this block that was not true. Body copy resolved through
   --sc-latin-stack, and none of system-ui / -apple-system / Segoe UI /
   Roboto / Helvetica / Arial carries Georgian on macOS or iOS. So the
   text face was whatever each operating system happened to substitute:
   Segoe UI on Windows, a system fallback on a Mac, something else again
   on iOS. Three platforms, three faces.

   Noto Sans Georgian is now self-hosted (sector-fonts.php) under the
   same unicode-range as the mtavruli faces, so it paints Georgian and
   nothing else: Latin text on a Georgian page still renders in
   InterLocal, and an English page never fetches the file at all.
   ------------------------------------------------------------------ */

/* Declared on the shared stack instead of behind html[lang]: InterLocal is
   Latin-only by unicode-range, so a Georgian glyph falls straight past it
   to Noto on every page, and an English page never fetches the file. One
   stack, both languages, no language switch needed. See body above and
   .sc-page in the Oxygen selectors. */

/* ------------------------------------------------------------------
   Heading and label surfaces that the original hand-written list at the
   top of this file never reached. Measured on the live /ka/ pages: each
   of these was rendering Georgian in mkhedruli (lowercase forms) while
   every other heading on the same page was in mtavruli.

   The worst of them were the fourteen form labels on /ka/start-a-project/
   and the thirty stat figures and captions on /ka/projects/.

   NOTE for future work: this list is the weak point of the whole
   arrangement — every new heading class has to be added here by hand or
   it is silently born in the wrong face. The durable fix is a single
   .sc-display utility carried on the elements themselves. Until that
   refactor happens, add new heading and label classes HERE.
   ------------------------------------------------------------------ */

.sc-hero-tag, .sc-hero-scroll,
.sc-num, .sc-num-light,
.sc-j-num, .sc-j-eyebrow,
.sc-c2-title, .sc-c2-sub, .sc-c2-eyebrow, .sc-c2-seq, .sc-c2-num,
.sc-c2-close-h2, .sc-ab-close-h2, .sc-sap-h2,
.sc-cap-num, .sc-cap-stat-num, .sc-plat-num, .sc-tool-num, .sc-sap-step-num,
.sc-proj-stat-num, .sc-proj-stat-label, .sc-proj-market-label, .sc-proj-cat, .sc-proj-tab,
.sc-ins-cat, .sc-ins-tab,
.sc-ab-value-title, .sc-ab-values-label, .sc-ab-mv-label, .sc-ab-mvs-title,
.sc-ab-stat-num, .sc-ab-stat-label,
.sc-plat-stat-num, .sc-plat-stat-label, .sc-plat-proof-num, .sc-plat-proof-label,
.sc-plat-vs-panel-head, .sc-plat-vs-badge,
.sc-sap-step-title, .sc-sap-quote-cite,
.sc-form-label, .sc-form-legend,
.sc-fband-eyebrow, .sc-cmp-box-label {
  font-family: "BPG Nino Mtavruli", InterLocal, var(--sc-latin-stack);
}

/* Oxygen's font-family control stores a SINGLE family, so importing the whole
   stack onto .sc-page collapses back to `font-family:InterLocal` and every
   Georgian glyph inside the page wrapper falls to the OS font again. Declared
   here instead, one class-level above, where it survives. */
:root .sc-page {
  font-family: InterLocal, "Noto Sans Georgian", var(--sc-latin-stack);
}


/* ------------------------------------------------------------------
   RUN-45 - motion.

   The hand-rolled scroll reveal (sector-reveal.js / .sc-rv / .sc-rv-hero)
   was removed. Entrance motion is now Oxygen's own GSAP + ScrollTrigger
   system, set per element with set-element-animations and rendered as the
   data-entrance attribute, so the builder owns it and there is nothing of
   ours to keep in sync.

   What stays here is only what Oxygen cannot express.
   ------------------------------------------------------------------ */

/* The home hero had its own CSS entrance (.sc-ent / sc-rise, 480ms,
   staggered 80/140/200/260ms) and no other page had anything. Switched off
   so every page arrives with the identical gesture. .sc-ent-fade was a
   scroll-driven fade that only ever ran in Chromium. */
.sc-ent,
.sc-ent-2,
.sc-ent-3,
.sc-ent-4,
.sc-ent-5,
.sc-ent-fade {
  animation: none;
  opacity: 1;
  transform: none;
}

/* Accessibility: a reader who has asked their OS for less motion gets a
   still page. Covers the legacy entrances, the document-level scroll-snap,
   the tab/arrow transitions, and Oxygen's own entrance animations - the
   builder hides [data-entrance] elements before GSAP takes over, so they
   must be forced visible here or they would never appear. */
@media (prefers-reduced-motion: reduce) {
  .sc-ent,
  .sc-ent-2,
  .sc-ent-3,
  .sc-ent-4,
  .sc-ent-5,
  .sc-ent-fade {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  [data-entrance] {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
  }

  html {
    scroll-snap-type: none !important;
  }

  .sc-ins-tab,
  .sc-proj-tab,
  .sc-c2-arw {
    transition: none !important;
  }
}

/* Failsafe for the entrance animations.

   Oxygen's entrance.css hides every animated element with
   `[data-entrance] { visibility: hidden }` and relies on GSAP to reveal it.
   sector-motion.php marks the document `sc-no-gsap` if GSAP has not arrived
   within 2.5s, so a failed script leaves a still page rather than a blank one.
   Higher specificity than the plugin rule, so cascade order does not matter. */
html.sc-no-gsap [data-entrance] {
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
}

/* Printing: the builder hides [data-entrance] elements until GSAP reveals them
   on scroll, and a print job never scrolls, so everything below the first screen
   came out blank on paper. Same escape hatch as the reduced-motion and no-GSAP
   blocks above. */
@media print {
  [data-entrance] {
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }
}