/* =============================
   TOKENS
   ============================= */
   :root {

    --red: #ff6a00;
    --red-bright: #ff8a2a;
    --red-glow: #ff7a18;
    --red-dark: #b94a00;
    --red-dim: rgba(255, 106, 0, 0.15);
    --red-border: rgba(255, 106, 0, 0.30);
  
    --bg-primary: #d7d9dd;
    --bg-secondary: #cfd2d7;
    --bg-card: rgba(255, 255, 255, 0.30);
    --bg-glass: rgba(255, 255, 255, 0.55);
    --bg-glass-hover: rgba(255, 255, 255, 0.70);
  
    --text-primary: #0f1115;
    --text-secondary: rgba(15,17,21,0.72);
    --text-dim: rgba(15,17,21,0.52);
  
    --border: rgba(15,17,21,0.18);
    --border-hover: rgba(255,106,0,0.55);
  
    --container: 1160px;
  
    --radius-lg: 0px;
    --radius-md: 0px;
    --radius-sm: 0px;
  
    --shadow-lg: none;
    --shadow-red: none;
  
    --font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-mono: "JetBrains Mono", "Fira Code", "SF Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  
    --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  
  /* =============================
     BASE / RESET
     ============================= */
  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body {
    margin: 0;
    font-family: var(--font-sans);
    background: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.65;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
  }
  
  h1, h2, h3 {
    margin: 0 0 0.75rem;
    line-height: 1.15;
    letter-spacing: -0.02em;
  }
  h1 {
    font-size: clamp(2.1rem, 4.6vw, 3.2rem);
    text-shadow: none;
  }
  h2 {
    font-size: 1.35rem;
  }
  h3 {
    font-size: 1.05rem;
  }
  p { margin: 0 0 1rem; color: var(--text-secondary); }
  ul { color: var(--text-secondary); }
  
  img { max-width: 100%; display: block; }
  a { color: inherit; }
  
  ::selection { background: var(--red); color: #fff; }
  
  body::before,
  body::after {
    content: none;
  }
  
  :focus-visible {
    outline: none;
    box-shadow: none;
    border-radius: 0;
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    * { transition: none; animation: none; }
  }
  
  /* =============================
     LIGHT MODE OVERRIDES (readability)
     Some components still had hardcoded light text from the old dark theme.
     ============================= */
  
  nav { border-bottom-color: rgba(15,17,21,0.12); }
  
  .section-header h2 { color: rgba(15,17,21,0.88); }
  
  .page-hero-label {
    color: rgba(15,17,21,0.78);
    border-color: rgba(15,17,21,0.18);
    background: rgba(255,255,255,0.35);
  }
  
  .writeup-tag,
  .featured-tag {
    border-color: rgba(15,17,21,0.18);
    background: rgba(255,255,255,0.35);
    color: rgba(15,17,21,0.72);
  }
  
  .container {
    width: 92%;
    max-width: var(--container);
    margin: 0 auto;
  }
  .content { padding: 3.25rem 0 4.25rem; }
  
  .section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 1.35rem;
  }
  .section-header h2 {
    margin: 0;
    font-size: 1.2rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-family: var(--font-mono);
    color: rgba(232, 232, 240, 0.92);
  }
  .section-line {
    height: 1px;
    flex: 1;
    background: none;
    opacity: 0.9;
  }
  .section-link {
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 0.78rem;
    color: rgba(232, 232, 240, 0.72);
    text-decoration: none;
  }
  .section-link:hover { color: rgba(255, 106, 0, 0.92); }
  
  /* =============================
     SHIFT5-LIKE BOXED FEEL (site-wide)
     - stronger dividers
     - flatter surfaces (less glow/shadow)
     ============================= */
  
  body::before { opacity: 0.38; }
  body::after { opacity: 0.70; }
  
  :root {
    --panel-bg: rgba(255, 255, 255, 0.02);
    --panel-bg-strong: rgba(255, 255, 255, 0.035);
    --panel-border: var(--border);
    --panel-border-strong: rgba(245,245,245,0.16);
  }
  
  .stat-block,
  .expertise-card,
  .featured-card,
  .writeup-card,
  .page-hero-stat,
  .pt1-info-card,
  .cert-featured-card,
  .bugbounty-stats .stat-item,
  .ecosystem-card,
  .process-step,
  .term-card,
  .starting-step,
  .rules-section,
  .severity-level,
  .disclosure-card,
  .bb-reputation-card,
  .vulnerability-card,
  .owasp-card,
  .writeup-header,
  .writeup-section,
  
  .page-hero,
  .hero,
  .lp-hero {
    border-bottom: 1px solid var(--panel-border);
  }
  
  .writeups-grid,
  .featured-grid,
  .expertise-grid,
  .bugbounty-stats,
  .ecosystem-grid,
  .terminology-grid,
  .starting-steps,
  .rules-content,
  .disclosure-content,
  .vulnerability-grid,
  .owasp-grid,
  .bb-reputation-grid,
  .pt1-info-grid {
    gap: 0;
    border: 1px solid var(--panel-border);
  }
  
  .writeups-grid > *,
  .featured-grid > *,
  .expertise-grid > *,
  .bugbounty-stats > *,
  .ecosystem-grid > *,
  .terminology-grid > *,
  .starting-steps > *,
  .rules-content > *,
  .disclosure-content > *,
  .vulnerability-grid > *,
  .owasp-grid > *,
  .bb-reputation-grid > *,
  .pt1-info-grid > * {
    border-left: 1px solid var(--panel-border);
    border-top: 1px solid var(--panel-border);
  }
  
  .writeups-grid,
  .featured-grid,
  .expertise-grid,
  .bugbounty-stats,
  .ecosystem-grid,
  .terminology-grid,
  .starting-steps,
  .rules-content,
  .disclosure-content,
  .vulnerability-grid,
  .owasp-grid,
  .bb-reputation-grid,
  .pt1-info-grid {
    margin-left: -1px;
    margin-top: -1px;
  }
  
  .expertise-card:hover,
  .featured-card:hover,
  .writeup-card:hover,
  .contact-card:hover {
    transform: none;
    border-color: var(--panel-border-strong);
  }
  
  .btn-primary,
  .btn-ghost,
  .lp-btn {
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    border: 1px solid var(--panel-border-strong);
  }
  .btn-primary:hover,
  .btn-ghost:hover,
  .lp-btn:hover {
    box-shadow: none;
    border-color: rgba(255,106,0,0.65);
  }
  
  .writeup-tag,
  .featured-tag,
  .lp-chip,
  .lp-state {
    border-radius: 0;
  }
  
  /* =============================
     LIGHT PAPER SECTIONS (Shift5-ish)
     Make content areas light while keeping the global dark chrome.
     ============================= */
  :root {
    --paper: #e9eaec;
    --paper-2: #dfe1e5;
    --paper-3: #d2d5db;
    --ink: #0f1115;
    --ink-2: rgba(15,17,21,0.72);
    --line: rgba(15,17,21,0.16);
    --line-strong: rgba(15,17,21,0.26);
  }
  
  .writeups-page-container,
  .writeup-container,
  .container .content {
    background: var(--paper);
    color: var(--ink);
    border: 1px solid var(--line);
    padding-left: clamp(0px, 0vw, 0px);
  }
  
  .writeups-page-container h1,
  .writeups-page-container h2,
  .writeups-page-container h3,
  .writeup-container h1,
  .writeup-container h2,
  .writeup-container h3,
  .container .content h1,
  .container .content h2,
  .container .content h3 {
    color: var(--ink);
    text-shadow: none;
  }
  .writeups-page-container p,
  .writeup-container p,
  .container .content p,
  .writeups-page-container ul,
  .writeup-container ul,
  .container .content ul {
    color: var(--ink-2);
  }
  
  .writeups-page-container .writeup-card,
  .writeups-page-container .cert-featured-card,
  .writeups-page-container .page-hero-stat,
  .container .content .expertise-card,
  .container .content .featured-card,
  .container .content .terminal-window,
  .container .content section,
  .writeup-container .writeup-header,
  .writeup-container .writeup-section,
  .writeups-page-container .pt1-info-card,
  .writeups-page-container .bugbounty-stats .stat-item,
  .writeups-page-container .ecosystem-card,
  .writeups-page-container .process-step,
  .writeups-page-container .term-card,
  .writeups-page-container .starting-step,
  .writeups-page-container .rules-section,
  .writeups-page-container .severity-level,
  .writeups-page-container .disclosure-card,
  .writeups-page-container .bb-reputation-card,
  .writeups-page-container .vulnerability-card,
  .writeups-page-container .owasp-card {
    background: var(--paper-2);
    color: var(--ink);
    border-color: var(--line-strong);
  }
  
  .writeups-page-container .writeups-grid,
  .writeups-page-container .certs-featured-grid,
  .writeups-page-container .bugbounty-stats,
  .writeups-page-container .ecosystem-grid,
  .writeups-page-container .process-timeline,
  .writeups-page-container .terminology-grid,
  .writeups-page-container .starting-steps,
  .writeups-page-container .rules-content,
  .writeups-page-container .disclosure-content,
  .writeups-page-container .vulnerability-grid,
  .writeups-page-container .owasp-grid,
  .writeups-page-container .bb-reputation-grid,
  .writeups-page-container .pt1-info-grid {
    border-color: var(--line-strong);
  }
  .writeups-page-container .writeups-grid > *,
  .writeups-page-container .certs-featured-grid > *,
  .writeups-page-container .bugbounty-stats > *,
  .writeups-page-container .ecosystem-grid > *,
  .writeups-page-container .process-timeline > *,
  .writeups-page-container .terminology-grid > *,
  .writeups-page-container .starting-steps > *,
  .writeups-page-container .rules-content > *,
  .writeups-page-container .disclosure-content > *,
  .writeups-page-container .vulnerability-grid > *,
  .writeups-page-container .owasp-grid > *,
  .writeups-page-container .bb-reputation-grid > *,
  .writeups-page-container .pt1-info-grid > * {
    border-left-color: var(--line-strong);
    border-top-color: var(--line-strong);
  }
  
  .writeups-page-container .writeup-tag,
  .writeup-container .writeup-tag {
    border-color: rgba(15,17,21,0.22);
    background: rgba(15,17,21,0.06);
    color: rgba(15,17,21,0.72);
  }
  
  .writeups-page-container a,
  .writeup-container a,
  .container .content a {
    color: rgba(185, 74, 0, 0.95);
    border-bottom-color: rgba(185, 74, 0, 0.35);
  }
  .writeups-page-container a:hover,
  .writeup-container a:hover,
  .container .content a:hover {
    border-bottom-color: rgba(255, 106, 0, 0.75);
    text-shadow: none;
  }
  
  /* =============================
     NAV
     ============================= */
  nav {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 2rem;
    background: rgba(233,234,236,0.92);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }
  nav::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: rgba(255,106,0,0.35);
    opacity: 0.55;
  }
  .nav-brand a {
    font-family: var(--font-mono);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 800;
    text-decoration: none;
    font-size: 0.95rem;
  }
  nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 1.2rem;
    align-items: center;
  }
  nav ul a {
    font-family: var(--font-mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.78rem;
    text-decoration: none;
    color: rgba(15,17,21,0.70);
    padding: 0.55rem 0.65rem;
    border-radius: 0;
    transition: background 220ms var(--ease-out), color 220ms var(--ease-out);
  }
  nav ul a:hover {
    color: rgba(15,17,21,0.92);
    background: rgba(15,17,21,0.06);
  }
  
  .nav-toggle { display: none; }
  .nav-hamburger {
    display: none;
    flex-direction: column;
    gap: 6px;
    cursor: pointer;
    width: 28px;
    height: 28px;
    z-index: 51;
  }
  .nav-hamburger span {
    display: block;
    height: 2px;
    width: 100%;
    background: rgba(15,17,21,0.88);
    border-radius: 0;
    transition: transform 240ms var(--ease-out), opacity 240ms var(--ease-out), background 240ms var(--ease-out);
  }
  .nav-toggle:checked ~ .nav-hamburger span:nth-child(1) { transform: rotate(45deg) translate(6px, 6px); background: var(--red-bright); }
  .nav-toggle:checked ~ .nav-hamburger span:nth-child(2) { opacity: 0; }
  .nav-toggle:checked ~ .nav-hamburger span:nth-child(3) { transform: rotate(-45deg) translate(6px, -6px); background: var(--red-bright); }
  
  @media (max-width: 840px) {
    nav { padding: 0.85rem 1rem; }
    .nav-hamburger { display: flex; }
    nav ul {
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      display: none;
      flex-direction: column;
      gap: 0.35rem;
      padding: 0.85rem;
      background: rgba(233,234,236,0.98);
      border-bottom: 1px solid rgba(255,255,255,0.10);
      backdrop-filter: none;
    }
    .nav-toggle:checked ~ ul { display: flex; }
    nav ul a { width: 100%; }
  }
  
  /* =============================
     BUTTONS
     ============================= */
  .btn-primary,
  .btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 1.05rem 1.35rem;
    border-radius: 0;
    text-decoration: none;
    font-family: var(--font-mono);
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-size: 0.82rem;
    background: transparent;
    border: 1px solid var(--line-strong);
    box-shadow: none;
    transition: border-color 180ms var(--ease-out), color 180ms var(--ease-out), background 180ms var(--ease-out);
  }
  .btn-primary:hover,
  .btn-ghost:hover {
    border-color: rgba(255,106,0,0.65);
  }
  
  /* =============================
     HERO (index) — layout only (light canvas handled by paper tokens below)
     ============================= */
  .hero {
    position: relative;
    padding: 4.8rem 0 3.2rem;
    overflow: hidden;
    background: var(--paper);
    color: var(--ink);
    border-bottom: 1px solid var(--line);
  }
  .hero-content {
    width: 92%;
    max-width: var(--container);
    margin: 0 auto;
    position: relative;
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 2.2rem;
    align-items: center;
  }
  .hero-title {
    margin: 0.9rem 0 0.9rem;
    font-size: clamp(3.0rem, 5.8vw, 4.9rem);
    letter-spacing: -0.04em;
    line-height: 1.03;
  }
  .typed-prefix { color: rgba(255,106,0,0.92); font-family: var(--font-mono); }
  .typed-text { font-family: var(--font-mono); }
  .typed-cursor { opacity: 0.9; }
  .hero-actions { margin-top: 1.6rem; display: flex; gap: 1rem; flex-wrap: wrap; }
  
  .hero-image-wrapper { position: relative; }
  .hero-image-frame {
    border-radius: var(--radius-lg);
    padding: 10px;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
  }
  .hero-image-frame img {
    border-radius: 0;
    width: 100%;
    height: auto;
  }
  
  .hero-scroll-indicator {
    width: 92%;
    max-width: var(--container);
    margin: 1.9rem auto 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.8rem;
    font-family: var(--font-mono);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-size: 0.72rem;
    color: rgba(15,17,21,0.62);
  }
  .scroll-line {
    width: 84px;
    height: 1px;
    background: rgba(255,106,0,0.55);
    opacity: 0.75;
  }
  
  @media (max-width: 980px) {
    .hero-content { grid-template-columns: 1fr; }
  }
  
  /* =============================
     STATS BAR
     ============================= */
  .stats-bar {
    width: 92%;
    max-width: var(--container);
    margin: 0 auto;
  
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: 0;
  
    border-radius: 0;
    border: 1px solid var(--line);
    background: var(--paper);
    box-shadow: none;
  }
  
  .stats-bar .stat-block {
    padding: 1rem 0.9rem;
    text-align: center;
    border: 0;
    background: transparent;
  }
  
  .stats-bar .stat-number {
    display: block;
    font-family: var(--font-mono);
    font-weight: 900;
    letter-spacing: 0.08em;
    font-size: 1.35rem;
    color: rgba(255,106,0,0.95);
  }
  
  .stats-bar .stat-label {
    display: block;
    margin-top: 0.35rem;
    font-family: var(--font-mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.72rem;
    color: rgba(15,17,21,0.62);
  }
  
  .stats-bar .stat-cert-link {
    display: inline-block;
    max-width: 100%;
  }
  
  .stats-bar .stat-cert-image {
    display: block;
    width: auto;
    max-width: 100%;
    height: 9rem;
    margin: 0 auto;
  }
  
  @media (max-width: 860px) {
    .stats-bar .stat-cert-image {
      height: 7rem;
    }
  }
  
  .stat-divider {
    width: 1px;
    background: var(--line-strong);
  }
  
  @media (max-width: 860px) {
    .stats-bar {
      grid-template-columns: repeat(3, 1fr);
    }
    .stat-divider {
      display: none;
    }
  }
  
  /* =============================
     EXPERTISE
     ============================= */
  .expertise-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.1rem;
  }
  .expertise-card {
    border-radius: 0;
    padding: 1.35rem 1.25rem;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
    transition: border-color 180ms var(--ease-out), background 180ms var(--ease-out);
  }
  .expertise-card:hover {
    border-color: rgba(255,106,0,0.42);
  }
  .expertise-icon { color: rgba(255,106,0,0.90); font-size: 1.25rem; }
  .expertise-card h3 { margin: 0.75rem 0 0.55rem; }
  .expertise-card p { margin: 0; color: var(--ink-2); }
  .expertise-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1.0rem;
  }
  .expertise-tags span {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.35rem 0.6rem;
    border-radius: 0;
    border: 1px solid var(--line);
    background: rgba(255,255,255,0.35);
    color: rgba(15,17,21,0.74);
  }
  @media (max-width: 980px) {
    .expertise-grid { grid-template-columns: 1fr; }
  }
  
  /* =============================
     TERMINAL (index) — styled as paper, not dark glass
     ============================= */
  .terminal-window {
    border-radius: 0;
    overflow: hidden;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
  }
  .terminal-dots { display: inline-flex; gap: 0.45rem; }
  .dot { width: 10px; height: 10px; border-radius: 0; display: inline-block; }
  .dot-red { background: rgba(255,106,0,0.95); }
  .dot-yellow { background: rgba(15,17,21,0.35); }
  .dot-green { background: rgba(15,17,21,0.22); }
  .terminal-title { font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.10em; color: rgba(15,17,21,0.62); }
  .terminal-body { padding: 1rem; font-family: var(--font-mono); font-size: 0.86rem; color: rgba(15,17,21,0.72); }
  .terminal-prompt,
  .terminal-cursor { color: rgba(255,106,0,0.95); }
  .terminal-category { color: rgba(15,17,21,0.88); }
  .terminal-cmd,
  .terminal-output { color: rgba(15,17,21,0.72); }
  
  /* =============================
     FEATURED
     ============================= */
  .featured-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.1rem;
  }
  .featured-card {
    display: block;
    text-decoration: none;
    border-radius: 0;
    padding: 1.2rem 1.15rem;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
    transition: border-color 180ms var(--ease-out), background 180ms var(--ease-out);
  }
  .featured-card:hover {
    border-color: rgba(255,106,0,0.42);
  }
  .featured-tag {
    display: inline-block;
    font-family: var(--font-mono);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-size: 0.72rem;
    padding: 0.35rem 0.6rem;
    border-radius: 0;
    background: rgba(255,106,0,0.12);
    border: 1px solid rgba(255,106,0,0.26);
    color: rgba(255,106,0,0.92);
  }
  .featured-card h3 { margin: 0.85rem 0 0.55rem; }
  .featured-card p { margin: 0; color: var(--ink-2); }
  .featured-read {
    display: inline-block;
    margin-top: 0.85rem;
    font-family: var(--font-mono);
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(15,17,21,0.62);
  }
  .featured-card:hover .featured-read { color: rgba(255,106,0,0.92); }
  @media (max-width: 980px) {
    .featured-grid { grid-template-columns: 1fr; }
  }
  
  /* =============================
     CONTACT + FOOTER (index)
     ============================= */
  .about-section p,
  .contact-section p {
    color: rgba(15,17,21,0.76);
  }
  
  .contact-grid {
    display: grid;
    gap: 1rem;
  }
  .contact-grid-2 { grid-template-columns: repeat(2, 1fr); }
  .contact-card {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    padding: 1.15rem 1.1rem;
    border-radius: 0;
    text-decoration: none;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
    transition: border-color 180ms var(--ease-out), background 180ms var(--ease-out);
  }
  .contact-card:hover {
    border-color: rgba(255,106,0,0.42);
  }
  .contact-card i { color: rgba(255,106,0,0.95); font-size: 1.25rem; }
  .contact-handle {
    font-family: var(--font-mono);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-size: 0.82rem;
    color: rgba(15,17,21,0.70);
  }
  @media (max-width: 860px) {
    .contact-grid-2 { grid-template-columns: 1fr; }
  }
  
  footer {
    width: 92%;
    max-width: var(--container);
    margin: 2.8rem auto 2.2rem;
    padding: 1.25rem 1.1rem;
    border-radius: 0;
    border: 1px solid var(--line);
    background: var(--paper);
  }
  .social-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem 1.2rem;
    align-items: center;
    justify-content: center;
  }
  .social-links a {
    text-decoration: none;
    font-family: var(--font-mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.74rem;
    color: rgba(15,17,21,0.62);
    padding: 0.45rem 0.6rem;
    border-radius: 0;
  }
  .social-links a:hover {
    color: rgba(15,17,21,0.92);
    background: rgba(15,17,21,0.06);
  }
  /* =============================
     WRITEUPS GRID + CARDS (writeups/pt1/certs)
     ============================= */
  .writeups-page-container {
    width: 92%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 2.6rem 0 4.0rem;
  }
  .writeups-grid,
  .writeup-grid,
  .writeup-cards,
  .writeup-list,
  .writeups-list,
  .writeup-list-grid,
  .writeup-cards-grid,
  .writeups-cards-grid,
  .writeups-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.1rem;
  }
  .writeup-card {
    display: block;
    text-decoration: none;
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.2rem;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper-2);
    box-shadow: none;
    transition: transform 260ms var(--ease-out), border-color 260ms var(--ease-out), box-shadow 260ms var(--ease-out);
    position: relative;
  }
  .writeup-card:hover {
    transform: none;
    border-color: rgba(255, 106, 0, 0.42);
    box-shadow: none;
  }
  .writeup-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
  }
  .writeup-card-arrow {
    color: rgba(15,17,21,0.55);
    transition: transform 240ms var(--ease-out), color 240ms var(--ease-out);
  }
  .writeup-card:hover .writeup-card-arrow {
    transform: translateX(3px);
    color: rgba(255,106,0,0.92);
  }
  .writeup-card h3 { margin: 0.35rem 0 0.6rem; }
  .writeup-card p {
    margin: 0;
    color: var(--ink-2);
  }
  .writeup-card-meta {
    margin-top: 0.95rem;
    color: rgba(15,17,21,0.70);
    font-family: var(--font-mono);
    font-size: 0.78rem;
    letter-spacing: 0.02em;
  }
  
  .writeup-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--font-mono);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-size: 0.72rem;
    padding: 0.35rem 0.6rem;
    border-radius: 0;
    border: 1px solid rgba(255,255,255,0.14);
    background: var(--paper);
    color: rgba(15,17,21,0.74);
  }
  .tag-cve,
  .tag-ad,
  .tag-dfir,
  .tag-web,
  .tag-cloud,
  .tag-redteam,
  .tag-blue,
  .tag-network,
  .tag-osint,
  .tag-malware,
  .tag-tools,
  .tag-dev,
  .tag-ctf,
  .tag-pt1-room {
    border-color: rgba(255,106,0,0.26);
    background: rgba(255,106,0,0.10);
    color: rgba(255,106,0,0.92);
  }
  
  @media (max-width: 980px) {
    .writeups-grid { grid-template-columns: 1fr; }
  }
  
  .writeups-grid--press .writeup-card,
  .writeups-grid--press .writeup-card::before,
  .writeups-grid--press .writeup-card::after {
    border-radius: 0;
  }
  .writeups-grid--press .writeup-tag { border-radius: 0; }
  .writeups-grid--press .writeup-card {
    border-left: none;
    border-top: none;
  }
  .writeups-grid--press {
    border: 1px solid rgba(255,255,255,0.10);
  }
  .writeups-grid--press > a.writeup-card {
    box-shadow: none;
  }
  
  .writeups-grid--press > a.writeup-card:hover {
    transform: none;
    border-color: rgba(255,106,0,0.28);
  }
  
  .writeups-grid--press {
    grid-template-columns: repeat(4, 1fr);
    grid-auto-flow: dense;
  }
  
  .writeups-grid--press > a.writeup-card { grid-column: span 2; }
  
  .writeups-grid--press > a.writeup-card--featured {
    grid-column: 1 / span 2;
    grid-row: span 2;
    min-height: 460px;
    padding: 1.35rem 1.25rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 0.9rem;
    overflow: hidden;
  }
  .writeups-grid--press > a.writeup-card--featured::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(15,17,21,0.04);
    pointer-events: none;
  }
  .writeups-grid--press > a.writeup-card--featured::after { content: none; }
  .writeups-grid--press > a.writeup-card--featured .writeup-card-top {
    position: absolute;
    top: 1.1rem;
    left: 1.1rem;
    right: 1.1rem;
    z-index: 2;
  }
  .writeups-grid--press > a.writeup-card--featured h3 {
    font-size: clamp(1.6rem, 2.6vw, 2.05rem);
    margin: 0;
    color: rgba(15,17,21,0.96);
    text-shadow: none;
    z-index: 2;
  }
  .writeups-grid--press > a.writeup-card--featured p {
    margin: 0;
    color: rgba(15,17,21,0.78);
    z-index: 2;
  }
  .writeups-grid--press > a.writeup-card--featured .writeup-card-meta {
    margin-top: 0;
    z-index: 2;
    color: rgba(15,17,21,0.68);
  }
  
  .writeups-grid--press > a.writeup-card:nth-child(2),
  .writeups-grid--press > a.writeup-card:nth-child(3),
  .writeups-grid--press > a.writeup-card:nth-child(4),
  .writeups-grid--press > a.writeup-card:nth-child(5) {
    grid-column: span 1;
    padding: 1.05rem 1.0rem;
  }
  .writeups-grid--press > a.writeup-card:nth-child(2) h3,
  .writeups-grid--press > a.writeup-card:nth-child(3) h3,
  .writeups-grid--press > a.writeup-card:nth-child(4) h3,
  .writeups-grid--press > a.writeup-card:nth-child(5) h3 {
    font-size: 1.02rem;
  }
  
  .writeups-grid--press > a.writeup-card:nth-child(n+6) {
    grid-column: span 2;
  }
  
  @media (max-width: 1100px) {
    .writeups-grid--press { grid-template-columns: repeat(2, 1fr); }
    .writeups-grid--press > a.writeup-card { grid-column: span 1; }
    .writeups-grid--press > a.writeup-card--featured {
      grid-column: span 2;
      grid-row: auto;
      min-height: 360px;
    }
  }
  @media (max-width: 700px) {
    .writeups-grid--press { grid-template-columns: 1fr; }
    .writeups-grid--press > a.writeup-card,
    .writeups-grid--press > a.writeup-card--featured { grid-column: span 1; min-height: auto; }
    .writeups-grid--press > a.writeup-card--featured .writeup-card-top { position: static; }
  }
  
  /* =============================
     SINGLE WRITEUP PAGES (writeups/*.html)
     ============================= */
  .writeup-container {
    width: 92%;
    max-width: 860px;
    margin: 0 auto;
    padding: 2.6rem 0 4.0rem;
  }
  .writeup-header {
    border-radius: var(--radius-lg);
    padding: 1.35rem 1.25rem;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper);
    backdrop-filter: none;
    box-shadow: none;
    margin-bottom: 1.4rem;
  }
  .writeup-section {
    margin-top: 1.1rem;
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.25rem;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper-2);
    box-shadow: none;
  }
  
  .pt1-writeup-intro {
    font-size: 1.02rem;
    color: rgba(15,17,21,0.78);
  }
  .pt1-note {
    margin-top: 0.85rem;
    border-radius: 0;
    border: 1px solid rgba(255,255,255,0.14);
    background: var(--paper);
    padding: 0.85rem 0.95rem;
    position: relative;
    overflow: hidden;
  }
  .pt1-note::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: none;
    opacity: 0.8;
    filter: blur(10px);
    pointer-events: none;
  }
  .pt1-note p { margin: 0; color: rgba(15,17,21,0.78); }
  
  pre {
    margin: 0.85rem 0;
    padding: 0.95rem 1.0rem;
    border-radius: 0;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper-2);
    overflow: auto;
    font-family: var(--font-mono);
    font-size: 0.86rem;
    color: rgba(15,17,21,0.82);
  }
  code {
    font-family: var(--font-mono);
    font-size: 0.92em;
    color: rgba(255,106,0,0.90);
  }
  
  .note {
    margin-top: 0.85rem;
    border-radius: 0;
    border: 1px solid rgba(255,106,0,0.28);
    background: rgba(255,106,0,0.10);
    padding: 0.85rem 0.95rem;
    position: relative;
  }
  .note::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 0;
    pointer-events: none;
    background: none;
    opacity: 0.9;
  }
  .note p { margin: 0; color: rgba(15,17,21,0.84); }
  
  .writeup-section {
    position: relative;
    overflow: hidden;
  }
  .writeup-section::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: none;
    opacity: 0.55;
    transform: translateX(-28%);
  }
  .writeup-section:hover {
    border-color: rgba(255,106,0,0.32);
    box-shadow: none;
  }
  .writeup-section h2 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }
  
  .writeup-container a {
    color: rgba(255,106,0,0.92);
    text-decoration: none;
    border-bottom: 1px solid rgba(255,106,0,0.28);
  }
  
  .writeup-container strong {
    color: rgba(15,17,21,0.92);
  }
  
  .writeup-container blockquote {
    margin: 1rem 0;
    padding: 0.9rem 1rem;
    border-left: 3px solid rgba(255,106,0,0.55);
    border-radius: 0;
    background: var(--paper);
    color: rgba(15,17,21,0.76);
  }
  
  .writeup-container mark {
    background: rgba(255,106,0,0.16);
    color: rgba(15,17,21,0.92);
    padding: 0.05em 0.25em;
    border-radius: 6px;
    border: 1px solid rgba(255,106,0,0.22);
  }
  
  pre {
    position: relative;
    box-shadow: none;
  }
  pre::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: 0;
    background: none;
    opacity: 0.75;
    filter: blur(10px);
    pointer-events: none;
  }
  
  .writeup-container ul {
    padding-left: 1.15rem;
  }
  .writeup-container li {
    margin: 0.35rem 0;
  }
  
  /* =============================
     PT1 PROGRESS + SEARCH + INFO
     ============================= */
  
  .pt1-info-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.1rem;
    margin-top: 2.2rem;
  }
  .pt1-info-card {
    border-radius: var(--radius-lg);
    padding: 1.35rem 1.25rem;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper-2);
    box-shadow: none;
  }
  .pt1-info-icon { color: rgba(255,106,0,0.90); font-size: 1.25rem; }
  .pt1-info-card h3 { margin: 0.75rem 0 0.55rem; }
  .pt1-info-card ul { margin: 0.7rem 0 0; padding-left: 1.1rem; color: var(--ink-2); }
  @media (max-width: 980px) {
    .pt1-info-grid { grid-template-columns: 1fr; }
  }
  
  /* =============================
     CERTS FEATURED
     ============================= */
  .certs-featured-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.1rem;
    margin-bottom: 1.4rem;
  }
  .cert-featured-card {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 1rem;
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.2rem;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
  }
  .cert-featured-body {
    min-width: 0;
  }
  .cert-featured-body p {
    color: var(--ink-2);
  }
  .cert-featured-badge {
    width: 48px;
    height: 48px;
    border-radius: 0;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,106,0,0.26);
    background: rgba(255,106,0,0.10);
    color: rgba(255,106,0,0.92);
  }
  .cert-featured-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
  }
  .cert-date {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(15,17,21,0.62);
  }
  .cert-provider {
    display: inline-block;
    margin-top: 0.35rem;
    font-family: var(--font-mono);
    font-size: 0.74rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(15,17,21,0.66);
  }
  .cert-link {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 0.9rem;
    text-decoration: none;
    font-family: var(--font-mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.72rem;
    color: rgba(15,17,21,0.70);
  }
  .cert-link:hover { color: rgba(255,106,0,0.92); }
  @media (max-width: 980px) {
    .certs-featured-grid { grid-template-columns: 1fr; }
  }
  
  /* =============================
     BUG BOUNTY (Shift5-like light canvas)
     ============================= */
  .bb-intro-text {
    color: var(--ink-2);
    max-width: 90ch;
  }
  .bugbounty-stats {
    margin-top: 1.4rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.1rem;
  }
  
  .bugbounty-stats .stat-item,
  .ecosystem-card,
  .process-step,
  .term-card,
  .starting-step,
  .rules-section,
  .severity-level {
    border-radius: var(--radius-lg);
    padding: 1.2rem 1.1rem;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
  }
  
  .bugbounty-stats h3 { margin: 0 0 0.35rem; color: rgba(255,106,0,0.92); font-family: var(--font-mono); letter-spacing: 0.06em; }
  .bugbounty-stats p { margin: 0; color: rgba(15,17,21,0.74); }
  .ecosystem-grid,
  .process-timeline,
  .terminology-grid,
  .starting-steps,
  .rules-content {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.1rem;
  }
  .terminology-grid { grid-template-columns: repeat(3, 1fr); }
  .process-timeline { grid-template-columns: repeat(5, 1fr); }
  .rules-content { grid-template-columns: repeat(3, 1fr); }
  .researcher-benefits {
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.2rem;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper);
  }
  .bb-icon { color: rgba(255,106,0,0.92); }
  .step-number {
    width: 34px;
    height: 34px;
    border-radius: 0;
    display: grid;
    place-items: center;
    background: rgba(255,106,0,0.10);
    border: 1px solid rgba(255,106,0,0.26);
    color: rgba(255,106,0,0.92);
    font-family: var(--font-mono);
    font-weight: 900;
  }
  @media (max-width: 1100px) {
    .process-timeline { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 980px) {
    .bugbounty-stats,
    .ecosystem-grid,
    .terminology-grid,
    .starting-steps,
    .rules-content { grid-template-columns: 1fr; }
  }
  
  .disclosure-content,
  .bb-reputation-grid,
  .vulnerability-grid,
  .owasp-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.1rem;
  }
  .bb-reputation-grid { grid-template-columns: repeat(2, 1fr); }
  .vulnerability-grid { grid-template-columns: repeat(3, 1fr); }
  .owasp-grid { grid-template-columns: repeat(2, 1fr); }
  
  .disclosure-card,
  .bb-reputation-card,
  .vulnerability-card,
  .owasp-card {
    border-radius: var(--radius-lg);
    padding: 1.2rem 1.1rem;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
  }
  .owasp-num {
    display: inline-block;
    font-family: var(--font-mono);
    font-weight: 900;
    letter-spacing: 0.16em;
    color: rgba(255,106,0,0.92);
    background: rgba(255,106,0,0.10);
    border: 1px solid rgba(255,106,0,0.26);
    border-radius: 0;
    padding: 0.28rem 0.55rem;
    font-size: 0.72rem;
    margin-bottom: 0.6rem;
  }
  .severity-scale {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.1rem;
  }
  
  @media (max-width: 1100px) {
    .severity-scale { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 980px) {
    .disclosure-content,
    .bb-reputation-grid,
    .vulnerability-grid,
    .owasp-grid,
    .severity-scale { grid-template-columns: 1fr; }
  }
  
  .terminal-section { margin-top: 2.2rem; }
  .terminal-line { display: flex; gap: 0.6rem; flex-wrap: wrap; }
  .terminal-cmd { color: rgba(15,17,21,0.88); }
  .terminal-output { margin-top: 0.65rem; color: rgba(15,17,21,0.74); }
  .terminal-cursor { color: rgba(255,106,0,0.88); }
  
  /* =============================
     LANDING PAGE — full migration from landing.css (scoped via lp-* classes)
     ============================= */
  
  body.lp {
    --lp-bg: #07070c;
    --lp-ink: #eef0ff;
    --lp-dim: rgba(238, 240, 255, 0.72);
    --lp-dimmer: rgba(238, 240, 255, 0.50);
  
    --lp-red: #ff8a2a;
    --lp-red2: #ff6a00;
    --lp-red-dim: rgba(255, 106, 0, 0.16);
    --lp-border: rgba(255, 255, 255, 0.12);
    --lp-border-strong: rgba(255, 106, 0, 0.42);
  
    --lp-glass: rgba(255, 255, 255, 0.05);
    --lp-glass2: rgba(255, 255, 255, 0.02);
  
    --lp-radius: 0px;
    --lp-radius-sm: 0px;
  
    --lp-shadow: 0 32px 130px rgba(0, 0, 0, 0.58);
    --lp-shadow-red: 0 42px 160px rgba(255, 106, 0, 0.22);
  
    color: var(--lp-ink);
  }
  
  body.lp .writeups-page-container,
  body.lp .page-hero {
    width: 100%;
    max-width: none;
    margin: 0;
  }
  
  .lp-shell {
    width: 92%;
    max-width: 1160px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }
  
  .lp-hero {
    position: relative;
    padding: 5.2rem 0 3.4rem;
    overflow: hidden;
  }
  
  .lp-hero-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 2.2rem;
    align-items: start;
  }
  
  .lp-kicker {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 1rem;
  }
  
  .lp-kicker-badge {
    font-family: var(--font-mono);
    font-size: 0.76rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 0.45rem 0.9rem;
    border-radius: 0;
    border: 1px solid rgba(255,255,255,0.14);
    background: rgba(255,255,255,0.35);
  }
  
  .lp-kicker-sub {
    font-family: var(--font-mono);
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--lp-dimmer);
  }
  
  .lp-kicker-dot { color: rgba(255,255,255,0.35); }
  
  .lp-title {
    margin: 0 0 0.9rem;
    font-size: clamp(3.0rem, 5.8vw, 4.9rem);
    letter-spacing: -0.04em;
    line-height: 1.03;
    text-shadow: none;
  }
  
  .lp-subtitle {
    margin: 0;
    max-width: 72ch;
    font-size: 1.12rem;
    color: var(--lp-dim);
  }
  
  .lp-hero-cta {
    margin-top: 1.6rem;
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
  }
  
  .lp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 1.05rem 1.35rem;
    border-radius: 0;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.20);
    background: rgba(255,255,255,0.35);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    position: relative;
    overflow: hidden;
    cursor: pointer;
  }
  
  .lp-btn span {
    font-family: var(--font-mono);
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-size: 0.82rem;
  }
  
  .lp-btn::before { content: none; }
  
  .lp-btn:hover {
    transform: none;
    border-color: rgba(255, 106, 0, 0.62);
    box-shadow: none;
  }
  
  .lp-btn-primary {
    border-color: rgba(255, 106, 0, 0.72);
    background: none;
    box-shadow: none;
  }
  
  .lp-btn-ghost {
    background: var(--paper-2);
  }
  
  .lp-trust {
    margin-top: 1.5rem;
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
  }
  
  .lp-trust-item {
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.035);
    border-radius: 0;
    padding: 0.85rem 1rem;
    min-width: 150px;
  }
  
  .lp-trust-num {
    font-family: var(--font-mono);
    font-weight: 900;
    font-size: 1.35rem;
    letter-spacing: 0.08em;
  }
  
  .lp-trust-label {
    margin-left: 0.5rem;
    font-family: var(--font-mono);
    color: var(--lp-dimmer);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.72rem;
  }
  
  .lp-important {
    margin-top: 1.25rem;
    border: 1px solid rgba(255, 106, 0, 0.55);
    background: rgba(255, 106, 0, 0.10);
    border-radius: var(--lp-radius-sm);
    padding: 0.95rem 1.1rem;
    color: var(--ink-2);
  }
  
  .lp-important strong { color: #fff; }
  
  .lp-panel {
    border: 1px solid rgba(255,255,255,0.12);
    background: var(--paper-2);
    border-radius: var(--lp-radius);
    padding: 1.25rem;
    box-shadow: none;
  }
  
  .lp-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.9rem;
  }
  
  .lp-panel-title {
    font-family: var(--font-mono);
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-size: 0.82rem;
    color: var(--ink-2);
  }
  
  .lp-panel-pulse {
    width: 10px;
    height: 10px;
    border-radius: 0;
    background: var(--lp-red);
    box-shadow: none;
    animation: lpPulse 1.6s ease-in-out infinite;
  }
  
  @keyframes lpPulse {
    0%,100% { transform: scale(1); opacity: 0.75; }
    50% { transform: scale(1.25); opacity: 1; }
  }
  
  .lp-panel-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  .lp-panel-list li {
    display: grid;
    grid-template-columns: 38px 1fr auto;
    align-items: center;
    gap: 0.8rem;
    padding: 0.7rem 0.6rem;
    border-radius: 0;
    border: 1px solid transparent;
    transition: all 0.25s ease;
  }
  
  .lp-panel-list li:hover {
    border-color: rgba(255,106,0,0.26);
    background: var(--paper);
  }
  
  .lp-idx {
    font-family: var(--font-mono);
    color: rgba(15,17,21,0.62);
    letter-spacing: 0.12em;
  }
  
  .lp-state {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255,106,0,0.90);
    background: rgba(255,106,0,0.10);
    border: 1px solid rgba(255,106,0,0.22);
    padding: 0.25rem 0.5rem;
    border-radius: 0;
  }
  
  .lp-panel-foot {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255,255,255,0.10);
    align-items: center;
  }
  
  .lp-mono {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(15,17,21,0.62);
  }
  
  .lp-chip {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.25rem 0.55rem;
    border-radius: 0;
    border: 1px solid rgba(255,255,255,0.12);
    background: var(--paper);
    color: rgba(15,17,21,0.62);
  }
  
  .lp-matrix {
    margin-top: 1rem;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper-2);
    border-radius: var(--lp-radius);
    padding: 1rem;
    box-shadow: none;
  }
  
  .lp-matrix-line {
    font-family: var(--font-mono);
    font-size: 0.78rem;
    letter-spacing: 0.18em;
    color: rgba(15,17,21,0.62);
    line-height: 1.6;
  }
  
  .lp-section {
    padding: 4.5rem 0;
    position: relative;
  }
  
  .lp-section-alt {
    background: var(--paper);
  }
  
  .lp-section-head {
    margin-bottom: 2rem;
  }
  
  .lp-section-head h2 {
    margin: 0;
    font-size: 2.2rem;
    letter-spacing: -0.03em;
  }
  
  .lp-section-head p {
    margin: 0.6rem 0 0;
    color: var(--lp-dim);
    font-size: 1.05rem;
  }
  
  .lp-offer {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 1.4rem;
    align-items: start;
  }
  
  .lp-offer-main {
    border: 1px solid rgba(255,255,255,0.12);
    background: none;
    border-radius: var(--lp-radius);
    padding: 2rem;
    box-shadow: none;
  }
  
  .lp-offer-tag {
    font-family: var(--font-mono);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-size: 0.76rem;
    display: inline-block;
    padding: 0.4rem 0.75rem;
    border-radius: 0;
    border: 1px solid rgba(255,106,0,0.30);
    background: rgba(255,106,0,0.10);
    color: rgba(255,106,0,0.95);
  }
  
  .lp-offer-main h3 {
    margin: 1.1rem 0 0.6rem;
    font-size: 3.0rem;
    letter-spacing: -0.02em;
  }
  
  .lp-offer-muted {
    font-size: 1.1rem;
    color: rgba(15,17,21,0.62);
    margin-left: 0.4rem;
  }
  
  .lp-offer-lead {
    margin: 0;
    font-size: 1.05rem;
    color: var(--lp-dim);
  }
  
  .lp-bullets {
    margin-top: 1.3rem;
    display: grid;
    gap: 0.7rem;
  }
  
  .lp-bullet {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-weight: 600;
    color: var(--ink-2);
  }
  
  .lp-bullet i { color: rgba(255,106,0,0.95); }
  
  .lp-offer-cta {
    margin-top: 1.6rem;
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
  }
  
  .lp-offer-side {
    display: grid;
    gap: 1.2rem;
  }
  
  .lp-card {
    border: 1px solid rgba(255,255,255,0.12);
    background: var(--paper-2);
    border-radius: var(--lp-radius);
    padding: 1.35rem;
    box-shadow: none;
  }
  
  .lp-card-title {
    font-family: var(--font-mono);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 900;
    font-size: 0.8rem;
    color: var(--ink-2);
    margin-bottom: 0.7rem;
  }
  
  .lp-card p { margin: 0; color: var(--lp-dim); }
  
  .lp-mini {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.45rem 0.8rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255,255,255,0.10);
  }
  
  .lp-mini-k {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink-2);
  }
  
  .lp-mini-v {
    font-weight: 700;
    color: var(--ink-2);
  }
  
  .lp-note-mini {
    margin-top: 0.85rem;
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-2);
  }
  
  .lp-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.3rem;
  }
  
  .lp-feature {
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    border-radius: 0;
    padding: 1.9rem;
    box-shadow: none;
    transition: border-color 180ms var(--ease-out), background 180ms var(--ease-out);
  }
  
  .lp-feature:hover {
    transform: none;
    border-color: rgba(255, 106, 0, 0.35);
    box-shadow: none;
  }
  
  .lp-feature-ico {
    width: 60px;
    height: 60px;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,106,0,0.26);
    background: rgba(255, 106, 0, 0.10);
    box-shadow: none;
    color: rgba(255,106,0,0.95);
    margin-bottom: 1.1rem;
  }
  
  .lp-feature h3 {
    margin: 0 0 0.7rem;
    font-size: 1.55rem;
    letter-spacing: -0.02em;
  }
  
  .lp-feature p {
    margin: 0;
    color: var(--lp-dim);
    font-size: 1.03rem;
  }
  
  .lp-feature ul {
    margin: 1rem 0 0;
    padding-left: 1.1rem;
  }
  
  .lp-feature li {
    margin: 0.4rem 0;
    color: var(--ink-2);
    font-size: 1.02rem;
  }
  
  .lp-contact-grid {
    display: grid;
    grid-template-columns: 1fr 0.9fr;
    gap: 1.4rem;
    align-items: start;
  }
  
  .lp-form {
    border: 1px solid rgba(255,255,255,0.12);
    background: none;
    border-radius: var(--lp-radius);
    padding: 1.7rem;
    box-shadow: none;
  }
  
  .lp-form-row { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; }
  
  .lp-label {
    font-family: var(--font-mono);
    font-size: 0.82rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ink-2);
  }
  
  .lp-input {
    border-radius: 0;
    border: 1px solid rgba(255,255,255,0.14);
    background: rgba(255,255,255,0.05);
    color: var(--ink-2);
    padding: 1.05rem 1.1rem;
    font-size: 1.05rem;
    outline: none;
    transition: box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
  }
  
  .lp-input::placeholder { color: var(--ink-2); }
  
  .lp-input:focus {
    border-color: rgba(255,106,0,0.78);
    background: rgba(255,255,255,0.06);
    box-shadow: none;
  }
  
  .lp-textarea { min-height: 180px; resize: vertical; line-height: 1.65; }
  
  .lp-help {
    margin: 0.9rem 0 0;
    font-family: var(--font-mono);
    font-size: 0.78rem;
    letter-spacing: 0.10em;
    color: var(--ink-2);
  }
  
  .lp-pay-card .lp-code {
    margin: 0.8rem 0 0;
    border: 1px solid rgba(255,255,255,0.10);
    background: var(--paper-2);
    border-radius: 0;
    padding: 1rem;
    overflow-x: auto;
  }
  
  .lp-pay-card code {
    font-family: var(--font-mono);
    font-size: 0.95rem;
    letter-spacing: 0.02em;
    color: rgba(15,17,21,0.62);
  }
  
  @media (max-width: 1020px) {
    .lp-hero-grid { grid-template-columns: 1fr; }
    .lp-offer { grid-template-columns: 1fr; }
    .lp-features { grid-template-columns: 1fr; }
    .lp-contact-grid { grid-template-columns: 1fr; }
  }
  
  @media (max-width: 560px) {
    .lp-title { font-size: 2.6rem; }
    .lp-btn { width: 100%; }
  }
  
  /* =============================
     CLEAN FLAT OVERRIDES (Shift5 1:1-ish)
     Remove gradients, glows, scanlines, blur, heavy effects.
     ============================= */
  
  nav,
  .btn-primary,
  .btn-ghost,
  .lp-btn,
  .stat-block,
  .expertise-card,
  .featured-card {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  
  .hero-grid-overlay,
  .lp-hero::before,
  .lp-hero::after,
  .writeup-section::after,
  .note::before,
  .pt1-note::before,
  pre::before {
    display: none;
  }
  
  .stat-block,
  .expertise-card,
  .featured-card,
  .writeup-card,
  .page-hero-stat,
  .pt1-info-card,
  .cert-featured-card,
  .bugbounty-stats .stat-item,
  .ecosystem-card,
  .process-step,
  .term-card,
  .starting-step,
  .rules-section,
  .severity-level,
  .disclosure-card,
  .bb-reputation-card,
  .vulnerability-card,
  .owasp-card,
  .writeup-header,
  .writeup-section {
    background-image: none;
    box-shadow: none;
  }
  
  .hero-title,
  .page-hero-title,
  .lp-title,
  h1 {
    text-shadow: none;
  }
  
  .terminal-window {
    background: #0f1115;
    border-color: rgba(245,245,245,0.14);
  }
  .terminal-header {
    background: rgba(245,245,245,0.06);
    border-bottom-color: rgba(245,245,245,0.12);
  }
  
  .btn-primary,
  .btn-ghost,
  .lp-btn {
    background-image: none;
  }
  .btn-primary::before,
  .lp-btn::before {
    display: none;
  }
  
  .writeups-page-container .writeup-card,
  .writeups-page-container .cert-featured-card,
  .writeups-page-container .page-hero-stat,
  .writeup-container .writeup-header,
  .writeup-container .writeup-section,
  .container .content section {
    background: var(--paper-2);
  }
  
  /* =============================
     LIGHT CANVAS — INK ENFORCEMENT (fix unreadable white-on-light)
     Root cause: old dark-theme component rules hardcoded light text and were
     defined after the paper overrides, so they won the cascade.
     ============================= */
  
  .writeups-page-container,
  .writeup-container,
  .container .content {
    color: var(--ink);
  }
  
  .writeups-page-container h1,
  .writeups-page-container h2,
  .writeups-page-container h3,
  .writeup-container h1,
  .writeup-container h2,
  .writeup-container h3,
  .container .content h1,
  .container .content h2,
  .container .content h3 {
    color: var(--ink);
  }
  
  .writeups-page-container p,
  .writeups-page-container ul,
  .writeups-page-container li,
  .writeup-container p,
  .writeup-container ul,
  .writeup-container li,
  .container .content p,
  .container .content ul,
  .container .content li {
    color: var(--ink-2);
  }
  
  .writeups-page-container .writeup-card h3,
  .writeups-page-container .writeup-card p,
  .writeups-page-container .writeup-card-meta,
  .writeups-page-container .writeup-card-arrow,
  .writeups-page-container .featured-read,
  .writeups-page-container .cert-provider,
  .writeups-page-container .cert-date,
  .writeups-page-container .cert-link,
  .writeups-page-container .page-hero-subtitle,
  .writeups-page-container .page-hero-label,
  .writeups-page-container .page-hero-title,
  .writeups-page-container .page-hero-stat-label,
  .container .content .expertise-card p,
  .container .content .expertise-tags span,
  .container .content .featured-card p,
  .container .content .featured-read,
  .container .content .contact-handle,
  .container .content .social-links a,
  .writeup-container .writeup-meta {
    color: var(--ink-2);
  }
  
  .writeups-page-container .stat-number,
  .writeups-page-container .page-hero-stat-num {
    color: rgba(255,106,0,0.95);
  }
  
  .page-hero {
    position: relative;
    padding: 3.6rem 0 2.4rem;
    overflow: hidden;
    background: var(--paper);
    color: var(--ink);
    border-bottom: 1px solid var(--line);
  }
  
  .page-hero-content {
    width: 92%;
    max-width: var(--container);
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }
  
  .page-hero-label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-family: var(--font-mono);
    font-size: 0.76rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 0.45rem 0.9rem;
    border-radius: 0;
    border: 1px solid var(--line);
    background: rgba(255,255,255,0.35);
    color: rgba(15,17,21,0.72);
  }
  
  .page-hero-title {
    margin: 0.9rem 0 0.65rem;
    font-size: clamp(2.4rem, 4.8vw, 3.4rem);
    letter-spacing: -0.03em;
    color: var(--ink);
  }
  
  .page-hero-subtitle {
    margin: 0;
    max-width: 85ch;
    color: var(--ink-2);
  }
  
  .page-hero-stats {
    margin-top: 1.15rem;
    display: flex;
    gap: 0.9rem;
    flex-wrap: wrap;
  }
  .page-hero-stat {
    display: grid;
    gap: 0.1rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    border-radius: 0;
    min-width: 150px;
  }
  .page-hero-stat-num {
    font-family: var(--font-mono);
    letter-spacing: 0.08em;
    font-weight: 900;
    color: rgba(255,106,0,0.95);
  }
  .page-hero-stat-label {
    font-family: var(--font-mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.72rem;
    color: rgba(15,17,21,0.62);
  }
  
  @media (max-width: 840px) {
    .page-hero { padding: 2.8rem 0 1.9rem; }
    .page-hero-stat { min-width: 0; }
  }
  
  .container .content .expertise-tags span {
    border-color: var(--line);
    background: rgba(255,255,255,0.35);
  }
  
  .container .content .section-header h2,
  .writeups-page-container .section-header h2 {
    color: rgba(15,17,21,0.88);
  }
  
  /* =============================
     SINGLE PAGES (writeups/* + pt1/*)
     Clean Shift5-ish paper styling + orange accents.
     ============================= */
  
  .writeup-container {
    background: var(--paper);
    border: 1px solid var(--line);
  }
  
  .writeup-header,
  .writeup-section {
    background: var(--paper-2);
    border-color: var(--line-strong);
  }
  
  .writeup-meta {
    color: rgba(15,17,21,0.62);
  }
  
  .writeup-section h2 {
    color: rgba(15,17,21,0.85);
  }
  .writeup-section h2::after {
    background: rgba(15,17,21,0.12);
  }
  .writeup-section h3 {
    color: rgba(15,17,21,0.88);
  }
  
  .writeup-container a {
    color: rgba(185,74,0,0.95);
    border-bottom: 1px solid rgba(185,74,0,0.35);
  }
  .writeup-container a:hover {
    color: rgba(255,106,0,0.95);
    border-bottom-color: rgba(255,106,0,0.75);
  }
  
  .writeup-container code {
    color: rgba(185,74,0,0.95);
    background: rgba(255,106,0,0.08);
    border: 1px solid rgba(255,106,0,0.18);
    padding: 0.08em 0.28em;
  }
  
  .note,
  .pt1-note {
    background: rgba(255,255,255,0.45);
    border-color: rgba(255,106,0,0.45);
  }
  .note p,
  .pt1-note p {
    color: rgba(15,17,21,0.74);
  }
  
  .writeup-container pre {
    background: rgba(255,255,255,0.55);
    color: rgba(15,17,21,0.88);
    border: 1px solid var(--line-strong);
    box-shadow: none;
  }
  .writeup-container pre code {
    background: transparent;
    border: 0;
    padding: 0;
    color: inherit;
  }
  
  .writeup-container mark {
    background: rgba(255,106,0,0.18);
    border-color: rgba(255,106,0,0.32);
    color: rgba(15,17,21,0.92);
  }
  
  .pt1-writeup-intro {
    color: rgba(15,17,21,0.72);
  }
  
  /* =============================
     HOME + IMPRINT: CLEAN PAPER PASS
     - remove leftover dark-theme whites
     - kill gradients/shadows in these areas
     ============================= */
  
  .container .content {
    background: var(--paper);
    border: 1px solid var(--line);
  }
  
  .hero {
    background: var(--paper);
    color: var(--ink);
    border-bottom: 1px solid var(--line);
  }
  .hero-grid-overlay { display: none; }
  .hero-title,
  .hero-tagline,
  .hero-label,
  .typed-prefix,
  .typed-text,
  .typed-cursor {
    color: var(--ink);
    text-shadow: none;
  }
  .hero-accent { color: rgba(255,106,0,0.95); }
  .hero-tagline { color: var(--ink-2); }
  .hero-label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-family: var(--font-mono);
    font-size: 0.76rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 0.45rem 0.9rem;
    border-radius: 0;
    border: 1px solid var(--line);
    background: rgba(255,255,255,0.35);
    color: rgba(15,17,21,0.72);
  }
  
  .hero .btn-primary,
  .hero .btn-ghost {
    background: transparent;
    border-color: var(--line-strong);
    color: rgba(15,17,21,0.86);
  }
  
  .stats-bar {
    background: var(--paper);
    border-color: var(--line);
    box-shadow: none;
  }
  .stat-block {
    background: var(--paper-2);
    border-color: var(--line-strong);
  }
  .stat-number { color: rgba(255,106,0,0.95); }
  .stat-label { color: rgba(15,17,21,0.62); }
  
  .container .content .expertise-card,
  .container .content .featured-card,
  .container .content .contact-card,
  .container .content .terminal-window {
    background: var(--paper-2);
    border-color: var(--line-strong);
  }
  .container .content .expertise-card p,
  .container .content .featured-card p {
    color: var(--ink-2);
  }
  .container .content .section-line {
    background: rgba(15,17,21,0.10);
  }
  
  .contact-card { background: var(--paper-2); border-color: var(--line-strong); }
  
  footer { background: var(--paper); border-color: var(--line); }
  
  body .container .content section {
    margin-top: 1.1rem;
    padding: 1.25rem 1.25rem;
    border-radius: 0;
    border: 1px solid var(--line-strong);
    background: var(--paper-2);
    box-shadow: none;
  }
  body .container .content section::after { display: none; }
  
  .container .content .terminal-window {
    background: var(--paper-2);
    border-color: var(--line-strong);
  }
  .container .content .terminal-header {
    background: rgba(255,255,255,0.35);
    border-bottom-color: var(--line);
  }
  .container .content .terminal-title {
    color: rgba(15,17,21,0.62);
  }
  .container .content .terminal-body {
    color: rgba(15,17,21,0.72);
  }
  .container .content .terminal-category {
    color: rgba(15,17,21,0.88);
  }
  .container .content .terminal-prompt,
  .container .content .terminal-cursor {
    color: rgba(255,106,0,0.95);
  }
  .container .content .dot-red { background: rgba(255,106,0,0.95); }
  .container .content .dot-yellow { background: rgba(15,17,21,0.35); }
  .container .content .dot-green { background: rgba(15,17,21,0.22); }
  
  .container .content .terminal-cmd,
  .container .content .terminal-output {
    color: rgba(15,17,21,0.72);
  }
  .container .content .terminal-output .terminal-category {
    color: rgba(15,17,21,0.88);
  }
  
  /* =============================
     GREY CANVAS TUNING
     User wants the main content blocks to be grey-ish (not white).
     ============================= */
  :root {
  
    --paper: #d7d9dd;
    --paper-2: #cfd2d7;
    --paper-3: #c4c8cf;
  }
  
  .writeups-page-container,
  .writeup-container,
  .container .content {
    background: var(--paper);
  }
  
  .writeups-page-container .writeup-card,
  .writeups-page-container .cert-featured-card,
  .writeups-page-container .page-hero-stat,
  .writeups-page-container .pt1-info-card,
  .writeups-page-container .bugbounty-stats .stat-item,
  .writeups-page-container .ecosystem-card,
  .writeups-page-container .process-step,
  .writeups-page-container .term-card,
  .writeups-page-container .starting-step,
  .writeups-page-container .rules-section,
  .writeups-page-container .severity-level,
  .writeups-page-container .disclosure-card,
  .writeups-page-container .bb-reputation-card,
  .writeups-page-container .vulnerability-card,
  .writeups-page-container .owasp-card,
  .writeup-container .writeup-header,
  .writeup-container .writeup-section,
  .container .content section,
  .container .content .expertise-card,
  .container .content .featured-card,
  .container .content .contact-card,
  .container .content .terminal-window {
    background: var(--paper-2);
  }
  
  .writeups-page-container .writeup-card h3,
  .writeups-page-container .writeup-card-arrow {
    color: rgba(15,17,21,0.90);
  }
  
  .writeups-page-container .writeup-card p { color: rgba(15,17,21,0.88); }
  .writeups-page-container .writeup-card-meta { color: rgba(15,17,21,0.82); }
  .writeups-page-container .writeup-card:hover .writeup-card-arrow { color: rgba(255,106,0,0.95); }
  
  .writeups-page-container .writeup-tag {
    background: rgba(255,106,0,0.10);
    border-color: rgba(255,106,0,0.35);
    color: rgba(255,106,0,0.95);
  }
  
  /* =============================
     TERMINAL CATEGORY HIGHLIGHT
     Bring back highlighted [Category] labels.
     ============================= */
  .container .content .terminal-output .terminal-category {
    color: rgba(255,106,0,0.95);
    font-weight: 800;
  }
  
  .writeup-container strong,
  .writeup-container .note strong,
  .writeup-container .pt1-note strong,
  .writeup-container .note b,
  .writeup-container .pt1-note b {
    color: rgba(255,106,0,0.95);
    font-weight: 900;
  }
  
  .writeup-container .note strong,
  .writeup-container .pt1-note strong {
    letter-spacing: 0.01em;
  }
  
  /* =============================
     BUG BOUNTY — ORANGE ACCENT PASS
     ============================= */
  .writeups-page-container .bb-intro-text strong,
  .writeups-page-container .rules-content strong,
  .writeups-page-container .researcher-benefits strong,
  .writeups-page-container .process-step strong {
    color: rgba(255,106,0,0.95);
  }
  
  .writeups-page-container .ecosystem-card h3 i,
  .writeups-page-container .researcher-benefits h3 i,
  .writeups-page-container .rules-section h3 i,
  .writeups-page-container .bb-icon {
    color: rgba(255,106,0,0.95);
  }
  
  .writeups-page-container .step-number {
    background: rgba(255,106,0,0.10);
    border-color: rgba(255,106,0,0.35);
    color: rgba(255,106,0,0.95);
  }
  
  .writeups-page-container .owasp-num {
    background: rgba(255,106,0,0.12);
    border-color: rgba(255,106,0,0.38);
    color: rgba(255,106,0,0.95);
  }
  
  .writeups-page-container .ecosystem-card,
  .writeups-page-container .process-step,
  .writeups-page-container .term-card,
  .writeups-page-container .starting-step,
  .writeups-page-container .rules-section,
  .writeups-page-container .severity-level,
  .writeups-page-container .disclosure-card,
  .writeups-page-container .bb-reputation-card,
  .writeups-page-container .vulnerability-card,
  .writeups-page-container .owasp-card,
  .writeups-page-container .researcher-benefits {
    box-shadow: none;
    border-top: 2px solid rgba(255,106,0,0.45);
  }
  
  .writeups-page-container .tools-categories,
  .writeups-page-container .recon-phases {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border: 1px solid var(--line-strong);
    margin-left: -1px;
    margin-top: -1px;
  }
  .writeups-page-container .tools-category,
  .writeups-page-container .recon-phase {
    background: var(--paper-2);
    border-left: 1px solid var(--line-strong);
    border-top: 1px solid var(--line-strong);
    padding: 1.2rem 1.15rem;
    border-top: 2px solid rgba(255,106,0,0.45);
  }
  
  .writeups-page-container .tools-category h3,
  .writeups-page-container .recon-phase h3 {
    color: rgba(15,17,21,0.92);
  }
  
  .writeups-page-container .tools-category p,
  .writeups-page-container .recon-phase p {
    color: rgba(15,17,21,0.72);
  }
  
  .writeups-page-container .tools-category ul,
  .writeups-page-container .recon-phase ul {
    margin: 0.8rem 0 0;
    padding-left: 1.15rem;
  }
  
  .writeups-page-container .tools-category li strong,
  .writeups-page-container .ai-applications li strong {
    color: rgba(255,106,0,0.95);
  }
  
  .writeups-page-container .ai-applications,
  .writeups-page-container .ai-philosophy {
    background: var(--paper-2);
    border: 1px solid var(--line-strong);
    border-top: 2px solid rgba(255,106,0,0.45);
    padding: 1.2rem 1.15rem;
  }
  
  @media (max-width: 980px) {
    .writeups-page-container .tools-categories,
    .writeups-page-container .recon-phases {
      grid-template-columns: 1fr;
    }
  }
  
  .certs-featured-grid .cert-featured-card {
    transition: background 180ms var(--ease-out), color 180ms var(--ease-out);
  }
  
  .certs-featured-grid .cert-featured-card:hover {
    background: rgba(255,106,0,0.08);
  }
  
  .certs-featured-grid .cert-featured-card:hover .cert-featured-badge,
  .certs-featured-grid .cert-featured-card:hover .cert-link {
    color: rgba(255,106,0,0.95);
  }
  
  .certs-featured-grid .cert-featured-card:hover .cert-link {
    text-decoration: none;
  }
  
  h2 {
    color: rgba(255,106,0,0.95);
  }
  
  .section-header h2,
  .writeup-section h2,
  .page-hero-label,
  .page-hero-stat-label {
    color: rgba(255,106,0,0.95);
  }
  
  .container .content .section-header h2,
  .writeups-page-container .section-header h2 {
    color: rgba(255,106,0,0.95);
  }
  
  .hero-title,
  .hero-title .hero-accent {
    font-family: var(--font-sans);
    font-weight: 800;
  }
  
  .page-hero--media {
    position: relative;
    overflow: hidden;
  }
  .page-hero--media .page-hero-media {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  .page-hero--media .page-hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(1) contrast(1.05);
  }
  
  .page-hero--media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(215,217,221,0.88);
    z-index: 0;
  }
  .page-hero--media .page-hero-content {
    position: relative;
    z-index: 1;
  }