/* ============================================================
   NOVA · Download Center - page-specific styles
   Depends on styles/shared.css (tokens, base, components, nav, footer).
   Only rules unique to this page live here - no duplication.
   ============================================================ */
main{padding-top:72px}
.section{padding:96px 0;border-top:1px solid var(--border-subtle)}
.section:first-of-type{border-top:0}

/* ---- hero ---- */
.dhero{position:relative;overflow:hidden;padding:80px 0 72px}
.dhero-bg{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 55% 48% at 72% 30%,var(--iris-glow),transparent 70%),radial-gradient(ellipse 42% 40% at 14% 84%,var(--cloud-bg),transparent 72%),linear-gradient(180deg,var(--bg-1),var(--bg-0) 62%)}
.js .dhero-bg{animation:fade 800ms var(--ease-out) both}
/* faint mesh/noise behind the installer - very low opacity, decorative */
.dhero-mesh{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:
    radial-gradient(ellipse 30% 40% at 78% 42%,var(--iris-faint),transparent 60%),
    radial-gradient(ellipse 26% 34% at 62% 68%,var(--cloud-bg),transparent 62%)}
.dhero-mesh::after{content:"";position:absolute;inset:0;opacity:.4;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:overlay}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.js .fx{animation:rise var(--dur-reveal) var(--ease-out) var(--d,0ms) both}
.dhero-grid{position:relative;display:grid;grid-template-columns:47fr 53fr;gap:56px;align-items:center}
/* faint radial highlight behind the headline so the left half carries weight */
.dhero-left{position:relative}
.dhero-left::before{content:"";position:absolute;left:-8%;top:-6%;width:70%;height:70%;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 60% 60% at 30% 30%,var(--iris-faint),transparent 70%);filter:blur(6px)}
.dhero h1{font-family:var(--font-display);font-weight:700;font-size:clamp(40px,4.6vw,61px);line-height:1.04;letter-spacing:-.02em;margin-top:22px}
.dhero .lede{margin:20px 0 30px;max-width:42ch;color:var(--text-secondary);font-size:17px;line-height:26px}
/* CTA: premium hover - brighter gradient, soft bloom underneath, stronger shadow */
.dhero .btn-download{position:relative;height:52px;padding:0 28px;font-size:16px}
.dhero .btn-download::after{content:"";position:absolute;left:12%;right:12%;bottom:-8px;height:22px;z-index:-1;border-radius:var(--radius-pill);
  background:var(--iris-500);opacity:0;filter:blur(16px);transition:opacity var(--dur-hover) var(--ease-out)}
.dhero .btn-download:hover{transform:translateY(-2px);filter:brightness(1.1) saturate(1.05);box-shadow:0 10px 30px var(--iris-glow),0 2px 8px var(--iris-glow),inset 0 1px 0 rgba(255,255,255,.14)}
.dhero .btn-download:hover::after{opacity:.5}
.dhero .btn-download:active{transform:translateY(0);filter:none}
/* premium trust badge: shield + verify, softer border, light blur */
.dhero-badge{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-color:var(--glass-border);padding:7px 15px;gap:9px}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.dhero-badge{background:var(--bg-1)}}
.dhero-badge svg{color:var(--iris-500)}
.dhero-badge .sep{width:3px;height:3px;border-radius:50%;background:var(--text-tertiary);opacity:.5;flex-shrink:0}
.dhero-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:26px;font-family:var(--font-mono);font-size:11.5px;color:var(--text-tertiary)}
.dhero-meta i{width:3px;height:3px;border-radius:50%;background:var(--text-tertiary);opacity:.5}
.dhero-meta .st{color:var(--success)}

/* installer preview - reads like a real Windows installer window */
.installer{position:relative;background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-xl);
  box-shadow:var(--shadow-4),0 28px 72px rgba(0,0,0,.5),0 24px 64px var(--iris-glow);overflow:hidden}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.installer{background:var(--bg-1)}}
