@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:wght@300;400;500;700&display=swap');

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --bg:      #0a0a0a;
  --bg2:     #111113;
  --orange:  #FF6B2B;
  --orange2: #FF9A5C;
  --glass:   rgba(255,255,255,0.04);
  --glass-b: rgba(255,255,255,0.08);
  --text:    #F5F0EC;
  --muted:   rgba(245,240,236,0.4);
}

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: 'DM Sans', sans-serif;
  overflow-x: hidden;
  cursor: none;
}

/* Elementor: remove extra padding it adds */
.elementor-section-wrap,
.elementor-section { margin-top: 0 !important; }

/* ── CURSOR ── */
.msy-cursor {
  width: 12px; height: 12px;
  background: var(--orange); border-radius: 50%;
  position: fixed; top:0; left:0;
  pointer-events: none; z-index: 9999;
  transform: translate(-50%,-50%);
  transition: width .2s, height .2s, opacity .2s;
}
.msy-cursor-ring {
  width: 36px; height: 36px;
  border: 1px solid rgba(255,107,43,0.5); border-radius: 50%;
  position: fixed; top:0; left:0;
  pointer-events: none; z-index: 9998;
  transform: translate(-50%,-50%);
  transition: width .12s, height .12s, border-color .2s, opacity .2s;
}

/* ── RAZOR CURSOR ── */
.razor-cursor {
  position: fixed;
  pointer-events: none;
  z-index: 99999;
  display: none;
  transform: translate(-7px, -4px);
}

/* ── NAV ── */
.msy-nav {
  position: fixed; inset: 0 0 auto; z-index: 500;
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.3rem 4rem;
  background: rgba(10,10,10,0.75);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.msy-logo {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.8rem; letter-spacing: 3px;
  color: var(--text); line-height: 1; text-decoration: none;
}
.msy-logo span { color: var(--orange); }
.nav-links { display: flex; gap: 2.5rem; list-style: none; }
.nav-links a {
  text-decoration: none; color: var(--muted);
  font-size: .85rem; font-weight: 500; letter-spacing: .5px; transition: color .3s;
}
.nav-links a:hover, .nav-links a.active { color: var(--orange); }
.msy-hamburger {
  display: none; flex-direction: column; gap: 5px;
  cursor: none; padding: .3rem; background: none; border: none;
}
.msy-hamburger span { width: 22px; height: 1.5px; background: var(--text); display: block; transition: all .3s; }

/* Mobile nav open */
.msy-nav.open .nav-links {
  display: flex; flex-direction: column;
  position: fixed; inset: 72px 0 0;
  background: var(--bg2); padding: 2.5rem 2rem;
  border-top: 1px solid rgba(255,255,255,.06);
  gap: 1.5rem; z-index: 499;
}
.msy-nav.open .nav-links a { font-size: 1.1rem; }

/* ── BUTTONS ── */
.btn-glass {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .65rem 1.6rem;
  background: rgba(255,107,43,0.08);
  border: 1px solid rgba(255,107,43,0.3); border-radius: 6px;
  color: var(--orange); font-family: 'DM Sans', sans-serif;
  font-size: .85rem; font-weight: 500; letter-spacing: .3px;
  cursor: none; text-decoration: none;
  backdrop-filter: blur(10px); transition: all .3s;
}
.btn-glass:hover {
  background: rgba(255,107,43,0.15); border-color: var(--orange);
  box-shadow: 0 0 20px rgba(255,107,43,.2); transform: translateY(-1px);
}
.btn-solid {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .75rem 2rem;
  background: var(--orange); border: none; border-radius: 6px;
  color: #0a0a0a; font-family: 'DM Sans', sans-serif;
  font-size: .9rem; font-weight: 700;
  cursor: none; text-decoration: none; transition: all .3s;
}
.btn-solid:hover {
  background: var(--orange2); transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(255,107,43,.4);
}

/* ── HERO ── */
.hero {
  min-height: 100vh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 8rem 4rem 4rem;
  position: relative; text-align: center;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .35rem 1rem;
  background: rgba(255,107,43,0.08);
  border: 1px solid rgba(255,107,43,0.25); border-radius: 4px;
  font-size: .72rem; color: var(--orange); font-weight: 500;
  letter-spacing: 2px; text-transform: uppercase; margin-bottom: 2rem;
  animation: fadeUp .7s ease both;
}
.hero-badge .dot { width:5px; height:5px; background:var(--orange); border-radius:50%; animation:blink 1.5s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.2} }

