:root {
  --black: #040404;
  --black-2: #080808;
  --panel: rgba(13, 13, 13, 0.86);
  --panel-2: #111;
  --text: #f7f7f7;
  --soft: #c9c9c9;
  --muted: #898989;
  --line: rgba(255,255,255,0.09);
  --line-2: rgba(255,255,255,0.15);
  --red: #d61f1f;
  --red-2: #ff2c2c;
  --red-dark: #951111;
  --font-body: Inter, system-ui, -apple-system, Segoe UI, sans-serif;
  --font-head: Oswald, Impact, sans-serif;
  --shadow: 0 24px 70px rgba(0,0,0,.62);
  --top: 34px;
  --head: 84px;
  --header-total: 118px;
  --max: 1380px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; background: var(--black); }
body {
  min-height: 100vh;
  color: var(--text);
  font-family: var(--font-body);
  line-height: 1.6;
  background:
    radial-gradient(circle at 15% 0%, rgba(214,31,31,.12), transparent 28%),
    radial-gradient(circle at 100% 18%, rgba(255,255,255,.04), transparent 24%),
    linear-gradient(180deg, #030303, #070707 42%, #050505);
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { font: inherit; }
.container { width: min(var(--max), calc(100% - 48px)); margin-inline: auto; }
.skip-link { position:absolute; left:-9999px; top:8px; background:var(--red); color:#fff; padding:10px 14px; border-radius:10px; z-index:9999; font-weight:800; }
.skip-link:focus { left:8px; }
::selection { background: var(--red); color: #fff; }
::-webkit-scrollbar { width: 9px; }
::-webkit-scrollbar-track { background: #070707; }
::-webkit-scrollbar-thumb { background: #2c2c2c; border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--red); }
.background-rig { position: fixed; inset: 0; pointer-events: none; z-index: -4; opacity: .38; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 120px 120px; mask-image: radial-gradient(circle at center, #000 22%, transparent 78%); }
.background-rig::after { content:""; position:absolute; inset:0; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='0.08'/></svg>"); }

.top-bar { position: fixed; top:0; left:0; right:0; height: var(--top); z-index: 1000; background: rgba(0,0,0,.92); border-bottom:1px solid rgba(255,255,255,.05); backdrop-filter: blur(12px); }
.top-bar-inner { height:100%; display:flex; align-items:center; justify-content:space-between; color:var(--soft); font-size:.78rem; text-transform:uppercase; letter-spacing:2px; font-weight:800; }
.top-bar span { color: var(--red-2); margin-right:7px; }

.site-header { position: fixed; top: var(--top); left:0; right:0; height: var(--head); z-index: 999; background: rgba(5,5,5,.82); backdrop-filter: blur(22px); border-bottom: 1px solid rgba(214,31,31,.28); box-shadow: 0 14px 35px rgba(0,0,0,.5); }
.site-header::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background: linear-gradient(90deg, transparent, rgba(214,31,31,.7), transparent); }
.header-inner { height:100%; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { height:70px; display:flex; align-items:center; max-width: 260px; position:relative; isolation:isolate; }
.brand::before { content:""; position:absolute; inset: 8px -14px; background: radial-gradient(circle, rgba(214,31,31,.32), transparent 70%); filter: blur(13px); z-index:-1; }
.brand img { height:100%; width:auto; object-fit:contain; filter: brightness(1.38) contrast(1.22) saturate(1.3) drop-shadow(0 0 10px rgba(255,255,255,.17)) drop-shadow(0 0 18px rgba(214,31,31,.42)); transition:.28s ease; }
.brand:hover img { transform: scale(1.025); filter: brightness(1.52) contrast(1.25) saturate(1.38) drop-shadow(0 0 14px rgba(255,255,255,.24)) drop-shadow(0 0 24px rgba(214,31,31,.55)); }
.desktop-nav { display:flex; align-items:center; gap:28px; }
.desktop-nav a { color: var(--soft); font-family:var(--font-head); text-transform:uppercase; letter-spacing:1.6px; font-size:1rem; font-weight:700; position:relative; transition:.22s ease; }
.desktop-nav a:not(.nav-phone)::after { content:""; position:absolute; left:0; bottom:-8px; width:0; height:2px; background: var(--red-2); transition: width .22s ease; }
.desktop-nav a:hover { color:#fff; }
.desktop-nav a:hover::after { width:100%; }
.nav-phone { padding:13px 22px; color:#fff!important; border-radius:999px; background:linear-gradient(135deg,var(--red),var(--red-dark)); box-shadow: 0 12px 30px rgba(214,31,31,.26); }
.nav-phone:hover { transform: translateY(-1px); box-shadow: 0 18px 40px rgba(214,31,31,.35); }
.menu-toggle { display:none; width:46px; height:42px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.02); cursor:pointer; align-items:center; justify-content:center; }
.menu-toggle span, .menu-toggle span::before, .menu-toggle span::after { content:""; display:block; width:23px; height:2px; border-radius:99px; background:#fff; position:relative; transition:.22s ease; }
.menu-toggle span::before { position:absolute; top:-7px; }
.menu-toggle span::after { position:absolute; top:7px; }
.mobile-menu { display:none; position: fixed; top: var(--header-total); left:0; right:0; bottom:0; z-index: 998; transform: translateX(100%); transition: transform .28s ease; background: rgba(4,4,4,.98); padding: 28px 24px 110px; border-top:1px solid var(--line); overflow:auto; }
.mobile-menu.open { transform: translateX(0); }
.mobile-menu a { display:block; padding:16px 0; border-bottom:1px solid rgba(255,255,255,.07); font-family:var(--font-head); text-transform:uppercase; letter-spacing:1.8px; color:var(--soft); font-size:1.25rem; }
.mobile-menu .mobile-call { color:#fff; }

.hero { position:relative; min-height: calc(100vh - var(--header-total)); margin-top:var(--header-total); overflow:hidden; isolation:isolate; }
.hero-media { position:absolute; inset:0; background: linear-gradient(90deg, rgba(0,0,0,.88), rgba(0,0,0,.74) 36%, rgba(0,0,0,.28) 66%, rgba(0,0,0,.45)), linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.58)), url('../img/ckr-hero-performance-shop.png') center/cover no-repeat; z-index:-3; transform:scale(1.03); }
.hero::before { content:""; position:absolute; inset:0; z-index:-2; background: radial-gradient(circle at 18% 28%, rgba(214,31,31,.16), transparent 24%), radial-gradient(circle at 77% 65%, rgba(255,255,255,.04), transparent 22%); }
.hero-scan { position:absolute; inset:0; pointer-events:none; z-index:-1; background: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px); background-size:100% 4px; opacity:.14; }
.hero-grid { min-height: calc(100vh - var(--header-total)); display:grid; grid-template-columns: minmax(0, 1fr); gap:0; align-items:center; padding:70px 0 54px; }
.hero-copy { max-width:840px; position:relative; }
.hero-copy::after { content:""; position:absolute; left:0; bottom:-36px; width:min(540px,70vw); height:1px; background:linear-gradient(90deg, rgba(214,31,31,.78), rgba(255,255,255,.14), transparent); opacity:.9; }
.hero-copy::before { content:""; position:absolute; left:-48px; top:-44px; width:360px; height:360px; background:radial-gradient(circle, rgba(214,31,31,.12), transparent 72%); filter:blur(8px); z-index:-1; pointer-events:none; }
.eyebrow, .kicker { display:inline-flex; align-items:center; gap:10px; color:var(--red-2); font-family:var(--font-head); text-transform:uppercase; letter-spacing:3.5px; font-size:.92rem; font-weight:700; margin-bottom:16px; }
.eyebrow::before, .kicker::before { content:""; width:38px; height:3px; background:linear-gradient(90deg,var(--red),var(--red-2)); border-radius:99px; }
.hero h1 { font-family:var(--font-head); font-size: clamp(3.5rem, 8vw, 7.8rem); line-height:.9; text-transform:uppercase; letter-spacing:1.2px; margin-bottom:22px; text-shadow: 0 14px 40px rgba(0,0,0,.56); }
.hero h1 span { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.62); text-stroke: 1px rgba(255,255,255,.62); }
.hero p { max-width:650px; color:var(--soft); font-size: clamp(1rem, 1.5vw, 1.18rem); line-height:1.86; font-weight:500; margin-bottom:28px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:28px; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:56px; padding:14px 26px; border-radius:14px; font-family:var(--font-head); text-transform:uppercase; letter-spacing:1.9px; font-weight:700; font-size:1.08rem; transition:.26s ease; }
.btn-red { background:linear-gradient(135deg,var(--red),var(--red-dark)); color:#fff; box-shadow:0 16px 36px rgba(214,31,31,.27); border:1px solid rgba(255,255,255,.08); }
.btn-red:hover { transform:translateY(-2px); box-shadow:0 22px 50px rgba(214,31,31,.38); }
.btn-ghost { background:rgba(255,255,255,.025); border:1px solid rgba(255,255,255,.16); color:#fff; backdrop-filter:blur(10px); }
.btn-ghost:hover { transform:translateY(-2px); border-color:rgba(214,31,31,.62); }
.badge-row { display:flex; flex-wrap:wrap; gap:10px; }
.badge-row span { padding:10px 14px; border-radius:999px; border:1px solid rgba(255,255,255,.11); background:rgba(0,0,0,.38); color:var(--soft); text-transform:uppercase; letter-spacing:1.25px; font-size:.78rem; font-weight:800; backdrop-filter:blur(12px); }
.hero-card { justify-self:end; width:min(100%,450px); padding:28px; border-radius:26px; border:1px solid rgba(255,255,255,.09); background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),rgba(8,8,8,.74); backdrop-filter:blur(24px); box-shadow: var(--shadow); position:relative; overflow:hidden; }
.hero-card::before { content:""; position:absolute; right:-90px; top:-90px; width:240px; height:240px; background:radial-gradient(circle,rgba(214,31,31,.22),transparent 70%); }
.card-topline { color:var(--muted); text-transform:uppercase; letter-spacing:2.2px; font-size:.78rem; font-weight:800; margin-bottom:14px; }
.hero-card h2 { font-family:var(--font-head); text-transform:uppercase; line-height:1; letter-spacing:1px; font-size:2.35rem; margin-bottom:20px; }
.hero-card-list { display:grid; gap:14px; margin-bottom:22px; }
.hero-card-list div { display:grid; grid-template-columns:48px 1fr; gap:14px; align-items:center; border:1px solid rgba(255,255,255,.065); background:rgba(255,255,255,.024); border-radius:16px; padding:14px; }
.hero-card-list strong { font-family:var(--font-head); font-size:1.35rem; color:var(--red-2); }
.hero-card-list span { color:var(--soft); font-size:.96rem; line-height:1.55; }
.mini-call { display:flex; justify-content:center; align-items:center; min-height:48px; border-radius:12px; background:linear-gradient(135deg,var(--red),var(--red-dark)); font-family:var(--font-head); text-transform:uppercase; letter-spacing:1.7px; }
.scroll-cue { position:absolute; left:50%; bottom:22px; transform:translateX(-50%); font-family:var(--font-head); text-transform:uppercase; letter-spacing:3px; color:var(--soft); font-size:.78rem; }
.scroll-cue::after { content:""; display:block; width:18px; height:18px; margin:8px auto 0; border-right:2px solid var(--red-2); border-bottom:2px solid var(--red-2); transform:rotate(45deg); }

.trust-band { background:rgba(7,7,7,.96); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.trust-grid div { text-align:center; padding:23px 18px; border-right:1px solid rgba(255,255,255,.065); }
.trust-grid div:last-child { border-right:0; }
.trust-grid strong { display:block; font-family:var(--font-head); text-transform:uppercase; letter-spacing:1px; font-size:1.35rem; }
.trust-grid span { color:var(--muted); font-weight:600; font-size:.94rem; }

.section { padding:110px 0; position:relative; scroll-margin-top:130px; }
.section-head { text-align:center; margin-bottom:54px; }
.section-head .kicker { justify-content:center; }
.section-head .kicker::before { display:none; }
.section-head h2, .proof h2, .contact h2 { font-family:var(--font-head); text-transform:uppercase; font-size:clamp(3rem,7vw,5.6rem); line-height:.95; letter-spacing:1px; }
.red-rule { width:170px; height:4px; margin:14px auto 18px; background:linear-gradient(90deg,transparent,var(--red),var(--red-2),var(--red),transparent); border-radius:99px; }
.section-head p, .proof-wrap > p:not(.kicker), .contact-card > p:not(.kicker) { color:var(--muted); text-transform:uppercase; letter-spacing:2px; font-weight:800; line-height:1.8; }
.services, .platforms, .proof, .contact { background:rgba(10,10,10,.72); }
.build-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.build-card, .platform-card, .process-card, .quality-grid article, .proof-box, .faq-list details, .contact-card { border:1px solid rgba(255,255,255,.075); border-radius:24px; background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.01)),rgba(12,12,12,.95); box-shadow:var(--shadow); }
.build-card { padding:30px 24px; position:relative; overflow:hidden; transition:.26s ease; }
.build-card::before { content:""; position:absolute; inset:0 0 auto 0; height:4px; background:linear-gradient(90deg,rgba(214,31,31,.2),var(--red),rgba(214,31,31,.2)); }
.build-card:hover { transform:translateY(-7px); border-color:rgba(214,31,31,.38); }
.num { display:block; font-family:var(--font-head); font-size:4.2rem; line-height:1; color:rgba(255,255,255,.11); margin-bottom:13px; }
.build-card h3, .quality-grid h3, .platform-card h3, .process-card h3 { font-family:var(--font-head); text-transform:uppercase; letter-spacing:1px; line-height:1.05; }
.build-card h3 { font-size:1.75rem; margin-bottom:14px; }
.build-card p, .quality-grid p, .platform-card p, .process-card p { color:var(--soft); line-height:1.86; }
.chip, .tag-list span { display:inline-flex; padding:8px 12px; border:1px solid var(--line); border-radius:999px; color:var(--muted); text-transform:uppercase; letter-spacing:1.2px; font-size:.72rem; font-weight:800; margin-top:18px; }
.standard { background:radial-gradient(circle at 80% 15%, rgba(214,31,31,.08), transparent 24%); }
.standard-grid { display:grid; grid-template-columns:1fr 1.08fr; gap:30px; align-items:stretch; }
.standard-copy { padding:40px 36px; border-left:3px solid var(--red); border-radius:24px; background:rgba(10,10,10,.8); border-top:1px solid var(--line); border-right:1px solid var(--line); border-bottom:1px solid var(--line); box-shadow:var(--shadow); }
.standard-copy h2 { font-family:var(--font-head); text-transform:uppercase; line-height:.95; font-size:clamp(3rem,6vw,5rem); margin-bottom:20px; }
.standard-copy h2 span { color:var(--red-2); }
.standard-copy p { color:var(--soft); line-height:1.9; font-size:1.05rem; margin-bottom:20px; }
.quality-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.quality-grid article { text-align:center; padding:28px 22px; transition:.26s ease; }
.quality-grid article:hover { transform:translateY(-5px); border-color:rgba(214,31,31,.36); }
.quality-grid .featured { background:linear-gradient(180deg,rgba(214,31,31,.12),rgba(255,255,255,.012)),rgba(12,12,12,.95); border-color:rgba(214,31,31,.46); }
.quality-grid article > span { display:grid; place-items:center; width:66px; height:66px; margin:0 auto 18px; border-radius:50%; border:1px solid rgba(255,255,255,.1); background:radial-gradient(circle at 30% 30%, rgba(214,31,31,.2), rgba(255,255,255,.02)); font-size:1.6rem; }
.quality-grid h3 { font-size:1.45rem; margin-bottom:12px; }
.platform-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.platform-card { padding:38px 34px; border-left:5px solid var(--red); }
.platform-card h3 { font-size:clamp(2.2rem,4vw,3.2rem); margin-bottom:16px; }
.tag-list { display:flex; flex-wrap:wrap; gap:10px; }
.tag-list span { margin-top:8px; color:var(--soft); }
.process { background:rgba(4,4,4,.6); }
.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.process-card { padding:32px 26px; }
.process-card > span { display:block; color:var(--red-2); text-transform:uppercase; letter-spacing:2px; font-weight:900; margin-bottom:14px; }
.process-card h3 { font-size:2rem; margin-bottom:12px; }
.proof-wrap { max-width:1000px; text-align:center; }
.proof-wrap > p:not(.kicker) { max-width:780px; margin:0 auto 32px; text-transform:none; letter-spacing:0; font-size:1.06rem; font-weight:500; color:var(--soft); }
.proof-box { padding:44px 28px; background:linear-gradient(135deg,rgba(214,31,31,.10),transparent 38%),rgba(12,12,12,.95); }
.proof-box strong { display:block; font-family:var(--font-head); text-transform:uppercase; font-size:clamp(2rem,4vw,3rem); margin-bottom:12px; }
.proof-box span { color:var(--muted); text-transform:uppercase; letter-spacing:2px; font-weight:800; }
.faq-list { max-width:980px; margin:0 auto; display:grid; gap:16px; }
.faq-list details { padding:0; overflow:hidden; }
.faq-list summary { list-style:none; cursor:pointer; padding:24px 60px 24px 24px; font-family:var(--font-head); text-transform:uppercase; font-size:1.45rem; letter-spacing:1px; position:relative; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:"+"; position:absolute; right:22px; top:50%; transform:translateY(-50%); color:var(--red-2); font-size:1.8rem; }
.faq-list details[open] summary::after { content:"–"; }
.faq-list p { color:var(--soft); padding:0 24px 24px; line-height:1.9; }
.faq-list a { color:#fff; font-weight:800; }
.contact { background:radial-gradient(circle at center top, rgba(214,31,31,.12), transparent 30%), rgba(10,10,10,.86); }
.contact-card { max-width:930px; text-align:center; padding:48px 36px; position:relative; overflow:hidden; }
.contact-card::before { content:""; position:absolute; top:-120px; left:50%; transform:translateX(-50%); width:420px; height:260px; background:radial-gradient(circle,rgba(214,31,31,.18),transparent 70%); filter:blur(16px); }
.contact-card * { position:relative; }
.contact-card p:not(.kicker) { max-width:720px; margin:0 auto 28px; color:var(--soft); text-transform:none; letter-spacing:0; font-size:1.08rem; font-weight:500; }
.contact-call { display:inline-flex; align-items:center; justify-content:center; min-height:68px; min-width:330px; padding:16px 34px; border-radius:16px; background:linear-gradient(135deg,var(--red),var(--red-dark)); font-family:var(--font-head); text-transform:uppercase; letter-spacing:2px; font-size:1.5rem; box-shadow:0 20px 46px rgba(214,31,31,.32); transition:.26s ease; }
.contact-call:hover { transform:translateY(-2px); box-shadow:0 26px 58px rgba(214,31,31,.42); }
.contact-card small { display:block; margin-top:20px; color:var(--muted); }
.site-footer { background:#030303; border-top:2px solid var(--red); padding:72px 0 26px; }
.footer-grid { display:grid; grid-template-columns:1.2fr .8fr 1fr 1fr; gap:34px; }
.footer-grid h2, .footer-grid h3 { font-family:var(--font-head); text-transform:uppercase; }
.footer-brand h2 { line-height:.93; font-size:clamp(3rem,5vw,4.8rem); margin-bottom:18px; }
.footer-brand h2 span { display:block; color:var(--red-2); }
.footer-grid h3 { letter-spacing:1.4px; font-size:1.45rem; margin-bottom:16px; }
.footer-grid p { color:var(--soft); line-height:1.88; }
.footer-grid a { display:block; color:var(--soft); text-transform:uppercase; letter-spacing:1.2px; font-weight:800; margin-bottom:10px; transition:.22s ease; }
.footer-grid a:hover { color:#fff; transform:translateX(5px); }
.footer-phone { color:var(--red-2)!important; font-family:var(--font-head); font-size:1.8rem; margin-top:16px; }
.footer-bottom { border-top:1px solid var(--line); color:#666; text-align:center; padding-top:22px; margin-top:44px; text-transform:uppercase; letter-spacing:1.5px; font-size:.82rem; font-weight:800; }
.reveal { opacity:0; transform:translateY(18px); transition:opacity .62s ease, transform .62s ease; }
.reveal.is-visible { opacity:1; transform:none; }
.sticky-call { display:none; }

@media (max-width:1220px) { .hero-grid { grid-template-columns:1fr; } .build-grid { grid-template-columns:repeat(2,1fr); } .footer-grid { grid-template-columns:repeat(2,1fr); } .desktop-nav { gap:18px; } }
@media (max-width:980px) { .desktop-nav { display:none; } .menu-toggle { display:flex; } .mobile-menu { display:block; } .trust-grid, .standard-grid, .platform-grid, .process-grid { grid-template-columns:1fr; } .trust-grid div { border-right:0; border-bottom:1px solid rgba(255,255,255,.065); } .trust-grid div:last-child { border-bottom:0; } .quality-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:720px) { .container { width: min(var(--max), calc(100% - 32px)); } .top-bar-inner { justify-content:center; font-size:.72rem; letter-spacing:1.4px; } .top-bar-inner div { display:none; } .brand { height:62px; max-width:200px; } .hero, .hero-grid { min-height:auto; } .hero-grid { padding:54px 0 48px; } .hero h1 { font-size: clamp(3rem, 16vw, 5.4rem); } .hero-actions, .standard-copy .hero-actions { flex-direction:column; align-items:stretch; } .btn, .contact-call { width:100%; min-width:0; } .hero-copy::after { width:70%; } .scroll-cue { display:none; } .section { padding:84px 0; } .section-head h2, .proof h2, .contact h2 { font-size: clamp(2.7rem, 14vw, 4.4rem); } .build-grid, .quality-grid, .footer-grid { grid-template-columns:1fr; } .contact-card, .standard-copy, .platform-card, .process-card, .build-card { padding-left:22px; padding-right:22px; } .sticky-call { display:block; position:fixed; left:0; right:0; bottom:0; z-index:1200; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:linear-gradient(180deg,transparent,rgba(0,0,0,.88)); backdrop-filter:blur(10px); } .sticky-call a { display:flex; justify-content:center; align-items:center; min-height:58px; border-radius:16px; background:linear-gradient(135deg,var(--red),var(--red-dark)); font-family:var(--font-head); text-transform:uppercase; letter-spacing:1.5px; box-shadow:0 18px 40px rgba(214,31,31,.28); } .site-footer { padding-bottom:92px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *, *::before, *::after { transition:none!important; animation:none!important; } .reveal { opacity:1!important; transform:none!important; } }