/*
Theme Name: Local Visibility Hub (Elementor Landing)
Theme URI: https://example.com/
Author: LVH
Author URI: https://example.com/
Description: Elementor-friendly landing-page theme matching the HTML look & feel. Responsive + social links + reviews section.
Version: 1.2.1
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: local-visibility-hub
Tags: elementor, landing-page, one-page, business
*/

:root{
  --lvh-bg:#0b1220;
  --lvh-text:#e9f0ff;
  --lvh-muted:#b7c3dd;
  --lvh-accent:#4fd1c5;
  --lvh-accent2:#7c3aed;
  --lvh-border: rgba(255,255,255,.10);
  --lvh-shadow: 0 16px 40px rgba(0,0,0,.35);
  --lvh-radius: 18px;
  --lvh-max: 1100px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(1200px 700px at 20% -10%, rgba(124,58,237,.35), transparent 60%),
    radial-gradient(1000px 650px at 90% 10%, rgba(79,209,197,.25), transparent 55%),
    var(--lvh-bg);
  color:var(--lvh-text);
  line-height:1.5;
  overflow-x:hidden;
}
img{max-width:100%; height:auto}
a{color:inherit; text-decoration:none}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline: 2px solid rgba(79,209,197,.55);
  outline-offset: 2px;
  border-radius: 10px;
}

.lvh-wrap{max-width:var(--lvh-max); margin:0 auto; padding:24px}
.lvh-header{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0}
.lvh-brand{display:flex; align-items:center; gap:12px}
.lvh-logo{width:42px; height:42px; border-radius:12px; background:linear-gradient(135deg,var(--lvh-accent),var(--lvh-accent2)); box-shadow:var(--lvh-shadow); flex:0 0 auto}
.lvh-brand strong{display:block; font-size:16px; letter-spacing:.2px}
.lvh-brand span{display:block; color:var(--lvh-muted); font-size:12px; margin-top:2px}
.lvh-nav{display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:flex-end}