.hero h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(4rem, 10vw, 8rem);
  line-height: .95; letter-spacing: 2px; margin-bottom: 1.5rem;
  animation: fadeUp .7s .1s ease both;
}
.hero h1 .line2 { color: var(--orange); }
.hero h1 .line3 { -webkit-text-stroke: 1px rgba(245,240,236,.25); color: transparent; }
.hero-sub {
  font-size: 1rem; color: var(--muted); max-width: 440px;
  line-height: 1.7; font-weight: 300; margin-bottom: 2.5rem;
  animation: fadeUp .7s .2s ease both;
}
.hero-btns { display:flex; gap:1rem; justify-content:center; margin-bottom:4rem; animation:fadeUp .7s .3s ease both; }
@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }

/* ── TIMELINE ── */
.timeline-wrap { width:100%; max-width:900px; animation:fadeUp .7s .4s ease both; }
.timeline-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:.6rem; padding:0 .5rem; }
.timeline-title { font-size:.7rem; color:rgba(255,255,255,.25); letter-spacing:1.5px; text-transform:uppercase; font-weight:500; display:flex; align-items:center; gap:.5rem; }
.rec-dot { width:6px; height:6px; background:#ff3b3b; border-radius:50%; animation:blink 1s infinite; }
.timecode { font-family:'Bebas Neue',sans-serif; font-size:.9rem; color:var(--orange); letter-spacing:2px; }
.timeline-container { background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:12px; overflow:hidden; position:relative; cursor:none; }
.ruler { height:28px; background:rgba(0,0,0,.4); border-bottom:1px solid rgba(255,255,255,.06); position:relative; overflow:hidden; }
.ruler-marks { position:absolute; top:0; left:0; right:0; bottom:0; display:flex; align-items:flex-end; }
.ruler-mark { flex:1; display:flex; flex-direction:column; align-items:flex-start; padding-left:4px; border-left:1px solid rgba(255,255,255,.07); }
.ruler-mark span { font-size:9px; color:rgba(255,255,255,.2); font-family:'Bebas Neue',sans-serif; letter-spacing:1px; padding-bottom:4px; }
.playhead { position:absolute; top:0; bottom:0; width:2px; background:var(--orange); z-index:20; pointer-events:none; left:30%; }
.playhead::before { content:'▼'; position:absolute; top:-1px; left:50%; transform:translateX(-50%); color:var(--orange); font-size:8px; line-height:1; }
.playhead-glow { position:absolute; top:0; bottom:0; width:60px; background:linear-gradient(90deg,transparent,rgba(255,107,43,.06),transparent); transform:translateX(-30px); pointer-events:none; }
.tracks { padding:.75rem 0; position:relative; }
.track { display:flex; align-items:center; height:38px; margin-bottom:5px; }
.track-label { width:80px; flex-shrink:0; font-size:.65rem; color:rgba(255,255,255,.25); text-transform:uppercase; letter-spacing:1px; text-align:right; padding-right:12px; font-weight:500; }
.track-area { flex:1; height:100%; position:relative; overflow:hidden; }
.clip { position:absolute; height:100%; border-radius:5px; display:flex; align-items:center; padding:0 8px; font-size:.6rem; font-weight:600; letter-spacing:.4px; overflow:hidden; transition:filter .2s,transform .15s; border-top:1px solid rgba(255,255,255,.15); cursor:none; }
.clip:hover { filter:brightness(1.2); transform:scaleY(1.05); }
.clip-wave { position:absolute; inset:0; display:flex; align-items:center; gap:2px; padding:4px 6px; opacity:.25; pointer-events:none; }
.clip-wave span { display:block; width:2px; background:rgba(255,255,255,.7); border-radius:1px; flex-shrink:0; }
.clip-name { position:relative; z-index:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1; display:block; width:100%; }
.clip-v  { background:linear-gradient(135deg,#1a3a5c,#0d2035); color:#5bb8ff; }
.clip-a  { background:linear-gradient(135deg,#2d1a4a,#1a0d35); color:#b57dff; }
.clip-f  { background:linear-gradient(135deg,#3a2000,#2a1500); color:var(--orange); }
.clip-t  { background:linear-gradient(135deg,#003a25,#001f15); color:#5affb8; }
.clip-s  { background:linear-gradient(135deg,#3a1a00,#251000); color:#ff9a3c; }
.scrub-overlay { position:absolute; inset:0; z-index:10; cursor:none; }
.tl-footer { height:32px; background:rgba(0,0,0,.3); border-top:1px solid rgba(255,255,255,.05); display:flex; align-items:center; padding:0 .5rem 0 80px; gap:.5rem; }
.tl-btn { width:22px; height:22px; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04); border-radius:4px; display:flex; align-items:center; justify-content:center; font-size:.6rem; color:rgba(255,255,255,.4); cursor:none; transition:all .2s; }
.tl-btn:hover, .tl-btn.active { border-color:var(--orange); color:var(--orange); }

/* ── MARQUEE ── */
.marquee-wrap { width:100%; overflow:hidden; border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); padding:1rem 0; background:rgba(255,107,43,.03); }
.marquee-inner { display:flex; gap:2rem; animation:marquee 20s linear infinite; white-space:nowrap; }
.marquee-inner span { font-family:'Bebas Neue',sans-serif; font-size:1rem; letter-spacing:3px; color:rgba(255,255,255,.12); flex-shrink:0; }
.marquee-inner span.accent { color:rgba(255,107,43,.4); }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── SECTION ── */
.section { max-width:1200px; margin:0 auto; padding:6rem 4rem; }
.section-tag { font-size:.72rem; text-transform:uppercase; letter-spacing:3px; color:var(--orange); font-weight:500; margin-bottom:.8rem; display:flex; align-items:center; gap:.5rem; }
.section-tag::before { content:''; width:16px; height:1px; background:var(--orange); }
.section h2 { font-family:'Bebas Neue',sans-serif; font-size:clamp(2.2rem,5vw,3.8rem); letter-spacing:2px; margin-bottom:3rem; line-height:1; }
.section h2 span { color:var(--orange); }

/* ── PAGE HERO ── */
.page-hero { min-height:50vh; display:flex; flex-direction:column; justify-content:flex-end; padding:10rem 4rem 4rem; border-bottom:1px solid rgba(255,255,255,.06); position:relative; }
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 60% 0%,rgba(255,107,43,.07),transparent 60%); pointer-events:none; }
.page-tag { font-size:.7rem; font-weight:500; letter-spacing:3px; text-transform:uppercase; color:var(--orange); display:flex; align-items:center; gap:.5rem; margin-bottom:1rem; }
.page-tag::before { content:''; width:20px; height:1px; background:var(--orange); }
.page-hero h1 { font-family:'Bebas Neue',sans-serif; font-size:clamp(3.5rem,9vw,7rem); letter-spacing:2px; line-height:.95; }
.page-hero h1 span { color:var(--orange); }
.page-hero h1 .outline { -webkit-text-stroke:1px rgba(245,240,236,.2); color:transparent; }
.page-hero p { font-size:1rem; color:var(--muted); font-weight:300; line-height:1.75; max-width:480px; margin-top:1.5rem; }

/* ── SERVICES GRID ── */
.services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.04); border-radius:14px; overflow:hidden; }
.service-card { background:var(--bg2); padding:2.2rem; transition:background .3s; position:relative; overflow:hidden; }
.service-card::before { content:''; position:absolute; bottom:0; left:2.2rem; right:2.2rem; height:1px; background:linear-gradient(90deg,transparent,rgba(255,107,43,0),transparent); transition:background .3s; }
.service-card:hover { background:rgba(255,107,43,.04); }
.service-card:hover::before { background:linear-gradient(90deg,transparent,rgba(255,107,43,.3),transparent); }
.service-num { font-family:'Bebas Neue',sans-serif; font-size:2.5rem; letter-spacing:1px; color:rgba(255,107,43,.12); line-height:1; margin-bottom:1rem; }
.service-card h3 { font-family:'Bebas Neue',sans-serif; font-size:1.4rem; letter-spacing:1px; margin-bottom:.7rem; }
.service-card p { font-size:.85rem; color:var(--muted); line-height:1.75; font-weight:300; }
.service-tag { display:inline-block; margin-top:1.2rem; padding:.3rem .8rem; background:rgba(255,107,43,.08); border:1px solid rgba(255,107,43,.2); border-radius:4px; font-size:.7rem; color:var(--orange); letter-spacing:1px; text-transform:uppercase; }

/* ── STATS ROW ── */
.stats-row { display:flex; gap:1.5px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.06); border-radius:12px; overflow:hidden; margin-top:2rem; }
.stat-item { flex:1; padding:2rem; background:var(--bg2); text-align:center; }
.stat-n { font-family:'Bebas Neue',sans-serif; font-size:3.5rem; color:var(--orange); letter-spacing:2px; line-height:1; }
.stat-l { font-size:.8rem; color:var(--muted); margin-top:.4rem; }

/* ── DIVIDER ── */
.divider { height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent); margin:0 4rem; }

/* ── WHY SECTION (custom SVG icons) ── */
.why-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.05); border-radius:14px; overflow:hidden; }
.why-card { background:var(--bg2); padding:2.5rem; transition:background .3s; }
.why-card:hover { background:rgba(255,107,43,.04); }
.why-card.featured { background:rgba(255,107,43,.06); border:none; outline:1px solid rgba(255,107,43,.2); outline-offset:-1px; display:flex; flex-direction:column; justify-content:space-between; }
.why-icon { width:44px; height:44px; margin-bottom:1.2rem; }
.why-icon svg { width:100%; height:100%; }
.why-card h3 { font-family:'Bebas Neue',sans-serif; font-size:1.4rem; letter-spacing:1px; margin-bottom:.6rem; }
.why-card p { font-size:.85rem; color:var(--muted); line-height:1.75; font-weight:300; }
.why-btns { display:flex; gap:.8rem; flex-wrap:wrap; margin-top:1.5rem; }

/* ── PORTFOLIO GRID ── */
.portfolio-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.06); border-radius:12px; overflow:hidden; }
.port-item { background:var(--bg2); aspect-ratio:9/16; position:relative; overflow:hidden; cursor:none; }
.port-bg { position:absolute; inset:0; transition:transform .5s ease; }
.port-item:hover .port-bg { transform:scale(1.05); }
.port-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(10,10,10,.85),transparent 60%); opacity:0; transition:opacity .3s; display:flex; flex-direction:column; justify-content:flex-end; padding:1.5rem; }
.port-item:hover .port-overlay { opacity:1; }
.port-num { font-family:'Bebas Neue',sans-serif; font-size:3rem; color:rgba(255,107,43,.15); position:absolute; top:1rem; left:1.2rem; line-height:1; }
.port-cat { font-size:.62rem; font-weight:500; color:var(--orange); letter-spacing:2px; text-transform:uppercase; margin-bottom:.3rem; }
.port-title { font-family:'Bebas Neue',sans-serif; font-size:1.2rem; letter-spacing:1px; }
.port-bottom { display:flex; align-items:center; justify-content:space-between; padding:.7rem 1rem; border-top:1px solid rgba(255,255,255,.05); font-size:.65rem; color:var(--muted); }
.port-filter-bar { display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:2rem; }
.pf-btn { padding:.4rem 1.1rem; background:var(--glass); border:1px solid var(--glass-b); border-radius:4px; font-size:.72rem; font-weight:500; color:var(--muted); cursor:none; transition:all .25s; }
.pf-btn:hover, .pf-btn.active { border-color:var(--orange); color:var(--orange); background:rgba(255,107,43,.08); }
.port-item.hidden { display:none; }

