
:root{
  --bgc: #0b0f13;         /* dark neutral */
  --fg: #f3f4f6;          /* near-white */
  --muted: #a1a1aa;       /* gray-400 */
  --accent: #22c55e;      /* emerald-500 */
  --accent-600: #16a34a;  /* emerald-600 */
  --overlay: rgba(0,0,0,.48);
  --overlay-strong: rgba(0,0,0,.60);
  --container: 1100px;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(0,0,0,.25);

  --bgc: #0a0a0a;
  --fg: #f2f2f2;
  --muted: #c8c8c8;
  --accent: #e0b081;
  --overlay: rgba(0,0,0,.48);
  --overlay-strong: rgba(0,0,0,.60);
  --container: 1100px;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(0,0,0,.25);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: "Helvetica Neue", Helvetica, Arial, system-ui, -apple-system, "Segoe UI", Roboto, Inter, sans-serif;
  background: var(--bgc);
  color: var(--fg);
  line-height:1.5;
}

/* Utilities */
.container{max-width:var(--container); margin:0 auto; padding:0 20px}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 18px; border-radius:12px; border:1px solid #3a3a3a;
  color:var(--fg); text-decoration:none; transition:.2s;
  backdrop-filter: blur(4px);
}
.btn:hover{transform: translateY(-1px)}
.btn.primary{background: var(--accent); color:#07130a; border-color: transparent}
.btn.primary:hover{background: var(--accent-600)}

.site-header{
  position:sticky; top:0; z-index:50;
  background: rgba(10,10,10,.6); backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.header-inner{
  height:58px; display:flex; align-items:center; justify-content:space-between;
}
.brand{color:var(--fg); text-decoration:none; font-weight:700; letter-spacing:.3px}
.top-links{display:flex; gap:14px; align-items:center}
.top-links a{color:var(--fg); text-decoration:none; opacity:.9}
.top-links a:hover{opacity:1}
.top-links .phone{display:flex; gap:8px; align-items:center}

/* Hero slider */
.hero{position:relative; height:calc(100dvh - 58px); min-height:calc(100dvh - 58px);}
.slider{position:relative; width:100%; height:inherit; min-height:inherit;}
.slide{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transform:scale(1.04); transition: opacity 800ms ease, transform 1000ms ease;
}
.slide.is-active{opacity:1; transform:scale(1)}
.overlay{
  position:absolute; inset:0; background: var(--overlay);
  pointer-events:none;
}
.hero-content{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center;
  padding:0 20px; z-index:2;
}
.eyebrow{margin:0 0 8px; color:var(--muted); letter-spacing:.3px}
.title{margin:0 0 10px; font-size: clamp(28px, 4vw, 48px); line-height:1.1}
.subtitle{margin:0 0 22px; color:#e8e8e8; opacity:.9}
.ctrl{
  position:absolute; top:50%; transform: translateY(-50%);
  width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.25);
  background: rgba(0,0,0,.35); color:#fff; font-size:28px; line-height:0;
  display:grid; place-items:center; cursor:pointer; z-index:3;
}
.ctrl:hover{background: rgba(0,0,0,.55)}
.ctrl.prev{left:16px}
.ctrl.next{right:16px}

.dots{
  position:absolute; bottom:18px; left:50%; transform:translateX(-50%);
  display:flex; gap:8px; z-index:3;
}
.dot{
  width:10px; height:10px; border-radius:999px; border:1px solid rgba(255,255,255,.6);
  background: transparent; cursor:pointer;
}
.dot.is-active{background:#fff}

.placeholder{
  padding:60px 0; background: #0e0e0e; border-top:1px solid rgba(255,255,255,.06)
}
.placeholder h2{margin:0 0 8px}
.placeholder p{margin:0; color:var(--muted)}

.site-footer{
  padding:18px 0; border-top:1px solid rgba(255,255,255,.06);
  background: rgba(10,10,10,.7); backdrop-filter: blur(10px);
}
.footer-inner{display:flex; align-items:center; justify-content:space-between; gap:10px}
.footer-right{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.sep{opacity:.5}

/* Responsiveness */
@media (max-width:768px){
  .header-inner{height:54px}
  .ctrl{display:none}
  .overlay{background: var(--overlay-strong)}
}

/* Prevent horizontal scroll */
html, body { overflow-x: hidden; }
.slider { overflow: hidden; }

/* Typing effect */
.title.typing{ white-space: nowrap; border-right: 2px solid var(--fg); padding-right: 4px; }
@keyframes caretBlink { 0%, 100% { border-color: transparent; } 50% { border-color: var(--fg); } }
.title.typing{ animation: caretBlink 1s step-end infinite; }


/* Global link styles — neutral + accent (no default blue/purple/red) */
a{ color: var(--fg); text-decoration: none; transition: color .2s ease, text-decoration-color .2s ease; }
a:visited{ color: var(--fg); }
a:hover{ color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
a:active{ color: var(--accent-600); }
a:focus-visible{ outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

/* Ensure buttons (which are anchors) do not get underlines on hover */
.btn:hover{ text-decoration: none !important; }
.top-links a:hover, .site-footer a:hover{ text-decoration: underline; text-underline-offset: 3px; }

