/*
Theme Name: Scholars Republic
Theme URI: https://scholarsrepublic.com
Author: Scholars Republic
Author URI: https://scholarsrepublic.com
Description: Custom theme with sticky header, INTO-style hero search, and filterable results layout.
Version: 1.0.0
Text Domain: scholars-republic
*/

/* ------------------------------
   RESET & TOKENS
------------------------------ */
* { box-sizing: border-box; }
html, body { margin:0; padding:0; }
img { max-width:100%; height:auto; display:block; }
a { color: inherit; text-decoration:none; }
:focus-visible { outline: 2px solid #e31b23; outline-offset: 2px; }

:root{
  --sr-text:#0a0a0a;
  --sr-muted:#444;
  --sr-border:#eaeaea;
  --sr-bg:#ffffff;
  --sr-soft:#f7f7f8;
  --sr-red:#e31b23;
  --sr-red-dark:#b00016;
  --sr-black:#0a0a0a;

  /* header heights */
  --sr-header-h: 100px;
  --sr-header-h-mobile: 70px;
}

body{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--sr-text);
  background:var(--sr-bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.container{ width:min(1200px,92%); margin-inline:auto; }

/* Utility */
.mt-24{ margin-top:24px; }
.mb-24{ margin-bottom:24px; }

/* Buttons */
.button,
button,
input[type=submit]{
  appearance:none;
  background:var(--sr-red);
  color:#fff;
  font-weight:700;
  border:none;
  padding:10px 18px;
  border-radius:10px;
  cursor:pointer;
  transition:.2s ease;
}
.button:hover,
button:hover,
input[type=submit]:hover{ background:var(--sr-red-dark); }

/* ------------------------------
   HEADER & NAV (compact version)
------------------------------ */
.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:#f4f4f5;                 /* <<< grey header */
  border-bottom:1px solid #e0e0e0;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}

.navbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:0;
}

.brand{ display:flex; align-items:center; gap:12px; }

.nav{ list-style:none; display:flex; gap:28px; margin:0; padding:0; }
.nav > li{ position:relative; }
.nav > li > a{
  display:inline-block; padding:8px 2px;
  font-weight:700; color:var(--sr-black); letter-spacing:.1px;
}
.nav > li > a:hover{ color:var(--sr-red); }

/* simple dropdown (optional) */
.nav li:hover > ul.submenu{ display:block; }
.submenu{
  display:none; position:absolute; top:100%; left:0;
  background:#fff; border:1px solid var(--sr-border);
  border-radius:10px; padding:8px; min-width:220px;
  box-shadow:0 10px 25px rgba(0,0,0,.06);
}
.submenu li a{ display:block; padding:8px 10px; border-radius:8px; }
.submenu li a:hover{ background:var(--sr-soft); }

/* ------------------------------
   HERO (INTO-style search)
------------------------------ */
.hero{
  padding:54px 0 42px;
  background:linear-gradient(180deg,#ffffff 0%, #fafafb 80%);
  border-bottom:1px solid var(--sr-border);
}
.hero h1{
  font-size:42px; line-height:1.15; font-weight:900; margin:0 0 10px;
  color:var(--sr-black);
}
.hero p{ margin:0 0 22px; color:#555; font-size:18px; }

.form-simple{ display:flex; gap:16px; align-items:center; }
.input-group-xl{ position:relative; flex:1; max-width:700px; }
.input-xl{
  width:100%; height:64px; padding:0 56px 0 56px; border-radius:32px;
  border:1px solid #ddd; background:#fff; font-size:18px;
}
.search-ico{
  position:absolute; left:20px; top:50%; transform:translateY(-50%);
  opacity:.55; font-size:22px; line-height:1; pointer-events:none;
}
.button-xl{
  height:64px; padding:0 28px; border-radius:32px; font-size:18px; font-weight:800;
}

@media (max-width:960px){
  .form-simple{ flex-direction:column; align-items:stretch; }
  .button-xl{ width:100%; }
}

/* ------------------------------
   RESULTS PAGE (filters + cards)
------------------------------ */
.results-layout{
  display:grid;
  grid-template-columns:300px 1fr;
  gap:28px;
  align-items:start;
}

/* Filters sidebar */
.filters{
  background:#fff;
  border:1px solid var(--sr-border);
  border-radius:12px;
  padding:18px;
  position:sticky; top:72px;
}
.filters-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:10px;
}
.filters-head h3{ margin:0; font-size:18px; font-weight:900; }
.filters-head .clear{ color:#666; text-decoration:underline; font-size:14px; }

.filter-group{ margin:16px 0 12px; padding-top:10px; border-top:1px solid #f1f1f1; }
.filter-group:first-of-type{ border-top:none; padding-top:0; }
.filter-title{ font-weight:800; margin-bottom:8px; }

.filter-options{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px 12px;
}
.check{ display:flex; align-items:center; gap:8px; font-size:15px; color:#222; }
.check input{ transform:translateY(1px); }

#filters-form .button{
  width:100%; margin-top:12px; height:42px; border-radius:10px;
  background:var(--sr-red); color:#fff; font-weight:800;
}

/* Results area */
.results-top h2{ margin:0 0 14px; font-size:20px; font-weight:900; }

/* Base card */
.card{
  background:#fff;
  border:1px solid var(--sr-border);
  border-radius:12px;
  padding:18px;
  margin:0;
  box-shadow:0 6px 26px rgba(0,0,0,.04);
}
.card h3{ margin:0 0 8px; font-size:20px; }
.card h3 a{ color:#111; }
.card p{ margin:0; color:var(--sr-muted); }

/* Meta chips */
.meta{ margin-top:10px; }
.chip{
  display:inline-block;
  background:#f5f5f5;
  border:1px solid #eee;
  color:#333;
  border-radius:999px;
  padding:4px 10px;
  margin:4px 6px 0 0;
  font-size:12px;
}

/* Pagination */
.pagination{ margin-top:18px; }
.pagination a, .pagination span{
  display:inline-block; padding:8px 12px; margin-right:6px;
  border:1px solid var(--sr-border); border-radius:8px;
  background:#fff; color:#222; text-decoration:none;
}
.pagination .current{ background:#111; color:#fff; border-color:#111; }

/* ------------------------------
   GLOBAL CARDS / LISTS
------------------------------ */
.card-list{ display:grid; gap:14px; }
.grid-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }

/* ------------------------------
   FOOTER
------------------------------ */
.site-footer{
  margin-top:40px; padding:36px 0;
  background:#0a0a0a; color:#fff; text-align:center;
  border-top:1px solid #111;
}
.site-footer a{ color:#fff; text-decoration:underline; }

/* ------------------------------
   RESPONSIVE
------------------------------ */
@media (max-width:1200px){
  .nav{ gap:22px; }
}
@media (max-width:1080px){
  .results-layout{ grid-template-columns:1fr; }
  .filters{ position:static; }
}
@media (max-width:680px){
  .navbar{ padding:8px 0; }
  .brand img{ height:32px; }
  .nav{ display:none; }
  .hero h1{ font-size:34px; }
}

/* ============ Home Sections ============ */
.section { padding: 48px 0; }
.section-title { font-size: 28px; font-weight: 800; margin: 0 0 16px; }

/* Destinations */
.destinations {
  display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:14px;
}
.dest-card {
  position:relative; height:220px; border-radius:18px; overflow:hidden;
  background:#111 center/cover no-repeat; color:#fff; display:block;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.dest-overlay{
  position:absolute; inset:0; display:flex; flex-direction:column;
  justify-content:flex-end; padding:18px;
  background:linear-gradient(0deg, rgba(0,0,0,.55), transparent 60%);
}
.dest-overlay h3{ margin:0 0 6px; font-size:22px; }
.dest-overlay span{ opacity:.9; }

.dest-china  { background-image:url('/wp-content/uploads/china.jpg'); }
.dest-taiwan { background-image:url('/wp-content/uploads/taiwan.jpg'); }

/* Carousel */
.carousel { position:relative; }
.carousel-track{
  display:flex; gap:14px; overflow-x:auto; scroll-behavior:smooth;
  scroll-snap-type:x mandatory; padding-bottom:6px;
}
.carousel-track::-webkit-scrollbar{ height:0; }
.carousel-item{ scroll-snap-align:start; flex:0 0 auto; }

/* Universities */
.uni-card {
  background:#fff;
  border-radius:12px;
  box-shadow:0 3px 8px rgba(0,0,0,0.08);
  padding:20px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  transition:transform .2s ease, box-shadow .2s ease;
  height:100%;
}
.uni-card:hover {
  transform:translateY(-4px);
  box-shadow:0 6px 14px rgba(0,0,0,0.15);
}
.uni-logo img {
  max-height:130px;
  max-width:130px;
  object-fit:contain;
  margin-bottom:12px;
}
.uni-title {
  font-size:1rem;
  font-weight:600;
  line-height:1.4em;
  color:#111;
  margin:0;
  text-align:center;
  max-width:220px;
  overflow-wrap:break-word;
}
.uni-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
  gap:24px;
  margin-top:30px;
}

/* Why */
.why-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:14px; }
.why-card{ background:#fff; border:1px solid #eee; border-radius:14px; padding:20px; text-align:center; }
.why-ico{ font-size:30px; margin-bottom:10px; }

/* Testimonials */
.testi-card{ width:360px; background:#fff; border:1px solid #eee; border-radius:14px; padding:16px; display:flex; gap:12px; }
.testi-photo img{ width:64px; height:64px; border-radius:999px; object-fit:cover; }
.testi-name{ margin:2px 0 6px; font-size:16px; font-weight:800; }
.testi-text{ margin:0; color:#444; }

/* News */
.news-card{ width:360px; background:#fff; border:1px solid #eee; border-radius:14px; overflow:hidden; }
.news-thumb img{ width:100%; height:180px; object-fit:cover; display:block; }
.news-body{ padding:12px; }
.news-title{ margin:0 0 6px; font-size:16px; }
.news-title a{ color:inherit; text-decoration:none; }
.news-excerpt{ margin:0; color:#444; }

@media (max-width:960px){
  .destinations{ grid-template-columns:1fr; }
  .why-grid{ grid-template-columns:1fr; }
  .testi-card, .news-card{ width:80vw; }
  .uni-card{ width:auto; }
}

/* Blog index */
.blog-layout { display:grid; grid-template-columns:300px 1fr; gap:28px; }
.blog-sidebar .widget, .blog-cats { background:#fff; border:1px solid var(--sr-border); border-radius:12px; padding:16px; }
.blog-sidebar h3 { margin:0 0 10px; font-size:18px; font-weight:800; }
.blog-title { font-size:28px; font-weight:900; margin:0 0 16px; }
.blog-grid { display:grid; gap:18px; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); }
.blog-card { background:#fff; border:1px solid var(--sr-border); border-radius:14px; overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.06); display:flex; flex-direction:column; }
.blog-card .thumb img { width:100%; height:180px; object-fit:cover; }
.blog-card .body { padding:14px 16px; }
.blog-card .meta { margin:0 0 6px; color:#777; font-size:13px; }
.blog-card .title { margin:0 0 8px; font-size:18px; font-weight:800; line-height:1.3; }
.blog-card .title a { color:#111; }
.blog-card .excerpt { margin:0 0 10px; color:#444; }
.blog-card .read-more { font-weight:700; color:var(--sr-red); }

@media (max-width:980px){
  .blog-layout { grid-template-columns:1fr; }
}

/* CTA pills */
.sr-cta-post {
  margin-top:34px;
  padding:22px 18px 28px;
  background:#f7fafc;
  border:1px solid #eaeff5;
  border-radius:14px;
}
.sr-cta-title { margin:0 0 4px; font-size:22px; font-weight:900; }
.sr-cta-sub { margin:0 0 16px; color:#445; }
.sr-cta-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
  gap:14px;
}
.sr-cta-pill {
  display:block;
  text-align:center;
  padding:12px 14px;
  border-radius:999px;
  background:#e31b23;
  color:#fff;
  font-weight:800;
  font-size:14px;
  min-width:200px;
  box-shadow:0 6px 18px rgba(0,0,0,.10);
  transition:transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.sr-cta-pill:hover {
  background:#b00016;
  filter:brightness(.98);
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(0,0,0,.14);
}
@media (max-width:640px){
  .sr-cta-pill{
    padding:10px 12px;
    min-width:100%;
  }
}

/* ==== SR HEADER / LOGO FINAL LARGE SIZE ==== */
.site-header .navbar{
  height: var(--sr-header-h);
  min-height: var(--sr-header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
}

header img.custom-logo,
.site-header img.custom-logo,
.site-header .custom-logo-link img,
.site-header .brand img,
.site-branding img.custom-logo,
.site-branding .custom-logo-link img {
  height: 94px !important;
  max-height: 94px !important;
  width: auto !important;
  display: block;
  object-fit: contain;
}

/* keep menu vertically centered */
.site-header .nav > li > a{
  line-height: var(--sr-header-h) !important;
  font-weight: 700;
}

/* Mobile */
@media (max-width: 680px){
  .site-header{
    background:#f4f4f5;
  }
  .site-header .navbar{
    height: var(--sr-header-h-mobile);
    min-height: var(--sr-header-h-mobile);
  }
  header img.custom-logo,
  .site-header img.custom-logo,
  .site-header .custom-logo-link img,
  .site-header .brand img,
  .site-branding img.custom-logo,
  .site-branding .custom-logo-link img {
    height: 50px !important;
    max-height: 50px !important;
  }
}