/* ── PRICING ── */
.price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.06); border-radius:12px; overflow:hidden; }
.price-card { background:var(--bg2); padding:2.5rem; position:relative; }
.price-card.featured { background:linear-gradient(135deg,#1a0f00,#0f0800); outline:1px solid rgba(255,107,43,.3); outline-offset:-1px; }
.price-card.featured::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,transparent,var(--orange),transparent); }
.pc-badge { display:inline-block; margin-bottom:1.5rem; padding:.28rem .8rem; background:rgba(255,107,43,.1); border:1px solid rgba(255,107,43,.25); border-radius:4px; font-size:.68rem; color:var(--orange); letter-spacing:1.5px; text-transform:uppercase; }
.pc-name { font-family:'Bebas Neue',sans-serif; font-size:1.8rem; letter-spacing:1px; margin-bottom:.4rem; }
.pc-desc { font-size:.83rem; color:var(--muted); line-height:1.7; font-weight:300; margin-bottom:1.8rem; }
.pc-price { font-family:'Bebas Neue',sans-serif; font-size:3.8rem; letter-spacing:-1px; line-height:1; margin-bottom:.3rem; }
.pc-price span { color:var(--orange); }
.pc-per { font-size:.72rem; color:var(--muted); margin-bottom:2rem; }
.pc-features { list-style:none; margin-bottom:2rem; }
.pc-features li { font-size:.85rem; color:var(--muted); font-weight:300; padding:.55rem 0; border-bottom:1px solid rgba(255,255,255,.05); display:flex; align-items:center; gap:.6rem; }
.pc-features li::before { content:'✓'; color:var(--orange); font-size:.75rem; font-weight:700; flex-shrink:0; }

