:root{
  --green:#60b044;
  --nav-green:#67b640;
  --primary:#1f4fa1;
  --muted:#666;
  --bg:#f2f4f7;
  --card:#ffffff;
  --max-width:1200px;
}
*{box-sizing:border-box}
html,body{height:100%}
img,video,svg{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
body{font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; margin:0; color:#222; background:var(--bg)}
.container{max-width:var(--max-width);margin:0 auto;padding:0 16px;width:100%}

/* Top toolbar (green) */
.top-bar{background:var(--nav-green); color:#fff; font-size:13px; padding:8px 0}
.top-bar .inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.top-bar .left{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.top-bar .left a{color:#fff;margin-right:6px}
.top-bar .right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* Header and nav */
.header{background:#fff;border-bottom:4px solid #f0f0f0}
.header .inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:12px;flex-wrap:wrap}
.logo img{height:58px;max-height:64px}
.main-nav{flex:1;margin-left:20px}
.main-nav ul{display:flex;gap:18px;align-items:center;padding:0;margin:0;list-style:none;flex-wrap:wrap}
.main-nav ul li a{color:#333;font-weight:600;padding:8px 6px;display:inline-block}
.selector{display:flex;align-items:center;gap:8px}
.selector select{padding:6px;border:1px solid #ddd;border-radius:4px}

/* Why Choose section */
.section{padding:28px 0}
.section h2{text-align:center;color:var(--primary);font-size:28px;margin:6px 0 18px}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch;padding:12px}
.why-card{background:var(--card);border-radius:10px;padding:28px 14px;text-align:center;box-shadow:0 2px 6px rgba(0,0,0,0.06);min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.why-card img{width:78px;height:78px;object-fit:contain;margin-bottom:12px}
.why-card h4{font-size:14px;margin:0;color:#222;font-weight:700}

/* Book A Test (organ icons) */
.book-test{padding:24px 0;background:#fff;border-top:4px solid #f0f0f0}
.book-title{text-align:center;margin-bottom:14px}
.organ-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:0 6px}
.organ-item{background:transparent;border-radius:8px;padding:18px;text-align:center}
.organ-circle{width:120px;height:120px;border-radius:999px;background:#fff;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(0,0,0,0.06);}
.organ-circle img{width:92px;height:92px;object-fit:contain}
.organ-item h3{font-size:16px;margin:6px 0;color:var(--primary)}
.organ-item p{font-size:13px;color:var(--muted);line-height:1.35}

/* Hero carousel */
.hero-carousel { position: relative; overflow: hidden; margin-top: 8px; width:100%}
.hero-slides { display:flex; transition: transform 0.6s ease; will-change: transform; }
.hero-slide { min-width:100%; height:400px; flex:0 0 100%; position:relative; background-size:cover; background-position:center; }
.hero-nav { position:absolute; left:50%; transform:translateX(-50%); bottom:14px; display:flex; gap:8px; z-index:5; }
.hero-dot { width:12px; height:12px; border-radius:50%; background:rgba(255,255,255,0.7); display:inline-block; cursor:pointer; }
.hero-dot.active { background:#1f4fa1; }

/* Icon tiles style (white cards with border) */
.quick-icons { background: #fff; padding:18px 5%; box-shadow:none; }
.icon-box { background:#fff; border:1px solid #eee; padding:22px; border-radius:6px; }

/* Packages horizontal carousel (desktop auto-scroll; mobile allows swipe) */
.package-scroll-wrapper { overflow:hidden; background:#fff; padding:18px 0; border-radius:8px; margin-top:20px }
.package-scroll-track { display:flex; gap:16px; align-items:center; /* animation for desktop only */ }
.package-card { min-width:320px; max-width:320px; border-radius:8px; overflow:hidden; border:1px solid #e6f0e9; background:#fff; }
.package-card img { width:100%; height:220px; object-fit:cover; display:block; }

/* Offers grid */
.offers { background:#fff; padding:20px 0; margin-top:18px; }
.offers-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.offer-card { background:#fff; border-radius:6px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.06); }
.offer-card img { width:100%; height:160px; object-fit:cover; display:block; }

/* Technology partners - full width, white background */
.partners { background:#fff; padding:18px 0; width:100%; box-shadow:none; margin-top:18px; }
.partners .container { max-width:var(--max-width); padding:0 16px }
.partners .title { text-align:center; font-size:22px; color:#2b2b7a; margin-bottom:8px; }
.partners .track {
  display:flex;
  gap:34px;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:nowrap;
  overflow:hidden;
  width:100%;
  -webkit-overflow-scrolling:touch;
}
.partners .track img { height:56px; opacity:0.95; display:inline-block; margin:0 18px; }

/* Footer */
footer { background:#2b2b7a; color:#dfe9ff; padding:48px 5% 24px; }
.footer-grid { display:grid; grid-template-columns: 280px repeat(4,1fr); gap:28px; align-items:start; }
.footer-grid img { filter: brightness(1.1); }
.footer-col h3 { color:#eaf3ff; font-size:16px; margin-bottom:12px; border-bottom:3px solid #67b640; display:inline-block; padding-bottom:6px; }
.footer-col a { color:#dfe9ff; opacity:0.95; }
.footer-address p, .footer-address a { color:#dfe9ff; opacity:0.9; }
.footer-small { font-size:13px; color:#d7e7ff; opacity:0.9; margin-top:12px; }

/* extra helpers */
.center { text-align:center }
.row { display:flex; gap:12px; align-items:center; }

/* ==== Animations only for larger screens (disable on small) ==== */
@media (min-width:1001px){
  .package-scroll-track { animation: scroll-left 18s linear infinite; }
  @keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); } /* duplicated content required in markup */
  }

  .partners .track { animation: partners-scroll 14s linear infinite; }
  @keyframes partners-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); } /* duplicate logos in markup for smooth loop */
  }
}

/* Responsive adjustments */
@media (max-width:1000px){
  :root { --max-width:1000px; }
  .why-grid{grid-template-columns:repeat(2,1fr)}
  .organ-grid{grid-template-columns:repeat(2,1fr)}
  .main-nav ul{display:none} /* collapse nav for smaller devices */
  .package-card { min-width:260px; }
  .hero-slide { height:320px; }
  .partners .track img { height:48px; margin:0 12px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width:520px){
  :root { --max-width:100%; }
  .why-grid{grid-template-columns:1fr}
  .organ-grid{grid-template-columns:1fr}
  .logo img{height:48px}
  .top-bar .inner{flex-direction:column;align-items:flex-start;gap:6px;padding:6px}
  .header .inner{flex-direction:column;align-items:flex-start;gap:8px}
  .hero-slide { height:220px; }
  .package-card { min-width:220px; }
  .offers-grid { grid-template-columns:1fr; }
  .partners .track { gap:18px; }
  .partners .track img { height:44px; }
  .footer-grid { grid-template-columns:1fr; }
}

/* accessibility focus */
a:focus { outline:2px solid rgba(31,79,161,0.25); outline-offset:2px }