:root{ --bg:#050505; --ink:#e9e9e9; --accent:#e50914; /* deep red */ --accent-2:#ff3344; /* bright red */ --panel:#0d0d0d; --muted:#a8a8a8; } /* iOS bottom bar fix: give a solid dark bg */ html { background:#050505; } *{box-sizing:border-box} html,body{height:100%} body{ margin:0; background:radial-gradient(1200px 600px at 70% -10%, rgba(229,9,20,.08), transparent 60%) , linear-gradient(180deg,#000 0%, #0a0a0a 100%); color:var(--ink); font-family:'Inter', ui-sans-serif, -apple-system, system-ui, Segoe UI, Roboto, Arial; line-height:1.65; } a{color:var(--ink); text-decoration:none} a:hover{color:var(--accent-2)} h1,h2,h3{margin:0 0 .6rem} h2{font-size:clamp(22px,3.2vw,28px)} h3{font-size:clamp(18px,2.6vw,22px)} .nav{ position:sticky; top:0; z-index:10; display:flex; align-items:center; justify-content:space-between; padding:12px 20px; background:rgba(5,5,5,.6); backdrop-filter:blur(8px); border-bottom:1px solid rgba(229,9,20,.18); } .brand{font-weight:800; letter-spacing:.3px} .menu a{margin-left:16px; opacity:.9} .menu .button{margin-left:16px} .hero{ padding:90px 20px 36px; max-width:1200px; margin:0 auto; text-align:center; } h1{font-size:clamp(38px,6vw,64px); line-height:1.1} .subtitle{opacity:.95; font-size:clamp(16px,2.2vw,20px); margin-top:8px} .cta{margin-top:22px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap} .button{ display:inline-block; padding:12px 16px; border-radius:12px; border:1px solid var(--accent); background:transparent; color:var(--ink); transition:transform .08s ease, box-shadow .18s ease, background .18s ease; } .button:hover{ transform:translateY(-1px); box-shadow:0 0 20px rgba(229,9,20,.35), 0 0 2px rgba(229,9,20,.6) inset } .button.ghost{ border-color:rgba(229,9,20,.5) } .button.small{padding:10px 14px; font-size:14px} section{ padding:56px 20px; max-width:1200px; /* wider container */ margin:0 auto; } .grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px } .card{ background:var(--panel); border:1px solid rgba(229,9,20,.18); border-radius:16px; padding:16px; box-shadow:0 0 0 1px rgba(229,9,20,.06) inset; } .glow{ box-shadow:0 0 30px rgba(229,9,20,.06), inset 0 0 0 1px rgba(229,9,20,.08) } .badge{ display:inline-block; border:1px solid rgba(229,9,20,.45); padding:2px 8px; border-radius:999px; font-size:12px; margin-right:6px; opacity:.9 } .chip{ display:inline-block; padding:6px 10px; border-radius:999px; border:1px solid rgba(229,9,20,.35); font-size:13px; opacity:.95; } /* ABOUT (text only, fixed) */ .about-wrap.text-only{display:block} .about-text{ min-width:0; max-width:900px; /* wide text block */ margin:0 auto; } .about-text p{ max-width:none; text-align:justify; /* straight edges left & right */ } .bullets{ margin:14px 0 0 0; padding-left:20px; color:var(--ink) } .bullets.tight li{margin:.45rem 0} .bullets li strong{color:var(--ink)} .bullets li{max-width:none} /* Pills */ .pill-grid{display:flex; flex-wrap:wrap; gap:10px} .pill{ border:1px solid rgba(229,9,20,.35); padding:6px 10px; border-radius:999px; font-size:13px; background:rgba(229,9,20,.06) } /* Quotes */ .quote{ background:var(--panel); border-left:3px solid var(--accent); padding:16px; border-radius:12px; opacity:.95 } .quote span{display:block; margin-top:6px; color:var(--muted); font-size:14px} .final-cta{ text-align:center; padding-top:24px } .muted{color:var(--muted); font-size:14px; margin-top:8px} footer{ padding:28px 20px; text-align:center; opacity:.75; border-top:1px solid rgba(229,9,20,.12) } /* ===== Contact Page ===== */ .contact-wrap{ max-width:760px; margin:0 auto; } .ea-form{ margin-top:18px; display:grid; grid-template-columns:1fr 1fr; gap:14px; } .ea-form label{ display:flex; flex-direction:column; gap:8px; } .ea-form label.full{ grid-column:1 / -1; } .ea-form span{ font-weight:600; letter-spacing:.2px; } .ea-form input, .ea-form textarea{ background:#0b0b0b; border:1px solid rgba(229,9,20,.35); color:var(--ink); border-radius:12px; padding:12px 14px; outline:none; transition:border-color .15s ease, box-shadow .2s ease; } .ea-form input::placeholder, .ea-form textarea::placeholder{ color:#8f8f8f; } .ea-form input:focus, .ea-form textarea:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(229,9,20,.18); } .button.submit{ grid-column:1 / -1; justify-self:start; padding:12px 18px; border:1px solid var(--accent); } .contact-quick{ margin-top:14px; justify-content:flex-start; } /* Mobile layout */ @media (max-width:720px){ .ea-form{ grid-template-columns:1fr; } .button.submit{ justify-self:stretch; text-align:center; } } /* ===== Mobile Navbar Fix (keep menu on one line) ===== */ @media (max-width:768px){ .nav{ padding:10px 12px; } .nav .brand{ font-size:15px; } .nav .menu a{ font-size:14px; margin-left:10px; } .nav .menu .button{ font-size:14px; padding:8px 12px; } }