:root{
  --bg:#0b1220;
  --card:#0f1b33;
  --muted:#a9b6d4;
  --text:#eef3ff;
  --brand:#4f8cff;
  --brand2:#63e6be;
  --border:rgba(255,255,255,.10);
  --shadow:0 20px 70px rgba(0,0,0,.45);
  --shadow2:0 12px 35px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background: radial-gradient(1200px 700px at 20% 10%, rgba(79,140,255,.25), transparent 60%),
              radial-gradient(900px 600px at 90% 20%, rgba(99,230,190,.20), transparent 55%),
              var(--bg);
  color:var(--text);
  line-height:1.65;
}
a{color:inherit}
.wrap{max-width:1100px;margin:0 auto;padding:24px}
header{
  position:sticky;top:0;z-index:20;
  background:rgba(11,18,32,.78);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--border);
}
.nav{
  display:flex;gap:14px;align-items:center;justify-content:space-between;
  padding:14px 24px;
  max-width:1100px;margin:0 auto;
}
.brand{
  display:flex;gap:10px;align-items:center;text-decoration:none;
  font-family:Poppins,Inter,sans-serif;font-weight:700;letter-spacing:.2px;
}
.logo{
  width:38px;height:38px;border-radius:12px;
  background: linear-gradient(135deg, var(--brand), var(--brand2));
  box-shadow: 0 12px 30px rgba(79,140,255,.25);
}
.navlinks{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.navlinks a{
  text-decoration:none;
  color:var(--muted);
  font-weight:600;
  padding:8px 10px;border-radius:10px;
}
.navlinks a:hover{background:rgba(255,255,255,.06);color:var(--text)}
.hero{padding:38px 0 12px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:start}
@media (max-width: 900px){ .hero-grid{grid-template-columns:1fr} }
h1{
  font-family:Poppins,Inter,sans-serif;
  font-size: clamp(32px, 4vw, 52px);
  line-height:1.05;margin:0 0 12px;
}
h2{font-family:Poppins,Inter,sans-serif}
.sub{color:var(--muted);font-size:1.05rem;margin:0 0 18px}
.pillrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.pill{
  border:1px solid rgba(15,23,42,0.10);
  background:rgba(255,255,255,.05);
  padding:8px 12px;border-radius:999px;
  color:var(--muted);
  font-weight:600;font-size:.92rem;
}
.card{
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border:1px solid rgba(15,23,42,0.10);
  border-radius:18px;
  padding:18px;
  box-shadow:var(--shadow2);
}
.btn{
  display:inline-flex;gap:10px;align-items:center;justify-content:center;
  padding:10px 14px;border-radius:14px;
  text-decoration:none;font-weight:800;
  background: linear-gradient(135deg, var(--brand), rgba(99,230,190,.65));
  color:#061021;border:0;
  cursor:pointer;
}
.btn:hover{transform:translateY(-1px)}
.btn.secondary{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  color:var(--text);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
}
.btn.secondary:hover{transform:translateY(-1px); background:rgba(255,255,255,.10);}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width: 900px){ .grid2{grid-template-columns:1fr} }
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width: 900px){ .grid3{grid-template-columns:1fr} }
.title{font-family:Poppins,Inter,sans-serif;margin:0 0 8px}
.muted{color:var(--muted)}
.small{font-size:.95rem;color:var(--muted)}
.section{padding:18px 0}
.kicker{color:rgba(99,230,190,.9);font-weight:900;letter-spacing:.12em;text-transform:uppercase;font-size:.78rem}
.hr{height:1px;background:var(--border);margin:18px 0}
.footer{
  margin-top:26px;
  padding:26px 0 36px;
  border-top:1px solid var(--border);
  color:var(--muted);
}
.footer a{color:var(--text);opacity:.9;text-decoration:none}
.footer a:hover{text-decoration:underline}
.footergrid{display:grid;grid-template-columns:1.2fr .9fr .9fr;gap:14px}
@media (max-width: 900px){ .footergrid{grid-template-columns:1fr} }
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 10px;border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(15,23,42,0.10);
  color:var(--muted);font-weight:700;font-size:.9rem;
}
.notice{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(99,230,190,.35);
  color:var(--text);
  padding:12px 14px;border-radius:14px;
}
input, select, textarea{
  width:100%;
  padding:11px 12px;
  border-radius:14px;
  border:1px solid rgba(15,23,42,0.10);
  background:rgba(255,255,255,.04);
  color:var(--text);
  outline:none;
}
input:focus, select:focus, textarea:focus{
  border-color: rgba(79,140,255,.8);
  box-shadow: 0 0 0 4px rgba(79,140,255,.22);
}
label{display:block;font-weight:800;margin:10px 0 6px}
table{width:100%;border-collapse:collapse}
th, td{border:1px solid rgba(15,23,42,0.10);padding:10px;border-radius:12px}
details{
  border:1px solid rgba(15,23,42,0.10);
  border-radius:14px;
  padding:10px 12px;
  background:rgba(255,255,255,.04);
}
details summary{cursor:pointer;font-weight:900;color:var(--text)}
details p{color:var(--muted);margin:10px 0 4px}
.toc{
  border:1px solid rgba(15,23,42,0.10);
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.04);
}
.toc a{color:var(--text);opacity:.92;text-decoration:none}
.toc a:hover{text-decoration:underline}
.article p{color:var(--muted)}
.article li{color:var(--muted)}
.article h2{margin-top:22px}
.callout{
  border:1px solid rgba(79,140,255,.35);
  background:rgba(79,140,255,.08);
  padding:12px 14px;
  border-radius:14px;
}

