/* ═══════════════════════════════════════════
   WebCraft Studio — Shared Stylesheet
   Navy Blue + Orange Theme
═══════════════════════════════════════════ */
:root {
  --navy:        #0B1D3A;
  --navy-mid:    #122952;
  --navy-light:  #1A3A6E;
  --orange:      #FF6B1A;
  --orange-glow: #FF8C4A;
  --orange-dim:  rgba(255,107,26,.15);
  --cream:       #F5F0E8;
  --white:       #FFFFFF;
  --text-muted:  #8A9DC0;
  --border:      rgba(255,255,255,.07);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Manrope', sans-serif; background: var(--navy); color: var(--white); overflow-x: hidden; }
h1,h2,h3,h4,h5 { font-family: 'Syne', sans-serif; }
a { text-decoration: none; }
img { max-width: 100%; }

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--navy); }
::-webkit-scrollbar-thumb { background: var(--orange); border-radius: 3px; }

/* ── Custom Cursor ── */
#cursor { width:14px;height:14px;border-radius:50%;background:var(--orange);position:fixed;pointer-events:none;z-index:9999;transition:transform .12s,width .25s,height .25s;mix-blend-mode:exclusion; }
#cursor-ring { width:38px;height:38px;border-radius:50%;border:1.5px solid var(--orange);position:fixed;pointer-events:none;z-index:9998;transition:transform .35s cubic-bezier(.22,1,.36,1),width .3s,height .3s,opacity .3s;opacity:.6; }

/* ── Navbar ── */
.navbar { background:rgba(11,29,58,.92);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,107,26,.12);padding:18px 0;transition:all .35s ease;position:fixed;width:100%;top:0;z-index:1000; }
.navbar.scrolled { padding:12px 0;box-shadow:0 8px 40px rgba(0,0,0,.45); }
.navbar-brand { font-family:'Syne',sans-serif;font-weight:800;font-size:1.55rem;color:var(--white)!important;letter-spacing:-.5px; }
.navbar-brand span { color:var(--orange); }
.nav-link { color:rgba(255,255,255,.75)!important;font-weight:500;font-size:.9rem;letter-spacing:.5px;margin:0 6px;position:relative;transition:color .25s; }
.nav-link::after { content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--orange);transition:width .3s ease;border-radius:2px; }
.nav-link:hover { color:var(--white)!important; }
.nav-link:hover::after, .nav-link.active-page::after { width:100%; }
.nav-link.active-page { color:var(--white)!important; }
.btn-nav { background:var(--orange);color:var(--white)!important;padding:9px 22px;border-radius:50px;font-weight:600;font-size:.88rem;letter-spacing:.4px;transition:all .28s;box-shadow:0 4px 20px rgba(255,107,26,.35); }
.btn-nav:hover { background:var(--orange-glow);transform:translateY(-2px);box-shadow:0 8px 28px rgba(255,107,26,.5); }
.btn-nav::after { display:none; }
.navbar-toggler { border:1px solid rgba(255,107,26,.3);padding:6px 10px; }
.navbar-toggler-icon { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23FF6B1A' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); }

/* ── Page Hero (inner pages) ── */
.page-hero { padding:160px 0 90px;position:relative;overflow:hidden;background:var(--navy-mid); }
.page-hero::before { content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,107,26,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,107,26,.05) 1px,transparent 1px);background-size:60px 60px; }
.page-hero-glow { position:absolute;width:500px;height:500px;border-radius:50%;filter:blur(90px);pointer-events:none;background:rgba(255,107,26,.15);top:-150px;right:-100px; }
.page-hero .breadcrumb { background:transparent;padding:0;margin-bottom:18px; }
.page-hero .breadcrumb-item a { color:var(--text-muted);font-size:.85rem;transition:color .22s; }
.page-hero .breadcrumb-item a:hover { color:var(--orange); }
.page-hero .breadcrumb-item.active { color:var(--orange);font-size:.85rem; }
.page-hero .breadcrumb-item+.breadcrumb-item::before { color:var(--text-muted); }
.page-hero h1 { font-size:clamp(2.4rem,5vw,4rem);font-weight:800;line-height:1.08;letter-spacing:-1.5px; }
.page-hero h1 span { color:var(--orange); }
.page-hero p { color:var(--text-muted);font-size:1.05rem;line-height:1.75;max-width:560px;margin-top:16px; }

/* ── Section Helpers ── */
.section-label { display:inline-flex;align-items:center;gap:8px;background:var(--orange-dim);border:1px solid rgba(255,107,26,.25);color:var(--orange);font-size:.75rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:6px 16px;border-radius:50px;margin-bottom:20px; }
.section-title { font-family:'Syne',sans-serif;font-size:clamp(2rem,4vw,3.2rem);font-weight:800;line-height:1.1;letter-spacing:-1px; }
.highlight { color:var(--orange); }
.section-subtitle { color:var(--text-muted);font-size:1rem;line-height:1.7;max-width:500px;margin-top:14px; }
.divider-line { width:52px;height:3px;background:var(--orange);border-radius:2px;margin:20px 0 0; }

/* ── Buttons ── */
.btn-primary-custom { background:var(--orange);color:var(--white);padding:14px 34px;border-radius:50px;font-weight:700;font-size:.95rem;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:all .3s;box-shadow:0 6px 30px rgba(255,107,26,.4);text-decoration:none; }
.btn-primary-custom:hover { background:var(--orange-glow);color:var(--white);transform:translateY(-3px);box-shadow:0 12px 40px rgba(255,107,26,.55); }
.btn-outline-custom { background:transparent;color:var(--white);padding:13px 30px;border-radius:50px;font-weight:600;font-size:.95rem;border:1.5px solid rgba(255,255,255,.25);cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:all .3s;text-decoration:none; }
.btn-outline-custom:hover { border-color:var(--orange);color:var(--orange);transform:translateY(-3px); }

