/* ==========================================================================
   GCCP Design System — Colors & Type
   Grand Canal Capital Partners
   ==========================================================================
   Brand standards from CLAUDE.md, STUDIO-GUIDE.html and the Coola Lawns
   brochure. Institutional Blackstone/Goldman register — never startup.
   ========================================================================== */

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

:root {
  /* ---------- BRAND PRIMARIES ---------- */
  --gccp-navy:       #1C2237;   /* Primary — wordmark, headings, navy panels */
  --gccp-slate:      #4A4F5C;   /* Secondary — body, captions */
  --gccp-blue-grey:  #3E4D77;   /* Hover state for navy buttons, secondary mark */
  --gccp-gold:       #B8975A;   /* Accent — section labels, badges, CTA accent */

  /* ---------- NEUTRALS ---------- */
  --gccp-white:      #FFFFFF;
  --gccp-cream:      #FAF8F5;   /* Section backgrounds, highlight cards */
  --gccp-warm-grey:  #F5F3F0;   /* Card backgrounds */
  --gccp-light-grey: #D1D5DB;   /* Brand light grey — dividers, low-emphasis */
  --gccp-border:     #E0DDD8;   /* Hairline borders on cream backgrounds */
  --gccp-gridline:   #E8E9EB;   /* Chart gridlines (Tufte rule: 0.5px max) */

  /* ---------- TEXT ---------- */
  --gccp-fg-1:       #1A1A1A;   /* Primary body text */
  --gccp-fg-2:       #555555;   /* Secondary body text */
  --gccp-fg-3:       #888888;   /* Tertiary, captions */
  --gccp-fg-on-dark: rgba(255,255,255,0.85);
  --gccp-fg-on-dark-2: rgba(255,255,255,0.55);

  /* ---------- SEMANTIC / STATUS ---------- */
  --gccp-status-green:  #28A745;
  --gccp-status-amber:  #FFC107;
  --gccp-status-red:    #DC3545;
  --gccp-status-purple: #6F42C1;

  /* ---------- TYPE FAMILIES ---------- */
  /* WEB: Inter for everything (UI / dashboards / web) */
  --gccp-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  /* DISPLAY: Playfair Display — used for marketing/brochure headlines (Coola Lawns) */
  --gccp-font-display: 'Playfair Display', 'Times New Roman', Georgia, serif;
  /* DOCUMENTS: Arial only for IR / DDQ / capital calls / partner letters */
  --gccp-font-doc: Arial, Helvetica, sans-serif;
  /* MONO: utilities, code, eircodes */
  --gccp-font-mono: 'SF Mono', 'Consolas', 'Menlo', monospace;

  /* ---------- TYPE SCALE (web) ---------- */
  --gccp-h1-size: clamp(40px, 5vw, 64px);
  --gccp-h2-size: clamp(28px, 3.2vw, 44px);
  --gccp-h3-size: clamp(20px, 2vw, 28px);
  --gccp-h4-size: 18px;
  --gccp-body-size: 15px;
  --gccp-small-size: 13px;
  --gccp-eyebrow-size: 11px;

  /* ---------- LAYOUT TOKENS ---------- */
  --gccp-radius-sm: 2px;
  --gccp-radius-md: 4px;
  --gccp-radius-lg: 8px;             /* dashboards default */
  --gccp-card-padding: 24px;
  --gccp-grid-gap: 20px;
  --gccp-max-width: 1400px;
  --gccp-portal-max: 1200px;         /* portals/dashboards default */

  /* ---------- ELEVATION ---------- */
  --gccp-shadow-sm: 0 1px 2px rgba(28,34,55,0.06);
  --gccp-shadow-md: 0 4px 16px rgba(28,34,55,0.08);
  --gccp-shadow-lg: 0 16px 48px rgba(28,34,55,0.10);
  --gccp-shadow-xl: 0 20px 60px rgba(28,34,55,0.12);

  /* ---------- MOTION ---------- */
  --gccp-ease: cubic-bezier(0.2, 0, 0, 1);
  --gccp-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --gccp-dur-fast: 150ms;
  --gccp-dur-base: 220ms;
  --gccp-dur-slow: 400ms;
}

/* ==========================================================================
   SEMANTIC ELEMENTS
   ========================================================================== */

html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

body {
  font-family: var(--gccp-font-sans);
  color: var(--gccp-fg-1);
  background: var(--gccp-white);
  line-height: 1.6;
  font-size: var(--gccp-body-size);
}

h1, .gccp-h1 {
  font-family: var(--gccp-font-display);
  font-size: var(--gccp-h1-size);
  font-weight: 600;
  color: var(--gccp-navy);
  line-height: 1.05;
  letter-spacing: -0.01em;
}

h2, .gccp-h2 {
  font-family: var(--gccp-font-display);
  font-size: var(--gccp-h2-size);
  font-weight: 600;
  color: var(--gccp-navy);
  line-height: 1.15;
  letter-spacing: -0.005em;
}

h3, .gccp-h3 {
  font-family: var(--gccp-font-sans);
  font-size: var(--gccp-h3-size);
  font-weight: 600;
  color: var(--gccp-navy);
  line-height: 1.3;
}

h4, .gccp-h4 {
  font-family: var(--gccp-font-sans);
  font-size: var(--gccp-h4-size);
  font-weight: 600;
  color: var(--gccp-navy);
}

p, .gccp-body {
  font-size: var(--gccp-body-size);
  color: var(--gccp-fg-2);
  line-height: 1.65;
}

.gccp-eyebrow {
  display: inline-block;
  font-size: var(--gccp-eyebrow-size);
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--gccp-gold);
}

.gccp-caption {
  font-size: 12px;
  color: var(--gccp-fg-3);
  letter-spacing: 0.3px;
}

.gccp-mono { font-family: var(--gccp-font-mono); }

/* Document-style (IR/DDQ/letters) — Arial only, navy headings, no decoration */
.gccp-doc, .gccp-doc * {
  font-family: var(--gccp-font-doc) !important;
}
.gccp-doc h1, .gccp-doc h2, .gccp-doc h3 {
  font-family: var(--gccp-font-doc) !important;
  color: var(--gccp-navy);
  font-weight: 700;
}
.gccp-doc-footer {
  font-family: var(--gccp-font-doc);
  font-size: 9pt;
  color: var(--gccp-slate);
  text-align: center;
  letter-spacing: 0.3px;
}