:root {
  --bg: #050914;
  --bg-2: #07101f;
  --surface: rgba(14, 25, 45, 0.74);
  --surface-2: rgba(255, 255, 255, 0.055);
  --line: rgba(255, 255, 255, 0.11);
  --text: #f6f9ff;
  --muted: #9aa9bf;
  --blue: #1976ff;
  --cyan: #32ddff;
  --cyan-soft: #9aedff;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
  --radius: 26px;
  --container: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 80% 5%, rgba(24, 118, 255, .12), transparent 32%),
    linear-gradient(180deg, #040812 0%, #06101f 45%, #050914 100%);
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  overflow-x: hidden;
}
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img, video { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }

.skip-link { position: fixed; top: -100px; left: 1rem; z-index: 9999; background: white; color: #000; padding: .8rem 1rem; border-radius: 8px; }
.skip-link:focus { top: 1rem; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.section { padding: 110px 0; position: relative; }
.section-label { display: inline-block; color: var(--cyan); font-size: .76rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 16px; }
h1, h2, h3 { font-family: "Space Grotesk", Inter, sans-serif; margin: 0; line-height: 1.02; letter-spacing: -.035em; }
h2 { font-size: clamp(2.4rem, 5vw, 5rem); }
h2 span, h1 span { color: var(--cyan); }
p { margin: 0; color: var(--muted); }

.site-header { position: fixed; inset: 0 0 auto 0; z-index: 1000; border-bottom: 1px solid transparent; transition: .3s ease; }
.site-header.scrolled { background: rgba(4, 8, 18, .86); backdrop-filter: blur(18px); border-color: var(--line); box-shadow: 0 10px 36px rgba(0,0,0,.2); }
.nav-wrap { height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; }
.brand-mark { width: 40px; height: 40px; color: var(--cyan); filter: drop-shadow(0 0 14px rgba(50,221,255,.38)); }
.brand-mark svg { width: 100%; height: 100%; }
.brand-copy { display: grid; gap: 1px; }
.brand-copy strong { font-family: "Space Grotesk", sans-serif; font-size: .94rem; letter-spacing: .05em; }
.brand-copy small { font-size: .55rem; color: var(--muted); letter-spacing: .18em; }
.desktop-nav { display: flex; align-items: center; gap: 28px; margin-left: auto; }
.desktop-nav a { color: #c4cfdf; font-size: .9rem; font-weight: 600; transition: .2s ease; }
.desktop-nav a:hover { color: #fff; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 24px; border-radius: 999px; background: linear-gradient(135deg, var(--blue), #0da8ff 70%, var(--cyan)); color: white; font-weight: 800; font-size: .92rem; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 14px 36px rgba(19, 118, 255, .26); transition: transform .25s ease, box-shadow .25s ease, filter .25s ease; }
.btn:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(19, 118, 255, .38); filter: brightness(1.07); }
.btn-small { min-height: 44px; padding-inline: 19px; }
.btn-ghost { background: rgba(255,255,255,.055); border-color: var(--line); box-shadow: none; backdrop-filter: blur(16px); }
.btn-full { width: 100%; }
.menu-toggle { display: none; width: 46px; height: 46px; border: 1px solid var(--line); background: rgba(255,255,255,.04); border-radius: 14px; align-items: center; justify-content: center; flex-direction: column; gap: 5px; cursor: pointer; }
.menu-toggle span { width: 20px; height: 2px; background: #fff; transition: .25s ease; }
.mobile-menu { display: none; }

.hero { min-height: 100svh; position: relative; display: flex; align-items: center; overflow: hidden; isolation: isolate; padding: 128px 0 90px; }
.hero-video, .hero-fallback, .hero-overlay, .hero-grid { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-video { object-fit: cover; z-index: -5; filter: saturate(.72) contrast(1.12) brightness(.68); }
.hero-fallback { z-index: -6; background: center/cover no-repeat var(--dh-hero-img); }
.hero-overlay { z-index: -4; background: linear-gradient(90deg, rgba(3,7,16,.95) 0%, rgba(3,7,16,.81) 42%, rgba(4,10,22,.36) 72%, rgba(3,8,18,.78) 100%), linear-gradient(180deg, rgba(2,5,13,.22), rgba(2,5,13,.82)); }
.hero-grid { z-index: -3; opacity: .14; background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(to bottom, transparent, #000 25%, #000 75%, transparent); }
.hero::before { content:""; position:absolute; z-index:-2; width:620px; height:620px; right:-120px; top:13%; background: radial-gradient(circle, rgba(17,145,255,.24), transparent 68%); filter: blur(10px); }
.hero-layout { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(340px, .82fr); align-items: center; gap: 70px; }
.hero-copy { max-width: 780px; }
.eyebrow-row { display: flex; align-items: center; gap: 20px; margin-bottom: 12px; flex-wrap: wrap; }
.eyebrow { padding: 9px 12px; border: 1px solid rgba(50,221,255,.32); background: rgba(12,71,110,.18); color: var(--cyan); border-radius: 999px; font-size: .7rem; font-weight: 800; letter-spacing: .16em; }
.story-trigger { display: inline-flex; align-items: center; gap: 9px; background: none; border: 0; padding: 0; cursor: pointer; color: #dbe7f7; font-size: .72rem; letter-spacing: .12em; font-weight: 700; }
.mini-play { width: 32px; height: 32px; border: 1px solid var(--line); background: rgba(255,255,255,.06); display: inline-grid; place-items: center; border-radius: 50%; font-size: .7rem; }
.hero-kicker { margin: 8px 0 6px; color: #dce9f9; font-family: "Space Grotesk", sans-serif; letter-spacing: .18em; font-size: clamp(.82rem, 1.4vw, 1rem); font-weight: 700; }
.hero h1 { font-size: clamp(4rem, 8.5vw, 8.4rem); line-height: .86; max-width: 850px; margin-top: 8px; text-shadow: 0 12px 50px rgba(0,0,0,.45); }
.hero h1 span { display: block; text-shadow: 0 0 32px rgba(50,221,255,.2); }
.hero-text { max-width: 660px; font-size: clamp(1rem, 1.6vw, 1.18rem); margin-top: 28px; color: #c2cfe0; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 32px; }
.hero-proof { display: flex; align-items: center; gap: 16px; margin-top: 34px; }
.avatar-stack { display: flex; }
.avatar-stack img { width: 38px; height: 38px; object-fit: cover; border-radius: 50%; border: 2px solid #08111f; margin-left: -8px; }
.avatar-stack img:first-child { margin-left: 0; }
.hero-proof > div:last-child { display: grid; gap: 2px; }
.hero-proof strong { font-size: .88rem; }
.hero-proof span { color: var(--muted); font-size: .75rem; }

.phone-wrap { position: relative; justify-self: center; width: min(100%, 410px); display: grid; place-items: center; }
.phone-glow { position: absolute; width: 360px; height: 360px; border-radius: 50%; background: radial-gradient(circle, rgba(27,149,255,.48), rgba(50,221,255,.09) 43%, transparent 70%); filter: blur(18px); animation: breathe 4.5s ease-in-out infinite; }
.phone { width: 278px; height: 558px; border: 9px solid #111827; border-radius: 42px; padding: 7px; background: #05070c; box-shadow: 0 36px 90px rgba(0,0,0,.65), inset 0 0 0 1px rgba(255,255,255,.12); transform: rotate(4deg); position: relative; z-index: 2; }
.phone-top { position:absolute; top:12px; left:50%; transform:translateX(-50%); z-index:4; width:84px; height:23px; border-radius:999px; background:#05070c; display:grid; place-items:center; }
.phone-top span { width: 7px; height: 7px; border-radius: 50%; background: #1e293b; }
.phone-screen { position:relative; height:100%; overflow:hidden; border-radius:29px; background:#08111f; }
.phone-bg { position:absolute; inset:0; background: center/cover var(--dh-phone-img); transform:scale(1.05); }
.phone-shade { position:absolute; inset:0; background:linear-gradient(180deg, rgba(3,7,17,.2), rgba(3,7,17,.85) 68%, #030812 100%); }
.phone-brand { position:absolute; top:52px; left:22px; font-size:.55rem; font-weight:800; letter-spacing:.13em; }
.phone-play { position:absolute; top:46%; left:50%; transform:translate(-50%,-50%); width:64px; height:64px; border-radius:50%; border:1px solid rgba(255,255,255,.28); background:rgba(6,14,29,.58); backdrop-filter:blur(14px); cursor:pointer; box-shadow:0 0 0 10px rgba(255,255,255,.035); }
.phone-message { position:absolute; left:22px; right:22px; bottom:34px; display:grid; gap:9px; }
.phone-message small { color:var(--cyan); font-size:.55rem; font-weight:800; letter-spacing:.16em; }
.phone-message strong { font-family:"Space Grotesk",sans-serif; font-size:2rem; line-height:.92; letter-spacing:-.04em; }
.phone-message em { color:var(--cyan); font-style:normal; }
.phone-message span { font-size:.62rem; color:#adc0d6; }
.floating-card { position:absolute; z-index:3; min-width:152px; padding:14px 16px; border:1px solid var(--line); border-radius:16px; background:rgba(8,17,32,.73); backdrop-filter:blur(16px); box-shadow:var(--shadow); display:grid; gap:2px; }
.floating-card span { color:var(--cyan); font-weight:800; font-family:"Space Grotesk",sans-serif; }
.floating-card small { color:#b3c2d5; font-size:.7rem; }
.fc-one { top:92px; left:-24px; animation:floaty 4s ease-in-out infinite; }
.fc-two { bottom:92px; right:-24px; animation:floaty 4.8s ease-in-out infinite reverse; }
.scroll-cue { position:absolute; left:50%; transform:translateX(-50%); bottom:28px; display:flex; align-items:center; gap:10px; font-size:.7rem; color:#9fb0c5; letter-spacing:.12em; text-transform:uppercase; }
.scroll-cue span { width:1px; height:34px; background:linear-gradient(var(--cyan), transparent); animation:scrollPulse 1.7s ease-in-out infinite; }

.stats-section { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(4,9,19,.84); backdrop-filter:blur(20px); }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.stats-grid article { padding:34px 28px; text-align:center; border-right:1px solid var(--line); }
.stats-grid article:last-child { border-right:0; }
.stats-grid strong { display:block; font-family:"Space Grotesk",sans-serif; font-size:clamp(2.1rem,4vw,3.4rem); color:#fff; letter-spacing:-.05em; }
.stats-grid span { display:block; color:var(--muted); margin-top:4px; font-size:.88rem; }

.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:50px; margin-bottom:54px; }
.section-head > p { max-width:460px; font-size:1.02rem; }
.services::before { content:""; position:absolute; width:520px; height:520px; top:60px; left:-220px; background:radial-gradient(circle,rgba(22,127,255,.1),transparent 70%); pointer-events:none; }
.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.service-card { min-height:310px; padding:28px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025)); backdrop-filter:blur(16px); position:relative; overflow:hidden; transition:.35s ease; display:flex; flex-direction:column; }
.service-card::after { content:""; position:absolute; inset:auto -30% -60% auto; width:210px; height:210px; border-radius:50%; background:radial-gradient(circle,rgba(48,220,255,.18),transparent 67%); opacity:0; transition:.35s ease; }
.service-card:hover { transform:translateY(-8px); border-color:rgba(50,221,255,.38); box-shadow:0 26px 55px rgba(0,0,0,.28); }
.service-card:hover::after { opacity:1; }
.service-num { position:absolute; right:22px; top:18px; color:rgba(255,255,255,.18); font-size:.72rem; font-weight:700; letter-spacing:.1em; }
.service-icon { width:48px; height:48px; display:grid; place-items:center; border:1px solid rgba(50,221,255,.25); background:rgba(24,126,255,.1); color:var(--cyan); border-radius:14px; margin-bottom:28px; font-size:1.1rem; }
.service-card h3 { font-size:1.35rem; line-height:1.08; margin-bottom:13px; }
.service-card p { font-size:.9rem; }
.service-card a { margin-top:auto; padding-top:24px; color:#dce9f7; font-size:.82rem; font-weight:700; }
.service-card a span { color:var(--cyan); }

.about-section { background:linear-gradient(180deg,rgba(255,255,255,.018),transparent); }
.about-layout { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.about-media { min-height:620px; border-radius:34px; overflow:hidden; position:relative; border:1px solid var(--line); box-shadow:var(--shadow); }
.about-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%,rgba(3,8,18,.85)); }
.about-media img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.media-badge { position:absolute; z-index:2; left:24px; bottom:24px; display:flex; align-items:center; gap:14px; padding:14px 18px; border-radius:16px; background:rgba(4,10,20,.7); border:1px solid var(--line); backdrop-filter:blur(16px); }
.media-badge strong { font-family:"Space Grotesk",sans-serif; color:var(--cyan); font-size:1.45rem; }
.media-badge span { color:#c5d3e5; font-size:.78rem; }
.about-copy > p { font-size:1.05rem; max-width:590px; margin:26px 0 34px; }
.feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.feature-grid article { padding:24px; border:1px solid var(--line); border-radius:20px; background:rgba(255,255,255,.028); }
.feature-grid article span { color:var(--cyan); font-size:.7rem; font-weight:800; letter-spacing:.1em; }
.feature-grid h3 { margin:16px 0 6px; font-size:1.25rem; }
.feature-grid p { font-size:.86rem; }

.portfolio { overflow:hidden; }
.text-link { font-size:.88rem; font-weight:700; color:#dce8f6; }
.text-link span { color:var(--cyan); }
.portfolio-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.project-card { height:430px; position:relative; overflow:hidden; border-radius:28px; border:1px solid var(--line); }
.project-card.project-wide { grid-column:span 2; height:520px; }
.project-card img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1), filter .5s ease; filter:saturate(.82) contrast(1.05); }
.project-shade { position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(3,8,18,.86) 100%); }
.project-meta { position:absolute; left:28px; bottom:26px; }
.project-meta span { font-size:.67rem; font-weight:800; color:var(--cyan); letter-spacing:.14em; }
.project-meta h3 { font-size:clamp(1.6rem,3vw,2.4rem); margin-top:6px; }
.project-btn { position:absolute; right:24px; bottom:28px; min-height:44px; padding:0 18px; border-radius:999px; border:1px solid rgba(255,255,255,.18); background:rgba(6,13,26,.68); backdrop-filter:blur(14px); display:flex; align-items:center; font-weight:700; font-size:.78rem; opacity:0; transform:translateY(10px); transition:.3s ease; }
.project-card:hover img { transform:scale(1.06); filter:saturate(1); }
.project-card:hover .project-btn { opacity:1; transform:none; }

.video-panel { min-height:650px; border-radius:34px; overflow:hidden; border:1px solid var(--line); position:relative; box-shadow:var(--shadow); }
.video-panel > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.video-panel-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,8,17,.87),rgba(3,8,17,.35) 64%), linear-gradient(180deg,rgba(3,8,17,.16),rgba(3,8,17,.75)); }
.big-play { position:absolute; z-index:3; left:68%; top:50%; transform:translate(-50%,-50%); width:112px; height:112px; border-radius:50%; border:1px solid rgba(255,255,255,.35); background:rgba(5,13,27,.47); backdrop-filter:blur(18px); font-size:1.45rem; cursor:pointer; box-shadow:0 0 0 18px rgba(255,255,255,.03), 0 18px 50px rgba(0,0,0,.35); transition:.3s ease; }
.big-play:hover { transform:translate(-50%,-50%) scale(1.06); background:rgba(22,116,255,.65); }
.video-copy { position:absolute; left:52px; bottom:52px; z-index:2; max-width:700px; }
.video-copy h2 { font-size:clamp(2.4rem,5vw,4.7rem); max-width:760px; }
.video-copy p { max-width:610px; margin-top:22px; color:#c8d5e5; }

.pricing-section { background:linear-gradient(180deg,rgba(22,116,255,.055),transparent 70%); }
.pricing-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; align-items:center; }
.pricing-copy p { margin-top:24px; max-width:520px; font-size:1rem; }
.price-note { margin-top:26px; display:inline-flex; padding:10px 14px; border-radius:999px; border:1px solid rgba(50,221,255,.24); color:var(--cyan-soft); background:rgba(50,221,255,.06); font-size:.78rem; font-weight:700; }
.price-card { position:relative; border:1px solid rgba(50,221,255,.28); background:linear-gradient(145deg,rgba(14,30,54,.92),rgba(7,14,28,.9)); border-radius:32px; padding:34px; box-shadow:0 38px 95px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.07); overflow:hidden; }
.price-card::before { content:""; position:absolute; width:340px; height:340px; top:-170px; right:-110px; border-radius:50%; background:radial-gradient(circle,rgba(50,221,255,.2),transparent 66%); }
.price-top { display:flex; justify-content:space-between; gap:16px; align-items:center; color:#dbe8f7; font-size:.8rem; font-weight:700; position:relative; }
.popular { padding:8px 11px; border-radius:999px; background:rgba(50,221,255,.11); color:var(--cyan); border:1px solid rgba(50,221,255,.2); font-size:.62rem; letter-spacing:.08em; }
.price { display:flex; align-items:end; gap:12px; margin:26px 0; position:relative; }
.price strong { font-family:"Space Grotesk",sans-serif; font-size:clamp(4rem,8vw,6.5rem); letter-spacing:-.07em; line-height:.88; }
.price span { color:var(--muted); font-size:.8rem; margin-bottom:11px; font-weight:700; }
.price-card ul { display:grid; grid-template-columns:repeat(2,1fr); gap:12px 22px; list-style:none; padding:26px 0; margin:0 0 26px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.price-card li { color:#cbd8e8; font-size:.88rem; position:relative; padding-left:24px; }
.price-card li::before { content:"✓"; position:absolute; left:0; color:var(--cyan); font-weight:900; }

.testimonial-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.demo-note { max-width:430px; font-size:.78rem!important; }
.testimonial-card { padding:28px; border-radius:24px; border:1px solid var(--line); background:rgba(255,255,255,.035); min-height:320px; display:flex; flex-direction:column; }
.stars { color:#7ee8ff; letter-spacing:.1em; font-size:.9rem; }
.testimonial-card > p { color:#d0dbe8; font-size:1rem; margin:28px 0 32px; }
.testimonial-person { margin-top:auto; display:flex; align-items:center; gap:12px; }
.testimonial-person img { width:48px; height:48px; border-radius:50%; object-fit:cover; }
.testimonial-person div { display:grid; gap:2px; }
.testimonial-person strong { font-size:.88rem; }
.testimonial-person span { color:var(--muted); font-size:.73rem; }

.partner-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.015); }
.partner-grid { min-height:140px; display:grid; grid-template-columns:repeat(6,1fr); align-items:center; gap:24px; }
.partner-grid span { text-align:center; color:#8595aa; font-family:"Space Grotesk",sans-serif; font-size:1.02rem; font-weight:700; letter-spacing:-.02em; filter:grayscale(1); transition:.2s ease; }
.partner-grid span:hover { color:#fff; filter:none; }

.final-cta { position:relative; overflow:hidden; padding:140px 0; background:linear-gradient(135deg,#061121,#07172a 55%,#04101d); border-bottom:1px solid var(--line); }
.cta-inner { text-align:center; position:relative; z-index:2; }
.cta-inner h2 { font-size:clamp(3.1rem,8vw,7.6rem); }
.cta-inner p { max-width:670px; margin:24px auto 0; font-size:1.05rem; }
.cta-actions { margin-top:34px; display:flex; justify-content:center; align-items:center; gap:22px; flex-wrap:wrap; }
.contact-inline { font-weight:700; color:#c8d6e8; border-bottom:1px solid rgba(255,255,255,.28); padding-bottom:2px; }
.cta-orb { position:absolute; border-radius:50%; filter:blur(5px); pointer-events:none; }
.orb-one { width:580px; height:580px; top:-280px; left:-140px; background:radial-gradient(circle,rgba(28,119,255,.24),transparent 67%); }
.orb-two { width:650px; height:650px; bottom:-350px; right:-140px; background:radial-gradient(circle,rgba(50,221,255,.16),transparent 67%); }

.site-footer { padding:74px 0 26px; background:#030711; }
.footer-grid { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:56px; }
.footer-brand > p { max-width:430px; margin:24px 0; font-size:.9rem; }
.footer-tagline { color:var(--cyan); font-family:"Space Grotesk",sans-serif; font-weight:700; letter-spacing:.12em; font-size:.72rem; }
.footer-col { display:grid; align-content:start; gap:11px; }
.footer-col h3 { font-size:.9rem; margin-bottom:7px; }
.footer-col a, .footer-col span { color:#8fa0b6; font-size:.82rem; transition:.2s ease; }
.footer-col a:hover { color:#fff; }
.footer-bottom { display:flex; justify-content:space-between; gap:24px; padding-top:28px; margin-top:54px; border-top:1px solid var(--line); color:#62748d; font-size:.72rem; }

.chat-fab { position:fixed; right:24px; bottom:24px; z-index:800; border:1px solid rgba(255,255,255,.14); background:rgba(6,17,31,.86); backdrop-filter:blur(18px); box-shadow:0 16px 40px rgba(0,0,0,.35); border-radius:999px; padding:11px 16px; display:flex; align-items:center; gap:9px; cursor:pointer; }
.chat-dot { width:10px; height:10px; border-radius:50%; background:#44ffb7; box-shadow:0 0 0 5px rgba(68,255,183,.08); }
.chat-label { font-size:.76rem; font-weight:700; }

.video-modal { position:fixed; inset:0; z-index:2000; display:none; place-items:center; padding:24px; }
.video-modal.open { display:grid; }
.video-modal-backdrop { position:absolute; inset:0; background:rgba(1,4,10,.82); backdrop-filter:blur(16px); }
.video-modal-card { width:min(100%,980px); position:relative; z-index:2; border:1px solid var(--line); border-radius:24px; background:#050a14; box-shadow:0 30px 100px rgba(0,0,0,.65); padding:12px; }
.video-modal video { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:16px; background:#000; }
.video-close { position:absolute; right:18px; top:18px; z-index:3; width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.18); background:rgba(3,8,17,.72); backdrop-filter:blur(12px); font-size:1.5rem; cursor:pointer; }
.video-credit { color:#7f91a7; font-size:.7rem; padding:10px 4px 2px; }

.reveal { opacity:0; transform:translateY(26px); transition:opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.reveal.in-view { opacity:1; transform:none; }

@keyframes floaty { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-11px)} }
@keyframes breathe { 0%,100%{transform:scale(.96);opacity:.75} 50%{transform:scale(1.04);opacity:1} }
@keyframes scrollPulse { 0%,100%{opacity:.25;transform:scaleY(.7)} 50%{opacity:1;transform:scaleY(1)} }

@media (max-width: 1120px) {
  .desktop-nav { gap:18px; }
  .service-grid { grid-template-columns:repeat(2,1fr); }
  .hero-layout { grid-template-columns:1fr 360px; gap:34px; }
  .phone { transform:scale(.9) rotate(4deg); }
  .pricing-layout { gap:48px; }
}

@media (max-width: 900px) {
  .desktop-nav, .nav-cta { display:none; }
  .menu-toggle { display:flex; }
  .menu-toggle.active span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  .menu-toggle.active span:nth-child(2) { opacity:0; }
  .menu-toggle.active span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  .mobile-menu { position:fixed; top:88px; left:20px; right:20px; padding:18px; border:1px solid var(--line); border-radius:22px; background:rgba(4,10,21,.96); backdrop-filter:blur(20px); box-shadow:var(--shadow); flex-direction:column; gap:8px; }
  .mobile-menu.open { display:flex; }
  .mobile-menu a:not(.btn) { padding:12px 10px; color:#c8d6e6; border-radius:10px; }
  .mobile-menu a:not(.btn):hover { background:rgba(255,255,255,.04); color:#fff; }
  .hero { padding-top:120px; }
  .hero-layout { grid-template-columns:1fr; }
  .hero-copy { text-align:center; margin-inline:auto; }
  .eyebrow-row, .hero-actions, .hero-proof { justify-content:center; }
  .phone-wrap { margin:6px auto 30px; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .stats-grid article:nth-child(2) { border-right:0; }
  .stats-grid article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .section-head { align-items:flex-start; flex-direction:column; gap:18px; }
  .about-layout, .pricing-layout { grid-template-columns:1fr; }
  .about-media { min-height:520px; }
  .portfolio-grid { grid-template-columns:1fr; }
  .project-card.project-wide { grid-column:span 1; height:430px; }
  .video-panel { min-height:600px; }
  .big-play { left:auto; right:34px; top:42px; transform:none; width:86px; height:86px; }
  .big-play:hover { transform:scale(1.05); }
  .price-card ul { grid-template-columns:1fr; }
  .testimonial-grid { grid-template-columns:1fr; }
  .partner-grid { grid-template-columns:repeat(3,1fr); padding-block:28px; }
  .footer-grid { grid-template-columns:1.5fr 1fr 1fr; }
  .footer-brand { grid-column:1/-1; }
}

@media (max-width: 620px) {
  .container { width:min(calc(100% - 28px),var(--container)); }
  .nav-wrap { height:76px; }
  .brand-mark { width:34px; height:34px; }
  .brand-copy strong { font-size:.82rem; }
  .brand-copy small { font-size:.49rem; }
  .mobile-menu { top:76px; left:14px; right:14px; }
  .section { padding:82px 0; }
  .hero { min-height:auto; padding:112px 0 90px; }
  .hero h1 { font-size:clamp(3.2rem,18vw,5.3rem); }
  .hero-text { font-size:.97rem; }
  .story-trigger { margin-inline:auto; }
  .eyebrow-row { gap:12px; }
  .phone-wrap { width:100%; }
  .phone { width:236px; height:472px; transform:rotate(2deg); }
  .phone-message strong { font-size:1.65rem; }
  .fc-one { left:4px; top:74px; }
  .fc-two { right:4px; bottom:72px; }
  .floating-card { min-width:128px; padding:11px 12px; }
  .scroll-cue { display:none; }
  .stats-grid article { padding:26px 12px; }
  .service-grid { grid-template-columns:1fr; }
  .service-card { min-height:270px; }
  .about-media { min-height:430px; }
  .feature-grid { grid-template-columns:1fr; }
  .project-card, .project-card.project-wide { height:360px; }
  .project-btn { opacity:1; transform:none; right:18px; bottom:18px; }
  .project-meta { left:20px; bottom:74px; }
  .video-panel { min-height:560px; }
  .video-copy { left:24px; right:24px; bottom:30px; }
  .video-copy h2 { font-size:2.35rem; }
  .big-play { width:72px; height:72px; right:22px; top:28px; }
  .price-card { padding:24px; }
  .price-top { align-items:flex-start; flex-direction:column; }
  .price strong { font-size:4.5rem; }
  .partner-grid { grid-template-columns:repeat(2,1fr); }
  .final-cta { padding:100px 0; }
  .cta-inner h2 { font-size:clamp(3rem,15vw,5.3rem); }
  .footer-grid { grid-template-columns:1fr 1fr; gap:38px 24px; }
  .footer-brand { grid-column:1/-1; }
  .footer-col:last-child { grid-column:1/-1; display:grid; grid-template-columns:repeat(5,max-content); gap:14px; overflow-x:auto; }
  .footer-col:last-child h3 { grid-column:1/-1; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .chat-label { display:none; }
  .chat-fab { width:48px; height:48px; border-radius:50%; justify-content:center; padding:0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
  .reveal { opacity:1; transform:none; }
}


/* =====================================================================
   WordPress additions
   ===================================================================== */
.screen-reader-text { border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute!important; width:1px; word-wrap:normal!important; }
.screen-reader-text:focus { background:#fff; color:#000; clip:auto!important; clip-path:none; display:block; height:auto; left:8px; padding:12px 18px; top:8px; width:auto; z-index:100000; border-radius:6px; }
.alignleft { float:left; margin:0 1.5rem 1rem 0; }
.alignright { float:right; margin:0 0 1rem 1.5rem; }
.aligncenter { display:block; margin-inline:auto; }
.alignwide, .alignfull { max-width:100%; }
.wp-caption, .gallery-caption, .wp-caption-text, .sticky, .bypostauthor { max-width:100%; }
.wp-caption-text, figcaption { color:var(--muted); font-size:.85rem; margin-top:.5rem; }
.brand-mark img { width:100%; height:100%; object-fit:contain; }

/* Reveal must stay visible without JS */
.no-js .reveal { opacity:1 !important; transform:none !important; }

/* Admin bar offset for the fixed header */
.admin-bar .site-header { top:32px; }
@media (max-width:782px) { .admin-bar .site-header { top:46px; } .admin-bar .mobile-menu { margin-top:0; } }
@media (max-width:600px) { .admin-bar .site-header { top:0; } }
.desktop-nav a.active, .mobile-menu a.active { color:#fff; }

/* Inner pages */
.site-main { min-height:60vh; }
.page-hero { padding:170px 0 70px; background:radial-gradient(circle at 80% 0%, rgba(24,118,255,.18), transparent 45%), linear-gradient(180deg,#050c1a,#06101f); border-bottom:1px solid var(--line); }
.page-hero h1 { font-size:clamp(2.2rem,5vw,4.2rem); max-width:18ch; }
.page-hero-text { margin-top:18px; max-width:60ch; }
.content-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:48px; padding:70px 0 100px; }
.content-layout:not(:has(.sidebar)) { grid-template-columns:minmax(0,1fr); }
.content-narrow { max-width:860px; padding:70px 0 100px; }
.post-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:26px; }
.post-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; transition:transform .25s ease, border-color .25s ease; }
.post-card:hover { transform:translateY(-4px); border-color:rgba(50,221,255,.35); }
.post-card-thumb img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.post-card-body { padding:24px; display:grid; gap:12px; }
.post-card-title { font-size:1.35rem; line-height:1.15; }
.post-meta { color:var(--cyan); font-size:.75rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.text-link { color:var(--cyan); font-weight:700; }

.entry-thumb { margin:0 0 32px; border-radius:var(--radius); overflow:hidden; }
.entry-thumb img { width:100%; height:auto; }
.entry-content { color:#c8d3e3; font-size:1.05rem; line-height:1.85; }
.entry-content > * + * { margin-top:1.3em; }
.entry-content p { color:#c8d3e3; }
.entry-content h2, .entry-content h3, .entry-content h4 { color:#fff; margin-top:1.8em; line-height:1.15; }
.entry-content h2 { font-size:clamp(1.7rem,3vw,2.4rem); }
.entry-content h3 { font-size:1.5rem; }
.entry-content a { color:var(--cyan); text-decoration:underline; text-underline-offset:3px; }
.entry-content ul, .entry-content ol { padding-left:1.4em; }
.entry-content blockquote { margin-inline:0; padding:8px 0 8px 22px; border-left:3px solid var(--cyan); color:#fff; }
.entry-content img { border-radius:16px; height:auto; }
.entry-content pre, .entry-content code { background:rgba(255,255,255,.06); border-radius:8px; }
.entry-content pre { padding:18px; overflow:auto; }
.entry-content code { padding:2px 6px; }
.entry-content table { width:100%; border-collapse:collapse; }
.entry-content th, .entry-content td { border:1px solid var(--line); padding:10px 14px; text-align:left; }
.entry-footer { margin-top:36px; display:flex; gap:12px; flex-wrap:wrap; color:var(--muted); font-size:.9rem; }
.entry-footer a { color:var(--cyan); margin-right:10px; }
.page-links { margin-top:20px; }

.sidebar { display:grid; gap:24px; align-content:start; }
.widget { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
.widget-title { font-size:1.1rem; margin-bottom:14px; }
.widget ul { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.widget a { color:#c4cfdf; }
.widget a:hover { color:var(--cyan); }

.search-form { display:flex; gap:10px; flex-wrap:wrap; }
.search-field, .dh-form input, .dh-form textarea, .comment-form input[type=text], .comment-form input[type=email], .comment-form input[type=url], .comment-form textarea {
  width:100%; background:rgba(255,255,255,.055); border:1px solid var(--line); border-radius:16px; color:#fff; padding:14px 18px; outline:none; transition:border-color .2s ease;
}
.search-field { flex:1; min-width:0; }
.search-field:focus, .dh-form input:focus, .dh-form textarea:focus, .comment-form input:focus, .comment-form textarea:focus { border-color:var(--cyan); }
::placeholder { color:#7f90a8; }
.not-found .search-form { margin-bottom:28px; }
.no-results { padding:40px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); display:grid; gap:14px; }

.navigation.pagination { margin-top:44px; }
.nav-links { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.page-numbers { padding:10px 16px; border:1px solid var(--line); border-radius:999px; color:#c4cfdf; }
.page-numbers.current, .page-numbers:hover { background:var(--blue); border-color:var(--blue); color:#fff; }
.post-navigation { margin-top:48px; }
.post-navigation .nav-links { justify-content:space-between; }
.post-navigation a { color:var(--cyan); }

.comments-area { margin-top:64px; }
.comments-title { font-size:1.8rem; margin-bottom:24px; }
.comment-list { list-style:none; padding:0; display:grid; gap:20px; }
.comment-list .children { list-style:none; padding-left:24px; margin-top:20px; display:grid; gap:20px; }
.comment-body { background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:20px; }
.comment-meta a, .comment-author a { color:#fff; }
.comment-metadata { font-size:.8rem; }
.comment-form { display:grid; gap:14px; margin-top:24px; }
.comment-form .submit { background:linear-gradient(135deg,var(--blue),var(--cyan)); border:0; color:#fff; font-weight:800; padding:14px 26px; border-radius:999px; cursor:pointer; width:max-content; }
.comment-reply-title { font-family:"Space Grotesk",sans-serif; font-size:1.5rem; }

/* Contact form */
.dh-form-wrap { max-width:680px; margin:36px auto 0; text-align:left; }
.dh-form { display:grid; gap:14px; }
.dh-form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.dh-form textarea { resize:vertical; min-height:130px; }
.dh-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.dh-form-notice { padding:14px 18px; border-radius:14px; margin-bottom:14px; font-weight:600; }
.dh-form-notice.is-success { background:rgba(34,197,94,.12); border:1px solid rgba(34,197,94,.4); color:#86efac; }
.dh-form-notice.is-error { background:rgba(239,68,68,.12); border:1px solid rgba(239,68,68,.4); color:#fca5a5; }

@media (max-width:900px) {
  .content-layout { grid-template-columns:1fr; padding:50px 0 80px; }
  .page-hero { padding:140px 0 50px; }
}
@media (max-width:620px) {
  .dh-form-row { grid-template-columns:1fr; }
}
@media (max-width:900px) { .admin-bar .mobile-menu { top:134px; } }
@media (max-width:620px) { .admin-bar .mobile-menu { top:122px; } }