/* ── Cards / Tags ── */
.tag { background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:var(--text-muted);font-size:.72rem;font-weight:600;padding:4px 12px;border-radius:50px;letter-spacing:.3px; }

/* ── Marquee ── */
.marquee-section { background:var(--orange);padding:16px 0;overflow:hidden;border-top:1px solid rgba(255,255,255,.15);border-bottom:1px solid rgba(255,255,255,.15); }
.marquee-track { display:flex;gap:48px;white-space:nowrap;animation:marqueeScroll 25s linear infinite; }
.marquee-item { font-family:'Syne',sans-serif;font-weight:700;font-size:1rem;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.9);display:flex;align-items:center;gap:16px;flex-shrink:0; }
.marquee-star { color:var(--navy);font-size:1.3rem; }
@keyframes marqueeScroll { 0%{transform:translateX(0)}100%{transform:translateX(-50%)} }

/* ── Footer ── */
footer { background:#060E1D;padding:70px 0 30px;border-top:1px solid rgba(255,255,255,.05); }
.footer-brand { font-family:'Syne',sans-serif;font-weight:800;font-size:1.6rem;color:var(--white);letter-spacing:-.5px;margin-bottom:14px; }
.footer-brand span { color:var(--orange); }
.footer-desc { color:var(--text-muted);font-size:.88rem;line-height:1.7;max-width:280px;margin-bottom:24px; }
.social-links { display:flex;gap:10px; }
.social-btn { width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:var(--text-muted);display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .25s;text-decoration:none; }
.social-btn:hover { background:var(--orange);border-color:var(--orange);color:var(--white);transform:translateY(-3px); }
.footer-heading { font-family:'Syne',sans-serif;font-weight:700;font-size:.95rem;color:var(--white);margin-bottom:20px;letter-spacing:.3px; }
.footer-links { list-style:none;padding:0; }
.footer-links li { margin-bottom:11px; }
.footer-links a { color:var(--text-muted);text-decoration:none;font-size:.88rem;transition:color .22s;display:flex;align-items:center;gap:6px; }
.footer-links a:hover { color:var(--orange); }
.footer-links a::before { content:'›';color:var(--orange);font-size:1.1rem;opacity:0;transition:opacity .22s; }
.footer-links a:hover::before { opacity:1; }
.footer-bottom { margin-top:50px;padding-top:24px;border-top:1px solid rgba(255,255,255,.06);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px; }
.footer-copy { color:var(--text-muted);font-size:.83rem; }
.footer-copy span { color:var(--orange); }
.footer-legal { display:flex;gap:20px; }
.footer-legal a { color:var(--text-muted);font-size:.83rem;text-decoration:none;transition:color .22s; }
.footer-legal a:hover { color:var(--orange); }

/* ── Scroll Reveal ── */
.reveal { opacity:0;transform:translateY(36px);transition:all .75s cubic-bezier(.22,1,.36,1); }
.reveal.visible { opacity:1;transform:translateY(0); }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }
.reveal-delay-4 { transition-delay:.4s; }

/* ── CTA Strip ── */
.cta-section { padding:110px 0;background:var(--navy-mid); }
.cta-box { background:linear-gradient(135deg,var(--navy-light) 0%,var(--navy) 100%);border:1px solid rgba(255,107,26,.2);border-radius:30px;padding:70px 60px;text-align:center;position:relative;overflow:hidden; }
.cta-box::before { content:'';position:absolute;top:-120px;right:-120px;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(255,107,26,.18),transparent 70%); }
.cta-box::after { content:'';position:absolute;bottom:-80px;left:-80px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,107,26,.1),transparent 70%); }
.cta-box h2 { font-size:clamp(2rem,4vw,3.4rem);font-weight:800;letter-spacing:-1.5px;margin-bottom:18px;position:relative;z-index:1; }
.cta-box p { color:var(--text-muted);font-size:1.05rem;max-width:500px;margin:0 auto 38px;position:relative;z-index:1; }
.cta-actions { display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1; }

/* ── Stats (orange strip) ── */
.stats-section { padding:90px 0;background:var(--orange);position:relative;overflow:hidden; }
.stats-section::before { content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:30px 30px; }
.stat-block { text-align:center; }
.stat-big { font-family:'Syne',sans-serif;font-size:clamp(3rem,6vw,5rem);font-weight:800;color:var(--white);line-height:1;display:block; }
.stat-desc { font-size:.9rem;color:rgba(255,255,255,.75);margin-top:8px;font-weight:500; }
.stat-suffix { font-family:'Syne',sans-serif;font-size:3rem;font-weight:800;color:#fff; }

/* ── Glowing border card ── */
.glow-card { background:var(--navy-mid);border:1px solid var(--border);border-radius:22px;padding:36px;position:relative;overflow:hidden;transition:all .38s ease; }
.glow-card::after { content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange),var(--orange-glow));transform:scaleX(0);transform-origin:left;transition:transform .38s ease; }
.glow-card:hover { border-color:rgba(255,107,26,.25);transform:translateY(-8px);box-shadow:0 24px 60px rgba(0,0,0,.4); }
.glow-card:hover::after { transform:scaleX(1); }

/* ── Icon Box ── */
.icon-box { width:60px;height:60px;background:var(--orange-dim);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:var(--orange);margin-bottom:22px;transition:all .3s; }
.glow-card:hover .icon-box { background:var(--orange);color:var(--white);transform:rotate(-5deg) scale(1.08); }

@media(max-width:992px){ .cta-box { padding:50px 28px; } }
@media(max-width:768px){ .stats-section::after { display:none; } }