/*
 * TenThirty.One — Visual Overrides
 * Drop this into: Elementor > Custom CSS  (site-wide)
 * OR load it as an additional stylesheet in functions.php
 *
 * Targets: nav size/weight, portfolio card title scale,
 *          card photo prominence, global type bump.
 */

/* ============================================================
   1. HEADER — taller, heavier nav
   ============================================================ */
:root {
  --header-h: 80px;   /* was 64px */
}

.site-header {
  height: var(--header-h);
  border-bottom: 1px solid var(--rule);
}

/* Logo mark — slightly bigger */
.logo-mark {
  width: 48px;
  height: 48px;
}
.logo-mark svg {
  width: 30px;
  height: 30px;
}
.logo-text {
  font-size: 1.3rem;
  letter-spacing: 0.12em;
}

/* Nav links — bigger, heavier, more spaced */
.primary-nav {
  gap: 2.75rem;
}
.primary-nav a {
  font-size: 0.875rem;      /* was 0.8rem */
  font-weight: 600;          /* was 500 */
  letter-spacing: 0.14em;
  color: var(--ink-mid);     /* darker at rest */
}
.primary-nav a::after {
  height: 2px;
  bottom: -4px;
}

/* ============================================================
   2. PAGE HERO — bigger title, more vertical room
   ============================================================ */
.page-hero {
  padding: var(--space-2xl) 0 var(--space-xl);
}

/* "PORTFOLIO", "ABOUT", "CONTACT" etc — go huge */
.page-hero h1 {
  font-size: clamp(4.5rem, 10vw, 9rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 0.92;
  margin-top: 0.35em;
}

.page-hero__desc {
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  color: rgba(255,255,255,0.6);
  margin-top: 1.25rem;
  max-width: 580px;
  line-height: 1.7;
}

.eyebrow {
  font-size: 0.72rem;
  letter-spacing: 0.22em;
}

/* ============================================================
   3. PORTFOLIO GRID — larger cards, bigger labels
   ============================================================ */

/* Photo thumbnail — taller aspect ratio for more image presence */
.portfolio-card__thumb {
  aspect-ratio: 3/2;    /* was 4/3 — gives more height per card */
  border-radius: var(--r-sm);
}

/* THE MAIN FIX: card project title — commanding, not a label */
.portfolio-card__label {
  font-size: clamp(1.5rem, 2.2vw, 2rem);   /* was 1.2rem */
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.1;
  margin-top: 0.75rem;
  margin-bottom: 0.2rem;
}

/* Sub-line (location · year) — proportional bump */
.portfolio-card__sub {
  font-size: 0.875rem;   /* was 0.8125rem */
  color: var(--ash);
  letter-spacing: 0.03em;
}

/* More breathing room between cards */
.portfolio-grid {
  gap: 2.5rem;            /* was var(--space-lg) / 2rem */
}

/* Slightly more space below the card bottom line before next row */
.portfolio-card {
  padding-bottom: 0.5rem;
}

/* ============================================================
   4. GLOBAL TYPE SCALE BUMP
   ============================================================ */

/* Section eyebrow labels */
.section-hd .eyebrow {
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  margin-bottom: 0.6rem;
}

/* Section H2 headlines */
.section-hd h2 {
  font-size: clamp(2.8rem, 5vw, 4.5rem);
  font-weight: 800;
  letter-spacing: -0.01em;
}

/* Hero h1 on front page */
.hero__title {
  font-size: clamp(4rem, 8.5vw, 7.5rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 0.92;
}

/* ============================================================
   5. SECTION PADDING — a bit more room at the larger type scale
   ============================================================ */
.section {
  padding-block: 5.5rem;
}
.section--sm {
  padding-block: 3.25rem;
}

/* ============================================================
   6. TIMELINE ENTRY TITLES — same treatment as portfolio labels
   ============================================================ */
.timeline-entry__title {
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  font-weight: 800;
  letter-spacing: 0.01em;
}

/* ============================================================
   7. POST/BLOG CARD TITLES — consistent with portfolio
   ============================================================ */
.post-card__title {
  font-size: clamp(1.3rem, 1.8vw, 1.7rem);
  font-weight: 800;
  letter-spacing: 0.02em;
}