/* Cypherme FZE — shared site styles */
:root { --ink:#eaf1ff; --muted:#9badc9; --navy:#071327; --panel:#0d1d36; --line:rgba(185,211,255,.16); --cyan:#45d8ff; --violet:#9474ff; --green:#73f0bd; --max:1180px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font:16px/1.65 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--ink); background:var(--navy); }
body::before { content:""; position:fixed; inset:0; z-index:-2; background:radial-gradient(circle at 15% 0%,rgba(69,216,255,.16),transparent 29rem),radial-gradient(circle at 90% 12%,rgba(148,116,255,.15),transparent 27rem),#071327; }
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible { outline:3px solid var(--green); outline-offset:4px; }
.container { width:min(calc(100% - 2.5rem),var(--max)); margin:auto; }
.site-header { position:sticky; top:0; z-index:10; background:rgba(7,19,39,.78); backdrop-filter:blur(16px); border-bottom:1px solid var(--line); }
.header-inner { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.logo { display:flex; align-items:center; gap:.65rem; font-size:1.2rem; font-weight:800; letter-spacing:.02em; }
.logo-mark { width:30px; height:30px; display:grid; place-items:center; color:#061326; background:linear-gradient(135deg,var(--cyan),var(--violet)); clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); font-size:.8rem; }
.nav-toggle { display:none; color:var(--ink); background:transparent; border:1px solid var(--line); border-radius:8px; padding:.45rem .6rem; font:inherit; }
.site-nav { display:flex; align-items:center; gap:.25rem; }
.site-nav a { color:var(--muted); padding:.5rem .75rem; border-radius:7px; font-size:.92rem; }
.site-nav a:hover,.site-nav a[aria-current="page"] { color:var(--ink); background:rgba(255,255,255,.07); }
.nav-contact { border:1px solid rgba(69,216,255,.5); color:var(--ink)!important; }
.hero { padding:7rem 0 5.5rem; min-height:600px; display:grid; align-items:center; }
.hero-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:4rem; align-items:center; }
.eyebrow { display:inline-flex; gap:.45rem; align-items:center; color:var(--cyan); text-transform:uppercase; letter-spacing:.14em; font-size:.76rem; font-weight:750; }
.eyebrow::before { content:""; width:21px; height:1px; background:currentColor; }
h1,h2,h3,p { margin-top:0; } h1 { max-width:760px; font-size:clamp(2.7rem,6vw,5.15rem); line-height:1.04; letter-spacing:-.055em; margin:.85rem 0 1.35rem; }
h2 { font-size:clamp(2rem,4vw,3.2rem); line-height:1.08; letter-spacing:-.04em; margin-bottom:1rem; } h3 { font-size:1.18rem; line-height:1.25; margin-bottom:.5rem; }
.lead { max-width:650px; color:var(--muted); font-size:1.12rem; }
.actions { display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2rem; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:.45rem; padding:.75rem 1.1rem; border:1px solid transparent; border-radius:8px; font-weight:700; transition:.2s ease; }
.button-primary { background:linear-gradient(120deg,var(--cyan),#6faefb); color:#041426; } .button-primary:hover { transform:translateY(-2px); box-shadow:0 12px 35px rgba(69,216,255,.22); }
.button-secondary { border-color:var(--line); color:var(--ink); } .button-secondary:hover { background:rgba(255,255,255,.07); }
.hero-visual { position:relative; min-height:370px; display:grid; place-items:center; }
.orb { width:min(86vw,340px); aspect-ratio:1; position:relative; border:1px solid rgba(105,206,255,.48); border-radius:50%; background:radial-gradient(circle at 38% 35%,rgba(69,216,255,.4),rgba(13,29,54,.2) 38%,transparent 70%); box-shadow:inset 0 0 80px rgba(69,216,255,.12),0 0 80px rgba(148,116,255,.14); }
.orb::before,.orb::after { content:""; position:absolute; border:1px solid rgba(148,116,255,.48); border-radius:50%; inset:-28px 45px; transform:rotate(63deg); } .orb::after { inset:46px -30px; border-color:rgba(115,240,189,.38); transform:rotate(-32deg); }
.signal { position:absolute; padding:.6rem .8rem; background:rgba(13,29,54,.85); border:1px solid var(--line); border-radius:8px; box-shadow:0 12px 32px rgba(0,0,0,.22); font-size:.8rem; color:var(--muted); } .signal strong { display:block; color:var(--ink); font-size:1rem; } .signal.one { top:12%; right:0; } .signal.two { bottom:12%; left:0; }
.section { padding:5.75rem 0; } .section-alt { background:rgba(255,255,255,.025); border-block:1px solid var(--line); }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:2.5rem; } .section-heading p { max-width:500px; color:var(--muted); margin-bottom:0; }
.grid { display:grid; gap:1.25rem; } .cards-3 { grid-template-columns:repeat(3,1fr); } .cards-2 { grid-template-columns:repeat(2,1fr); }
.card { padding:1.65rem; background:linear-gradient(145deg,rgba(21,44,78,.72),rgba(10,26,50,.6)); border:1px solid var(--line); border-radius:12px; } .card p { color:var(--muted); margin-bottom:0; }
.card-icon { display:grid; place-items:center; width:43px; height:43px; margin-bottom:1.15rem; border-radius:10px; color:var(--cyan); background:rgba(69,216,255,.11); font-size:1.3rem; }
.stat-row { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:3.5rem; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--line); } .stat { padding:1.2rem 1.5rem; background:#0a1930; } .stat strong { display:block; font-size:1.65rem; } .stat span { color:var(--muted); font-size:.9rem; }
.page-intro { padding:5.8rem 0 3.8rem; border-bottom:1px solid var(--line); } .page-intro h1 { font-size:clamp(2.7rem,5vw,4.4rem); margin-bottom:.75rem; }
.page-intro .lead { max-width:730px; }
.check-list { padding:0; list-style:none; color:var(--muted); } .check-list li { position:relative; padding-left:1.55rem; margin:.55rem 0; } .check-list li::before { content:"✓"; position:absolute; left:0; color:var(--green); font-weight:800; }
.split { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; } .split p { color:var(--muted); }
.process { counter-reset:process; } .process .card::before { counter-increment:process; content:"0" counter(process); display:block; margin-bottom:1rem; color:var(--cyan); font-weight:800; font-size:.85rem; letter-spacing:.12em; }
.partner { display:flex; align-items:center; gap:1rem; min-height:100px; } .partner b { font-size:1.1rem; } .partner span { color:var(--muted); font-size:.92rem; }
.contact-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:2rem; } .contact-details p { color:var(--muted); } .contact-details a { color:var(--cyan); }
form { display:grid; gap:1rem; } label { display:grid; gap:.4rem; font-size:.9rem; font-weight:650; } input,textarea { width:100%; padding:.78rem .85rem; font:inherit; color:var(--ink); background:#091a33; border:1px solid var(--line); border-radius:7px; } textarea { min-height:135px; resize:vertical; } input:focus,textarea:focus { outline:none; border-color:var(--cyan); }
.notice { display:none; margin:.5rem 0 0; color:var(--green); font-weight:650; }
.cta { padding:3rem; text-align:center; background:linear-gradient(120deg,rgba(69,216,255,.14),rgba(148,116,255,.14)); border:1px solid var(--line); border-radius:14px; } .cta p { color:var(--muted); }
.site-footer { padding:3rem 0 1.4rem; color:var(--muted); border-top:1px solid var(--line); } .footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:2rem; margin-bottom:2.5rem; } .site-footer h3 { color:var(--ink); font-size:.95rem; } .site-footer a { display:block; margin:.3rem 0; } .site-footer a:hover { color:var(--cyan); } .copyright { padding-top:1.25rem; border-top:1px solid var(--line); font-size:.85rem; }
@media (max-width:760px) { .nav-toggle { display:block; } .site-nav { display:none; position:absolute; top:76px; left:0; right:0; padding:1rem 1.25rem; flex-direction:column; align-items:stretch; background:#0a1930; border-bottom:1px solid var(--line); } .site-nav.open { display:flex; } .site-nav a { padding:.7rem; } .hero { padding:4.5rem 0; min-height:0; } .hero-grid,.split,.contact-layout { grid-template-columns:1fr; gap:2.2rem; } .hero-visual { min-height:300px; } .cards-3,.cards-2,.stat-row,.footer-grid { grid-template-columns:1fr; } .section { padding:4rem 0; } .section-heading { display:block; } .section-heading p { margin-top:.8rem; } .page-intro { padding:4.25rem 0 3rem; } }
