@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;800&family=Rajdhani:wght@400;500;600;700&display=swap');

:root{
  --bg:#070b10; --panel:#0d141c; --panel2:#111c25; --line:#1e3440;
  --text:#e9f6fa; --muted:#8ba4ad; --accent:#38d6e8; --accent2:#7af0a6;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Rajdhani,Arial,sans-serif;font-size:18px}
a{color:inherit;text-decoration:none}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid var(--line);background:#080d13eF;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{font-size:31px;color:var(--accent);text-shadow:0 0 18px #38d6e866}.brand strong{display:block;font:800 20px Orbitron;letter-spacing:2px}.brand small{display:block;color:var(--muted);font-size:11px;letter-spacing:3px}
nav{display:flex;gap:27px}nav a{font-weight:600;color:#a9bbc1;text-transform:uppercase;font-size:14px;letter-spacing:1.5px}nav a:hover,nav .active{color:var(--accent)}
.hero{min-height:670px;position:relative;display:flex;align-items:center;justify-content:space-between;padding:80px 9vw;overflow:hidden;background:radial-gradient(circle at 75% 45%,#16424c55 0,transparent 34%),linear-gradient(120deg,#071016,#081018 48%,#0b1c22)}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff04 1px,transparent 1px),linear-gradient(90deg,#ffffff04 1px,transparent 1px);background-size:55px 55px;mask-image:linear-gradient(to right,transparent,#000 40%,#000 100%);pointer-events:none}
.scanlines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 5px,#ffffff03 6px);pointer-events:none}
.hero-copy{position:relative;z-index:2;max-width:610px}.eyebrow{color:var(--accent);font:700 12px Orbitron;letter-spacing:3px}
h1,h2,h3{font-family:Orbitron,Arial,sans-serif}h1{font-size:clamp(48px,7vw,92px);line-height:.98;margin:18px 0 25px;letter-spacing:-2px;text-shadow:0 0 35px #38d6e822}h1 span{color:var(--accent)}
.lead{font-size:24px;line-height:1.35;color:#b8cbd0}.hero-actions{display:flex;gap:14px;margin-top:32px}.button{padding:14px 20px;border:1px solid var(--accent);font:700 13px Orbitron;letter-spacing:1.5px}.primary{background:var(--accent);color:#061116;box-shadow:0 0 28px #38d6e822}.ghost{color:var(--accent)}
.radio-panel{position:relative;z-index:2;width:min(430px,42vw);padding:22px;background:#071016dd;border:1px solid #2c6570;box-shadow:0 0 60px #38d6e811, inset 0 0 35px #38d6e808}
.panel-top,.panel-bottom,.mode-row,.dial{display:flex;justify-content:space-between;color:#71939c;font:10px Orbitron;letter-spacing:1px}.frequency{font:700 clamp(38px,5vw,62px) Orbitron;color:var(--accent);text-shadow:0 0 18px #38d6e877;margin:25px 0 8px}.frequency span{font-size:16px}.mode-row{border-top:1px solid var(--line);padding:12px 0}.meter{height:55px;display:flex;align-items:end;gap:4px;border-bottom:1px solid #21414a}.meter i{display:block;width:7%;height:18%;background:#247d89}.meter i:nth-child(4n){height:44%}.meter i:nth-child(7n){height:72%}.meter i:nth-child(10){height:92%;background:var(--accent)}.dial{padding-top:12px}.dial b{color:var(--accent)}
.ticker{display:flex;justify-content:space-around;gap:20px;padding:13px 5vw;background:#0c171e;border-block:1px solid var(--line);font:11px Orbitron;color:#86a7af;letter-spacing:1px}
.section{padding:100px 9vw}.section-heading{max-width:760px;margin-bottom:45px}.section h2{font-size:clamp(30px,4vw,52px);margin:10px 0 15px}.section-heading>p:last-child,.aprs-box p{color:var(--muted);font-size:20px;line-height:1.5}
.cards{display:grid;gap:18px}.three{grid-template-columns:repeat(3,1fr)}.card{background:var(--panel);border:1px solid var(--line);padding:30px;min-height:245px;transition:.2s}.card:hover{transform:translateY(-5px);border-color:#2b7180}.icon{font-size:34px}.card h3{font-size:20px}.card p{color:var(--muted);line-height:1.45}.card a{color:var(--accent);font-weight:700}
.dark-section{background:#05090d;border-block:1px solid var(--line)}.mode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.mode-grid div{padding:27px;background:var(--panel);border:1px solid var(--line)}.mode-grid span{display:block;color:var(--accent);font:800 26px Orbitron}.mode-grid b{display:block;margin-top:10px;color:#91a8af}
.aprs-box{display:grid;grid-template-columns:1fr 330px;gap:50px;align-items:center}.aprs-screen{padding:28px;background:#071014;border:1px solid #28636d;box-shadow:inset 0 0 35px #38d6e80a}.aprs-screen span,.aprs-screen small{display:block;font:11px Orbitron;color:#71939c;letter-spacing:2px}.aprs-screen strong{display:block;font:700 35px Orbitron;color:var(--accent);margin:22px 0}.aprs-screen small+small{margin-top:8px}
.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.journal-grid article{border-top:2px solid #24545d;padding:22px;background:#0a1117}.journal-grid span{color:var(--accent);font:10px Orbitron;letter-spacing:2px}.journal-grid h3{font-size:19px}.journal-grid p{color:var(--muted)}
footer{display:flex;justify-content:space-between;padding:28px 9vw;border-top:1px solid var(--line);color:#708890;font-size:14px}footer strong{color:var(--accent);font-family:Orbitron}
@media(max-width:900px){nav{display:none}.hero{padding:65px 7vw;display:block}.radio-panel{width:100%;margin-top:50px}.three,.journal-grid,.mode-grid{grid-template-columns:1fr}.aprs-box{grid-template-columns:1fr}.ticker{flex-direction:column;align-items:center;text-align:center}footer{display:block;text-align:center;line-height:2}}

/* Public equipment display */

.equipment-public {
  margin-top: 50px;
}

.equipment-public-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.equipment-public-card {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 20px;
  border-radius: 14px;
  background: rgba(255,255,255,0.05);
}

.equipment-public-card img {
  width: 140px;
  height: 100px;
  object-fit: cover;
  border-radius: 10px;
  flex-shrink: 0;
}

.equipment-public-card h3 {
  margin-top: 0;
  margin-bottom: 6px;
}

.equipment-public-type {
  font-weight: 600;
  margin-top: 0;
}

/* Mobile navigation */

@media (max-width: 700px) {

  .topbar {
    flex-direction: column;
    align-items: center;
    gap: 15px;
  }

  .topbar nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    width: 100%;
  }

  .topbar nav a {
    font-size: 13px;
    padding: 8px 10px;
    white-space: nowrap;
  }

}


/* HamAlert panel */

.hero-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  width: 400px;
}

.hamalert {
  width: 100%;
  display: flex;
  justify-content: center;
}

.hamalert img {
  width: 100%;
  max-width: 370px;
  height: auto;
  display: block;
}


/* Album photo count */

.album-count {
  margin-top: 15px !important;
  color: var(--accent);
  font-family: Orbitron, Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
}


/* APRS dashboard details */

.aprs-details {
  display: grid;
  gap: 12px;
  margin: 25px 0;
}

.aprs-details div {
  display: flex;
  align-items: center;
  gap: 15px;
}

.aprs-details span {
  min-width: 75px;
  color: var(--muted);
  font: 10px Orbitron;
  letter-spacing: 1.5px;
}

.aprs-details strong {
  color: var(--text);
  font-weight: 700;
}

.aprs-details + .button {
  display: inline-block;
  margin-top: 5px;
}

.aprs-status {
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--accent2);
  font: 10px Orbitron;
  letter-spacing: 1.5px;
}

.aprs-status i {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  border-radius: 50%;
  background: var(--accent2);
  box-shadow: 0 0 10px var(--accent2);
}

/* =========================
   APRS PAGE
   ========================= */

.aprs-card {
    max-width: 900px;
    margin: 30px auto;
    padding: 30px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    text-align: center;
}

.aprs-card h2 {
    margin-top: 0;
    font-size: 28px;
}

.aprs-card p {
    font-size: 17px;
    line-height: 1.6;
}

.aprs-status {
    margin-top: 25px;
    padding: 20px;
    border-radius: 12px;
    background: #f2f7f9;
    text-align: left;
    line-height: 2;
    font-size: 17px;
}

.page-section {
    padding: 40px 20px;
}

.page-container {
    max-width: 1100px;
    margin: auto;
}

.page-section h1 {
    text-align: center;
    margin-bottom: 10px;
}

.page-intro {
    text-align: center;
    font-size: 18px;
    margin-bottom: 25px;
}

/* Study Centre Quiz Answers */

.quiz-option {
    display: block !important;
    width: 100%;
    box-sizing: border-box;
    margin: 10px 0;
    padding: 12px;
    background: #111c25;
    border: 1px solid #263746;
    border-radius: 6px;
    cursor: pointer;
    color: #c4d0da;
    line-height: 1.5;
}

.quiz-option:hover {
    border-color: #526b7d;
}

.quiz-option input {
    margin-right: 8px;
}