/* AdSense ad container */
.ad-card{margin-top:1.2rem;text-align:center;}
.ad-card ins{min-height:120px;}



/* --- Tool UI helpers (RailTrack24) --- */
.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width: 900px){ .formgrid{grid-template-columns:1fr} }

.mini{
  border:1px solid rgba(15,23,42,0.10);
  border-radius:14px;
  padding:10px 12px;
  background:rgba(255,255,255,.03);
}
.big{
  font-family:Poppins,Inter,sans-serif;
  font-weight:800;
  font-size:1.35rem;
  line-height:1.2;
}

.badge.good{border-color:rgba(99,230,190,.45);background:rgba(99,230,190,.10);color:rgba(210,255,244,.95)}
.badge.warn{border-color:rgba(255,199,102,.45);background:rgba(255,199,102,.10);color:rgba(255,236,204,.95)}
.badge.bad{border-color:rgba(255,120,120,.45);background:rgba(255,120,120,.10);color:rgba(255,220,220,.95)}

.progress{
  height:12px;border-radius:999px;
  border:1px solid rgba(15,23,42,0.10);
  background:rgba(255,255,255,.04);
  overflow:hidden;
}
.progressfill{
  height:100%;
  background:linear-gradient(90deg, rgba(79,140,255,.75), rgba(99,230,190,.65));
  width:0%;
}


