/* Home 360 layout overrides — only on shell homepage */
body.shell-360,
body.public-site.home-page.shell-360 {
  --bg: #eef1f4;
  --surface: #fff;
  --ink: #172333;
  --muted: #5b6b76;
  --line: #e3e8ec;
  --accent: #08786d;
  --accent-soft: #e7f5f3;
  --shadow: 0 10px 28px rgba(20, 33, 43, .06);
  --color-school: #08786d;
  --color-institute: #2563eb;
  --color-tutor: #966500;
  --color-ad: #e11d48;
  --color-learning-center: #0e7490;
  /* classic header pull-up must not apply inside 360 shell */
  --listing-header-offset: 0px;
  background: var(--bg) !important;
}
body.shell-360 .main > .proto-home { min-width: 0; }
body.shell-360 .proto-footer { display: none; }
body.shell-360 .home-hero {
  margin-top: 0 !important;
}
body.shell-360 .home-hero-band,
body.shell-360 .home-hero--mock .home-hero-band {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}
body.shell-360 .home-hero--360 .home-hero-inner {
  width: 100% !important;
  max-width: none !important;
  padding-inline: 18px !important;
  box-sizing: border-box;
}
body.shell-360 .home-hero-grid--360 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 300px);
  gap: 18px 22px;
  align-items: stretch;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}