/* ── PROCESS ── */
.process-list { display:flex; flex-direction:column; }
.process-item { display:flex; gap:2.5rem; align-items:flex-start; padding:2.5rem 0; border-bottom:1px solid rgba(255,255,255,.05); transition:padding .3s; }
.process-item:last-child { border-bottom:none; }
.process-item:hover { padding-left:.5rem; }
.proc-num { font-family:'Bebas Neue',sans-serif; font-size:4rem; letter-spacing:1px; color:rgba(255,107,43,.12); line-height:1; flex-shrink:0; width:80px; transition:color .3s; }
.process-item:hover .proc-num { color:rgba(255,107,43,.4); }
.proc-body h3 { font-family:'Bebas Neue',sans-serif; font-size:1.5rem; letter-spacing:1px; margin-bottom:.5rem; }
.proc-body p { font-size:.88rem; color:var(--muted); line-height:1.75; font-weight:300; max-width:500px; }

/* ── CONTACT ── */
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:5rem; align-items:start; }
.c-detail { display:flex; gap:1rem; align-items:flex-start; margin-bottom:.8rem; }
.c-label { font-size:.65rem; font-weight:500; color:var(--orange); letter-spacing:1.5px; text-transform:uppercase; min-width:60px; padding-top:.15rem; }
.c-val { font-size:.9rem; font-weight:400; }
.msy-form { display:flex; flex-direction:column; gap:1.2rem; }
.form-group { display:flex; flex-direction:column; gap:.4rem; }
.form-group label { font-size:.65rem; font-weight:500; color:var(--muted); letter-spacing:1px; text-transform:uppercase; }
.form-group input, .form-group textarea, .form-group select { width:100%; padding:.8rem 1rem; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:6px; font-family:'DM Sans',sans-serif; font-size:.9rem; color:var(--text); outline:none; transition:border-color .25s; }
.form-group select option { background:#111; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { border-color:rgba(255,107,43,.5); background:rgba(255,107,43,.03); }
.form-group textarea { resize:vertical; min-height:130px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-success { background:rgba(255,107,43,.1); border:1px solid rgba(255,107,43,.3); border-radius:6px; padding:1rem 1.2rem; margin-bottom:1.5rem; font-size:.85rem; color:var(--orange); font-weight:500; }

/* ── CTA ── */
.cta-section { padding:6rem 4rem; text-align:center; max-width:700px; margin:0 auto; }
.cta-section h2 { font-family:'Bebas Neue',sans-serif; font-size:clamp(3rem,6vw,5rem); letter-spacing:2px; line-height:1; margin-bottom:1.2rem; }
.cta-section h2 span { color:var(--orange); }
.cta-section p { color:var(--muted); font-size:.95rem; font-weight:300; margin-bottom:2.5rem; line-height:1.7; }
.cta-btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }

/* ── FAQ ── */
.faq-item { border-bottom:1px solid rgba(255,255,255,.06); padding:1.8rem 0; }
.faq-q { font-family:'Bebas Neue',sans-serif; font-size:1.3rem; letter-spacing:1px; cursor:none; display:flex; align-items:center; justify-content:space-between; }
.fq-icon { color:var(--orange); font-size:1rem; transition:transform .3s; }
.faq-item.open .fq-icon { transform:rotate(45deg); }
.faq-a { font-size:.88rem; color:var(--muted); line-height:1.75; font-weight:300; max-height:0; overflow:hidden; transition:max-height .4s ease,padding .3s; }
.faq-item.open .faq-a { max-height:200px; padding-top:.8rem; }

/* ── FOOTER ── */
.msy-footer { border-top:1px solid rgba(255,255,255,.06); background:var(--bg2); }
.footer-top { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:3rem; padding:4rem; }
.footer-logo { font-family:'Bebas Neue',sans-serif; font-size:1.4rem; letter-spacing:3px; text-decoration:none; color:var(--text); display:block; margin-bottom:.8rem; }
.footer-logo span { color:var(--orange); }
.footer-brand p { font-size:.82rem; color:var(--muted); line-height:1.7; font-weight:300; max-width:220px; }
.footer-col h4 { font-family:'Bebas Neue',sans-serif; font-size:.85rem; letter-spacing:2px; color:rgba(255,255,255,.3); margin-bottom:1.2rem; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:.6rem; }
.footer-col ul li a { font-size:.82rem; color:var(--muted); text-decoration:none; transition:color .2s; }
.footer-col ul li a:hover { color:var(--orange); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; padding:1.4rem 4rem; border-top:1px solid rgba(255,255,255,.05); }
.footer-bottom p { font-size:.75rem; color:rgba(255,255,255,.2); }

/* ── ELEMENTOR overrides ── */
.elementor-page .msy-nav { z-index: 9999 !important; }
/* Allow Elementor sections to go full width */
.elementor-section.elementor-section-full_width { padding-left: 0 !important; padding-right: 0 !important; }

/* ── REVEAL ── */
.rv  { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }
.rv.in  { opacity:1; transform:none; }
.rvl { opacity:0; transform:translateX(-28px); transition:opacity .7s ease,transform .7s ease; }
.rvl.in { opacity:1; transform:none; }

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .msy-nav { padding:1rem 1.5rem; }
  .nav-links { display:none; }
  .msy-hamburger { display:flex; }
  .hero,.page-hero { padding:7rem 1.5rem 3rem; }
  .section { padding:4rem 1.5rem; }
  .divider { margin:0 1.5rem; }
  .why-grid { grid-template-columns:1fr; }
  .portfolio-grid { grid-template-columns:1fr 1fr; }
  .price-grid { grid-template-columns:1fr; }
  .contact-grid { grid-template-columns:1fr; gap:3rem; }
  .stats-row { flex-direction:column; }
  .footer-top { grid-template-columns:1fr 1fr; gap:2rem; padding:3rem 1.5rem; }
  .footer-bottom { flex-direction:column; gap:.5rem; text-align:center; padding:1.2rem 1.5rem; }
  .form-row { grid-template-columns:1fr; }
  .cta-section { padding:4rem 1.5rem; }
}
@media(max-width:600px){
  .portfolio-grid { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr; }
}

