/* ================================================================
   EGWU — site.css
   Discover-style reskin for the remaining info/legal pages (about,
   pricing, help, contact, careers, press, investors, legal, …).
   Load order: style.css → responsive.css → pages.css → shell.css → site.css
   Only restyles — page markup and js/app.js behaviour are unchanged.
   ================================================================ */
:root{
  /* old tokens → Discover / mobile-theme values (brand blue as the accent) */
  --bg:#14181B; --bg2:#171C20; --bg3:#1B2226;
  --glass:#1C2427; --glass2:#222B30;
  --b:#283136; --b2:#34424B;
  --muted:#8A97A3; --dim:#C9D2DA;
  --accent:#7FB0FF; --blue:#004AAD; --blue-h:#1F6FE0; --blue-l:#1F6FE0;
  --nav-h:0px;                         /* the new header is sticky (in flow), not fixed */
  --px:clamp(16px,3.2vw,64px);
  --dx-card:#1C2427; --dx-card2:#1B2226; --dx-line:#283136; --dx-line2:#34424B; --dx-blue-tx:#7FB0FF;
}
/* style.css sets overflow-x:hidden on BOTH html and body, which turns body into its own
   scroll box and breaks the sticky header. clip still blocks sideways scroll without that. */
html,body{overflow-x:clip}
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;background:#14181B;color:#fff}
.btn,.plan-cta,.auth-submit,input,select,textarea,button{font-family:inherit}
#page-progress{background:linear-gradient(90deg,#004AAD,#1F6FE0,#7FB0FF)}

/* type */
h1,h2,h3,h4{letter-spacing:-.02em}
.eyebrow,.ph-tag,.guide-eyebrow{font-size:11px;font-weight:800;letter-spacing:1.4px;color:var(--accent)}
.eyebrow::before,.ph-tag::before{display:none}
.pricing-hero p.eyebrow,.page-header p.eyebrow,main p.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.4px;color:var(--accent);line-height:1.4}
.sec-title{font-weight:900;letter-spacing:-.03em}

