/* Small site-wide adjustments on top of the Vite front build (resources/css/front.css), loaded right after it by
   front/layouts/partials/styles.blade.php. Plain file — this copy has no node_modules to rebuild the theme CSS. */

/* Header top bar: larger social icons (29 Sep 2026, requested) — were 1.75rem buttons / 0.95rem icons */
.topbar .social { gap: var(--space-1); }
.topbar .social a { width: 2.25rem; height: 2.25rem; }
.topbar .social .icon { width: 1.25rem; height: 1.25rem; }

/* Floating call / WhatsApp buttons removed site-wide (29 Sep 2026) — the footer bottom bar no longer needs room for them */
.footer__bottom .container { padding-right: var(--gutter); }

/* ---- Home: one equal gap between all sections, 30% smaller than --section-space (29 Sep 2026, requested) ----
   Every visible gap (content ↔ content, content ↔ a coloured band's edge, around the CTA boxes) = --home-gap.
   Two white sections in a row share one gap instead of adding their paddings; full-width colour bands (two-audience
   CTA, image band) still sit flush against coloured neighbours. Scoped to body.home-v2 (the Home page only). */
.home-v2 { --home-gap: calc(var(--section-space) * 0.7); }                     /* ≈ 39–67 px (was 56–96) */
.home-v2 main > .section,
.home-v2 main > .trust { padding-block: var(--home-gap); }
.home-v2 main > .section:not(.section--tint):not(.section--dark) + .section:not(.section--tint):not(.section--dark),
.home-v2 main > .rs-ctabox + .section:not(.section--tint):not(.section--dark) { padding-top: 0; }
.home-v2 main > .section:not(.section--tint):not(.section--dark):has(+ .rs-ctabox) { padding-bottom: 0; }
.home-v2 main > .rs-ctabox { margin-block: var(--home-gap); }
.home-v2 main > .rs-ctabox:last-child { margin-bottom: 0; }

/* ---- Service pages "Works we deliver" / role tiles (ServiceElement style 2): checkerboard colours (29 Sep 2026) ----
   The theme alternated crimson / navy by position, so every row repeated the same pattern and each column was one
   colour. Now each row starts with the other colour: no two tiles of the same colour side by side or one above the
   other — 2 columns below 900 px, 4 columns from 900 px (components.css .rs-roles__grid). */