.js .installer{animation:rise var(--dur-reveal) var(--ease-out) 320ms both}
.installer-top{height:40px;display:flex;align-items:center;gap:9px;padding:0 14px;border-bottom:1px solid var(--border-subtle);background:linear-gradient(180deg,var(--bg-2),var(--bg-1))}
.installer-top .app{width:16px;height:16px;border-radius:5px;background:linear-gradient(135deg,var(--iris-500),var(--iris-700));display:grid;place-items:center;color:#fff;flex-shrink:0}
.installer-top .title{font-family:var(--font-body);font-size:11.5px;font-weight:500;color:var(--text-secondary)}
.installer-top .win{margin-left:auto;display:flex;align-items:center;gap:14px;color:var(--text-tertiary)}
.installer-body{padding:34px 30px 30px;text-align:center}
.installer-logo{width:60px;height:60px;margin:0 auto;border-radius:17px;background:var(--bg-1);display:grid;place-items:center;box-shadow:var(--shadow-2),0 0 0 6px var(--iris-faint)}
.installer-logo img{width:48px;height:48px;display:block;object-fit:contain}
.installer-title{margin-top:16px;font-family:var(--font-display);font-size:19px;font-weight:600}
.installer-body p{margin-top:4px;font-size:12.5px;color:var(--text-tertiary)}
.installer-status{margin-top:6px;font-size:11.5px;color:var(--text-secondary)}
.installer-status b{color:var(--success);font-weight:500}
.installer-bar{height:8px;border-radius:var(--radius-pill);background:var(--bg-3);overflow:hidden;margin:22px 0 10px}
/* progress fill animates transform (compositor-friendly, no layout/paint).
   Full by default so the "100%" preview reads correctly without JS. */
.installer-bar i{display:block;height:100%;width:100%;transform-origin:left;border-radius:var(--radius-pill);background:linear-gradient(90deg,var(--iris-500),var(--iris-300))}
.js .installer-bar i{transform:scaleX(0);animation:fill 1600ms var(--ease-out) 700ms forwards}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.installer-pct{display:flex;align-items:center;justify-content:space-between;font-family:var(--font-mono);font-size:11px;color:var(--text-secondary)}
.installer-pct .done{color:var(--success)}
.installer-verify{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:22px}

/* ---- download card ---- */
.dcard{max-width:560px;margin:0 auto;background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);
  border-radius:var(--radius-2xl);box-shadow:var(--shadow-4),0 32px 80px var(--iris-glow);padding:32px;transition:transform var(--dur-slow) var(--ease-out),box-shadow var(--dur-slow) var(--ease-out)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.dcard{background:var(--bg-1)}}
.dcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-4),0 40px 96px var(--iris-glow)}
.dcard-head{display:flex;align-items:center;gap:14px}
.dcard-logo{width:52px;height:52px;border-radius:15px;background:var(--bg-1);display:grid;place-items:center;flex-shrink:0;box-shadow:var(--shadow-2)}
.dcard-logo img{width:42px;height:42px;display:block;object-fit:contain}
.dcard-head b{display:block;font-family:var(--font-display);font-size:19px;font-weight:600}
.dcard-head span{display:block;margin-top:3px;font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary)}
.dcard-plat{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:18px;font-size:12px;color:var(--text-tertiary)}
.dcard-plat i{width:3px;height:3px;border-radius:50%;background:var(--text-tertiary);opacity:.5}
.dcard .btn-download{width:100%;height:54px;font-size:16px;margin-top:20px}
.dcard-sec{display:flex;gap:10px;margin-top:12px}
.dcard-sec a{flex:1}
.dcard-sec .btn-secondary{width:100%;height:42px;font-size:13px}
.dcard-div{height:1px;background:var(--border-subtle);margin:22px 0}
.dcard-trust{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}

/* ---- platforms ---- */
.plats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:56px}
.plat{background:var(--bg-1);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);padding:28px;transition:transform var(--dur-hover) var(--ease-out),border-color var(--dur-hover) var(--ease-out),box-shadow var(--dur-hover) var(--ease-out)}
.plat:hover{transform:translateY(-2px);border-color:var(--border-default);box-shadow:var(--shadow-3)}
.plat .row{display:flex;align-items:center;justify-content:space-between}
.plat h3{font-family:var(--font-display);font-size:19px;font-weight:600;margin-top:16px}
.plat p{margin-top:8px;color:var(--text-secondary);font-size:13.5px;line-height:21px}

/* ---- requirements table ---- */
.tbl-wrap{margin-top:48px;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-1)}
.tbl-wrap table{width:100%;border-collapse:collapse}
.req th,.req td{padding:16px 22px;text-align:left;font-size:14px}
.req thead th{font-family:var(--font-mono);font-weight:500;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-tertiary);border-bottom:1px solid var(--border-default);background:var(--bg-2)}
.req tbody tr{border-bottom:1px solid var(--border-subtle);transition:background var(--dur-hover) var(--ease-out)}
.req tbody tr:last-child{border-bottom:0}
.req tbody tr:hover{background:var(--bg-2)}
.req td:first-child{font-weight:500;color:var(--text-primary)}
.req td{color:var(--text-secondary)}
.req .rec{color:var(--text-primary)}

/* ---- install timeline ---- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:56px;position:relative}
.istep{position:relative}
.istep .icon-box{width:48px;height:48px}
.istep h3{margin:16px 0 4px;font-family:var(--font-display);font-size:17px;font-weight:600}
.istep p{color:var(--text-secondary);font-size:13px;line-height:20px}
.istep .est{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-family:var(--font-mono);font-size:10.5px;color:var(--text-tertiary)}
.istep .num{position:absolute;top:0;right:0;font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary);opacity:.6}

/* ---- verify installer ---- */
.verify{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px;align-items:start}
.verify-card{background:var(--bg-1);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:24px}
.verify-card h3{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:16px;font-weight:600}
.verify-card h3 svg{color:var(--success)}
.verify-card p{margin-top:10px;color:var(--text-secondary);font-size:13.5px;line-height:21px}
.hash{display:flex;align-items:center;gap:10px;margin-top:16px;padding:12px 14px;border-radius:var(--radius-md);background:var(--bg-0);border:1px solid var(--border-default)}
.hash code{flex:1;min-width:0;font-family:var(--font-mono);font-size:11.5px;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hash button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:9px;cursor:pointer;border:1px solid var(--border-default);background:transparent;color:var(--text-primary);font:500 11.5px/1 var(--font-body);flex-shrink:0;transition:background var(--dur-hover) var(--ease-out),border-color var(--dur-hover) var(--ease-out)}
.hash button:hover{background:var(--bg-2);border-color:var(--border-strong)}
.hash button.copied{color:var(--success);border-color:var(--success)}
.verify-list{display:grid;gap:12px;margin-top:8px}
.verify-list .v{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-secondary)}
.verify-list .v svg{color:var(--success);flex-shrink:0}

