/* SEO landing-page layer — preserves the existing Raju Driving School visual system. */
.seo-page{background:#f7f7f2;color:#111}
.seo-hero{padding:150px 6vw 90px;background:linear-gradient(135deg,#101820 0%,#17232d 62%,#0f151a 100%);color:#fff;position:relative;overflow:hidden}
.seo-hero:after{content:"";position:absolute;inset:auto -10% -45% 35%;height:70%;background:radial-gradient(circle,rgba(246,211,72,.18),transparent 65%);pointer-events:none}
.seo-hero-inner{max-width:1180px;margin:auto;position:relative;z-index:1}
.seo-breadcrumb{font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.7;margin-bottom:26px}
.seo-breadcrumb a{color:inherit;text-decoration:none}
.seo-hero h1{font:800 clamp(42px,6vw,82px)/.98 Manrope,Arial,sans-serif;letter-spacing:-.05em;max-width:950px;margin:0 0 24px}
.seo-hero h1 span{color:#f6d348}
.seo-lead{font-size:clamp(18px,2vw,23px);line-height:1.6;max-width:760px;color:rgba(255,255,255,.8);margin:0}
.seo-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.seo-content{max-width:1180px;margin:auto;padding:80px 6vw}
.seo-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:start}
.seo-content h2{font:800 clamp(30px,4vw,48px)/1.05 Manrope,Arial,sans-serif;letter-spacing:-.04em;margin:0 0 18px}
.seo-content h2 span{color:#b49400}
.seo-content h3{font:800 23px/1.15 Manrope,Arial,sans-serif;margin:0 0 10px}
.seo-content p{font-size:17px;line-height:1.72;color:#4d5358;margin:0 0 16px}
.seo-card{background:#fff;border:1px solid #e6e6df;border-radius:24px;padding:28px;box-shadow:0 18px 45px rgba(16,24,32,.07)}
.seo-card ul,.seo-content ul{padding-left:20px;color:#4d5358;line-height:1.8}
.seo-card li::marker{color:#b49400}
.seo-kicker{font-size:12px;letter-spacing:.14em;font-weight:800;color:#777;text-transform:uppercase;margin-bottom:12px}
.seo-services{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:34px}
.seo-service{background:#fff;border:1px solid #e5e5df;border-radius:22px;padding:26px;text-decoration:none;color:#111;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.seo-service:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.08);border-color:#d2c27a}
.seo-service small{display:block;color:#8a8a82;letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.seo-service p{font-size:15px;margin:0 0 14px}
.seo-service b{font-size:14px}
/* Standalone topic/deep-dive sections must use the same content rail as the page body.
   Without this, sections placed after </main> can stretch edge-to-edge and look
   clipped/over-spaced on desktop. */
.seo-topic{max-width:1180px;margin:58px auto 0;padding:48px 6vw 80px;border-top:1px solid #deded5}
.seo-topic > h2{max-width:980px}
.seo-topic > p{max-width:1100px}
.seo-topic .seo-topic-grid{max-width:1180px}

.seo-topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:25px}
.seo-topic-card{background:#eef0eb;border-radius:20px;padding:24px}
.seo-cta{margin-top:60px;background:#121a20;color:#fff;border-radius:30px;padding:44px;display:flex;justify-content:space-between;gap:30px;align-items:center}
.seo-cta h2{margin-bottom:8px;color:#fff}
.seo-cta p{color:rgba(255,255,255,.68);margin:0}
.seo-note{font-size:13px!important;color:#7a7e80!important}
@media(max-width:800px){.seo-hero{padding:125px 5vw 70px}.seo-content{padding:60px 5vw}.seo-grid,.seo-services,.seo-topic-grid{grid-template-columns:1fr}.seo-cta{padding:30px;display:block}.seo-cta .seo-actions{margin-top:24px}}


/* =========================================================
   SEO PAGE NAVIGATION — consistent dark-hero treatment
   The landing-page hero is dark, so the shared floating nav
   uses a dark glass surface with high-contrast links.
   ========================================================= */
.seo-page .nav{
  left:24px!important;right:24px!important;top:16px!important;
  width:auto!important;height:68px!important;
  padding:0!important;transform:none!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.seo-page .nav:before{display:none!important}
.seo-page .nav .brand{
  position:absolute!important;left:0!important;right:auto!important;top:50%!important;
  transform:translateY(-50%)!important;height:58px!important;
  padding:3px 11px 3px 4px!important;border-radius:18px!important;
  background:rgba(11,27,43,.72)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.08)!important;
  backdrop-filter:blur(20px) saturate(135%)!important;
  -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
}
.seo-page .nav .brand-logo{width:78px!important;height:52px!important;object-fit:contain!important}
.seo-page .desktop-nav{
  margin-left:auto!important;gap:4px!important;padding:7px 8px 7px 16px!important;
  border:1px solid rgba(255,255,255,.20)!important;border-radius:999px!important;
  background:rgba(11,27,43,.68)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.08)!important;
  backdrop-filter:blur(22px) saturate(135%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(135%)!important;
}
.seo-page .desktop-nav>a:not(.nav-cta){color:#e6eef8!important;padding:10px 12px!important}
.seo-page .desktop-nav>a:not(.nav-cta):hover{color:#fff!important;background:rgba(255,255,255,.10)!important}
.seo-page .nav-cta{margin-left:6px!important;padding:12px 19px!important;border-radius:999px!important}
@media(max-width:900px){
  .seo-page .nav{left:12px!important;right:12px!important;width:auto!important;height:64px!important;top:10px!important;transform:none!important;padding:0 12px!important;border-radius:18px!important;background:rgba(11,27,43,.66)!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 10px 28px rgba(0,0,0,.14)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important}
  .seo-page .nav .brand{position:relative!important;left:auto!important;right:auto!important;top:auto!important;transform:none!important;height:58px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .seo-page .nav .brand-logo{width:70px!important;height:50px!important}
  .seo-page .menu-btn i{background:#fff!important}
  .seo-page .mobile-menu{top:70px!important;right:0!important}
}


/* ================================================================
   DESKTOP PAGE HERO / NAV SPACING
   Keep fixed navigation from creating a large visual dead zone and
   make the opening copy readable inside short laptop viewports.
   ================================================================ */
@media (min-width:901px){
  .seo-hero{padding:104px 6vw 68px;}
  .seo-hero h1{font-size:clamp(44px,5.2vw,72px);line-height:.96;margin-bottom:18px;max-width:900px;}
  .seo-lead{font-size:clamp(17px,1.55vw,21px);line-height:1.52;max-width:700px;}
  .seo-actions{margin-top:26px;}
}
@media (min-width:901px) and (max-height:760px){
  .seo-hero{padding-top:86px;padding-bottom:58px;}
  .seo-breadcrumb{margin-bottom:18px;font-size:11px;}
  .seo-hero h1{font-size:clamp(40px,4.8vw,64px);line-height:.94;margin-bottom:15px;}
  .seo-lead{font-size:17px;line-height:1.45;max-width:650px;}
  .seo-actions{margin-top:20px;}
  .seo-actions .btn{padding:11px 17px;}
}
@media (min-width:901px) and (max-height:560px){
  .seo-hero{padding-top:72px;padding-bottom:45px;}
  .seo-breadcrumb{margin-bottom:12px;}
  .seo-hero h1{font-size:clamp(36px,4.3vw,56px);margin-bottom:12px;}
  .seo-lead{font-size:15px;line-height:1.38;}
  .seo-actions{margin-top:15px;}
  .seo-actions .btn{padding:9px 14px;font-size:.7rem;}
}

@media (min-width:901px){
  .seo-page .nav{top:12px!important;}
}

@media (min-width:901px){
  .seo-topic{margin-top:42px;padding-top:38px;padding-bottom:72px;}
}
@media (min-width:901px) and (max-height:760px){
  .seo-topic{margin-top:34px;padding-top:32px;padding-bottom:58px;}
  .seo-topic-grid{margin-top:20px;}
  .seo-topic-card{padding:22px;}
}
@media (max-width:800px){
  .seo-topic{margin-top:34px;padding:38px 5vw 58px;}
}