/* =====================================================================
   УНИВЕРСИТЕТ КОСЫГИНА — Colors & Type foundations
   РГУ им. А.Н. Косыгина · Приёмная комиссия (SMM / info-poster identity)
   Motto: «Технологии. Дизайн. Искусство.»
   ---------------------------------------------------------------------
   All values reconstructed from the brand Figma «Айдентика Косыгина».
   Primary typeface: Inter (the file's working font). Secondary faces
   ElementaCyr-Bold / Montserrat appear a handful of times only and are
   substituted by Inter here — see README "Font substitution".
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  /* ---------------------------------------------------------------
     BRAND BLUES — the identity is overwhelmingly blue (≈70% of fills)
     --------------------------------------------------------------- */
  --blue-primary:   #3764E5;  /* rgb(55,100,229)  · chips, accents, most-used */
  --blue-bright:    #1E85FF;  /* rgb(30,133,255)  · gradient top, handle pills */
  --blue-electric:  #0989FF;  /* rgb(9,137,255)   · highlights */
  --blue-pure:      #0077FF;  /* rgb(0,119,255)   · gradient stops */
  --blue-deep:      #1752A9;  /* rgb(23,82,169)   · gradient bottom */
  --blue-navy:      #093D7B;  /* rgb(9,61,123)    · text on light surfaces */
  --blue-navy-2:    #003B81;  /* rgb(0,59,129)    · deep stroke */

  /* Surface blue gradient — the signature poster background */
  --grad-blue: linear-gradient(180deg, #1E85FF 0%, #1752A9 100%);
  /* Inner chip / button gradient */
  --grad-blue-chip: linear-gradient(180deg, #3764E5 0%, #0077FF 100%);

  /* ---------------------------------------------------------------
     WARM ACCENTS — coral / orange family + the orange variant theme
     --------------------------------------------------------------- */
  --coral:          #F97755;  /* rgb(249,119,85)  · accent stroke / fill */
  --orange:         #F18822;  /* rgb(241,136,34)  · orange-variant top */
  --orange-deep:    #E97300;  /* rgb(233,115,0)   · orange-variant bottom */
  --peach:          #F4D4BD;  /* rgb(244,212,189) · soft warm fill / text */
  --grad-orange: linear-gradient(180deg, #F18822 0%, #E97300 100%);

  /* ---------------------------------------------------------------
     PINK ACCENTS — section-label capsules & soft fills
     --------------------------------------------------------------- */
  --pink:           #FFBFE1;  /* rgb(255,191,225) · primary section capsule */
  --pink-rose:      #F1B4CB;  /* rgb(241,180,203) · soft gradient top */
  --pink-mauve:     #F0A4C0;  /* rgb(240,164,192) · text / fill */

  /* ---------------------------------------------------------------
     INSTITUTE TAG PALETTE — the multicolour rotated tags ("Наши институты")
     --------------------------------------------------------------- */
  --tag-coral:   #F2724E;
  --tag-blue:    #B9CBE4;
  --tag-cream:   #FBE7BE;
  --tag-pink:    #F6C9DE;
  --tag-sage:    #97B89A;
  --tag-peach:   #F4D9BE;

  /* ---------------------------------------------------------------
     NEUTRALS
     --------------------------------------------------------------- */
  --white:        #FFFFFF;
  --surface:      #F5F5F5;  /* rgb(245,245,245) · cards on blue */
  --surface-2:    #EEEEEC;  /* rgb(238,238,236) · alt card */
  --ink:          #25242C;  /* rgb(37,36,44)    · near-black text */
  --ink-2:        #333233;  /* rgb(51,50,51)    · secondary near-black */
  --line:         #E0E0E0;  /* rgb(224,224,224) · hairline */
  --line-2:       #D9D9D9;  /* rgb(217,217,217) · hairline 2 */

  /* Decorative giant ghost type sitting in poster backgrounds */
  --ghost-on-blue: rgba(255,255,255,0.08);

  /* ---------------------------------------------------------------
     TYPOGRAPHY
     The whole system runs on Inter with TIGHT tracking. Two distinct
     tracking regimes appear in the file:
       · Headlines / body  → -0.05em
       · Pills & chip labels → -0.07em
     Line-height is unusually tight (0.9) on headings — a key signature.
     --------------------------------------------------------------- */
  --font-display: 'Inter', system-ui, sans-serif;
  --font-text:    'Inter', system-ui, sans-serif;

  --track-tight:   -0.05em;   /* headings + body */
  --track-tighter: -0.07em;   /* pills / chips */
  --leading-tight: 0.9;       /* signature heading line-height */
  --leading-flat:  1;         /* chips / single lines */

  /* Type scale (normalised to a ~1080px-wide poster canvas).
     On the native 3474px artboards every value is ×3.217. */
  --fs-display:  72px;   /* hero headline (Inter 800/700) */
  --fs-h1:       54px;   /* large headline */
  --fs-h2:       38px;   /* card / block title (Inter 700) */
  --fs-section:  33px;   /* pink section-capsule label (Inter 700) */
  --fs-sublabel: 25px;   /* grey sub-label chip (Inter 700) */
  --fs-body:     22px;   /* body copy (Inter 500) */
  --fs-chip:     23px;   /* blue value chips (Inter 500) */
  --fs-handle:   28px;   /* @handle pill (Inter 500) */
  --fs-small:    18px;   /* fine print */

  /* ---------------------------------------------------------------
     SHAPE — radii are large & friendly. Capsules are full pills.
     Native px (÷3.217 → canvas px):
       card 42→13 · pink capsule 32→10 · sublabel 18→6 · chip 24→7.5
     We expose practical canvas-scale tokens here.
     --------------------------------------------------------------- */
  --r-pill:    999px;   /* handle pills, value chips */
  --r-card:    20px;    /* content cards (radius 42 native) */
  --r-capsule: 16px;    /* pink section capsules */
  --r-chip:    12px;    /* blue value chips */
  --r-sm:      9px;     /* grey sub-labels */

  /* ---------------------------------------------------------------
     SHADOW — the system is almost flat. One soft drop on pills.
     --------------------------------------------------------------- */
  --shadow-pill: 0 2px 6px rgba(0,0,0,0.18);
  --shadow-card: 0 6px 24px rgba(9,37,84,0.18);
}

/* =====================================================================
   SEMANTIC ELEMENT STYLES — drop-in classes for poster/UI work
   ===================================================================== */

.ds-display {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--fs-display);
  line-height: var(--leading-tight);
  letter-spacing: var(--track-tight);
  color: var(--white);
  text-wrap: balance;
}
.ds-h1 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-h1);
  line-height: var(--leading-tight);
  letter-spacing: var(--track-tight);
  color: var(--white);
}
.ds-h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-h2);
  line-height: var(--leading-tight);
  letter-spacing: var(--track-tight);
  color: var(--blue-navy);
}
.ds-body {
  font-family: var(--font-text);
  font-weight: 500;
  font-size: var(--fs-body);
  line-height: 1.05;
  letter-spacing: var(--track-tight);
  color: var(--white);
}