body.shell-360 .home-hero--360 .home-hero-copy {
  align-items: center !important;
  text-align: center !important;
  max-width: none !important;
  width: 100% !important;
  margin-inline: 0 !important;
  gap: 10px !important;
}
body.shell-360 .home-hero--360 .home-hero-copy h1 {
  white-space: normal !important;
  font-size: clamp(22px, 2.6vw, 34px) !important;
  line-height: 1.45 !important;
  max-width: none;
  color: #0f1f2a !important;
}
body.shell-360 .home-hero--360 .home-hero-copy > p {
  white-space: normal !important;
  font-size: clamp(13.5px, 1.4vw, 15.5px) !important;
  line-height: 1.85 !important;
  max-width: none;
  color: #24343c !important;
  font-weight: 600;
}
body.shell-360 .home-hero-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
}
body.shell-360 .home-hero-brand-mark {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #0aa394, #06665d);
  color: #fff;
  font-size: 22px;
  font-weight: 900;
  flex: 0 0 auto;
  box-shadow: 0 8px 18px rgba(8, 120, 109, .22);
}
body.shell-360 .home-hero-brand-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}
body.shell-360 .home-hero-brand-text strong {
  font-size: 18px;
  font-weight: 900;
  color: #0f1f2a;
  line-height: 1.3;
}
body.shell-360 .home-hero-brand-text em {
  font-style: normal;
  font-size: 13px;
  font-weight: 700;
  color: #1a3a34;
  line-height: 1.5;
}
body.shell-360 .home-hero-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 8px;
  width: 100%;
}
body.shell-360 .home-hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid #cfdadf;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  color: #172333;
  text-decoration: none;
  box-shadow: none;
}
body.shell-360 .home-hero-chip .lucide { width: 14px; height: 14px; }
body.shell-360 .home-hero-chip--school { color: #08786d; border-color: #b9ddd6; }
body.shell-360 .home-hero-chip--kinder { color: #0e7490; border-color: #a5d8e0; }
body.shell-360 .home-hero-chip--tutor { color: #966500; border-color: #e7d39a; }
body.shell-360 .home-hero-chip--konkur { color: #7c3aed; border-color: #d4c4f7; }
body.shell-360 .home-hero-chip--lang { color: #2563eb; border-color: #bfcff8; }
body.shell-360 .home-hero-chip--institute { color: #1d4ed8; border-color: #c7d7fe; }
body.shell-360 .home-tool-row--stack {
  margin: 0 !important;
  width: 100%;
  max-width: none;
  align-self: stretch;
}
body.shell-360 .home-tool-grid--stack {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  height: 100%;
}
body.shell-360 .home-tool-grid--stack .home-tool-card {
  min-height: 58px;
}
@media (max-width: 900px) {
  body.shell-360 .home-hero--mock .home-hero-grid--360,
  body.shell-360 .home-hero-grid--360 {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 14px !important;
    align-items: stretch !important;
  }
  body.shell-360 .home-hero--360 .home-hero-copy,
  body.shell-360 .home-hero--mock .home-hero-copy {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    width: 100% !important;
    height: auto !important;
    order: 1 !important;
  }
  body.shell-360 .home-hero--360 .home-hero-copy h1,
  body.shell-360 .home-hero--mock .home-hero-copy h1 {
    order: 0 !important;
    max-width: none;
    white-space: normal !important;
    font-size: clamp(18px, 5.2vw, 24px) !important;
    line-height: 1.45 !important;
  }
  body.shell-360 .home-hero--360 .home-hero-copy > p,
  body.shell-360 .home-hero--mock .home-hero-copy > p {
    order: 0 !important;
    max-width: none;
    white-space: normal !important;
    font-size: clamp(13px, 3.6vw, 15px) !important;
    line-height: 1.75 !important;
  }
  body.shell-360 .home-hero-chips {
    order: 0 !important;
    justify-content: center;
    flex-wrap: wrap;
  }
  body.shell-360 .home-tool-row--stack {
    order: 2 !important;
    width: 100% !important;
  }
  body.shell-360 .home-tool-grid--stack {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  body.shell-360 .home-tool-grid--stack .home-tool-card {
    min-height: 56px;
  }
}
/* home stack: each block is its own card (not one big sheet) */
    .proto-home {
      display: grid;
      gap: 12px;
      background: transparent;
      border-radius: 0;
      box-shadow: none;
      overflow: visible;
    }
    /* —— current home hero (mock) —— */
    .home-hero--mock { overflow: visible; }
    .home-hero--mock .home-hero-band {
      color: #172333; overflow: visible; isolation: auto;
      padding: 16px 0 14px;
      background:
        radial-gradient(circle at 12% 18%, rgba(8,120,109,.16), transparent 42%),
        radial-gradient(circle at 88% 8%, rgba(247,201,72,.24), transparent 34%),
        linear-gradient(180deg, #e8f6f1 0%, #e4f1eb 48%, #eef6f2 100%);
      border-radius: 22px;
    }
    .home-hero-inner { position: relative; z-index: 1; padding-inline: 16px; }
    .home-hero--mock .home-hero-grid {
      display: grid; grid-template-columns: 1fr;
      gap: 0; align-items: center; min-height: 0;
    }
    .home-hero--mock .home-hero-visual { display: none !important; }
    .home-hero--mock .home-hero-copy {
      position: relative; z-index: 3; text-align: center;
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      padding: 0; gap: 8px; max-width: 920px; margin-inline: auto; width: 100%;
    }
    .home-hero--mock .home-hero-copy h1 {
      color: #12352f; margin: 0; font-size: clamp(18px, 2.2vw, 28px); line-height: 1.4; font-weight: 900;
      white-space: nowrap; max-width: none;
    }
    .home-hero--mock .home-hero-copy > p {
      color: #4d6360; margin: 0; font-size: 13.5px; line-height: 1.7;
      white-space: nowrap; max-width: none;
    }
    .home-hero-search {
      padding: 10px; border-radius: 16px; background: #fff;
      border: 1.5px solid #08786d; box-shadow: 0 14px 32px rgba(8,120,109,.12);
    }
    .home-hero-search.is-institutes { border-color: #2563eb; box-shadow: 0 14px 32px rgba(37,99,235,.14); }
    .home-hero-search.is-tutors { border-color: #f7c948; box-shadow: 0 14px 32px rgba(247,201,72,.2); }
    .home-hero-search.is-ads { border-color: #e11d48; box-shadow: 0 14px 32px rgba(225,29,72,.14); }
    .home-quick-search-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
    .home-quick-search-tab {
      border: 0; background: #f3f6f7; border-radius: 999px; padding: 8px 12px;
      display: inline-flex; align-items: center; gap: 6px; color: #647580;
      font-size: 12.5px; font-weight: 800; cursor: pointer;
    }
    .home-quick-search-tab .lucide { width: 15px; height: 15px; }
    .home-quick-search-tab.is-on { background: #fff; color: var(--color-school); box-shadow: 0 2px 10px rgba(15,118,110,.12); }
    .home-hero-search.is-institutes .home-quick-search-tab.is-on { color: var(--color-institute); }
    .home-hero-search.is-tutors .home-quick-search-tab.is-on { color: var(--color-tutor); }
    .home-hero-search.is-ads .home-quick-search-tab.is-on { color: var(--color-ad); }
    .home-quick-search-form {
      display: grid; grid-template-columns: 140px 1fr auto; gap: 8px; align-items: center;
    }
    .home-quick-search-form select,
    .home-quick-search-form input {
      border: 1px solid #dbe4e8; border-radius: 12px; min-height: 44px; padding: 0 12px; background: #fff; outline: none;
    }
    .home-hero-search-submit { min-height: 44px; border-radius: 12px; padding-inline: 18px; }
    .home-hero--mock .home-hero-visual {
      position: relative; display: flex; justify-content: center; align-items: flex-end;
      transform: translateX(-16px); pointer-events: none;
    }
    .home-hero-visual-stage { position: relative; width: min(280px, 100%); height: 100%; display: flex; align-items: flex-end; justify-content: center; }
    .home-mascot-image {
      width: auto; max-width: min(220px, 86%); max-height: 280px; object-fit: contain;
      filter: drop-shadow(0 10px 18px rgba(20,50,40,.16));
    }
    .home-hero-stats { position: absolute; inset: 0; pointer-events: none; }
    .home-float-chip {
      position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: 5px;
      min-height: 32px; padding: 5px 9px; border-radius: 12px;
      background: rgba(255,255,255,.92); font-size: 11px; font-weight: 800;
      box-shadow: 0 10px 24px rgba(20,40,50,.16); pointer-events: auto;
    }
    .home-float-chip em { font-style: normal; font-weight: 900; }
    .home-float-chip--schools { top: 14%; right: -4%; color: #08786d; }
    .home-float-chip--institutes { top: 16%; left: -6%; color: #2563eb; }
    .home-float-chip--tutors { bottom: 14%; right: -6%; color: #b77900; }

    /* stats row under hero — compact, label then number */
    .home-stats-row {
      display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px;
    }
    .home-stat-card {
      display: grid; justify-items: center; text-align: center; gap: 4px; align-content: center;
      padding: 10px 8px; border-radius: 14px; background: var(--surface);
      border: 1px solid #e2e9ef; box-shadow: var(--shadow); min-width: 0;
    }
    .home-stat-icon { display: none; }
    .home-stat-label {
      margin: 0; font-size: 11.5px; font-weight: 700; color: #5b6b76; line-height: 1.3;
      order: -1;
    }
    .home-stat-value {
      margin: 0; font-size: clamp(15px, 1.6vw, 20px); font-weight: 900; color: #172333;
      font-variant-numeric: tabular-nums; letter-spacing: -.02em; line-height: 1.15;
    }

    /* tools — one row under hero text */
    .home-tool-row {
      margin-top: 2px; padding: 0; background: transparent; max-width: none; width: 100%;
    }
    .home-tool-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .home-tool-card {
      display: flex; align-items: center; gap: 8px; padding: 10px 11px;
      border-radius: 12px; border: 1px solid rgba(220,230,235,.9); background: rgba(255,255,255,.94);
      box-shadow: 0 4px 12px rgba(20,40,50,.05); min-width: 0;
    }
    .home-tool-icon {
      width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: #fff;
      color: var(--accent); flex: 0 0 auto; border: 1px solid #e8eef1;
    }
    .home-tool-icon .lucide { width: 18px; height: 18px; }
    .home-tool-copy { display: grid; gap: 1px; min-width: 0; }
    .home-tool-copy strong { font-size: 12.5px; line-height: 1.35; }
    .home-tool-copy em { font-style: normal; font-size: 11px; color: #647580; line-height: 1.4; }
    .home-tool-card--map .home-tool-icon { color: #08786d; }
    .home-tool-card--compare .home-tool-icon { color: #2563eb; }
    .home-tool-card--stats .home-tool-icon { color: #0e7490; }

    /* catalog already from home-catalog.css; panel tweaks */
    .proto-home .home-catalog-section {
      padding-inline: 14px;
      padding-block: 16px 18px;
      border-bottom: 0;
      border-radius: 22px;
      box-shadow: var(--shadow);
    }
    .proto-home .home-catalog-section--school {
      padding-inline: 12px;
    }
    .proto-home .home-catalog-section--school .home-catalog-heading {
      padding-inline: 4px;
    }
    .proto-home .home-catalog-split {
      padding: 0;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      background: transparent;
    }
    .proto-home .home-catalog-split .site-wrap.home-catalog-split-grid {
      display: contents;
      width: auto; max-width: none; margin: 0; padding: 0;
    }
    .proto-home .home-catalog-section--panel {
      margin: 0;
      border-radius: 22px;
      box-shadow: var(--shadow);
      padding: 18px;
      background: #fff !important;
      border: 1px solid #e2e9ef !important;
      border-top: 3px solid var(--catalog-accent, #08786d) !important;
    }
    .proto-home .home-catalog-section--panel .home-catalog-heading h2 {
      color: var(--catalog-accent, #08786d);
    }
    .proto-home .home-catalog-section--panel .home-catalog-heading h2 > .lucide {
      color: var(--catalog-accent, #08786d);
    }
    .proto-home .home-ads-cta-band .site-wrap,
    .proto-home .home-how .site-wrap,
    .proto-home .home-news .site-wrap { width: auto; max-width: none; margin-inline: auto; padding-inline: 0; }
    .proto-home .home-catalog-section .site-wrap { width: auto; max-width: none; }
    .proto-home .home-featured-picks,
    .proto-home .home-how,
    .proto-home .home-news-band,
    .proto-home .faq-section {
      width: 100%;
      max-width: none;
      margin-inline: 0;
      background: var(--surface);
      border-radius: 22px;
      box-shadow: var(--shadow);
    }
    .proto-home .home-featured-picks {
      padding: 14px 16px;
      overflow: hidden;
      box-sizing: border-box;
      max-height: calc(3 * 50px + 2 * 8px + 28px);
    }
    .proto-home .home-featured-row {
      overflow: hidden;
      width: 100%;
      max-width: 100%;
    }
    .proto-home .home-featured-track {
      flex-wrap: nowrap;
      width: max-content;
    }
    .proto-home .home-how {
      --home-band-green: linear-gradient(90deg, #063327 0%, #0a4a38 48%, #106148 100%);
      padding: 18px 16px;
      background-color: #0a4a38 !important;
      background-image:
        radial-gradient(circle at 14% 30%, rgba(255, 255, 255, .07), transparent 36%),
        radial-gradient(circle at 86% 72%, rgba(255, 255, 255, .05), transparent 40%),
        var(--home-band-green) !important;
      box-shadow: 0 14px 32px rgba(6, 40, 30, .22) !important;
      border: 0 !important;
      border-radius: 22px !important;
      color: #fff;
    }
    .proto-home .home-how .site-wrap { max-width: none; padding: 0; width: 100%; }
    .proto-home .home-how-box {
      border: 0 !important;
      background: transparent !important;
      background-image: none !important;
      color: #fff !important;
      padding: 0 !important;
      box-shadow: none !important;
      border-radius: 0 !important;
    }
    .proto-home .home-how-head {
      text-align: center;
      max-width: none;
      margin: 0 auto 16px;
    }
    .proto-home .home-how-head h2 {
      color: #fff !important;
      font-size: 20px;
    }
    .proto-home .home-how-head p {
      display: none;
    }
    .proto-home .home-how-card {
      border: 1px solid #e2e9ef;
      box-shadow: none;
      background: #fff;
      text-align: center;
      align-items: center;
    }
    .proto-home .home-how-card:hover {
      box-shadow: 0 8px 18px rgba(20, 33, 43, .06);
    }
    .proto-home .home-how-top {
      justify-content: center;
      flex-direction: column;
      text-align: center;
    }
    .proto-home .home-how-card h3 { color: #0f1f2a !important; }
    .proto-home .home-how-card p { color: #33454f !important; }
    .proto-home .home-how-card a {
      color: var(--accent, #08786d);
      font-weight: 800;
      text-decoration: underline;
      text-underline-offset: 2px;
    }
    .proto-home .home-news-band { padding: 16px; border-top: 0; }
    .proto-home .home-news .site-wrap { max-width: none; }
    .proto-home .faq-section { padding: 18px 16px; width: 100%; max-width: none; box-sizing: border-box; }
    .proto-home .faq-home-box { border: 0; background: transparent; padding: 0; width: 100%; }
/* Dual owner CTAs */
.owner-cta-row {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
body.shell-360 .owner-cta-band--home { display: none !important; }
body.shell-360 .owner-cta {
  margin: 0; padding: 18px 20px; border-radius: 22px;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px;
  box-shadow: none;
}
body.shell-360 .owner-cta--school {
  background: linear-gradient(118deg, #e8f6f1, #f3fbf8);
  border: 1px solid #cfe6df;
}
body.shell-360 .owner-cta--institute {
  background: linear-gradient(118deg, #eaf2ff, #f5f8ff);
  border: 1px solid #c7d7fe;
}
body.shell-360 .owner-cta h2 { margin: 0 0 4px; font-size: 17px; line-height: 1.45; }
body.shell-360 .owner-cta--school h2 { color: #0f5f56; }
body.shell-360 .owner-cta--institute h2 { color: #1d4ed8; }
body.shell-360 .owner-cta p { margin: 0; color: #647580; font-size: 13.5px; }
body.shell-360 .owner-cta--school .btn { background: #08786d; }
body.shell-360 .owner-cta--institute .btn { background: #2563eb; }

/* Beat legacy home-hero fixed height from site.css */
body.shell-360 .home-hero--mock .home-hero-inner {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}
body.shell-360 .home-hero--mock .home-hero-grid:not(.home-hero-grid--360) {
  grid-template-columns: 1fr !important;
  min-height: 0 !important;
  height: auto !important;
}
body.shell-360 .home-hero--mock .home-hero-grid--360 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 300px) !important;
  gap: 16px 22px !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
}
@media (max-width: 900px) {
  body.shell-360 .home-hero--mock .home-hero-grid--360 {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 14px !important;
  }
}
body.shell-360 .home-hero--mock .home-hero-visual,
body.shell-360 .home-hero--mock .home-hero-search,
body.shell-360 .home-hero--mock .home-hero-ad { display: none !important; }
body.shell-360 .home-tool-row { display: block; }
body.shell-360 .home-tool-row--stack { width: 100%; }
body.shell-360 .home-tool-grid--stack {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}
body.shell-360 .faq-section { max-width: none !important; }
body.shell-360 .faq-home-about-links {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; padding-top: 12px;
  border-top: 1px solid #e4ecef;
}
body.shell-360 .faq-home-about-links a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-radius: 999px; background: #fff;
  border: 1px solid #dce6eb; font-size: 12.5px; font-weight: 700; color: #33454f;
}
body.shell-360 .faq-home-about-links a .lucide { width: 14px; height: 14px; }

@media (max-width: 1100px) {
  body.shell-360 .home-stats-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body.shell-360 .proto-home .home-catalog-split { grid-template-columns: 1fr; }
  body.shell-360 .faq-home-box { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  body.shell-360 .owner-cta-row { grid-template-columns: 1fr; }
  body.shell-360 .home-stats-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.shell-360 .home-hero--mock .home-hero-copy h1,
  body.shell-360 .home-hero--mock .home-hero-copy > p { white-space: normal; }
}
