/*
Theme Name: CA Swapan Pradhan
Theme URI: https://caswapanpradhan.com
Author: Amiya Bera
Author URI: https://caswapanpradhan.com
Description: Premium Swiss-Style WordPress theme for CA Swapan Pradhan — ICAI Chartered Accountant & Finance Educator, Kolkata. Dual-audience professional site covering tax consulting for Eastern India and finance tutoring in South Kolkata.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
License: Private — All Rights Reserved
Text Domain: caswapanpradhan
*/

/* ============================================================
   DESIGN TOKENS — Single source of truth
   ============================================================ */
:root {
  /* Colours */
  --ink:        #0D0D0F;
  --parchment:  #F5F2EC;
  --mist:       #ECEAE4;
  --gold:       #C9A84C;
  --gold-dim:   #8B6914;
  --gold-pale:  #F0DFA0;
  --gold-glow:  rgba(201,168,76,0.15);
  --slate:      #111827;
  --slate-mid:  #1F2937;
  --mid:        #6B6560;
  --light:      #A8A39D;
  --rule:       #DDD9D2;
  --rule-dark:  rgba(255,255,255,0.09);
  --white:      #FFFFFF;

  /* Typography */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Inter', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  /* Layout */
  --container: 1360px;
  --gutter:    64px;
  --header-h:  76px;
  --section-v: 128px;
  --section-sm: 80px;

  /* Easing */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ── RESET ──────────────────────────────────────────────────── */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  background: var(--parchment);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  cursor: auto; /* Default cursor — JS activates custom cursor on mouse move */
}

img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { cursor: pointer; font-family: inherit; }
input, select, textarea { font-family: inherit; }

/* ── UTILITY ────────────────────────────────────────────────── */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap;
}
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  width: 100%;
}
.section { padding: var(--section-v) 0; }
.section-sm { padding: var(--section-sm) 0; }
.section-dark { background: var(--slate); }
.section-mist { background: var(--mist); }

/* ── TYPOGRAPHY SYSTEM ──────────────────────────────────────── */
.t-eyebrow {
  font-family: var(--font-mono);
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold);
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 28px;
}
.t-eyebrow::before {
  content: ''; display: block; width: 40px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold));
  flex-shrink: 0;
  transform: scaleX(0); transform-origin: right;
  transition: transform 1s var(--ease-out);
}
.t-eyebrow.line-ready::before { transform: scaleX(1); }

.t-hero {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(52px, 7.5vw, 108px);
  line-height: 0.93; letter-spacing: -0.025em;
  color: var(--white);
}
.t-hero em { font-style: italic; color: var(--gold); }

.t-section {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(36px, 4.5vw, 68px);
  line-height: 1.04; letter-spacing: -0.02em;
}
.t-section em { font-style: italic; color: var(--gold); }
.t-section-dark { color: var(--white); }

.t-sub {
  font-family: var(--font-body); font-weight: 300;
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.75; color: var(--mid);
}
.t-sub-light { color: rgba(255,255,255,0.52); }

/* ── REVEAL ANIMATIONS ──────────────────────────────────────── */
.reveal {
  opacity: 0; transform: translateY(48px);
  transition: opacity 1s var(--ease-out), transform 1s var(--ease-out);
  will-change: opacity, transform;
}
.reveal.visible { opacity: 1; transform: translateY(0); will-change: auto; }
.reveal-left { opacity: 0; transform: translateX(-56px);
  transition: opacity 1s var(--ease-out), transform 1s var(--ease-out); }
.reveal-left.visible { opacity: 1; transform: translateX(0); will-change: auto; }
.reveal-right { opacity: 0; transform: translateX(56px);
  transition: opacity 1s var(--ease-out), transform 1s var(--ease-out); }
.reveal-right.visible { opacity: 1; transform: translateX(0); will-change: auto; }

.stagger > *:nth-child(1) { transition-delay: 0.05s; }
.stagger > *:nth-child(2) { transition-delay: 0.15s; }
.stagger > *:nth-child(3) { transition-delay: 0.25s; }
.stagger > *:nth-child(4) { transition-delay: 0.35s; }
.stagger > *:nth-child(5) { transition-delay: 0.45s; }
.stagger > *:nth-child(6) { transition-delay: 0.55s; }
.stagger > *:nth-child(7) { transition-delay: 0.65s; }
.stagger > *:nth-child(8) { transition-delay: 0.75s; }
.stagger > *:nth-child(9) { transition-delay: 0.85s; }

/* ── KEYFRAME ANIMATIONS ────────────────────────────────────── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; } to { opacity: 1; }
}
@keyframes lineReveal {
  from { transform: translateY(110%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.35; transform: scale(0.65); }
}
@keyframes scrollLine {
  0%, 100% { transform: scaleY(0); transform-origin: top; }
  50%       { transform: scaleY(1); transform-origin: top; }
}

/* ── ACCESSIBILITY ──────────────────────────────────────────── */
*:focus { outline: none; }
*:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}
a:focus-visible, button:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
  border-radius: 1px;
}

/* ── PRINT ──────────────────────────────────────────────────── */
@media print {
  .site-nav, .wa-sticky, .cursor-dot, .cursor-ring,
  .scroll-progress { display: none !important; }
  body { background: white !important; color: black !important; }
}

/* ── REDUCED MOTION ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .reveal, .reveal-left, .reveal-right { opacity: 1; transform: none; }
}
