/* ============================================================
   AURA — SF Pro Font System
   Apple's official SF Pro integrated locally
   Do not modify these declarations
   ============================================================ */

/* SF Pro Display — for type >= 20px */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Ultralight.otf') format('opentype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Thin.otf') format('opentype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-RegularItalic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Heavy.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Display';
  src: url('../assets/fonts/sf-pro/SF-Pro-Display-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* SF Pro Text — for type < 20px */
@font-face {
  font-family: 'SF Pro Text';
  src: url('../assets/fonts/sf-pro/SF-Pro-Text-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Text';
  src: url('../assets/fonts/sf-pro/SF-Pro-Text-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Text';
  src: url('../assets/fonts/sf-pro/SF-Pro-Text-RegularItalic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Text';
  src: url('../assets/fonts/sf-pro/SF-Pro-Text-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Text';
  src: url('../assets/fonts/sf-pro/SF-Pro-Text-MediumItalic.otf') format('opentype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Text';
  src: url('../assets/fonts/sf-pro/SF-Pro-Text-Semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Text';
  src: url('../assets/fonts/sf-pro/SF-Pro-Text-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* SF Pro Rounded — for pills, badges, CTAs, tags */
@font-face {
  font-family: 'SF Pro Rounded';
  src: url('../assets/fonts/sf-pro/SF-Pro-Rounded-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Rounded';
  src: url('../assets/fonts/sf-pro/SF-Pro-Rounded-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Rounded';
  src: url('../assets/fonts/sf-pro/SF-Pro-Rounded-Semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Rounded';
  src: url('../assets/fonts/sf-pro/SF-Pro-Rounded-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF Pro Rounded';
  src: url('../assets/fonts/sf-pro/SF-Pro-Rounded-Heavy.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/* ============================================================
   APPLE TYPOGRAPHY SYSTEM — Usage Rules
   Matches apple.com exactly
   ============================================================ */

:root {
  /* Font stacks */
  --font-display:  'SF Pro Display', -apple-system, BlinkMacSystemFont, 
                   'Helvetica Neue', Arial, sans-serif;
  --font-text:     'SF Pro Text',    -apple-system, BlinkMacSystemFont, 
                   'Helvetica Neue', Arial, sans-serif;
  --font-rounded:  'SF Pro Rounded', -apple-system, BlinkMacSystemFont, 
                   'Helvetica Neue', Arial, sans-serif;

  /* Type scale — mirrors Apple.com exactly */
  --type-hero:        80px;   /* Hero headlines (index.html H1) */
  --type-display:     56px;   /* Section display headlines */
  --type-title-xl:    48px;   /* Large section titles */
  --type-title-lg:    40px;   /* Standard section titles */
  --type-title-md:    28px;   /* Sub-section titles */
  --type-title-sm:    21px;   /* Card titles, callouts */
  --type-body-lg:     19px;   /* Large body, intro paragraphs */
  --type-body:        17px;   /* Standard body copy */
  --type-body-sm:     15px;   /* Secondary body, descriptions */
  --type-label:       14px;   /* Nav links, tags, labels */
  --type-caption:     13px;   /* Captions, footnotes, metadata */
  --type-micro:       11px;   /* Legal, tiny labels */

  /* Letter spacing — Apple's optical values */
  --tracking-hero:     -0.005em;
  --tracking-display:  -0.003em;
  --tracking-title:    -0.002em;
  --tracking-body:      0em;
  --tracking-label:     0em;
  --tracking-caps:      0;  /* For uppercase labels */

  /* Line height */
  --leading-tight:   1.05;   /* Hero, display */
  --leading-snug:    1.2;    /* Titles */
  --leading-normal:  1.47;   /* Body text — Apple's exact value */
  --leading-relaxed: 1.6;    /* Long-form prose */
}

/* ============================================================
   GLOBAL BASE — Applied to everything
   ============================================================ */

*,
*::before,
*::after {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

html {
  font-family: var(--font-text);
  font-size: 17px;
  font-weight: 400;
  line-height: var(--leading-normal);
  color: #1d1d1f;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-text);
}

/* ============================================================
   APPLE TYPOGRAPHY RULES
   SF Pro Display for >= 20px
   SF Pro Text for < 20px
   This is Apple's exact internal rule
   ============================================================ */

/* Everything 20px and above uses Display */
h1, h2, h3,
.text-hero, .text-display,
[class*="text-[4"], [class*="text-[5"],
[class*="text-[6"], [class*="text-[7"],
[class*="text-[8"],
.font-hero-h1, .font-section-h2 {
  font-family: var(--font-display);
  letter-spacing: var(--tracking-display);
}

/* Everything below 20px uses Text */
h4, h5, h6,
p, li, a, span, label,
.text-body, .text-label, .text-caption,
nav a, footer a {
  font-family: var(--font-text);
}

/* Rounded for pills, badges, CTAs only */
.rounded-full,
button.rounded-full,
a.rounded-full,
[class*="pill"],
[class*="badge"],
[class*="tag"] {
  font-family: var(--font-rounded);
}

/* ============================================================
   SPECIFIC ELEMENT RULES — Matches Apple.com
   ============================================================ */

/* Hero headline (index.html "Worn. Screenless. Aware.") */
h1.hero-headline,
.font-hero-h1 {
  font-family: var(--font-display);
  font-size: var(--type-hero);
  font-weight: 700;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-hero);
}

/* Section display headlines */
h2.section-headline {
  font-family: var(--font-display);
  font-size: var(--type-display);
  font-weight: 700;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-display);
}

/* Nav wordmark "Aura" */
.nav-wordmark {
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -0.3px;
  line-height: 1;
}

/* Nav links */
nav a,
.nav-link {
  font-family: var(--font-text);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: var(--tracking-body);
}

/* CTA buttons (Build Yours, etc.) */
a.rounded-full,
button.rounded-full {
  font-family: var(--font-rounded);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
}

/* Body / article prose */
article p,
.prose p,
.text-body {
  font-family: var(--font-text);
  font-size: var(--type-body);
  line-height: var(--leading-normal);
  letter-spacing: var(--tracking-body);
}

/* Card titles */
.card-title,
h3 {
  font-family: var(--font-display);
  font-size: var(--type-title-sm);
  font-weight: 600;
  letter-spacing: var(--tracking-title);
}

/* Labels, captions, metadata */
.text-label,
figcaption,
caption,
.text-caption {
  font-family: var(--font-text);
  font-size: var(--type-label);
  font-weight: 400;
}

/* Footer links */
footer a {
  font-family: var(--font-text);
  font-size: var(--type-label);
  font-weight: 400;
}

/* Footer section headers */
footer h4 {
  font-family: var(--font-text);
  font-size: var(--type-caption);
  font-weight: 500;
  letter-spacing: 0;
}

/* Code / terminal blocks */
code, pre, .font-mono {
  font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
}

/* ============================================================
   REMOVE INTER — CRITICAL
   These rules override any remaining Inter references
   ============================================================ */

@import url('') ; /* This line intentionally blank — 
                     remove the Google Fonts Inter import 
                     from all HTML <head> tags instead */