/* ════════════════════════════════════
   BLOG — SHARED
════════════════════════════════════ */
.blog-hero { min-height:40vh; display:flex; flex-direction:column; justify-content:flex-end; padding:9rem 4rem 3.5rem; border-bottom:1px solid rgba(255,255,255,.06); position:relative; }
.blog-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 70% 0%,rgba(255,107,43,.07),transparent 55%); pointer-events:none; }

.post-meta-row { display:flex; align-items:center; gap:1.2rem; flex-wrap:wrap; }
.post-cat { font-size:.65rem; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:var(--orange); padding:.25rem .7rem; border:1px solid rgba(255,107,43,.3); border-radius:3px; }
.post-date { font-size:.72rem; color:var(--muted); font-weight:400; }
.post-read-time { font-size:.72rem; color:var(--muted); font-weight:400; display:flex; align-items:center; gap:.35rem; }
.post-read-time::before { content:''; width:3px; height:3px; background:var(--muted); border-radius:50%; }

/* Views & Likes pill */
.post-stats { display:flex; align-items:center; gap:1rem; }
.stat-pill { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; color:var(--muted); font-weight:400; }
.stat-pill svg { width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; }

/* ── LAYOUT 1: GRID ── */
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.05); border-radius:14px; overflow:hidden; }
.blog-card { background:var(--bg2); display:flex; flex-direction:column; transition:background .3s; position:relative; }
.blog-card:hover { background:#161618; }
.blog-card-thumb { aspect-ratio:16/9; overflow:hidden; position:relative; }
.blog-card-thumb img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; display:block; }
.blog-card:hover .blog-card-thumb img { transform:scale(1.05); }
.blog-card-thumb .thumb-placeholder { width:100%; height:100%; background:linear-gradient(135deg,#1a1a1e,#111113); display:flex; align-items:center; justify-content:center; }
.blog-card-thumb .thumb-placeholder span { font-family:'Bebas Neue',sans-serif; font-size:4rem; color:rgba(255,107,43,.1); letter-spacing:2px; }
.blog-card-body { padding:1.8rem; flex:1; display:flex; flex-direction:column; gap:.8rem; }
.blog-card-title { font-family:'Bebas Neue',sans-serif; font-size:1.35rem; letter-spacing:1px; line-height:1.1; text-decoration:none; color:var(--text); transition:color .2s; }
.blog-card-title:hover { color:var(--orange); }
.blog-card-excerpt { font-size:.82rem; color:var(--muted); line-height:1.7; font-weight:300; flex:1; }
.blog-card-footer { display:flex; align-items:center; justify-content:space-between; padding-top:.8rem; border-top:1px solid rgba(255,255,255,.05); }
.blog-card-read { font-size:.72rem; font-weight:600; color:var(--orange); letter-spacing:.5px; text-decoration:none; transition:gap .2s; display:flex; align-items:center; gap:.3rem; }
.blog-card-read:hover { gap:.6rem; }

/* Featured card (first post) */
.blog-card.featured { grid-column:span 3; flex-direction:row; }
.blog-card.featured .blog-card-thumb { width:50%; aspect-ratio:unset; flex-shrink:0; }
.blog-card.featured .blog-card-body { padding:2.5rem; justify-content:center; }
.blog-card.featured .blog-card-title { font-size:2.2rem; }
.blog-card.featured .blog-card-excerpt { font-size:.9rem; max-width:500px; }

/* ── LAYOUT 2: EDITORIAL LIST ── */
.blog-list-wrap { display:flex; flex-direction:column; }
.blog-list-item { display:grid; grid-template-columns:80px 1fr auto; gap:2rem; align-items:start; padding:2.5rem 0; border-bottom:1px solid rgba(255,255,255,.05); transition:padding .3s; }
.blog-list-item:last-child { border-bottom:none; }
.blog-list-item:hover { padding-left:.5rem; }
.blog-list-num { font-family:'Bebas Neue',sans-serif; font-size:4rem; color:rgba(255,107,43,.1); line-height:1; transition:color .3s; padding-top:.2rem; }
.blog-list-item:hover .blog-list-num { color:rgba(255,107,43,.35); }
.blog-list-title { font-family:'Bebas Neue',sans-serif; font-size:1.6rem; letter-spacing:1px; line-height:1.05; text-decoration:none; color:var(--text); display:block; margin-bottom:.6rem; transition:color .2s; }
.blog-list-title:hover { color:var(--orange); }
.blog-list-excerpt { font-size:.83rem; color:var(--muted); line-height:1.7; font-weight:300; max-width:560px; }
.blog-list-thumb { width:140px; height:100px; border-radius:8px; overflow:hidden; flex-shrink:0; }
.blog-list-thumb img { width:100%; height:100%; object-fit:cover; }
.blog-list-thumb .thumb-placeholder { width:100%; height:100%; background:linear-gradient(135deg,#1a1a1e,#111113); display:flex; align-items:center; justify-content:center; }
.blog-list-thumb .thumb-placeholder span { font-family:'Bebas Neue',sans-serif; font-size:2rem; color:rgba(255,107,43,.15); }

/* ── LAYOUT 3: MAGAZINE ── */
.blog-magazine { display:grid; grid-template-columns:1fr 1fr; gap:1.5px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.05); border-radius:14px; overflow:hidden; }
.mag-hero { grid-column:span 2; position:relative; min-height:420px; display:flex; align-items:flex-end; overflow:hidden; }
.mag-hero-bg { position:absolute; inset:0; background:linear-gradient(135deg,#1a1a1e,#0d0d0f); }
.mag-hero-bg img { width:100%; height:100%; object-fit:cover; opacity:.5; }
.mag-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(10,10,10,.95) 0%,transparent 60%); }
.mag-hero-body { position:relative; z-index:1; padding:2.5rem; width:100%; }
.mag-hero-body .blog-card-title { font-size:2.5rem; display:block; text-decoration:none; color:var(--text); transition:color .2s; }
.mag-hero-body .blog-card-title:hover { color:var(--orange); }
.mag-small { background:var(--bg2); padding:2rem; transition:background .3s; }
.mag-small:hover { background:rgba(255,107,43,.04); }
.mag-small .blog-card-title { font-size:1.2rem; display:block; text-decoration:none; color:var(--text); transition:color .2s; margin:.6rem 0; line-height:1.15; }
.mag-small .blog-card-title:hover { color:var(--orange); }

/* ── SINGLE POST ── */
.single-hero { min-height:55vh; display:flex; flex-direction:column; justify-content:flex-end; padding:10rem 4rem 4rem; border-bottom:1px solid rgba(255,255,255,.06); position:relative; overflow:hidden; }
.single-hero-bg { position:absolute; inset:0; }
.single-hero-bg img { width:100%; height:100%; object-fit:cover; opacity:.15; }
.single-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,var(--bg) 30%,rgba(10,10,10,.6)); }
.single-hero-body { position:relative; z-index:1; max-width:860px; }
.single-hero h1 { font-family:'Bebas Neue',sans-serif; font-size:clamp(2.8rem,6vw,5.5rem); letter-spacing:2px; line-height:.95; margin:1rem 0 1.5rem; }

.single-content-wrap { max-width:860px; margin:0 auto; padding:4rem 4rem 2rem; }
.single-content { font-size:1rem; line-height:1.85; color:rgba(245,240,236,.8); font-weight:300; }
.single-content h2 { font-family:'Bebas Neue',sans-serif; font-size:2rem; letter-spacing:1px; color:var(--text); margin:2.5rem 0 1rem; }
.single-content h3 { font-family:'Bebas Neue',sans-serif; font-size:1.5rem; letter-spacing:1px; color:var(--text); margin:2rem 0 .8rem; }
.single-content p { margin-bottom:1.5rem; }
.single-content a { color:var(--orange); text-decoration:none; border-bottom:1px solid rgba(255,107,43,.3); transition:border-color .2s; }
.single-content a:hover { border-color:var(--orange); }
.single-content img { width:100%; border-radius:10px; margin:1.5rem 0; }
.single-content blockquote { border-left:3px solid var(--orange); padding:1rem 1.5rem; margin:2rem 0; background:rgba(255,107,43,.04); border-radius:0 8px 8px 0; }
.single-content blockquote p { color:var(--text); font-size:1.05rem; font-style:italic; margin:0; }
.single-content ul,
.single-content ol { padding-left:1.5rem; margin-bottom:1.5rem; }
.single-content li { margin-bottom:.5rem; color:rgba(245,240,236,.75); }
.single-content code { background:rgba(255,107,43,.08); border:1px solid rgba(255,107,43,.15); padding:.15rem .45rem; border-radius:4px; font-size:.85rem; color:var(--orange); }
.single-content pre { background:#111113; border:1px solid rgba(255,255,255,.07); border-radius:10px; padding:1.5rem; overflow-x:auto; margin:1.5rem 0; }

/* Like & Views bar on single post */
.post-engage-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:2rem 0; border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); margin:2rem 0; }
.like-btn { display:inline-flex; align-items:center; gap:.6rem; padding:.65rem 1.6rem; background:rgba(255,107,43,.06); border:1px solid rgba(255,107,43,.2); border-radius:6px; color:var(--muted); font-family:'DM Sans',sans-serif; font-size:.9rem; font-weight:500; cursor:pointer; transition:all .25s; }
.like-btn:hover { background:rgba(255,107,43,.12); border-color:rgba(255,107,43,.5); color:var(--orange); }
.like-btn.liked { background:rgba(255,107,43,.15); border-color:var(--orange); color:var(--orange); }
.like-btn svg { width:18px; height:18px; transition:transform .2s; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.like-btn.liked svg { fill:var(--orange); }
.like-btn:active svg { transform:scale(1.3); }
.like-count { font-family:'Bebas Neue',sans-serif; font-size:1.1rem; letter-spacing:1px; }

.views-display { display:flex; align-items:center; gap:.5rem; font-size:.82rem; color:var(--muted); }
.views-display svg { width:16px; height:16px; stroke:var(--muted); fill:none; stroke-width:2; stroke-linecap:round; }
.views-num { font-family:'Bebas Neue',sans-serif; font-size:1.1rem; color:var(--text); letter-spacing:1px; }

/* Related posts */
.related-posts { max-width:860px; margin:0 auto; padding:0 4rem 4rem; }
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.05); border-radius:12px; overflow:hidden; margin-top:1.5rem; }
.related-card { background:var(--bg2); padding:1.5rem; transition:background .3s; text-decoration:none; display:block; }
.related-card:hover { background:rgba(255,107,43,.04); }
.related-card .post-cat { margin-bottom:.6rem; display:inline-block; }
.related-card-title { font-family:'Bebas Neue',sans-serif; font-size:1.1rem; letter-spacing:.5px; color:var(--text); line-height:1.15; transition:color .2s; }
.related-card:hover .related-card-title { color:var(--orange); }