.lvh-social{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.lvh-social a{
  width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:12px; border:1px solid var(--lvh-border);
  background: rgba(255,255,255,.05);
}
.lvh-social a:hover{background: rgba(255,255,255,.10)}
.lvh-social svg{width:18px; height:18px; opacity:.92}

.lvh-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 16px; border-radius:12px;
  border:1px solid var(--lvh-border);
  background: rgba(255,255,255,.06);
  font-weight:600;
  transition: transform .08s ease, background .15s ease;
  gap:10px;
  white-space:nowrap;
}
.lvh-btn:hover{transform: translateY(-1px); background: rgba(255,255,255,.10)}
.lvh-btn.primary{
  background: linear-gradient(135deg, var(--lvh-accent), #22c55e);
  color:#07111f; border:0;
}
.lvh-btn.primary:hover{background: linear-gradient(135deg, #62f1e6, #35e27a)}
.lvh-btn.full{width:100%}

.lvh-hero{display:grid; grid-template-columns: 1.1fr .9fr; gap:22px; align-items:stretch; padding:22px 0 10px}
.lvh-hero-card{
  background: rgba(255,255,255,.04);
  border:1px solid var(--lvh-border);
  border-radius: var(--lvh-radius);
  padding:26px;
  box-shadow: var(--lvh-shadow);
}
.lvh-h1{margin:0 0 10px; font-size:clamp(28px, 3.6vw, 42px); line-height:1.08}
.lvh-sub{color:var(--lvh-muted); font-size:16px; margin:0 0 18px}
.lvh-pill-row{display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 22px}
.lvh-pill{padding:8px 10px; border-radius:999px; border:1px solid var(--lvh-border); background: rgba(255,255,255,.04); color:var(--lvh-muted); font-size:12px}
.lvh-cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:12px}
.lvh-note{color:var(--lvh-muted); font-size:12px; margin-top:12px}

.lvh-side{
  background: linear-gradient(180deg, rgba(79,209,197,.12), rgba(124,58,237,.10));
  border:1px solid var(--lvh-border);
  border-radius: var(--lvh-radius);
  padding:22px;
  box-shadow: var(--lvh-shadow);
}
.lvh-side h3{margin:0 0 10px}
.lvh-checklist{margin:0; padding:0; list-style:none; display:grid; gap:10px}
.lvh-checklist li{display:flex; gap:10px; align-items:flex-start; color:var(--lvh-muted)}
.lvh-dot{width:18px; height:18px; border-radius:6px; background: rgba(79,209,197,.18); border:1px solid rgba(79,209,197,.35); flex:0 0 auto; margin-top:2px}

.lvh-section{padding:22px 0}
.lvh-section-title{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:14px}
.lvh-section-title h2{margin:0; font-size:26px}
.lvh-section-title p{margin:0; color:var(--lvh-muted)}

.lvh-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:14px}
.lvh-card{
  background: rgba(255,255,255,.04);
  border:1px solid var(--lvh-border);
  border-radius: var(--lvh-radius);
  padding:18px;
  box-shadow: 0 10px 28px rgba(0,0,0,.25);
  display:flex;
  flex-direction:column;
  min-height: 220px;
}
.lvh-highlight{border:1px solid rgba(79,209,197,.35); background: linear-gradient(180deg, rgba(79,209,197,.10), rgba(255,255,255,.03))}
.lvh-badge{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; color:var(--lvh-muted);
  border:1px solid var(--lvh-border);
  background: rgba(255,255,255,.04);
  padding:6px 10px;
  border-radius:999px;
  width: fit-content;
}
.lvh-price{font-size:34px; font-weight:800; margin:10px 0 6px; letter-spacing:.2px}
.lvh-price small{font-size:14px; font-weight:600; color:var(--lvh-muted)}
.lvh-card h3{margin:12px 0 6px; font-size:18px}
.lvh-card p{margin:0 0 12px; color:var(--lvh-muted)}
.lvh-card ul{margin:0; padding-left:18px; color:var(--lvh-muted); display:grid; gap:6px}
.lvh-grow{flex:1}
.lvh-actions{display:flex; gap:10px; margin-top:14px; flex-wrap:wrap}

.lvh-how{display:grid; grid-template-columns: repeat(3, 1fr); gap:14px}
.lvh-step{padding:16px; background: rgba(255,255,255,.03); border:1px solid var(--lvh-border); border-radius: var(--lvh-radius)}
.lvh-step strong{display:block; margin-bottom:6px}
.lvh-small{font-size:12px}

.lvh-form-grid{display:grid; grid-template-columns: 1.2fr .8fr; gap:14px; align-items:stretch}
.lvh-footer{padding:24px 0 50px; color:var(--lvh-muted); border-top:1px solid var(--lvh-border); margin-top:10px}
.lvh-footer-row{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap}

.lvh-reviews{display:grid; grid-template-columns: repeat(3, 1fr); gap:14px}
.lvh-review{
  background: rgba(255,255,255,.03);
  border:1px solid var(--lvh-border);
  border-radius: var(--lvh-radius);
  padding:16px;
}
.lvh-stars{display:flex; gap:4px; margin-bottom:10px; opacity:.95}
.lvh-stars svg{width:16px; height:16px}
.lvh-review p{margin:0; color:var(--lvh-muted)}
.lvh-review .lvh-name{margin-top:10px; color:var(--lvh-text); font-weight:700}
.lvh-review .lvh-meta{color:var(--lvh-muted); font-size:12px}

@media (max-width: 980px){
  .lvh-wrap{padding:18px}
  .lvh-header{flex-direction:column; align-items:flex-start}
  .lvh-nav{width:100%; justify-content:space-between}
  .lvh-hero{grid-template-columns:1fr}
  .lvh-grid{grid-template-columns:1fr}
  .lvh-how{grid-template-columns:1fr}
  .lvh-reviews{grid-template-columns:1fr}
  .lvh-form-grid{grid-template-columns:1fr}
}
@media (max-width: 520px){
  .lvh-wrap{padding:14px}
  .lvh-btn{padding:11px 14px}
  .lvh-social a{width:36px; height:36px}
  .lvh-section-title{flex-direction:column; align-items:flex-start}
}
