/* Phone Option Malta — main.css (static) */
:root{
  --bg:#0b1220;
  --card:rgba(255,255,255,0.06);
  --text:#eaf0ff;
  --muted:rgba(234,240,255,0.72);
  --line:rgba(234,240,255,0.14);
  --accent:#4da3ff;
  --accent2:#a6e14b;
  --shadow:0 18px 40px rgba(0,0,0,0.35);
  --radius:18px;
  --radius2:22px;
  --max:1100px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,"Apple Color Emoji","Segoe UI Emoji";
  background:radial-gradient(1200px 700px at 20% -10%, rgba(77,163,255,0.22), transparent 55%),
             radial-gradient(900px 500px at 90% 0%, rgba(166,225,75,0.16), transparent 60%),
             linear-gradient(180deg,#08101f 0%,#0b1220 60%,#070d17 100%);
  color:var(--text);
  line-height:1.55;
}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.container{max-width:var(--max);margin:0 auto;padding:0 18px}
.skip-link{
  position:absolute;left:-999px;top:10px;background:#fff;color:#000;
  padding:10px 12px;border-radius:10px;z-index:9999
}
.skip-link:focus{left:12px}

.site-header{
  position:sticky;top:0;z-index:50;
  backdrop-filter:blur(14px);
  background:rgba(8,16,31,0.62);
  border-bottom:1px solid var(--line)
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;min-width:200px}
.brand img{width:42px;height:42px;border-radius:10px;background:rgba(255,255,255,0.08);padding:6px}
.brand .title{display:flex;flex-direction:column;line-height:1.1}
.brand .title strong{font-size:16px;letter-spacing:.2px}
.brand .title span{font-size:12px;color:var(--muted)}

.nav{display:flex;align-items:center;gap:16px}
.nav a{font-weight:600;font-size:14px;color:rgba(234,240,255,0.86);padding:8px 10px;border-radius:12px}
.nav a[aria-current="page"]{
  background:rgba(77,163,255,0.16);
  border:1px solid rgba(77,163,255,0.25)
}

.header-actions{display:flex;align-items:center;gap:10px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 14px;border-radius:14px;border:1px solid var(--line);
  background:rgba(255,255,255,0.06);color:var(--text);
  font-weight:700;font-size:14px;cursor:pointer;user-select:none;
  box-shadow:0 10px 22px rgba(0,0,0,0.25)
}
.btn:hover{background:rgba(255,255,255,0.10);text-decoration:none}
.btn.primary{border-color:rgba(77,163,255,0.35);background:linear-gradient(180deg, rgba(77,163,255,0.22), rgba(77,163,255,0.10))}
.btn.accent{border-color:rgba(166,225,75,0.35);background:linear-gradient(180deg, rgba(166,225,75,0.18), rgba(166,225,75,0.08))}
.btn.ghost{background:transparent}

.burger{display:none;width:44px;height:44px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,0.06);cursor:pointer}
.burger span{display:block;width:20px;height:2px;background:rgba(234,240,255,0.9);margin:6px auto;border-radius:2px}

.hero{padding:34px 0 12px}
.hero-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.09), rgba(255,255,255,0.05));
  border:1px solid var(--line);
  border-radius:var(--radius2);
  box-shadow:var(--shadow);
  padding:22px;
  overflow:hidden;
  position:relative
}
.hero-card:before{
  content:"";
  position:absolute;
  inset:-120px -180px auto auto;
  width:460px;height:460px;
  background:radial-gradient(circle, rgba(166,225,75,0.18), transparent 60%);
  transform:rotate(12deg)
}
.hero-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:18px;position:relative}
.hero h1{margin:0 0 6px;font-size:clamp(26px,3.2vw,42px);letter-spacing:-.3px}
.hero .tagline{margin:0 0 12px;font-size:16px;color:rgba(234,240,255,0.86)}
.hero .sub{margin:0 0 16px;color:var(--muted);max-width:60ch}
.hero .cta{display:flex;flex-wrap:wrap;gap:10px}
.hero-badges{display:grid;gap:10px;align-content:start}

.badge{
  display:flex;gap:10px;align-items:flex-start;
  padding:12px;border-radius:16px;border:1px solid var(--line);
  background:rgba(0,0,0,0.18)
}
.badge strong{font-size:14px}
.badge span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.badge .dot{width:10px;height:10px;border-radius:50%;margin-top:4px;background:var(--accent);box-shadow:0 0 0 6px rgba(77,163,255,0.14)}
.badge.green .dot{background:var(--accent2);box-shadow:0 0 0 6px rgba(166,225,75,0.14)}

.section{padding:16px 0}
.section h2{margin:0 0 10px;font-size:20px}
.lead{margin:0 0 14px;color:var(--muted)}

.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.card{border:1px solid var(--line);background:rgba(255,255,255,0.06);border-radius:var(--radius);padding:14px}
.card h3{margin:0 0 6px;font-size:16px}
.card p{margin:0;color:var(--muted);font-size:13px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}

.kv{display:grid;gap:10px}
.kv .row{
  display:grid;grid-template-columns:120px 1fr;gap:10px;align-items:start;
  padding:10px 12px;border-radius:16px;border:1px solid var(--line);
  background:rgba(255,255,255,0.05)
}
.kv .row strong{color:rgba(234,240,255,0.9);font-size:13px}
.kv .row span{color:var(--muted);font-size:13px}

.notice{
  border-left:4px solid rgba(166,225,75,0.7);
  padding:12px;background:rgba(166,225,75,0.08);
  border-radius:16px;border:1px solid rgba(166,225,75,0.18);
  color:rgba(234,240,255,0.92)
}

.footer{
  border-top:1px solid var(--line);
  margin-top:18px;
  padding:18px 0 70px;
  background:rgba(8,16,31,0.45)
}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.footer small{color:rgba(234,240,255,0.68)}
.footer .links{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.footer .links a{font-weight:700;font-size:13px;color:rgba(234,240,255,0.78)}

.map{border:1px solid var(--line);border-radius:var(--radius2);overflow:hidden;min-height:320px;background:rgba(255,255,255,0.04)}
.map iframe{width:100%;height:340px;border:0}

.floating-cta{position:fixed;left:16px;right:16px;bottom:14px;display:none;gap:10px;z-index:60}
.floating-cta a{flex:1;text-align:center}

hr.sep{border:none;border-top:1px solid var(--line);margin:14px 0}

@media (max-width:920px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  .nav{display:none}
  .burger{display:inline-block}
  .header-actions .btn{display:none}
  .header-actions .btn.ghost{display:inline-flex}
  .split{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer .links{justify-content:flex-start}
  .floating-cta{display:flex}
}
.mobile-nav{display:none;border-top:1px solid var(--line);background:rgba(8,16,31,0.80)}
.mobile-nav.open{display:block}
.mobile-nav a{display:block;padding:12px 18px;border-bottom:1px solid rgba(234,240,255,0.10);font-weight:800;color:rgba(234,240,255,0.9)}
.mobile-nav a:last-child{border-bottom:none}
