
:root {
  --bg: #0b1016;
  --fg: #eaf0f6;
  --muted: #9fb0c2;
  --brand: #f2b705;
  --brand-2: #2b3441;
  --card: #111722;
  --card-2:#0e141d;
  --border: #1f2a37;
  --ring: rgba(242,183,5,.35);
  --shadow: 0 10px 30px rgba(0,0,0,.35);
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background:radial-gradient(1200px 600px at 10% -10%, #142033 0%, transparent 60%), linear-gradient(180deg, #0b1016, #0a0f15); color:var(--fg); font:16px/1.6 ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;}
a { color: var(--fg); text-decoration: none; }
a:hover { opacity:.9; }
.container { max-width: 1100px; margin: 0 auto; padding: 1rem; }
header { display:flex; align-items:center; justify-content:space-between; gap:1rem; position: sticky; top:0; background:rgba(10,15,21,.65); backdrop-filter: blur(10px); border-bottom:1px solid rgba(255,255,255,.06); z-index: 30;}
.brand { display:flex; align-items:center; gap:.85rem; padding:.25rem 0; }
.brand-logo{ height:42px; width:auto; display:block; filter: drop-shadow(0 3px 8px rgba(0,0,0,.35)); }
.nav { display:flex; gap:.25rem; flex-wrap: wrap; }
.nav a { padding:.55rem .85rem; border-radius:12px; color:#d7e0ea; }
.nav a:hover { background: rgba(255,255,255,.06); }
.cta-mini { display:none; }
@media (max-width: 720px){ .nav{display:none;} .cta-mini{display:inline-flex;}}

.btn { display:inline-flex; align-items:center; gap:.5rem; background: linear-gradient(180deg, #fcd24d, var(--brand)); color:#1a1200; padding:.8rem 1rem; border-radius:14px; border:1px solid rgba(0,0,0,.2); font-weight:700; box-shadow: var(--shadow); }
.btn:hover { transform: translateY(-1px); }
.btn.ghost { background: rgba(255,255,255,.05); color: var(--fg); border:1px solid var(--border); box-shadow:none; }

.hero { display:grid; grid-template-columns: 1.25fr 1fr; gap:2rem; padding: 3.2rem 0 2.2rem; align-items:center; }
.hero h1 { font-size: clamp(32px, 5vw, 56px); line-height:1.08; margin:0; letter-spacing:.2px;}
.hero p.lead { font-size: clamp(16px, 2.3vw, 20px); color:#c7d1dc; margin:.6rem 0 1.1rem; }
.hero .panel { background: radial-gradient(400px 250px at 60% 20%, rgba(242,183,5,.12), transparent 70%), linear-gradient(180deg, var(--card), var(--card-2)); border:1px solid var(--border); border-radius:18px; padding:1rem; box-shadow: var(--shadow); }
.hero .stats { display:grid; grid-template-columns: repeat(3,1fr); gap:.5rem; margin-top: .75rem; }
.hero .stat { background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:14px; padding:.6rem .75rem; text-align:center; }
.hero .stat b{ font-size:20px; display:block; }
.hero ul { margin:.5rem 0 1.25rem; padding-left:1.1rem; color:#cfd8e2; }
.hero li { margin:.15rem 0; }

section { padding: 1.2rem 0; }
.section-title{ font-size: 26px; margin: 1.2rem 0 .35rem; letter-spacing:.2px; }

.grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem; }
@media (max-width: 960px){ .grid{ grid-template-columns: repeat(2,1fr);} .hero{ grid-template-columns:1fr; } }
@media (max-width: 640px){ .grid{ grid-template-columns: 1fr; } }

.card { position:relative; background: linear-gradient(180deg, var(--card), var(--card-2)); padding:1rem; border-radius:16px; border:1px solid var(--border); box-shadow: var(--shadow); transition: transform .15s ease, border-color .2s; }
.card:hover { transform: translateY(-2px); border-color: rgba(242,183,5,.35); }
.card h3{ margin:.2rem 0 .4rem; }
.card p{ color:#c5ced8; }
.card .icon { width:28px; height:28px; display:inline-grid; place-items:center; border-radius:8px; background: rgba(242,183,5,.15); border:1px solid var(--ring); margin-bottom:.4rem; }

.kicker { text-transform: uppercase; letter-spacing:.2em; font-size:12px; color: var(--muted); }

.footer { border-top:1px solid rgba(255,255,255,.08); margin-top:2rem; color: var(--muted); }
.footer .footgrid { display:grid; grid-template-columns: 1.2fr 1fr 1fr; gap:1rem; }
.footer .brand-s { display:flex; align-items:center; gap:.6rem; }
.footer .brand-s img{ height:28px; }

.hr { height:1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.09), transparent); margin: 1.2rem 0; }
.badge { display:inline-block; padding:.25rem .5rem; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid var(--border); font-size:12px; color:#cfd7e2; }
.list { display:grid; gap:.35rem; }
.list li::marker { color: var(--brand); }

.gallery { display:grid; grid-template-columns: repeat(3,1fr); gap:10px; margin-top: .8rem; }
.gallery .g-item { display:block; border-radius:12px; overflow:hidden; border:1px solid var(--border); background: #0c121a; }
.gallery img { width:100%; height:240px; object-fit:cover; display:block; transition: transform .2s ease; }
.gallery .g-item:hover img { transform: scale(1.02); }
@media (max-width: 960px){ .gallery{ grid-template-columns: repeat(2,1fr);} .gallery img{ height:200px; } }
@media (max-width: 640px){ .gallery{ grid-template-columns: 1fr; } .gallery img{ height:220px; } }
.lightbox { position: fixed; inset:0; background: rgba(0,0,0,.85); display:none; align-items:center; justify-content:center; z-index: 100; }
.lightbox.open { display:flex; }
.lb-img { max-width: 92vw; max-height: 90vh; border-radius:14px; border:1px solid rgba(255,255,255,.2); box-shadow: var(--shadow); }
.lb-close { position:absolute; top:14px; right:14px; font-size:28px; line-height:1; padding:.3rem .6rem; border-radius:10px; border:1px solid rgba(255,255,255,.25); background: rgba(0,0,0,.4); color:#fff; cursor:pointer; }

/* Testimonials */
.tgrid { display:grid; grid-template-columns: repeat(3,1fr); gap:14px; }
@media (max-width: 960px){ .tgrid{ grid-template-columns: repeat(2,1fr);} }
@media (max-width: 640px){ .tgrid{ grid-template-columns: 1fr; } }
.tcard { background: linear-gradient(180deg, var(--card), var(--card-2)); border:1px solid var(--border); border-radius:16px; padding:1rem; box-shadow: var(--shadow); }
.tstars { font-size: 18px; letter-spacing: 1px; color: #ffd146; }
.ttext { color:#cfd7e2; margin:.45rem 0 .6rem; }
.tname { font-weight:700; color:#e9edf5; }
