/* ============================================================
   nxlearn.net -- Nexus Learning Hub
   ============================================================ */
:root {
  --nw-navy:        #0b1d3a;
  --nw-navy-mid:    #0f2548;
  --nw-blue:        #1d4ed8;
  --nw-blue-lt:     #2563eb;
  --nw-blue-br:     #3b82f6;
  --nw-blue-dark:   #1e40af;
  --nw-teal:        #0891b2;
  --nw-teal-br:     #06b6d4;

  --acc-teal-bg:    rgba(8,145,178,.08);
  --acc-teal-bd:    rgba(8,145,178,.25);
  --acc-orange-bg:  rgba(211,84,0,.07);
  --acc-orange-bd:  rgba(211,84,0,.22);
  --acc-emerald-bg: rgba(5,150,105,.07);
  --acc-emerald-bd: rgba(5,150,105,.22);

  --silver-50:  #fafbfc;
  --silver-100: #f4f6f8;
  --silver-200: #e8ecf0;
  --silver-300: #d1d9e0;
  --silver-400: #b4bfc9;
  --n600: #4b5563;
  --n700: #374151;
  --n800: #1f2937;
  --n900: #0f172a;

  --grad-primary: linear-gradient(135deg, #1d4ed8 0%, #0891b2 100%);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'DM Sans', -apple-system, sans-serif;
  background: var(--silver-50); color: var(--n700);
  line-height: 1.6; overflow-x: hidden;
}

.grain {
  position: fixed; inset: 0; pointer-events: none; z-index: 9999; opacity: .025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 256px 256px;
}
.container { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
.reveal.vis { opacity:1; transform:translateY(0); }
.stagger .reveal:nth-child(1) { transition-delay:0s; }
.stagger .reveal:nth-child(2) { transition-delay:.12s; }
.stagger .reveal:nth-child(3) { transition-delay:.24s; }
.stagger .reveal:nth-child(4) { transition-delay:.36s; }

/* ============================================================ HEADER */
.header {
  position:fixed; top:0; width:100%;
  background:rgba(11,29,58,.95); backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.07); z-index:1000;
  transition:box-shadow .3s, border-color .3s;
}
.header.scrolled { box-shadow:0 4px 24px rgba(0,0,0,.35); border-bottom-color:transparent; }
.header-inner { max-width:1160px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:12px 24px; }
.logo-wrap { display:flex; align-items:center; gap:13px; text-decoration:none; }
.logo-img { width:38px; height:38px; object-fit:contain; flex-shrink:0; }
.logo-name { font-family:'JetBrains Mono',monospace; font-size:.98rem; font-weight:700; color:white; letter-spacing:-.3px; display:block; }
.logo-sub { font-size:.68rem; color:rgba(255,255,255,.4); font-weight:400; }
nav { display:flex; align-items:center; gap:24px; }
nav a { color:rgba(255,255,255,.68); text-decoration:none; font-size:.88rem; font-weight:500; transition:color .2s; position:relative; }
nav a:hover { color:white; }
nav a::after { content:''; position:absolute; bottom:-3px; left:0; width:0; height:2px; background:var(--grad-primary); border-radius:2px; transition:width .3s; }
nav a:hover::after { width:100%; }
.nav-email::after, .nav-nw::after { display:none !important; }
.nav-nw { display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); padding:7px 14px; border-radius:8px; font-weight:600 !important; transition:background .2s, border-color .2s !important; }
.nav-nw:hover { background:rgba(255,255,255,.16) !important; border-color:rgba(255,255,255,.3) !important; }
.nav-nw svg { width:12px; height:12px; }
.hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.hamburger span { display:block; width:22px; height:2px; background:rgba(255,255,255,.8); border-radius:2px; transition:all .3s; }
.hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.hamburger.active span:nth-child(2) { opacity:0; }
.hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* ============================================================ HERO */
.hero {
  min-height:100vh; background:var(--nw-navy);
  display:flex; align-items:center; justify-content:center;
  text-align:center; padding:140px 24px 100px;
  position:relative; overflow:hidden;
}
.hero-wave-bg { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.hero-wave-svg {
  position:absolute; width:100%; height:100%;
  top:50%; left:50%; transform:translate(-50%,-50%);
  min-width:900px;
}
/* Frosted glass overlay -- the key effect */
.hero-glass {
  position:absolute; inset:0;
  background:rgba(11,29,58,.65);
  backdrop-filter:blur(8px) saturate(1.15);
  -webkit-backdrop-filter:blur(8px) saturate(1.15);
}
.hw { stroke-dasharray:1200; stroke-dashoffset:1200; }
.hw5 { animation:draw-stroke 2.4s cubic-bezier(.22,1,.36,1) .1s forwards; }
.hw4 { animation:draw-stroke 2.4s cubic-bezier(.22,1,.36,1) .28s forwards; }
.hw3 { animation:draw-stroke 2.4s cubic-bezier(.22,1,.36,1) .46s forwards; }
.hw2 { animation:draw-stroke 2.4s cubic-bezier(.22,1,.36,1) .64s forwards; }
.hw1 { animation:draw-stroke 2.4s cubic-bezier(.22,1,.36,1) .82s forwards; }
@keyframes draw-stroke { to { stroke-dashoffset:0; } }
.hero-dots { position:absolute; inset:0; pointer-events:none; z-index:1; background-image:radial-gradient(circle, rgba(77,143,212,.055) 1px, transparent 1px); background-size:38px 38px; }
.glow { position:absolute; border-radius:50%; pointer-events:none; filter:blur(100px); }
.glow-a { width:500px; height:500px; top:-80px; right:-60px; background:rgba(29,78,216,.11); animation:glow-breathe 10s ease-in-out infinite; z-index:1; }
.glow-b { width:380px; height:380px; bottom:-60px; left:-40px; background:rgba(8,145,178,.07); animation:glow-breathe 13s ease-in-out infinite 1.5s; z-index:1; }
@keyframes glow-breathe { 0%,100%{opacity:.4;transform:scale(1);}50%{opacity:.8;transform:scale(1.12);} }
.hero-content { position:relative; z-index:2; max-width:800px; }
.hero-eyebrow { display:inline-flex; align-items:center; gap:10px; color:rgba(255,255,255,.42); font-size:.8rem; font-weight:500; letter-spacing:1.2px; text-transform:uppercase; margin-bottom:28px; }
.eyebrow-dot { width:6px; height:6px; background:var(--nw-teal-br); border-radius:50%; animation:dot-pulse 2.5s ease-in-out infinite; }
@keyframes dot-pulse { 0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(6,182,212,.4);}50%{opacity:.5;box-shadow:0 0 0 5px rgba(6,182,212,0);} }
.hero-title { font-family:'Playfair Display',serif; font-size:clamp(3rem,7vw,5.5rem); font-weight:700; line-height:1.1; color:white; margin-bottom:28px; letter-spacing:-.5px; }
.hero-title em { font-style:italic; background:linear-gradient(135deg,var(--nw-blue-br) 0%,var(--nw-teal-br) 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-tagline { font-size:1.1rem; color:rgba(255,255,255,.58); line-height:1.8; max-width:620px; margin:0 auto 44px; font-weight:300; }
.hero-ctas { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.cta-primary { display:inline-flex; align-items:center; gap:10px; background:var(--grad-primary); color:white; padding:15px 30px; border-radius:10px; font-weight:700; font-size:1rem; text-decoration:none; box-shadow:0 6px 24px rgba(29,78,216,.4); transition:all .3s; }
.cta-primary svg { width:18px; height:18px; }
.cta-primary:hover { transform:translateY(-3px); box-shadow:0 10px 32px rgba(29,78,216,.55); }
.cta-secondary { display:inline-flex; align-items:center; gap:10px; background:transparent; color:rgba(255,255,255,.78); padding:15px 28px; border-radius:10px; font-weight:600; font-size:1rem; text-decoration:none; border:1.5px solid rgba(255,255,255,.2); transition:all .3s; }
.cta-secondary svg { width:16px; height:16px; transition:transform .3s; }
.cta-secondary:hover { color:white; border-color:rgba(255,255,255,.45); }
.cta-secondary:hover svg { transform:translateX(4px); }
.hero-scroll-hint { margin-top:60px; animation:scroll-bounce 2.5s ease-in-out infinite; }
.hero-scroll-hint svg { width:28px; height:28px; color:rgba(255,255,255,.2); }
@keyframes scroll-bounce { 0%,100%{transform:translateY(0);opacity:.3;}50%{transform:translateY(8px);opacity:.8;} }

/* ============================================================ SECTION COMMONS */
.section-kicker { display:inline-block; background:linear-gradient(135deg,rgba(29,78,216,.08),rgba(8,145,178,.12)); color:var(--nw-blue); font-size:.77rem; font-weight:700; text-transform:uppercase; letter-spacing:2.5px; padding:7px 18px; border-radius:50px; border:1.5px solid rgba(29,78,216,.2); margin-bottom:18px; }
.section-title { font-family:'Playfair Display',serif; font-size:clamp(2rem,4vw,3rem); font-weight:700; color:var(--n800); margin-bottom:18px; }
.section-lead { font-size:1.08rem; color:var(--n600); line-height:1.8; max-width:660px; margin:0 auto; }
.section-head { text-align:center; margin-bottom:60px; }

/* ============================================================ RESOURCES */
.resources-section { padding:120px 24px; background:linear-gradient(to bottom,white,var(--silver-50)); }
.resources-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:26px; }
.resource-card { border-radius:20px; border:1px solid var(--silver-200); background:white; position:relative; overflow:hidden; transition:transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s; }
.resource-card:hover { transform:translateY(-8px); }
.card-inner { padding:34px 30px 30px; display:flex; flex-direction:column; height:100%; }
.card-inner-muted { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; min-height:320px; }
.card-top { display:flex; align-items:center; gap:12px; margin-bottom:22px; flex-wrap:wrap; }
.card-status { display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:700; letter-spacing:.5px; padding:4px 11px; border-radius:50px; }
.status-dot { width:7px; height:7px; border-radius:50%; }
.status-live   { background:rgba(5,150,105,.1);   color:#065f46; border:1px solid rgba(5,150,105,.25); }
.status-live .status-dot { background:#10b981; animation:dot-pulse 2s infinite; }
.status-soon   { background:rgba(99,102,241,.08); color:#3730a3; border:1px solid rgba(99,102,241,.2); }
.status-soon .status-dot { background:#818cf8; }
.card-category { font-size:.75rem; color:var(--n600); font-weight:500; }
.card-icon { width:54px; height:54px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; transition:transform .3s; }
.resource-card:hover .card-icon { transform:translateY(-3px) scale(1.06); }
.card-icon svg { width:24px; height:24px; color:white; }
.card-icon-teal    { background:linear-gradient(135deg,#0891b2,#06b6d4); box-shadow:0 6px 18px rgba(8,145,178,.3); }
.card-icon-orange  { background:linear-gradient(135deg,#d35400,#e67e22); box-shadow:0 6px 18px rgba(211,84,0,.3); }
.card-icon-emerald { background:linear-gradient(135deg,#059669,#10b981); box-shadow:0 6px 18px rgba(5,150,105,.3); }
.card-title { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:var(--n800); line-height:1.2; margin-bottom:12px; }
.card-desc { font-size:.94rem; color:var(--n600); line-height:1.75; margin-bottom:18px; flex:1; }
.card-tags { list-style:none; display:flex; flex-wrap:wrap; gap:7px; margin-bottom:26px; }
.card-tags li { font-size:.77rem; font-weight:500; color:var(--n700); background:var(--silver-100); border:1px solid var(--silver-200); padding:4px 11px; border-radius:20px; transition:all .25s; }
.card-teal:hover .card-tags li    { border-color:var(--acc-teal-bd);    background:var(--acc-teal-bg); }
.card-orange:hover .card-tags li  { border-color:var(--acc-orange-bd);  background:var(--acc-orange-bg); }
.card-emerald:hover .card-tags li { border-color:var(--acc-emerald-bd); background:var(--acc-emerald-bg); }
.card-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:auto; }
.card-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; border-radius:9px; font-size:.88rem; font-weight:700; text-decoration:none; color:white; transition:all .3s; }
.card-btn svg { width:14px; height:14px; }
.card-btn-teal    { background:linear-gradient(135deg,#0891b2,#06b6d4); box-shadow:0 4px 14px rgba(8,145,178,.3); }
.card-btn-teal:hover    { transform:translateY(-2px); box-shadow:0 7px 20px rgba(8,145,178,.45); }
.card-btn-orange  { background:linear-gradient(135deg,#d35400,#e67e22); box-shadow:0 4px 14px rgba(211,84,0,.3); }
.card-btn-orange:hover  { transform:translateY(-2px); box-shadow:0 7px 20px rgba(211,84,0,.45); }
.card-btn-emerald { background:linear-gradient(135deg,#059669,#10b981); box-shadow:0 4px 14px rgba(5,150,105,.3); }
.card-btn-emerald:hover { transform:translateY(-2px); box-shadow:0 7px 20px rgba(5,150,105,.45); }
.card-btn-ghost { display:inline-flex; align-items:center; gap:7px; color:var(--n600); text-decoration:none; font-size:.86rem; font-weight:600; padding:10px 16px; border-radius:9px; border:1.5px solid var(--silver-300); transition:all .3s; }
.card-btn-ghost svg { width:14px; height:14px; }
.card-btn-ghost:hover { border-color:var(--nw-blue); color:var(--nw-blue); transform:translateY(-2px); }
.card-accent { position:absolute; top:0; left:0; width:100%; height:4px; transform:scaleX(0); transform-origin:left; transition:transform .4s cubic-bezier(.22,1,.36,1); }
.resource-card:hover .card-accent { transform:scaleX(1); }
.card-accent-teal    { background:linear-gradient(90deg,#0891b2,#06b6d4); }
.card-accent-orange  { background:linear-gradient(90deg,#d35400,#e67e22); }
.card-accent-emerald { background:linear-gradient(90deg,#059669,#10b981); }
.card-accent-muted   { background:var(--silver-300); }
.card-teal:hover    { box-shadow:0 20px 50px rgba(8,145,178,.14),  0 4px 12px rgba(0,0,0,.04); }
.card-orange:hover  { box-shadow:0 20px 50px rgba(211,84,0,.12),   0 4px 12px rgba(0,0,0,.04); }
.card-emerald:hover { box-shadow:0 20px 50px rgba(5,150,105,.12),  0 4px 12px rgba(0,0,0,.04); }
.card-muted:hover   { box-shadow:0 20px 50px rgba(0,0,0,.07),      0 4px 12px rgba(0,0,0,.04); }
.more-icon { width:60px; height:60px; border-radius:50%; background:var(--silver-100); border:2px dashed var(--silver-300); display:flex; align-items:center; justify-content:center; margin:0 auto 18px; }
.more-icon svg { width:26px; height:26px; color:var(--silver-400); }
.more-title { font-family:'Playfair Display',serif; font-size:1.35rem; font-weight:700; color:var(--n700); margin-bottom:12px; }
.more-desc { font-size:.92rem; color:var(--n600); line-height:1.7; margin-bottom:22px; }
.more-suggest { display:inline-flex; align-items:center; gap:7px; color:var(--nw-blue); text-decoration:none; font-weight:700; font-size:.88rem; transition:gap .2s; }
.more-suggest svg { width:14px; height:14px; }
.more-suggest:hover { gap:12px; }

/* ============================================================ FTC ECOSYSTEM */
.ecosystem-section { padding:120px 24px; background:var(--nw-navy); position:relative; overflow:hidden; }
.eco-grid-bg { position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(16,185,129,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(16,185,129,.03) 1px,transparent 1px); background-size:52px 52px; }
.eco-glow { position:absolute; border-radius:50%; pointer-events:none; filter:blur(90px); }
.eco-glow-a { width:420px; height:420px; top:-80px; right:-60px; background:rgba(251,191,36,.08); animation:glow-breathe 9s ease-in-out infinite; }
.eco-glow-b { width:360px; height:360px; bottom:-60px; left:-40px; background:rgba(34,211,238,.07); animation:glow-breathe 13s ease-in-out infinite 2s; }
.eco-kicker { background:rgba(251,191,36,.12) !important; color:#d97706 !important; border-color:rgba(251,191,36,.3) !important; }
.eco-title { color:white !important; }
.eco-lead { color:rgba(255,255,255,.58) !important; }
.eco-flow { display:flex; align-items:flex-start; gap:0; position:relative; z-index:1; }
.eco-tool { flex:1; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:18px; overflow:hidden; transition:all .3s; display:flex; flex-direction:column; }
.eco-tool:hover { background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.14); transform:translateY(-5px); box-shadow:0 16px 40px rgba(0,0,0,.4); }
.eco-tool-header { display:flex; align-items:center; gap:14px; padding:26px 24px 20px; border-bottom:1px solid rgba(255,255,255,.06); }
.eco-tool-icon { width:46px; height:46px; border-radius:12px; flex-shrink:0; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.3); }
.eco-tool-icon svg { width:22px; height:22px; color:white; }
.eco-icon-amber { background:linear-gradient(135deg,#d97706,#fbbf24); }
.eco-icon-green { background:linear-gradient(135deg,#059669,#10b981); }
.eco-icon-cyan  { background:linear-gradient(135deg,#0891b2,#22d3ee); }
.eco-tool-name { font-family:'DM Sans',sans-serif; font-size:1.12rem; font-weight:700; color:white; }
.eco-tool-sub  { font-size:.72rem; color:rgba(255,255,255,.42); font-family:'JetBrains Mono',monospace; }
.eco-tool-body { padding:22px 24px; flex:1; }
.eco-tool-body p { font-size:.88rem; color:rgba(255,255,255,.52); line-height:1.75; margin-bottom:18px; }
.eco-terminal { background:#060d1a; border:1px solid rgba(255,255,255,.06); border-radius:10px; overflow:hidden; margin-bottom:18px; }
.eco-term-bar { padding:8px 12px; background:rgba(255,255,255,.03); border-bottom:1px solid rgba(255,255,255,.05); }
.eco-dots { display:flex; gap:5px; }
.eco-dots span { width:8px; height:8px; border-radius:50%; }
.eco-dots span:nth-child(1){background:#ff5f57;} .eco-dots span:nth-child(2){background:#febc2e;} .eco-dots span:nth-child(3){background:#28c840;}
.eco-term-body { padding:14px 16px; font-family:'JetBrains Mono',monospace; font-size:.74rem; line-height:1.9; }
.ep { color:#34d399; font-weight:700; margin-right:8px; }
.ec { color:rgba(255,255,255,.85); }
.eo { display:block; padding-left:16px; }
.eg { color:#34d399; } .ec2 { color:#22d3ee; } .ea { color:#fbbf24; }
.eco-tags { list-style:none; display:flex; flex-wrap:wrap; gap:6px; }
.eco-tags li { font-size:.72rem; font-weight:500; color:rgba(255,255,255,.48); background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09); padding:3px 10px; border-radius:20px; }
.eco-tool-footer { padding:18px 24px; border-top:1px solid rgba(255,255,255,.06); display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.eco-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-radius:9px; font-size:.84rem; font-weight:700; text-decoration:none; color:white; transition:all .3s; }
.eco-btn svg { width:14px; height:14px; }
.eco-btn-amber { background:linear-gradient(135deg,#d97706,#fbbf24); box-shadow:0 4px 12px rgba(217,119,6,.3); }
.eco-btn-amber:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(217,119,6,.5); }
.eco-btn-green { background:linear-gradient(135deg,#059669,#10b981); box-shadow:0 4px 12px rgba(5,150,105,.3); }
.eco-btn-green:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(5,150,105,.5); }
.eco-btn-cyan  { background:linear-gradient(135deg,#0891b2,#22d3ee); box-shadow:0 4px 12px rgba(8,145,178,.3); }
.eco-btn-cyan:hover  { transform:translateY(-2px); box-shadow:0 6px 20px rgba(8,145,178,.5); }
.eco-version { font-family:'JetBrains Mono',monospace; font-size:.69rem; color:rgba(255,255,255,.28); }
.eco-btn-ghost-sm {
  color: rgba(255,255,255,.38); text-decoration: none;
  font-size: .75rem; font-weight: 600;
  font-family: 'JetBrains Mono', monospace;
  border: 1px solid rgba(255,255,255,.1);
  padding: 6px 12px; border-radius: 7px;
  transition: all .25s;
}
.eco-btn-ghost-sm:hover { color: rgba(255,255,255,.75); border-color: rgba(255,255,255,.22); }
.eco-connector { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:0 14px; flex-shrink:0; min-width:84px; }
.eco-conn-line { width:1px; height:40px; background:linear-gradient(to bottom,transparent,rgba(255,255,255,.14),transparent); }
.eco-conn-label { font-size:.65rem; color:rgba(255,255,255,.28); text-align:center; line-height:1.4; font-family:'JetBrains Mono',monospace; }
.eco-conn-arrow svg { width:20px; height:20px; color:rgba(255,255,255,.22); }
.eco-callout { margin-top:40px; display:flex; align-items:flex-start; gap:18px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:24px 28px; position:relative; z-index:1; }
.eco-callout-icon { width:36px; height:36px; flex-shrink:0; background:rgba(251,191,36,.12); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.eco-callout-icon svg { width:16px; height:16px; color:#fbbf24; }
.eco-callout-text { font-size:.9rem; color:rgba(255,255,255,.48); line-height:1.78; }
.eco-callout-text strong { color:rgba(255,255,255,.78); }

/* ============================================================ PHILOSOPHY */
.philosophy-section { padding:120px 24px; background:var(--nw-navy); position:relative; overflow:hidden; }
.philosophy-bg { position:absolute; inset:0; pointer-events:none; background-image:radial-gradient(circle,rgba(77,143,212,.04) 1px,transparent 1px); background-size:32px 32px; }
.phil-wave { position:absolute; bottom:0; right:0; width:65%; opacity:.35; pointer-events:none; }
.phil-inner { display:grid; grid-template-columns:140px 1fr; gap:60px; align-items:flex-start; position:relative; z-index:1; max-width:900px; margin:0 auto; }
.phil-logo-wrap { padding-top:8px; }
.phil-logo-img { width:120px; height:120px; object-fit:contain; }
.kicker-light { background:rgba(255,255,255,.08) !important; color:rgba(255,255,255,.62) !important; border-color:rgba(255,255,255,.14) !important; }
.phil-title { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.6rem); font-weight:700; color:white; line-height:1.2; margin-bottom:20px; }
.phil-text p { font-size:.98rem; color:rgba(255,255,255,.56); line-height:1.8; margin-bottom:16px; }
.phil-text p:last-of-type { margin-bottom:28px; }
.phil-link { display:inline-flex; align-items:center; gap:8px; color:var(--nw-teal-br); text-decoration:none; font-weight:700; font-size:.93rem; transition:gap .2s; }
.phil-link svg { width:14px; height:14px; }
.phil-link:hover { gap:13px; }

/* ============================================================ ENS SECTION */
.ens-section { padding:100px 24px; background:linear-gradient(160deg,#e8eef6 0%,#f0f5fb 40%,#e4ecf5 100%); position:relative; overflow:hidden; }
.ens-section::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle,rgba(29,78,216,.05) 1px,transparent 1px); background-size:30px 30px; pointer-events:none; }
.ens-inner { display:grid; grid-template-columns:1fr 420px; gap:64px; align-items:center; position:relative; z-index:1; }
.ens-kicker { display:inline-block; font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:2.5px; color:#1d4ed8; background:rgba(29,78,216,.1); border:1.5px solid rgba(29,78,216,.2); padding:5px 14px; border-radius:50px; margin-bottom:16px; }
.ens-title { font-family:'Playfair Display',serif; font-size:clamp(2rem,3.5vw,2.8rem); font-weight:700; color:#0b1d3a; line-height:1.15; margin-bottom:16px; }
.ens-lead { font-size:1.05rem; color:#374151; line-height:1.8; margin-bottom:14px; }
.ens-lead strong { color:#0b1d3a; }
.ens-body { font-size:.95rem; color:#4b5563; line-height:1.8; margin-bottom:24px; }
.ens-topics { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px; }
.ens-topics span { font-size:.78rem; font-weight:600; color:#374151; background:rgba(29,78,216,.07); border:1.5px solid rgba(29,78,216,.14); padding:5px 13px; border-radius:20px; transition:all .25s; }
.ens-topics span:hover { background:rgba(29,78,216,.14); border-color:rgba(29,78,216,.3); color:#1d4ed8; }
.ens-btn { display:inline-flex; align-items:center; gap:9px; background:linear-gradient(135deg,#1d4ed8,#0891b2); color:white; text-decoration:none; padding:13px 26px; border-radius:10px; font-weight:700; font-size:.95rem; box-shadow:0 6px 20px rgba(29,78,216,.3); transition:all .3s; }
.ens-btn svg { width:14px; height:14px; }
.ens-btn:hover { transform:translateY(-3px); box-shadow:0 10px 30px rgba(29,78,216,.4); }
.ens-card-wrap { perspective:1000px; }
.ens-card { background:white; border-radius:18px; border:1.5px solid rgba(29,78,216,.12); box-shadow:0 16px 48px rgba(11,29,58,.12),0 4px 16px rgba(11,29,58,.06); overflow:hidden; transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s; }
.ens-card:hover { transform:translateY(-6px) rotateX(1deg); box-shadow:0 24px 60px rgba(11,29,58,.18),0 6px 20px rgba(11,29,58,.08); }
.ens-card-header { display:flex; align-items:center; gap:14px; padding:22px 24px 18px; background:linear-gradient(135deg,#0b1d3a,#1d4ed8); border-bottom:1px solid rgba(255,255,255,.08); }
.ens-bolt { font-size:1.4rem; line-height:1; background:rgba(255,255,255,.12); border-radius:10px; width:40px; height:40px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ens-card-title { font-family:'Playfair Display',serif; font-size:1.05rem; font-weight:700; color:white; }
.ens-card-sub   { font-family:'JetBrains Mono',monospace; font-size:.68rem; color:rgba(255,255,255,.45); margin-top:2px; }
.ens-card-sections { padding:12px 0; }
.ens-sec-link { display:flex; align-items:center; gap:12px; padding:11px 24px; text-decoration:none; font-size:.9rem; font-weight:500; color:#374151; border-bottom:1px solid #f0f4f8; transition:all .2s; }
.ens-sec-link:last-child { border-bottom:none; }
.ens-sec-link:hover { background:rgba(29,78,216,.05); color:#1d4ed8; padding-left:30px; }
.ens-sec-icon { font-size:1rem; flex-shrink:0; width:22px; text-align:center; }
.ens-card-footer { display:flex; align-items:center; justify-content:space-between; padding:14px 24px; background:#f8fafc; border-top:1px solid #e8ecf0; }
.ens-card-tag { font-family:'JetBrains Mono',monospace; font-size:.7rem; color:#6b7280; }
.ens-ws-link { font-size:.78rem; font-weight:600; color:#1d4ed8; text-decoration:none; transition:color .2s; }
.ens-ws-link:hover { color:#0891b2; }
@media(max-width:1000px) { .ens-inner { grid-template-columns:1fr; gap:36px; } }
@media(max-width:768px) { .ens-section { padding:72px 24px; } }

/* ============================================================ FOOTER */
.footer { background:var(--n900); color:rgba(255,255,255,.42); padding:60px 24px 28px; position:relative; }
.footer-grad-line { position:absolute; top:0; left:0; width:100%; height:1px; background:linear-gradient(90deg,transparent,#2563eb,#06b6d4,transparent); }
.footer-grid { max-width:1160px; margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; margin-bottom:44px; }
.footer-brand { display:flex; flex-direction:column; gap:11px; }
.footer-logo-img { width:54px; height:54px; object-fit:contain; }
.footer-tagline { font-weight:700; color:var(--nw-blue-lt); font-size:.92rem; }
.footer-mission { color:rgba(255,255,255,.36); font-size:.87rem; line-height:1.6; }
.footer-email { display:inline-flex; align-items:center; gap:7px; color:var(--nw-teal-br); text-decoration:none; font-weight:500; font-size:.87rem; margin-top:4px; transition:color .2s; }
.footer-email svg { width:14px; height:14px; }
.footer-email:hover { color:white; }
.footer-links-col h4, .footer-info-col h4 { font-size:.93rem; font-weight:700; color:white; margin-bottom:14px; }
.footer-links-col ul { list-style:none; display:flex; flex-direction:column; gap:9px; }
.footer-links-col a { color:rgba(255,255,255,.4); text-decoration:none; font-size:.87rem; transition:color .2s; position:relative; }
.footer-links-col a::after { content:''; position:absolute; bottom:-2px; left:0; width:0; height:1px; background:var(--nw-blue-lt); transition:width .3s; }
.footer-links-col a:hover { color:rgba(255,255,255,.88); }
.footer-links-col a:hover::after { width:100%; }
.footer-info-col p { font-size:.84rem; color:rgba(255,255,255,.36); line-height:1.7; margin-bottom:7px; }
.footer-email-sm { display:inline-flex; align-items:center; gap:7px; color:var(--nw-teal-br); text-decoration:none; font-size:.84rem; font-weight:500; margin-top:8px; transition:color .2s; }
.footer-email-sm svg { width:13px; height:13px; }
.footer-email-sm:hover { color:white; }
.footer-bottom { max-width:1160px; margin:0 auto; padding-top:24px; border-top:1px solid rgba(255,255,255,.07); font-size:.79rem; color:rgba(255,255,255,.26); display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.heart { width:13px; height:13px; vertical-align:middle; }

/* ============================================================ RESPONSIVE */
@media (max-width:1000px) {
  .eco-flow { flex-direction:column; }
  .eco-connector { flex-direction:row; padding:12px 0; min-width:auto; width:100%; }
  .eco-conn-line { width:60px; height:1px; }
  .phil-inner { grid-template-columns:1fr; gap:32px; }
  .phil-logo-img { width:80px; height:80px; }
}
@media (max-width:900px) {
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1 / -1; }
}
@media (max-width:768px) {
  nav { display:none; }
  nav.open { display:flex; flex-direction:column; gap:0; position:fixed; inset:0; background:#0b1d3a; z-index:1001; padding:100px 32px 40px; }
  nav.open a { font-size:1.3rem; padding:15px 0; border-bottom:1px solid rgba(255,255,255,.07); color:rgba(255,255,255,.78); }
  nav.open .nav-nw { margin-top:16px; justify-content:center; }
  .header.nav-is-open { background:#0b1d3a; backdrop-filter:none; z-index:1002; }
  .hamburger { display:flex; z-index:1001; position:relative; }
  .resources-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; gap:28px; }
  .footer-brand { grid-column:auto; }
}
@media (max-width:480px) {
  .hero-title { font-size:2.6rem; }
  .hero-ctas { flex-direction:column; align-items:stretch; }
  .cta-primary, .cta-secondary { justify-content:center; }
  .card-actions { flex-direction:column; }
  .card-btn, .card-btn-ghost { justify-content:center; }
  .eco-callout { flex-direction:column; }
}