/* Top-right contact pill (@rsukosygin / rguk.ru) */
.ds-handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--blue-bright);
  color: var(--white);
  font-family: var(--font-text);
  font-weight: 500;
  font-size: var(--fs-handle);
  letter-spacing: var(--track-tighter);
  line-height: 1;
  padding: 14px 22px;
  border-radius: var(--r-pill);
  box-shadow: var(--shadow-pill);
}

/* Primary section label — pink capsule, navy bold text */
.ds-capsule {
  display: inline-flex;
  align-items: center;
  background: var(--pink);
  color: var(--blue-navy);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-section);
  letter-spacing: var(--track-tight);
  line-height: var(--leading-tight);
  padding: 12px 18px;
  border-radius: var(--r-capsule);
}

/* Secondary sub-label — light grey chip, navy bold text */
.ds-sublabel {
  display: inline-flex;
  align-items: center;
  background: var(--surface);
  color: var(--blue-navy);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-sublabel);
  letter-spacing: var(--track-tight);
  line-height: var(--leading-tight);
  padding: 7px 12px;
  border-radius: var(--r-sm);
}

/* Blue value chip — for times, short labels */
.ds-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--blue-primary);
  color: var(--white);
  font-family: var(--font-text);
  font-weight: 500;
  font-size: var(--fs-chip);
  letter-spacing: var(--track-tighter);
  line-height: 1;
  padding: 8px 14px;
  border-radius: var(--r-chip);
}

/* Content surface card */
.ds-card {
  background: var(--surface);
  border-radius: var(--r-card);
  color: var(--blue-navy);
}

/* Poster background */
.ds-bg-blue   { background: var(--grad-blue); }
.ds-bg-orange { background: var(--grad-orange); }