/* ---- latest release ---- */
.release{max-width:820px;margin:48px auto 0;background:linear-gradient(180deg,var(--bg-3),var(--bg-2));border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-glow);padding:32px}
.release-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.release-top h3{font-family:var(--font-display);font-size:24px;font-weight:600}
.release-top .badges{display:flex;gap:8px;flex-wrap:wrap}
.release-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.release-grid .r{padding:14px 16px;border-radius:var(--radius-md);background:var(--bg-1);border:1px solid var(--border-subtle)}
.release-grid small{display:block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-tertiary)}
.release-grid b{display:block;margin-top:6px;font-size:14px;font-weight:500;color:var(--text-primary)}

/* ---- version history table ---- */
.vh td:first-child{font-family:var(--font-mono);color:var(--text-primary);font-weight:500}
.vh a{color:var(--iris-500);text-decoration:none;position:relative}
.vh a:hover{color:var(--iris-300)}
.vh .st{display:inline-flex;align-items:center;gap:6px;font-size:12px}
.vh .st.stable{color:var(--success)}.vh .st.stable i{width:6px;height:6px;border-radius:50%;background:var(--success)}
.vh .st.old{color:var(--text-tertiary)}.vh .st.old i{width:6px;height:6px;border-radius:50%;background:var(--text-tertiary)}

/* ---- release notes preview ---- */
.notes{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:48px}
.note-col{background:var(--bg-1);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:22px}
.note-col h3{display:flex;align-items:center;gap:9px;font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-primary)}
.note-col h3 .tag{width:8px;height:8px;border-radius:3px}
.note-col.added .tag{background:var(--success)}.note-col.improved .tag{background:var(--iris-500)}.note-col.fixed .tag{background:var(--cloud)}.note-col.known .tag{background:var(--warning)}
.note-col ul{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:9px}
.note-col li{display:flex;gap:9px;font-size:13px;line-height:20px;color:var(--text-secondary)}
.note-col li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--text-tertiary);flex-shrink:0;margin-top:8px}
.notes-cta{text-align:center;margin-top:28px}

/* ---- accordion (reused pattern) ---- */
.acc{max-width:820px;margin:48px auto 0;display:grid;gap:8px}
.acc-item{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-1);overflow:hidden}
.acc-q{display:flex;align-items:center;gap:12px;width:100%;padding:16px 18px;background:transparent;border:0;cursor:pointer;text-align:left;font:500 14.5px/1.4 var(--font-body);color:var(--text-primary)}
.acc-q svg.lead{color:var(--text-tertiary);flex-shrink:0}
.acc-q .chev{margin-left:auto;color:var(--text-tertiary);flex-shrink:0;transition:transform var(--dur-content) var(--ease-out)}
.acc-item[data-open="true"] .chev{transform:rotate(180deg)}
/* collapsed panels are visibility:hidden so screen readers don't announce
   their text while closed; max-height animates the reveal */
.acc-a{max-height:0;overflow:hidden;visibility:hidden;transition:max-height var(--dur-slow) var(--ease-out),visibility var(--dur-slow) var(--ease-out)}
.acc-item[data-open="true"] .acc-a{visibility:visible}
.acc-a p{padding:0 18px 16px 46px;color:var(--text-secondary);font-size:13.5px;line-height:22px}

/* ---- need help ---- */
.help{text-align:center}
.help-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:32px}

/* ---- page responsive (nav + footer + wrap live in shared.css) ---- */
@media (max-width:1024px){
  .dhero-grid{grid-template-columns:1fr;gap:44px}
  .dhero-grid .installer{max-width:520px}
  .verify{grid-template-columns:1fr}
}
@media (max-width:768px){
  .section{padding:72px 0}
  .plats{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr;gap:20px}
  .release-grid{grid-template-columns:1fr}
  .notes{grid-template-columns:1fr}
  .dcard-sec{flex-direction:column}
  .dhero .btn-download{width:100%;max-width:340px}
  .verify-card{min-width:0}
  .hash{align-items:stretch;flex-direction:column}
  .hash code{white-space:normal;overflow-wrap:anywhere;text-overflow:clip}
  .hash button{align-self:flex-start}
  .tbl-wrap{overflow:visible}
  .tbl-wrap table,.req thead,.req tbody,.req tr,.req th,.req td{display:block;width:100%}
  .req thead{display:none}
  .req tbody tr{padding:12px 0}
  .req th,.req td{white-space:normal;padding:7px 16px}
  .req td:first-child{font-size:13px}
  .req td:not(:first-child){padding-left:28px}
}