/* buttons → Discover shapes */
.btn{border-radius:12px;border-width:1px;font-weight:700;height:auto;min-height:44px;padding:12px 22px}
.btn-sm{min-height:38px;padding:8px 16px;border-radius:10px}
.btn-blue{background:#004AAD}.btn-blue:hover{background:#1F6FE0;box-shadow:none}
.btn-white{background:#fff;color:#14181B}.btn-white:hover{background:#E8EDF2}
.btn-outline,.btn-ghost,.btn-dim{background:transparent;color:#fff;border-color:#3A4852}
.btn-outline:hover,.btn-ghost:hover,.btn-dim:hover{border-color:var(--muted);background:transparent;color:#fff}

/* ── Page header → Discover hero card ────────────────────────── */
.page-header{background:none;border:0;padding:28px var(--px) 0;overflow:visible}
.page-header>.ph-orb{display:none}
.page-header .ph-inner{max-width:1480px;margin:0 auto;position:relative;overflow:hidden;border-radius:32px;border:1px solid var(--b);
  padding:clamp(28px,4.5vw,64px) clamp(22px,4vw,56px);background:radial-gradient(90% 140% at 0% 0%,#0b2a5a 0%,#101a24 55%,#14181B 100%)}
.page-header .ph-inner::before{content:"";position:absolute;right:-120px;top:-140px;width:420px;height:420px;border-radius:50%;background:rgba(31,111,224,.32);filter:blur(80px);pointer-events:none}
.page-header .ph-inner>*{position:relative}
.page-header h1{font-size:clamp(34px,5.4vw,68px);font-weight:900;letter-spacing:-.035em;line-height:1;margin:12px 0 14px}
.page-header .tg{background:none;-webkit-text-fill-color:#7FB0FF;color:#7FB0FF}
.ph-updated{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:var(--dim);font-weight:600}

/* ── Body ───────────────────────────────────────────────────── */
.page-body{background:transparent;padding:44px 0 96px}
.page-content{max-width:860px}
.page-content h2{font-size:clamp(20px,2.4vw,26px);font-weight:900;border-bottom-color:var(--b)}
.page-content h3{color:#fff;font-weight:800}
.page-content p,.page-content li{color:var(--dim)}
.page-content li::before{content:'';width:6px;height:6px;border-radius:50%;background:#1F6FE0;top:15px;left:4px}
.page-content a,.info-box a,.pricing-legal-note a{color:var(--accent)}
.page-content a:hover{color:#fff}

/* every card-like block → Discover card */
.info-box,.about-mission-card,.about-pillar,.about-stat,.contact-card,.contact-address-card,.contact-dept,.value-card,.market-item,
.ms-card,.press-facts-card,.press-logo-box,.careers-cta-card,.no-jobs-box,.dark-box,.strategy-item,.guide-section,.guide-toc a,.guide-table-wrap,
.faq-item,.help-intro,.response-banner,.auth-card{background:var(--dx-card);border:1px solid var(--dx-line);border-radius:22px}
.about-mission-card::before,.plan-card::before{display:none}
.about-stat .as-num{color:#7FB0FF;font-weight:900;letter-spacing:-.03em}
.pillar-icon,.value-icon,.contact-address-icon,.market-item-icon,.about-mission-icon,.help-intro-icon{background:rgba(31,111,224,.16);border:1px solid rgba(91,155,255,.3);border-radius:12px}
.guide-section{padding:clamp(22px,3.5vw,36px) clamp(18px,3.5vw,36px);margin-top:24px}
.guide-section:first-of-type{border-top:1px solid var(--dx-line);margin-top:32px}
.guide-section .guide-eyebrow{margin-top:0}
.guide-section>:last-child{margin-bottom:0}
.note-box{background:rgba(31,111,224,.10);border:1px solid rgba(91,155,255,.28);border-radius:16px}
.warn-box{border-radius:16px}
.page-img-strip,.section-img{border-radius:28px!important;overflow:hidden}
.dept-tag,.gtag{border-radius:999px}

/* help center */
.help-search-wrap .hs-input,.hs-input{background:var(--dx-card);border:1px solid var(--dx-line);border-radius:14px;color:#fff}
.hs-input:focus{border-color:var(--dx-line2);outline:none}
.faq-item{margin-bottom:10px;overflow:hidden}
.faq-btn{color:#fff;font-weight:700}
.faq-plus{color:var(--accent)}
.faq-group-title{color:#fff;font-weight:900;letter-spacing:-.02em}
.guide-step .gs-num,.guide-toc-num{background:#004AAD;color:#fff;border-radius:10px}

/* forms (contact, delete-user) */
input[type=text],input[type=email],input[type=tel],input[type=password],select,textarea{background:var(--dx-card2);border:1px solid var(--dx-line);border-radius:12px;color:#fff}
input:focus,select:focus,textarea:focus{border-color:#1F6FE0;outline:none}

/* ── Pricing ───────────────────────────────────────────────── */
.pricing-hero{background:none;padding:28px var(--px) 40px}
.pricing-hero-orb{display:none}
.pricing-hero-inner{max-width:1480px;border-radius:32px;border:1px solid var(--b);padding:clamp(28px,4.5vw,64px) clamp(22px,4vw,56px);
  background:radial-gradient(90% 140% at 50% 0%,#0b2a5a 0%,#101a24 55%,#14181B 100%);overflow:hidden}
.pricing-hero h1{font-size:clamp(34px,5.4vw,68px);letter-spacing:-.035em;line-height:1}
.billing-badge{background:rgba(31,111,224,.14);border-color:rgba(91,155,255,.32);color:#A9C9FF}
.pricing-section{background:transparent}
.plan-card{background:var(--dx-card);border:1px solid var(--dx-line);border-radius:28px}
.plan-card.featured{border:2px solid #1F6FE0;box-shadow:0 0 0 6px rgba(31,111,224,.10),0 24px 60px rgba(0,0,0,.35);
  background:radial-gradient(120% 70% at 50% 0%,rgba(31,111,224,.20),transparent 60%),var(--dx-card)}
.plan-card.featured::after{display:none}
.plan-badge{background:rgba(31,111,224,.16);border-color:rgba(91,155,255,.45);color:#A9C9FF}
.plan-card.featured .plan-check,.plan-check{background:rgba(31,111,224,.16);border-color:rgba(91,155,255,.32);color:#7FB0FF}
.plan-cycle{background:rgba(255,255,255,.05);border-color:var(--b)}
.plan-cta{border-radius:12px}
.plan-cta.cta-default{background:transparent;border:1px solid #3A4852;color:#fff}
.plan-cta.cta-default:hover{background:transparent;border-color:var(--muted);box-shadow:none;transform:none}
.plan-cta.cta-featured,.plan-cta.cta-premium{background:#004AAD;color:#fff}
.plan-cta.cta-featured:hover,.plan-cta.cta-premium:hover{background:#1F6FE0;box-shadow:none;transform:none}
.secure-badge{background:var(--dx-card);border-color:var(--dx-line)}

/* 4 plans (Free, Rising Star, Pro Artist, Icon) — 2026-11-13 */
.pricing-grid.pricing-grid-4{max-width:1360px;grid-template-columns:1fr}
@media (min-width:700px){.pricing-grid.pricing-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1180px){.pricing-grid.pricing-grid-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.pricing-grid-4 .plan-card{padding:28px 24px}.pricing-grid-4 .plan-price{font-size:34px}}
.pricing-grid-4 .plan-card.featured{transform:none}
.pricing-grid-4 .plan-card.featured:hover,.pricing-grid-4 .plan-card:hover{transform:translateY(-4px)}
.plan-feature.is-no{color:var(--muted)}
.plan-feature.is-no .plan-check{background:rgba(255,255,255,.04);border-color:var(--b2);color:var(--muted)}
.pricing-fine{max-width:760px;margin:28px auto 0;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.pricing-fine p{font-size:13px;color:var(--muted);line-height:1.65}
.pricing-fine a{color:var(--accent)}

/* AJAX page swap keeps working with the sticky header */
main{min-height:50vh}
@media (max-width:1024px){ .page-header{padding-top:16px} .pricing-hero{padding-top:16px} }