nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem;height:56px;background:rgba(7,9,15,0.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-subtle);}
  nav .logo{font-family:var(--serif);font-size:1.2rem;color:var(--gold);letter-spacing:0.08em;}
  nav .logo{text-decoration:none;}
  nav .links{display:flex;gap:1.75rem;}
  nav .links a{font-size:0.74rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-dim);text-decoration:none;transition:color 0.2s;}
  nav .links a:hover{color:var(--gold);}
  nav .tag{font-family:var(--mono);font-size:0.68rem;color:var(--gold);background:rgba(201,168,76,0.05);padding:0.2rem 0.65rem;border-radius:4px;border:1px solid rgba(201,168,76,0.2);}
  nav .menu-toggle{display:none;width:34px;height:34px;align-items:center;justify-content:center;border:1px solid var(--border-subtle);border-radius:7px;background:rgba(20,31,54,0.42);color:var(--text);font-size:1rem;line-height:1;cursor:pointer;}

  /* HERO */
  #hero{min-height:58vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8rem 2rem 4rem;position:relative;overflow:hidden;}
  #hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 55%,rgba(111,144,186,0.045) 0%,transparent 65%);}
  .hero-eyebrow{font-family:var(--mono);font-size:0.7rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--blue);margin-bottom:1.25rem;opacity:0;animation:fadeUp 0.8s 0.2s forwards;}
  .hero-title{font-family:var(--serif);font-size:clamp(2.5rem,7vw,5rem);font-weight:300;line-height:1.05;margin-bottom:0.5rem;opacity:0;animation:fadeUp 0.8s 0.4s forwards;}
  .hero-title em{color:var(--gold);font-style:italic;}
  .hero-sub{font-family:var(--serif);font-size:clamp(1rem,2vw,1.35rem);font-style:italic;color:var(--text-dim);margin-bottom:2rem;opacity:0;animation:fadeUp 0.8s 0.6s forwards;}
  .hero-lead{font-size:1rem;color:var(--text-dim);max-width:680px;line-height:1.85;margin:0 auto 2.5rem;opacity:0;animation:fadeUp 0.8s 0.8s forwards;}
  .hero-badges{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;opacity:0;animation:fadeUp 0.8s 1s forwards;}
  .hero-badge{font-family:var(--mono);font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;padding:0.3rem 0.9rem;border-radius:4px;border:1px solid;}

  /* LAYOUT */
  .section{padding:5.5rem 2rem;max-width:1200px;margin:0 auto;}
  hr.div{border:none;border-top:1px solid var(--border-subtle);margin:0 2rem;}
  .section-label{font-family:var(--mono);font-size:0.68rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:0.85rem;}
  .section-title{font-family:var(--serif);font-size:clamp(1.8rem,4vw,3rem);font-weight:300;line-height:1.1;margin-bottom:1.25rem;}
  .section-title em{color:var(--gold);font-style:italic;}
  .section-intro{font-size:1rem;color:var(--text-dim);max-width:720px;line-height:1.85;margin-bottom:3rem;}

  /* CALLOUT */
  .callout{background:var(--gold-glow);border:1px solid var(--border);border-radius:8px;padding:1.25rem 1.5rem;margin:1.5rem 0;}
  .callout p{font-size:0.92rem;color:var(--text);line-height:1.75;}
  .callout.info{background:rgba(111,144,186,0.045);border-color:rgba(61,139,205,0.2);}
  .callout.warn{background:rgba(204,102,85,0.06);border-color:rgba(204,102,85,0.2);}
  .unamuno-quote{
    font-family:var(--serif);
    font-style:italic;
    font-size:1.1rem;
    color:rgba(201,168,76,0.75);
    border-left:1px solid rgba(201,168,76,0.3);
    padding-left:1.25rem;
    margin:1.3rem auto 0.7rem;
    max-width:760px;
    text-align:left;
    line-height:1.65;
  }
  .unamuno-source{
    font-family:var(--mono);
    font-size:0.65rem;
    letter-spacing:0.15em;
    color:var(--text-muted);
    margin:0.2rem auto 0;
    padding-left:1.25rem;
    text-transform:uppercase;
    max-width:760px;
    text-align:left;
    display:block;
  }

  /* TEST CARDS GRID */
  .tests-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-top:2.5rem;}
  .test-card{background:var(--bg2);border:1px solid var(--border-subtle);border-radius:12px;overflow:hidden;transition:border-color 0.3s,transform 0.3s;}
  .test-card:hover{border-color:var(--border);transform:translateY(-2px);}
  .test-header{padding:1.25rem 1.5rem;display:flex;align-items:flex-start;gap:1rem;border-bottom:1px solid var(--border-subtle);}
  .test-id{font-family:var(--mono);font-size:1.5rem;color:var(--gold);line-height:1;min-width:2rem;font-weight:300;}
  .test-header-text{}
  .test-title{font-family:var(--serif);font-size:1.05rem;color:var(--text);line-height:1.3;margin-bottom:0.2rem;}
  .test-meta{font-family:var(--mono);font-size:0.65rem;letter-spacing:0.12em;color:var(--text-muted);text-transform:uppercase;}
  .test-body{padding:1.25rem 1.5rem;}
  .test-body p{font-size:0.87rem;color:var(--text-dim);line-height:1.7;margin-bottom:0.85rem;}
  .test-body p:last-child{margin-bottom:0;}
  .test-body strong{color:var(--text);font-weight:500;}
  .kill-continue{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;margin-top:1rem;}
  .kc-box{padding:0.75rem 1rem;border-radius:6px;font-size:0.82rem;line-height:1.6;}
  .kc-continue{background:rgba(90,170,114,0.08);border:1px solid rgba(90,170,114,0.2);}
  .kc-continue .kc-label{color:var(--green);font-family:var(--mono);font-size:0.65rem;letter-spacing:0.15em;text-transform:uppercase;margin-bottom:0.3rem;display:block;}
  .kc-kill{background:rgba(204,102,85,0.07);border:1px solid rgba(204,102,85,0.2);}
  .kc-kill .kc-label{color:var(--red);font-family:var(--mono);font-size:0.65rem;letter-spacing:0.15em;text-transform:uppercase;margin-bottom:0.3rem;display:block;}
  .kc-text{color:var(--text-dim);}
  .test-effort{display:flex;gap:0.5rem;flex-wrap:wrap;margin-top:0.85rem;}
  .effort-tag{font-family:var(--mono);font-size:0.65rem;letter-spacing:0.08em;padding:0.18rem 0.55rem;border-radius:3px;background:var(--bg3);color:var(--text-muted);}

  /* PRIORITY BADGE */
  .priority{display:inline-block;font-family:var(--mono);font-size:0.6rem;letter-spacing:0.15em;text-transform:uppercase;padding:0.15rem 0.5rem;border-radius:3px;margin-left:0.5rem;}
  .p-highest{background:rgba(201,168,76,0.15);color:var(--gold);}
  .p-high{background:rgba(111,144,186,0.12);color:var(--blue);}
  .p-mid{background:rgba(74,74,66,0.25);color:var(--text-muted);}

  /* SOFTWARE STACK */
  .stack-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:2rem;}
  .stack-card{background:var(--bg2);border:1px solid var(--border-subtle);border-radius:8px;padding:1.1rem;transition:border-color 0.3s;}
  .stack-card:hover{border-color:var(--border);}
  .stack-lib{font-family:var(--mono);font-size:0.82rem;color:var(--gold);margin-bottom:0.3rem;}
  .stack-use{font-size:0.78rem;color:var(--text-dim);line-height:1.55;}
  .stack-type{font-family:var(--mono);font-size:0.62rem;letter-spacing:0.1em;color:var(--text-muted);margin-top:0.4rem;text-transform:uppercase;}

  /* PLATFORM SCORECARD */
  .platform-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:2.5rem;}
  .platform-card{background:var(--bg2);border:1px solid var(--border-subtle);border-radius:12px;overflow:hidden;}
  .platform-header{padding:1.25rem 1.5rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-subtle);}
  .platform-name{font-family:var(--serif);font-size:1.2rem;color:var(--text);}
  .platform-verdict{font-family:var(--mono);font-size:0.65rem;letter-spacing:0.12em;text-transform:uppercase;padding:0.2rem 0.65rem;border-radius:4px;}
  .verdict-plausible{background:rgba(201,168,76,0.08);color:var(--gold);}
  .verdict-established{background:rgba(42,184,160,0.1);color:var(--teal);}
  .platform-body{padding:1.25rem 1.5rem;}
  .score-row{display:flex;align-items:center;justify-content:space-between;padding:0.6rem 0;border-bottom:1px solid var(--border-subtle);}
  .score-row:last-child{border-bottom:none;}
  .score-label{font-size:0.83rem;color:var(--text-dim);}
  .score-dots{display:flex;gap:4px;}
  .score-dot{width:8px;height:8px;border-radius:50%;}
  .dot-full{background:var(--gold);}
  .dot-half{background:rgba(201,168,76,0.35);}
  .dot-empty{background:rgba(74,74,66,0.4);}
  .score-note{font-size:0.75rem;color:var(--text-muted);font-family:var(--mono);}

  /* COMPARISON TABLE */
  .comp-wrap{overflow-x:auto;margin-top:2rem;border-radius:10px;border:1px solid var(--border-subtle);}
  table.comp{width:100%;border-collapse:collapse;font-size:0.83rem;}
  .comp thead tr{background:var(--bg2);border-bottom:1px solid var(--border-subtle);}
  .comp th{padding:0.8rem 1rem;text-align:left;font-family:var(--mono);font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--text-muted);font-weight:400;}
  .comp td{padding:0.8rem 1rem;border-bottom:1px solid rgba(24,38,66,0.3);color:var(--text-dim);vertical-align:top;line-height:1.6;}
  .comp tr:last-child td{border-bottom:none;}
  .comp tr:hover td{background:rgba(20,31,54,0.42);}
  .comp .hl td{color:var(--text);}
  .badge{display:inline-block;padding:0.12rem 0.55rem;border-radius:3px;font-family:var(--mono);font-size:0.65rem;letter-spacing:0.06em;}
  .b-teal{background:rgba(42,184,160,0.12);color:var(--teal);}
  .b-gold{background:rgba(201,168,76,0.08);color:var(--gold);}
  .b-red{background:rgba(204,102,85,0.1);color:var(--red);}
  .b-blue{background:rgba(111,144,186,0.12);color:var(--blue);}
  .b-gray{background:rgba(74,74,66,0.2);color:var(--text-muted);}
  .b-purple{background:rgba(139,111,186,0.12);color:var(--purple);}

  /* TIMELINE */
  #timeline-section{background:linear-gradient(180deg,var(--bg) 0%,#090d1c 50%,var(--bg) 100%);}
  .tl-outer{position:relative;margin-top:3rem;}
  /* central spine */
  .tl-outer::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--border-subtle);transform:translateX(-50%);}
  .tl-item{display:grid;grid-template-columns:1fr 60px 1fr;gap:0;margin-bottom:2rem;align-items:start;}
  .tl-item:last-child{margin-bottom:0;}
  .tl-left{text-align:right;padding-right:2rem;padding-top:0.15rem;}
  .tl-right{padding-left:2rem;padding-top:0.15rem;}
  .tl-center{display:flex;flex-direction:column;align-items:center;position:relative;}
  .tl-node{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--gold-dim);background:var(--bg);flex-shrink:0;margin-top:0.15rem;transition:background 0.3s,border-color 0.3s;}
  .tl-item.gate .tl-node{width:18px;height:18px;background:rgba(201,168,76,0.15);border-color:var(--gold);box-shadow:0 0 10px rgba(201,168,76,0.25);}
  .tl-item.deliverable .tl-node{width:18px;height:18px;background:rgba(42,184,160,0.15);border-color:var(--teal);box-shadow:0 0 10px rgba(42,184,160,0.2);}
  .tl-connector{flex:1;width:1px;background:var(--border-subtle);min-height:40px;}
  .tl-month{font-family:var(--mono);font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;display:block;line-height:1;margin-bottom:0.3rem;}
  .tl-content-title{font-family:var(--serif);font-size:1rem;color:var(--text);margin-bottom:0.3rem;line-height:1.3;}
  .tl-content-desc{font-size:0.83rem;color:var(--text-dim);line-height:1.65;}
  .tl-phase-tag{display:inline-block;font-family:var(--mono);font-size:0.6rem;letter-spacing:0.15em;text-transform:uppercase;padding:0.15rem 0.55rem;border-radius:3px;margin-bottom:0.4rem;}
  .phase-A{background:rgba(61,139,205,0.1);color:var(--blue);}
  .phase-B{background:rgba(42,184,160,0.1);color:var(--teal);}
  .phase-C{background:rgba(201,168,76,0.08);color:var(--gold);}
  .phase-gate{background:rgba(201,168,76,0.15);color:var(--gold);border:1px solid rgba(201,168,76,0.3);}
  .phase-hw{background:rgba(139,111,186,0.12);color:var(--purple);}
  .phase-del{background:rgba(42,184,160,0.12);color:var(--teal);border:1px solid rgba(42,184,160,0.25);}
  .gate-box{background:rgba(201,168,76,0.05);border:1px solid rgba(201,168,76,0.2);border-radius:6px;padding:0.75rem 1rem;margin-top:0.5rem;}
  .gate-box p{font-size:0.8rem;color:var(--text-dim);line-height:1.6;}
  .gate-box strong{color:var(--gold);font-weight:500;}

  /* CHECKLIST */
  .checklist{display:flex;flex-direction:column;gap:0.75rem;margin-top:2rem;}
  .check-item{display:grid;grid-template-columns:2rem 1fr;gap:0.75rem;align-items:start;padding:1rem 1.25rem;background:var(--bg2);border:1px solid var(--border-subtle);border-radius:8px;transition:border-color 0.3s;}
  .check-item:hover{border-color:var(--border);}
  .check-num{font-family:var(--mono);font-size:0.75rem;color:var(--gold);line-height:1.5;}
  .check-text{font-size:0.88rem;color:var(--text-dim);line-height:1.7;}
  .check-text strong{color:var(--text);font-weight:500;}
  .check-text code{font-family:var(--mono);font-size:0.82em;color:var(--gold);background:rgba(201,168,76,0.05);padding:0.1em 0.35em;border-radius:3px;}

  /* BUDGET BARS */
  .budget-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-top:2rem;}
  .budget-card{background:var(--bg2);border:1px solid var(--border-subtle);border-radius:10px;padding:1.4rem;}
  .budget-label{font-family:var(--mono);font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-muted);margin-bottom:0.4rem;}
  .budget-title{font-family:var(--serif);font-size:1rem;color:var(--text);margin-bottom:0.75rem;}
  .budget-bar-wrap{height:6px;background:var(--bg3);border-radius:3px;margin-bottom:0.5rem;overflow:hidden;}
  .budget-bar{height:100%;border-radius:3px;transition:width 0.8s ease;}
  .budget-range{font-family:var(--mono);font-size:0.82rem;color:var(--gold);}
  .budget-sub{font-size:0.78rem;color:var(--text-muted);margin-top:0.3rem;}

  /* CONCLUSION */
  .conclusion-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.5rem;margin-top:2.5rem;}
  .conc-card{background:var(--bg2);border:1px solid var(--border-subtle);border-radius:10px;padding:1.5rem;transition:border-color 0.3s;}
  .conc-card:hover{border-color:var(--border);}
  .conc-title{font-family:var(--mono);font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;margin-bottom:0.75rem;}
  .conc-card.pos .conc-title{color:var(--green);}
  .conc-card.neut .conc-title{color:var(--gold);}
  .conc-card.crit .conc-title{color:var(--blue);}
  .conc-card p{font-size:0.88rem;color:var(--text-dim);line-height:1.7;}
  .conc-card strong{color:var(--text);font-weight:500;}

  footer{border-top:1px solid var(--border-subtle);padding:3rem 2rem;text-align:center;}
  footer .foot-phi{font-family:var(--serif);font-size:2.5rem;color:var(--gold);font-style:italic;opacity:0.3;display:block;margin-bottom:0.75rem;}
  footer p{font-size:0.78rem;color:var(--text-muted);letter-spacing:0.05em;line-height:1.8;}
  footer a{color:var(--text-muted);text-decoration:none;border-bottom:1px dotted rgba(122,118,104,0.45);}
  footer a:hover{color:var(--gold);border-bottom-color:rgba(201,168,76,0.45);}

  @keyframes fadeUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}

  @media(max-width:900px){
    .section{padding:4.8rem 1.3rem;}
    hr.div{margin:0 1.3rem;}
    .tests-grid{grid-template-columns:1fr;}
    .platform-grid{grid-template-columns:1fr;}
    .budget-grid{grid-template-columns:1fr;}
    .conclusion-grid{grid-template-columns:1fr;}
    .stack-grid{grid-template-columns:1fr 1fr;}
    .tl-outer::before{left:20px;}
    .tl-item{grid-template-columns:20px 1fr;}
    .tl-left{display:none;}
    .tl-right{padding-left:1.25rem;}
    .tl-center{align-items:flex-start;}
  }
  @media(max-width:600px){
    nav{padding:0 0.9rem;height:56px;}
    nav .logo{font-size:1.05rem;}
    nav .menu-toggle{display:inline-flex;}
    nav .tag{display:none;}
    nav .links{display:none;position:absolute;top:56px;left:0.75rem;right:0.75rem;flex-direction:column;gap:0.2rem;padding:0.7rem 0.9rem 0.85rem;background:rgba(7,9,15,0.97);border:1px solid var(--border-subtle);border-radius:10px;z-index:120;}
    nav.open .links{display:flex !important;}
    nav .links a{padding:0.25rem 0.1rem;}
    #hero{padding:6.8rem 0.72rem 3rem;}
    .section{padding:4rem 0.72rem;}
    hr.div{margin:0 0.72rem;}
    .callout{padding:1rem 1.05rem;}
    .test-header,.test-body,.platform-header,.platform-body{padding:1rem;}
    .check-item{padding:0.9rem 1rem;}
    .budget-card,.conc-card{padding:1.1rem;}
    .kill-continue{grid-template-columns:1fr;}
    .stack-grid{grid-template-columns:1fr;}
    .unamuno-quote{
      font-size:0.98rem;
      line-height:1.55;
      padding-left:0.95rem;
      margin:1.05rem auto 0.5rem;
    }
    .unamuno-source{
      font-size:0.57rem;
      letter-spacing:0.1em;
      padding-left:0.95rem;
      margin:0.15rem auto 0;
    }
  }
  @media(min-width:430px) and (max-width:600px){
    #hero{padding-left:0.56rem;padding-right:0.56rem;}
    .section{padding-left:0.56rem;padding-right:0.56rem;}
    hr.div{margin:0 0.56rem;}
  }
  @media(max-width:420px){
    .unamuno-quote{font-size:0.92rem;}
    .unamuno-source{font-size:0.52rem;letter-spacing:0.08em;}
  }