/*
Theme Name: Hello Elementor HeyNow
Template: hello-elementor
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&display=swap');

:root {
  --bg: #0b0b0b;
  --bg2: #121212;
  --bg3: #181818;
  --white: #eeece7;
  --muted: rgba(238,236,231,0.42);
  --muted2: rgba(238,236,231,0.18);
  --border: rgba(238,236,231,0.08);
  --border2: rgba(238,236,231,0.14);
  --neon: #00ffb3;
  --neon-glow: rgba(0,255,179,0.22);
  --serif: 'Instrument Serif', serif;
  --sans: 'DM Sans', sans-serif;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: var(--bg);
  color: var(--white);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--serif);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--white);
}
h1 { font-size: clamp(52px, 8.5vw, 112px); }
h2 { font-size: clamp(36px, 5vw, 58px); }
h3 { font-size: clamp(22px, 3vw, 32px); }

p { color: var(--muted); font-weight: 300; font-size: 16px; line-height: 1.85; }
a { color: var(--neon); text-decoration: none; transition: opacity 0.2s; }
a:hover { opacity: 0.75; }

.site-header { display: none; }
.site-footer { display: none; }
#page { margin: 0; padding: 0; }
.elementor-page { background: var(--bg); }
.elementor-widget-heading .elementor-heading-title { font-family: var(--serif); }
.hn-btn-neon {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--neon); color: #0b0b0b;
  font-family: var(--sans); font-size: 14px; font-weight: 500;
  padding: 16px 36px; border-radius: 100px;
  text-decoration: none; transition: box-shadow 0.3s, transform 0.2s;
  border: none; cursor: pointer;
}
.hn-btn-neon:hover {
  box-shadow: 0 0 32px var(--neon-glow), 0 0 64px rgba(0,255,179,0.08);
  transform: translateY(-2px); color: #0b0b0b; opacity: 1;
}

.hn-btn-outline {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid var(--border2); color: var(--muted);
  font-family: var(--sans); font-size: 14px; font-weight: 400;
  padding: 16px 36px; border-radius: 100px;
  text-decoration: none; transition: border-color 0.3s, color 0.3s;
}
.hn-btn-outline:hover { border-color: rgba(0,255,179,0.4); color: var(--neon); }

.hn-label {
  font-family: var(--sans); font-size: 11px; font-weight: 400;
  letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--neon); opacity: 0.85; display: block; margin-bottom: 14px;
}

.hn-neon { color: var(--neon); }
.hn-neon-em { color: var(--neon); font-style: italic; }
.hn-muted { color: var(--muted); }
.hn-bg2 { background: var(--bg2); }
.hn-bg3 { background: var(--bg3); }
.hn-border-t { border-top: 1px solid var(--border); }
.hn-border-b { border-bottom: 1px solid var(--border); }

.hn-neon-line {
  display: block; width: 100%; height: 2px;
  background: var(--neon);
  box-shadow: 0 0 8px var(--neon), 0 0 20px var(--neon-glow);
}
.hn-marquee-wrap {
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 17px 0; overflow: hidden; background: var(--bg2);
}
.hn-marquee {
  display: flex; white-space: nowrap;
  animation: hn-marq 34s linear infinite;
  font-family: var(--serif); font-style: italic;
  font-size: 17px; color: var(--muted2);
}
.hn-marquee-item { padding: 0 36px; }
.hn-marquee-sep { color: var(--neon); font-style: normal; opacity: 0.6; }
@keyframes hn-marq {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.hn-work-card { overflow: hidden; position: relative; cursor: pointer; background: var(--bg3); }
.hn-work-card-img { overflow: hidden; }
.hn-work-card-img img { transition: transform 0.7s cubic-bezier(0.25,0.1,0.25,1); width: 100%; }
.hn-work-card:hover .hn-work-card-img img { transform: scale(1.04); }
.hn-neon-bar {
  position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: var(--neon); box-shadow: 0 0 12px var(--neon);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.55s cubic-bezier(0.7,0,0.3,1); z-index: 5;
}
.hn-work-card:hover .hn-neon-bar { transform: scaleX(1); }
.hn-work-cat {
  font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--muted2); display: block; margin-bottom: 8px;
}
.hn-work-name {
  font-family: var(--serif); font-size: 20px;
  letter-spacing: -0.3px; line-height: 1.2; color: var(--white);
}
.hn-work-arrow {
  font-size: 18px; color: var(--muted2);
  transition: color 0.3s, transform 0.3s;
}
.hn-work-card:hover .hn-work-arrow { color: var(--neon); transform: translate(3px,-3px); }
.hn-svc-row {
  display: flex; align-items: center; gap: 28px;
  padding: 36px 0; border-bottom: 1px solid var(--border);
  transition: padding-left 0.35s cubic-bezier(0.7,0,0.3,1);
}
.hn-svc-row:hover { padding-left: 14px; background: rgba(0,255,179,0.012); }
.hn-svc-name {
  font-family: var(--serif); font-size: clamp(22px,3.2vw,38px);
  letter-spacing: -0.5px; flex: 1; transition: color 0.25s; color: var(--white);
}
.hn-svc-row:hover .hn-svc-name { color: var(--neon); }
.hn-svc-tag {
  font-size: 10px; letter-spacing: 1px; text-transform: uppercase;
  border: 1px solid var(--border); color: var(--muted2);
  padding: 5px 12px; border-radius: 100px;
  transition: border-color 0.25s, color 0.25s; display: inline-block; margin: 3px;
}
.hn-svc-row:hover .hn-svc-tag { border-color: rgba(0,255,179,0.25); color: rgba(0,255,179,0.55); }

.hn-stat-num {
  font-family: var(--serif);
  font-size: clamp(44px, 5.5vw, 68px);
  letter-spacing: -2px; line-height: 1; color: var(--white);
}
.hn-stat-num em { font-style: normal; color: var(--neon); }
.hn-stat-label { font-size: 12px; color: var(--muted); margin-top: 10px; font-weight: 300; }

.hn-quote-mark {
  font-family: var(--serif); font-size: 80px; line-height: 0.6;
  color: var(--neon); display: block; margin-bottom: 44px; opacity: 0.8;
}
.hn-quote-text {
  font-family: var(--serif); font-size: clamp(22px,3vw,38px);
  letter-spacing: -0.5px; line-height: 1.35; color: var(--white);
}
.hn-quote-text em { font-style: italic; color: var(--neon); }
.hn-quote-author {
  font-size: 12px; color: var(--muted2);
  letter-spacing: 2px; text-transform: uppercase;
}

.hn-glow {
  position: absolute; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(0,255,179,0.05) 0%, transparent 65%);
  animation: hn-glow-pulse 9s ease-in-out infinite;
}
@keyframes hn-glow-pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.6; transform: scale(1.12); }
}

.hn-reveal {
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.75s ease, transform 0.75s ease;
}
.hn-reveal.hn-in { opacity: 1; transform: none; }

.hn-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  padding: 22px 52px; display: flex; justify-content: space-between; align-items: center;
  transition: background 0.4s, border-color 0.4s;
  border-bottom: 1px solid transparent;
}
.hn-nav.scrolled {
  background: rgba(11,11,11,0.94);
  backdrop-filter: blur(18px);
  border-bottom-color: var(--border);
}
.site-header, .site-footer, .page-header, .entry-header,
h1.entry-title, .page-title, header.entry-header { display: none !important; }
.site-main { margin-top: 0 !important; padding-top: 0 !important; }
.page-content, .entry-content { margin-top: 0 !important; }
html, body { width: 100%; overflow-x: hidden; }
.site, #page, .site-content, #content,
.content-area, .site-main, article,
.entry-content, .wp-block-html,
.wp-block-group { 
  max-width: 100% !important; 
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.wp-block-html > div {
  max-width: 100% !important;
  width: 100% !important;
}
html, body { width: 100%; overflow-x: hidden; }
.site, #page, .site-content, #content,
.content-area, .site-main, article,
.entry-content, .wp-block-html,
.wp-block-group { 
  max-width: 100% !important; 
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.wp-block-html > div {
  max-width: 100% !important;
  width: 100% !important;
}
.hero{padding:140px 52px 100px!important;}
.hero h1{font-size:clamp(48px,7vw,96px)!important;margin-bottom:0!important;}
.hero-bottom{display:flex!important;flex-direction:row!important;align-items:flex-end!important;justify-content:space-between!important;gap:48px!important;margin-top:52px!important;}
.hero-desc{max-width:420px!important;font-size:15px!important;}
.hero-actions{flex-shrink:0!important;display:flex!important;flex-direction:column!important;align-items:flex-end!important;gap:14px!important;}
.work-grid .placeholder{height:100%!important;min-height:200px;font-size:14px!important;color:rgba(238,236,231,0.5)!important;text-align:center;padding:20px;}
#hn-nav{padding:18px 52px!important;}
#hn-nav div a{margin:0 4px!important;}
@media (min-width:768px){
  .hero-bottom{flex-direction:row!important;align-items:flex-end!important;}
  .hero-actions{align-items:flex-end!important;}
  .hero-desc{max-width:420px!important;}
}
.hero-bottom{margin-top:52px!important;padding-top:52px!important;border-top:1px solid rgba(238,236,231,0.08)!important;}
.wcard .placeholder{color:rgba(238,236,231,0.5)!important;background-blend-mode:normal!important;}
.hero-bottom{display:flex!important;flex-direction:row!important;align-items:flex-end!important;justify-content:space-between!important;flex-wrap:nowrap!important;}
.hero-desc{max-width:380px!important;flex-shrink:1!important;}
.hero-actions{flex-shrink:0!important;margin-left:40px!important;}
#hn-nav img { display:block!important; visibility:visible!important; opacity:1!important; height:36px!important; width:auto!important; max-width:none!important; }
.hero{justify-content:center!important;padding-top:120px!important;}
.hero-bottom{width:100%!important;margin-top:40px!important;}
.hero-actions{margin-left:0!important;}