@media (max-width: 899px) {
  .rs-roles__grid > .rs-role:nth-child(4n+1), .rs-roles__grid > .rs-role:nth-child(4n+4) { background: #6f5733; }
  .rs-roles__grid > .rs-role:nth-child(4n+2), .rs-roles__grid > .rs-role:nth-child(4n+3) { background: #046530; }
}
@media (min-width: 900px) {
  .rs-roles__grid > .rs-role:nth-child(8n+1), .rs-roles__grid > .rs-role:nth-child(8n+3),
  .rs-roles__grid > .rs-role:nth-child(8n+6), .rs-roles__grid > .rs-role:nth-child(8n+8) { background: #6f5733; }
  .rs-roles__grid > .rs-role:nth-child(8n+2), .rs-roles__grid > .rs-role:nth-child(8n+4),
  .rs-roles__grid > .rs-role:nth-child(8n+5), .rs-roles__grid > .rs-role:nth-child(8n+7) { background: #046530; }
}

/* ---- Home headings on one line from 900 px (30 Sep 2026, requested) -------------------------------------------
   "Manpower solutions you can depend on" (services slider): the intro was capped at 46rem and the heading missed by
   3 px — cap lifted. "From enquiry to people on site" (How it works, CoreValueSection style 1 = .cv1) sits in the
   narrow left column of a 5 : 7 split, so it keeps one line by scaling with the screen (≈ 23 px at 1024, 32 px from
   1440) instead of wrapping. Phones keep the normal size and wrap. */
@media (min-width: 900px) {
  .home-v2 .svc2__intro { max-width: none; }
  .home-v2 .svc2__intro h2 { white-space: nowrap; }
  .home-v2 .cv1 .section-head h2 { white-space: nowrap; font-size: min(2.2vw, 1.95rem); }
}

/* ---- Header with the new wide logo (1019 × 245, 30 Sep 2026) ----------------------------------------------------
   The old logo was almost square (82 × 63); the new one is 4× wider than tall. At the theme's fixed 63 px height it
   took ~260 px, the 8 menu items (FAQ now top level, "Why Us") no longer fitted: "Why Us" broke onto two lines (items
   at different heights), the account icon stacked above "Get a Quote" (header 101 px) and the logo was squashed on
   narrower screens. Desktop menu (from 1024 px): logo keeps its shape (48 px high, 36 px up to 1279 px), menu words
   stay on one line, the icon + button stay side by side; 1024–1279 px: slightly tighter menu spacing. */
@media (min-width: 1024px) {
  .header-bar > .brand { flex: none; }
  .header-bar .brand__logo { height: 3rem; width: auto; max-width: none; }
  .header-bar > .cluster { flex: none; flex-wrap: nowrap; }
  .header-bar .nav__list > .nav__item .nav__link { white-space: nowrap; }
}
@media (min-width: 1280px) and (max-width: 1439px) { /* 8 menu items (Careers added, 8 Oct 2026) fit with the two buttons */
  .header-bar .nav__list > .nav__item .nav__link { padding-inline: 0.55rem; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .header-bar .brand__logo { height: 2.25rem; }
  .header-bar .nav__list > .nav__item .nav__link { padding-inline: 0.45rem; letter-spacing: 0.02em; }
  .header-bar { gap: 0.75rem; }
}

/* ---- "Apply now" button (academy, 7 Oct 2026) --------------------------------------------------------------------
   Gold button next to "Get a Quote" in the header and the mobile menu; links to the Admission page.
   gold-500 with white text = 4.55:1. Lives here (plain CSS, no build) because this folder has no node_modules. */
.btn--gold { background: var(--gold-500); color: var(--n-0); }
.btn--gold:hover, .btn--gold:focus-visible { background: var(--gold-600); color: var(--n-0); box-shadow: var(--shadow-md); }
.nav__footer .btn--gold { margin-top: var(--space-3); }
@media (min-width: 1024px) {
  .header-bar > .cluster .header-cta { white-space: nowrap; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .header-bar > .cluster .header-cta { padding-inline: 0.9em; }
}
@media (min-width: 1024px) and (max-width: 1199px) { /* 8 menu items: "Enquire now" (also in the menu's footer and the CTA bands) makes room */
  .header-bar > .cluster .header-cta.btn--primary { display: none; }
}

/* ---- Plain page hero (academy, 7 Oct 2026) --------------------------------------------------------------------
   Pages without an uploaded hero image use the green brand hero (the old fallback photos showed manpower crews).
   A soft gold glow and a thin gold rule tie it to the logo; same look as the course hero. */
.page-hero--plain {
  background:
    radial-gradient(50rem 26rem at 88% 0%, rgba(166, 138, 92, 0.22), transparent 60%),
    linear-gradient(120deg, var(--green-900) 0%, var(--green-700) 55%, var(--green-500) 100%);
  border-bottom: 3px solid var(--gold-400);
}
.page-hero--plain::after { background: none; }

/* UKAIS (16 Oct 2026): footer backdrop — the UKAIS mosque banner instead of the Adrem city skyline. */
.site-footer--skyline::before { background-image: url("/assets/admin/uploads/ukais/setting/home_beadcrum_img/17672511861945541579.webp"); background-position: center 40%; }

/* UKAIS (16 Oct 2026, Our Principal "Institutions Under His Guidance"): uploaded logos in the team cards (Why choose us
   style 4) get a larger white circle so the institution logos are legible; theme sprite icons keep the small ring. */
.pro-card__icon:has(> .cms-icon-img) { width: 7rem; height: 7rem; background: var(--n-0); border: 1px solid var(--color-border); box-shadow: var(--shadow-sm); }
.pro-card__icon > .cms-icon-img { width: 80%; height: 80%; }

/* UKAIS (16 Oct 2026, Home course categories): a trust strip with exactly three cards uses three equal columns — one
   row, full width — instead of three quarters of a four-column grid. Four-card strips (counters) are unchanged. */
@media (min-width: 768px) {
  .trust__grid:has(> li:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
}
@media (min-width: 480px) and (max-width: 767px) {
  .trust__grid:has(> li:nth-child(3):last-child) > li:last-child { grid-column: 1 / -1; }
}

/* UKAIS (16 Oct 2026): Client section style 2 "Partner cards" (Educational Partners) — equal cards across the width,
   full-colour logos with the partner name. --partner-cols is set by the view (number of logos, max 4). */
.partner-cards__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: var(--space-5);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 900px) { .partner-cards__grid { grid-template-columns: repeat(var(--partner-cols, 4), minmax(0, 1fr)); } }
@media (max-width: 479px) { .partner-cards__grid { grid-template-columns: 1fr; } }
.partner-card {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4);
  padding: var(--space-8) var(--space-6) var(--space-6); text-align: center;
  background: var(--n-0); border: 1px solid var(--color-border); border-top: 4px solid var(--gold-400);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-sm);
  transition: transform 0.35s var(--ease-out), box-shadow 0.35s var(--ease-out), border-color 0.35s var(--ease-out);
}
.partner-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-top-color: var(--green-500); }
.partner-card__logo { display: flex; align-items: center; justify-content: center; width: 100%; height: 6rem; }
.partner-card__logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.partner-card__name { font-family: var(--font-heading); font-weight: var(--weight-semibold); font-size: var(--text-sm); line-height: var(--leading-snug); color: var(--color-heading); }
@media (prefers-reduced-motion: reduce) { .partner-card, .partner-card:hover { transition: none; transform: none; } }

/* UKAIS (16 Oct 2026) Job page: the poster at its full height (it is a portrait flyer, not a landscape photo) */
.article-media--poster { max-width: 40rem; box-shadow: var(--shadow-md); }
.article-media--poster img { display: block; height: auto; }