/* Highlighted quick-action buttons (homepage) */
.btn.btn-pnr{background:linear-gradient(135deg,#ffb703,#fb8500); color:#1a1200;}
.btn.btn-seat{background:linear-gradient(135deg,#06d6a0,#3a86ff); color:#07121f;}
.btn.btn-live{background:linear-gradient(135deg,#ff006e,#8338ec); color:#100018;}
.btn.btn-pnr:hover,.btn.btn-seat:hover,.btn.btn-live:hover{transform:translateY(-1px); filter:saturate(1.05);}

/* Tool cards with soft colored backgrounds */
.tool-card{position:relative; overflow:hidden;}
.tool-card:before{
  content:""; position:absolute; inset:-60px;
  background:radial-gradient(circle at 30% 20%, rgba(255,255,255,.16), transparent 55%);
  pointer-events:none;
}
.tool-card .title{position:relative}
.tool-card .muted{position:relative}
.tool-card .tool-btn{position:relative}

.tool-seat{background:linear-gradient(135deg, rgba(79,140,255,.16), rgba(99,230,190,.10));}
.tool-decision{background:linear-gradient(135deg, rgba(255,183,3,.14), rgba(79,140,255,.10));}
.tool-planner{background:linear-gradient(135deg, rgba(131,56,236,.14), rgba(99,230,190,.08));}
.tool-delay{background:linear-gradient(135deg, rgba(255,0,110,.14), rgba(58,134,255,.10));}

.tool-btn{min-width:140px}

/* Better layout for tool grids (4 cards) */
.grid3.toolgrid{grid-template-columns:repeat(2, minmax(0,1fr));}
@media (max-width: 980px){ .grid3.toolgrid{grid-template-columns:1fr;} }

/* Small card variant used in delay tool */
.card.mini{background:rgba(255,255,255,.05); border:1px solid rgba(15,23,42,0.10); box-shadow:none;}

/* ===== Visual identity ===== */
.logoimg{width:34px;height:34px;display:block}
.nav .brand{gap:10px}
body::before{
  content:"";
  position:fixed; inset:0;
  background:url("train-bg.jpg") center/cover no-repeat;
  opacity:0.10;
  z-index:-2;
}
body::after{
  content:"";
  position:fixed; inset:0;
  background:linear-gradient(180deg, rgba(2,6,23,0.02) 0%, rgba(2,6,23,0.10) 100%);
  z-index:-1;
}

/* Hero with dim train image */
.hero{
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute; inset:-2px;
  background:linear-gradient(135deg, rgba(29,78,216,0.86), rgba(124,58,237,0.72)),
             url("train-bg.jpg") center/cover no-repeat;
  filter:saturate(1.05);
  z-index:0;
}
.hero .hero-grid{position:relative; z-index:1}
.hero h1, .hero .sub, .hero .kicker, .hero .pill{color:#fff}
.hero .card{background:rgba(255,255,255,0.92); backdrop-filter: blur(10px)}
.hero .pill{background:rgba(255,255,255,0.18); border-color:rgba(255,255,255,0.25)}
.hero .btn.secondary{background:rgba(255,255,255,0.16); border-color:rgba(255,255,255,0.25); color:#fff}

/* Sections separation */
.section.alt{
  background:#ffffff;
  border:1px solid rgba(15,23,42,0.10);
  box-shadow: var(--shadow);
  border-radius: var(--radius);
  padding:22px;
}

/* Improve contrast on light sections */
.section.alt{ color:#0f172a; }
.section.alt .muted{ color:#475569; }
.section.alt .kicker{ color:#0f766e; }
.section.alt a{ color:#1d4ed8; }
.feature-card{ color:#0f172a; }
.feature-card p{ color:#475569; }
.feature-card h3 a{ color:#0f172a; text-decoration:none; }
.feature-card h3 a:hover{ text-decoration:underline; }

.sectionTitleRow{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.sectionTitleRow .muted{max-width:70ch}

/* Official strip in footer */
.official-strip{margin-top:16px; padding-top:16px; border-top:1px solid rgba(255,255,255,0.14)}
.official-btns{display:flex; gap:10px; flex-wrap:wrap}
.footer .btn{font-size:0.95rem}

/* Featured cards */
.feature-grid{display:grid; gap:12px; grid-template-columns:repeat(1,minmax(0,1fr))}
@media(min-width:900px){.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.feature-card{background:#fff; border:1px solid rgba(15,23,42,0.10); border-radius: var(--radius); box-shadow:var(--shadow); padding:16px}
.feature-card .tag{display:inline-block; padding:4px 10px; border-radius:999px; font-weight:700; font-size:0.82rem; background:#eef2ff; color:#1e3a8a; margin-bottom:8px}
.feature-card h3{margin:6px 0 6px}
.feature-card p{margin:0 0 10px}


/* === Tools (separate area) === */
.section.tools-zone{
  background: linear-gradient(180deg, rgba(15,23,42,0.92), rgba(15,23,42,0.86)), url('assets/train-bg.jpg') center/cover no-repeat;
  color:#fff;
}
.section.tools-zone .kicker{color: rgba(199,210,254,0.9);}
.section.tools-zone h2, .section.tools-zone p{color:#fff;}
.tools-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:14px;}
@media (min-width: 860px){ .tools-grid{grid-template-columns:repeat(3,1fr);} }
.tool-card{
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 14px 30px rgba(0,0,0,0.22);
  backdrop-filter: blur(10px);
}
.tool-card h3{margin:0 0 8px;font-size:1.05rem}
.tool-card p{margin:0 0 14px;color: rgba(255,255,255,0.9);font-size:0.95rem}
.tool-card .btn{display:inline-flex;align-items:center;gap:8px}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:6px 10px;border-radius:999px;background: rgba(99,102,241,0.20);border:1px solid rgba(99,102,241,0.35);color:#e0e7ff;margin-bottom:10px}
.noticebox{
  border-radius:14px;
  padding:12px 14px;
  background: rgba(255,255,255,0.10);
  border:1px solid rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.92);
  font-size:0.95rem;
}
.formgrid{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width: 860px){ .formgrid{grid-template-columns:repeat(2,1fr);} }
.input, select{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid rgba(226,232,240,0.9);
  background:#fff;
  color:#0f172a;
  font-size:16px;
}
.input:focus, select:focus{outline:none;box-shadow:0 0 0 4px rgba(59,130,246,0.25);border-color:#93c5fd}
.resultcard{
  margin-top:14px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:16px;
  box-shadow: 0 12px 26px rgba(0,0,0,0.08);
}
.progress{
  height:10px;border-radius:999px;background:#e2e8f0;overflow:hidden;margin:10px 0 6px;
}
.progress > div{height:100%;width:0%;}
.smallmuted{color:#475569;font-size:0.95rem}


/* =========================
   V6 Professional "Official" Theme Overrides
   ========================= */
:root{
  --bg:#f5f7fb;
  --card:#ffffff;
  --muted:#475569;
  --text:#0f172a;
  --brand:#0b5ed7;   /* deep official blue */
  --brand2:#14b8a6;  /* teal accent */
  --border:rgba(15,23,42,.10);
  --shadow:0 18px 45px rgba(2,6,23,.10);
  --shadow2:0 10px 25px rgba(2,6,23,.08);
}

/* Base */
body{
  background: var(--bg);
  color: var(--text);
}
a{color:inherit}

/* Background train image: subtle */
body::before{opacity:0.07; filter:saturate(0.9) contrast(1.05);}
body::after{
  background:linear-gradient(180deg, rgba(245,247,251,0.80) 0%, rgba(245,247,251,0.95) 55%, rgba(245,247,251,1) 100%);
}

/* Header/Nav */
header{
  background:rgba(255,255,255,.85);
  border-bottom:1px solid var(--border);
}
.navlinks a{color:#0f172a}
.navlinks a:hover{background:rgba(11,94,215,.08); color:#0b5ed7}

/* Typography helpers */
.muted{color:var(--muted)}
.subtext-strong{color:#1e3a8a; font-weight:700}

/* Pills */
.pill{
  background:#ffffff;
  border:1px solid var(--border);
  color:#334155;
}

/* Cards */
.card{
  background: var(--card);
  border:1px solid var(--border);
  box-shadow: var(--shadow2);
}
.hr{background:rgba(15,23,42,.08)}

/* Buttons */
.btn{
  background: linear-gradient(135deg, #0b5ed7, #0ea5e9);
  color:#ffffff;
  box-shadow: 0 10px 18px rgba(11,94,215,.18);
}
.btn.secondary{
  background:#ffffff;
  color:#0b5ed7;
  border:1px solid rgba(11,94,215,.22);
  box-shadow:none;
}
.btn.secondary:hover{background:rgba(11,94,215,.06)}
.btn:hover{transform:translateY(-1px)}

/* Highlight official actions */
.btn.btn-pnr{
  background: linear-gradient(135deg, #f59e0b, #f97316);
  color:#1f2937;
}
.btn.btn-seat{
  background: linear-gradient(135deg, #10b981, #22c55e);
  color:#052e1b;
}
.btn.btn-live{
  background: linear-gradient(135deg, #7c3aed, #ec4899);
  color:#ffffff;
}
.btn.btn-guide{
  background: linear-gradient(135deg, #0b5ed7, #14b8a6);
  color:#ffffff;
}

/* Sections */
.section.alt{
  background:#ffffff;
  border-top:1px solid rgba(15,23,42,.08);
  border-bottom:1px solid rgba(15,23,42,.08);
}
.section.alt h2, .section.alt h3, .section.alt a{color:#0f172a}
.section.alt .muted{color:#475569}

/* Feature cards (guides grid) */
.feature-card{
  background:#ffffff;
  border:1px solid rgba(15,23,42,.10);
  box-shadow:0 12px 22px rgba(2,6,23,.06);
}
.feature-card p{color:#475569}
.feature-card a{color:#0b5ed7}

/* Footer */
footer{
  background:#0b1630;
  color:#e5edff;
}
footer a{color:#bcd6ff}
footer a:hover{color:#ffffff}