:root {
  --site-primary: #1267d5;
  --site-secondary: #0d1c33;
  --site-background: #f4f8fd;
  --site-on-primary: #ffffff;
  --site-on-secondary: #ffffff;
  --site-on-background: #14243b;
  --site-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --site-font-heading: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --site-heading-scale: 1;
  --site-spacing-scale: 1;
  --site-radius-scale: 1;
  --site-decoration-opacity: 1;
  color-scheme: light dark;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--site-font-body); background: light-dark(#f4f8fd,#101722); color: light-dark(#14243b,#eef4ff); }
.app-root { min-height: 100vh; width: 100%; border-radius: 0; background-color: var(--site-background); color: var(--site-on-background); overflow: hidden; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding: calc(20px * var(--site-spacing-scale)) max(6vw, 22px); background: var(--site-secondary); color: var(--site-on-secondary); }
.brand { display:flex; align-items:center; gap:12px; font-weight:900; letter-spacing:-.04em; font-size:1.12rem; }
.brand-logo { width:82px; height:82px; object-fit:contain; border-radius:50%; background:#fff; padding:2px; flex-shrink:0; display:block; }
.header-note { color:#c5d5ee; font-size:.88rem; }
.instagram-link { display:inline-flex; align-items:center; gap:9px; padding:11px 15px; border:1px solid #ffffff55; border-radius:12px; color:#fff; text-decoration:none; font-weight:800; white-space:nowrap; background:linear-gradient(120deg,#833ab4,#fd1d1d,#fcb045); }
.instagram-link:hover { transform:translateY(-2px); filter:brightness(1.08); }
.instagram-link svg { width:21px; height:21px; flex-shrink:0; }
.logo-hero { display:block; width:min(100%,340px); height:auto; aspect-ratio:1; object-fit:contain; background:#fff; border:0; border-radius:50%; box-shadow:0 24px 65px #0005; padding:0; }
.gallery-wrap { position:relative; max-width:1120px; margin:auto; }
.gallery-track { display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding:8px 2px 18px; scrollbar-width:thin; scroll-behavior:smooth; }
.gallery-card { flex:0 0 min(78%,330px); scroll-snap-align:start; border-radius:20px; overflow:hidden; background:#fff; border:1px solid #dce6f2; box-shadow:0 8px 24px #09264a12; }
.gallery-card img { display:block; width:100%; height:230px; object-fit:cover; background:linear-gradient(135deg,#0d1c33,#1267d5); }
.gallery-caption { padding:16px; color:#14243b; font-weight:800; }
.gallery-caption small { display:block; margin-top:5px; color:#64748b; font-weight:500; }
.gallery-controls { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:12px; }
.gallery-arrow { border:0; border-radius:50%; width:44px; height:44px; font-size:22px; font-weight:800; background:#0d1c33; color:#fff; cursor:pointer; }
.hero { position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:30px; align-items:center; padding: clamp(42px,7vw,90px) max(6vw,22px); background:radial-gradient(circle at 82% 45%, #1e5da4 0%, transparent 32%), linear-gradient(120deg, #07162b 0%, #123a68 100%); color:white; }
.hero:after { content:""; position:absolute; width:330px; height:330px; border:55px solid var(--site-primary); border-radius:50%; right:-120px; top:-160px; opacity:calc(.18 * var(--site-decoration-opacity)); pointer-events:none; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; color:#9fcaff; font-size:.78rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin-bottom:18px; }
h1,h2,h3 { font-family:var(--site-font-heading); margin:0; letter-spacing:-.045em; }
h1 { font-size:clamp(2.45rem,5vw,4.6rem); line-height:1.02; max-width:690px; }
.hero h1 span { color:#65adff; text-shadow:0 5px 0 #071a31; }
.hero h1 { text-transform:uppercase; }
.hero .eyebrow { background:#1267d5; color:#fff; padding:9px 13px; border-radius:999px; letter-spacing:.08em; }
.bolt-card { outline:5px solid #ffffff22; }
.bolt-caption { background:#fff; color:#0752b5; box-shadow:0 8px 22px #001b3d55; }
.hero p { color:#d7e4f5; font-size:1.08rem; line-height:1.7; max-width:560px; margin:22px 0 28px; }
.actions { display:flex; flex-wrap:wrap; gap:12px; }
.btn { display:inline-flex; justify-content:center; align-items:center; gap:9px; border-radius:calc(12px * var(--site-radius-scale)); padding:14px 19px; font-weight:800; text-decoration:none; transition:transform .15s ease, opacity .15s ease; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:var(--site-primary); color:white; }
.btn-light { background:white; color:#132540; }
.hero-art { display:flex; justify-content:center; align-items:center; min-height:260px; }
.bolt-card { width:min(100%,340px); aspect-ratio:1/1; border-radius:34px; background:linear-gradient(145deg,#267ff0,#0752b5); display:flex; align-items:center; justify-content:center; position:relative; box-shadow:0 24px 65px #0004; transform:rotate(2deg); }
.bolt-card:before { content:""; position:absolute; inset:18px; border:1px solid #ffffff55; border-radius:25px; }
.bolt { font-size:clamp(7rem,16vw,12rem); color:white; text-shadow:0 10px 0 #063e8b; filter:drop-shadow(0 14px 12px #002e6b55); }
.bolt-caption { position:absolute; bottom:28px; background:white; color:#14243b; border-radius:10px; padding:9px 14px; font-weight:900; font-size:.78rem; letter-spacing:.12em; }
.section { padding:clamp(44px,6vw,76px) max(6vw,22px); }
.section-heading { text-align:center; max-width:670px; margin:0 auto 34px; }
.section-heading .eyebrow { color:var(--site-primary); margin-bottom:12px; }
h2 { font-size:clamp(2rem,3.4vw,3rem); line-height:1.08; }
.section-heading p { color:light-dark(#617087,#bdc9da); line-height:1.65; margin:14px 0 0; }
.services { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; max-width:1100px; margin:auto; }
.service { background:light-dark(#fff,#1a2637); border:1px solid light-dark(#e0e9f4,#334155); border-radius:calc(20px * var(--site-radius-scale)); padding:26px; min-height:210px; }
.service-icon { width:52px; height:52px; border-radius:15px; display:grid; place-items:center; background:light-dark(#e7f1ff,#183c68); color:var(--site-primary); font-size:26px; margin-bottom:20px; }
.service h3 { font-size:1.3rem; margin-bottom:10px; }
.service p { color:light-dark(#627087,#c2cede); line-height:1.65; margin:0; font-size:.96rem; }
.band { background:var(--site-primary); color:white; display:flex; align-items:center; justify-content:space-between; gap:25px; padding:34px max(6vw,22px); }
.band h2 { font-size:clamp(1.65rem,3vw,2.5rem); }
.band p { margin:8px 0 0; color:#e2efff; }
.contact { display:grid; grid-template-columns:1fr 1fr; gap:30px; max-width:1000px; margin:auto; align-items:center; }
.contact-copy p { color:light-dark(#617087,#bdc9da); line-height:1.7; }
.contact-card { background:light-dark(#fff,#1a2637); border:1px solid light-dark(#e0e9f4,#334155); border-radius:calc(20px * var(--site-radius-scale)); padding:26px; }
.contact-line { display:flex; gap:13px; align-items:center; padding:12px 0; border-bottom:1px solid light-dark(#e6edf6,#344256); }
.contact-line:last-child { border-bottom:0; }
.contact-line .symbol { font-size:22px; width:34px; text-align:center; }
.contact-line small { display:block; color:light-dark(#718096,#b7c3d4); margin-bottom:3px; }
.contact-line strong { overflow-wrap:anywhere; }
.footer { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:22px max(6vw,22px); background:var(--site-secondary); color:#c9d7eb; font-size:.86rem; }
.footer strong { color:white; }
.note { font-size:.78rem; opacity:.8; }
@media (max-width:760px) { .hero { grid-template-columns:1fr; padding-top:52px; } .hero-art { min-height:230px; } .bolt-card { max-width:260px; } .services { grid-template-columns:1fr; } .service { min-height:auto; } .band { align-items:flex-start; flex-direction:column; } .contact { grid-template-columns:1fr; } .header-note { display:none; } .brand-logo { width:64px; height:64px; } .gallery-card { flex-basis:84%; } .gallery-card img { height:205px; } }
@media (prefers-color-scheme:dark) { .app-root { background-color:#101722; } }
.link-inherit { color: inherit; }
.center { text-align: center; }
.hero p.slogan { color:#ffffff; font-weight:800; font-size:1.2rem; margin:18px 0 0; }
.services-2 { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:900px; }
.services-2 .service { min-height:170px; }
@media (max-width:760px) { .services-2 { grid-template-columns:1fr; } }
.contact .eyebrow { color:var(--site-primary); }