/* Blog switcher tabs */
.blog-layout-switch { display:flex; gap:.5rem; margin-bottom:2rem; }
.layout-btn { padding:.4rem 1rem; background:var(--glass); border:1px solid var(--glass-b); border-radius:4px; font-size:.72rem; font-weight:500; color:var(--muted); cursor:pointer; transition:all .25s; letter-spacing:.3px; }
.layout-btn:hover,.layout-btn.active { border-color:var(--orange); color:var(--orange); background:rgba(255,107,43,.08); }
.blog-layout { display:none; }
.blog-layout.active { display:block; }

@media(max-width:900px){
  .blog-card.featured { flex-direction:column; grid-column:span 3; }
  .blog-card.featured .blog-card-thumb { width:100%; aspect-ratio:16/9; }
  .blog-grid { grid-template-columns:1fr; }
  .blog-card.featured { grid-column:span 1; }
  .blog-magazine { grid-template-columns:1fr; }
  .mag-hero { grid-column:span 1; }
  .blog-list-item { grid-template-columns:50px 1fr; }
  .blog-list-thumb { display:none; }
  .single-hero,.single-content-wrap,.related-posts { padding-left:1.5rem; padding-right:1.5rem; }
  .blog-hero { padding:7rem 1.5rem 2.5rem; }
  .related-grid { grid-template-columns:1fr; }
}

/* ── PAGINATION ── */
.page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 .8rem; background:var(--glass); border:1px solid var(--glass-b); border-radius:6px; font-size:.8rem; color:var(--muted); text-decoration:none; transition:all .25s; margin:0 .2rem; }
.page-numbers:hover, .page-numbers.current { border-color:rgba(255,107,43,.5); color:var(--orange); background:rgba(255,107,43,.08); }
.page-numbers.dots { background:none; border:none; }
