/* Page-specific layouts. */

/* ---------- Home hero (Developer 279:52) ---------- */
.home-hero {
  position: relative; overflow: hidden; margin-top: -104px; padding-top: 104px;
  border-end-end-radius: 200px; background: var(--color-bg);
}
.home-hero__bg { position: absolute; inset: 0; opacity: .2; pointer-events: none; }
.home-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; }
.home-hero__grid {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto;
  gap: 40px 80px; align-items: end; min-height: 774px; padding-bottom: 0;
}
.home-hero__text { padding-block: 48px 96px; align-self: center; display: flex; flex-direction: column; gap: 24px; max-width: 640px; }
.home-hero__proof { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.home-hero__text .t-h6 { color: var(--color-text-muted); font-weight: 500; }
.home-hero__text h1 { display: flex; flex-direction: column; gap: 4px; }
.home-hero__rule { width: 106px; height: 4px; margin: 8px 0 0; border: 0; background: var(--secondary-500); border-radius: 2px; }
.home-hero__text .lead { margin: 0; max-width: 560px; color: var(--color-text-muted); font-weight: 500; }
.home-hero__text .btn-row { margin-top: 16px; }
.home-hero__visual { display: flex; align-items: center; gap: 8px; align-self: end; }
.home-hero__stats { display: flex; flex-direction: column; align-items: center; gap: 24px; width: 148px; flex: none; padding-bottom: 120px; position: relative; }
.home-hero__stats::before {
  content: ""; position: absolute; top: 72px; bottom: 160px; inset-inline-start: 50%; width: 2px;
  background: var(--secondary-200); transform: translateX(-50%);
}
[dir="rtl"] .home-hero__stats::before { transform: translateX(50%); }
.stat-col { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; width: 100%; position: relative; z-index: 1; background: transparent; }
.stat-col__icon { width: 64px; height: 64px; }
.stat-col strong { font-size: 32px; line-height: 40px; font-weight: 700; color: var(--secondary-500); }
.stat-col span { font-size: 18px; line-height: 28px; color: var(--color-text); }
.stat-col__dot { width: 24px; height: 24px; border-radius: 50%; background: var(--secondary-500); opacity: .45; position: relative; z-index: 1; }
.home-hero__photo { width: min(591px, 42vw); border-radius: 80px; overflow: hidden; align-self: end; }
.home-hero__photo img { width: 100%; height: auto; display: block; }
.google-rating { display: flex; align-items: flex-start; gap: 16px; }
.google-rating__logo { width: 40px; height: 40px; flex: none; }
.google-rating__score { display: flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; font-weight: 700; color: var(--gray-800); }
.google-rating__stars { display: inline-flex; gap: 4px; color: #F6B80B; }
.google-rating__stars .icon { width: 16px; height: 16px; }
.google-rating .t-c4 { color: var(--gray-500); text-align: start; }
.avail-chip {
  display: inline-flex; align-items: center; gap: 16px; background: var(--color-white);
  border-radius: var(--radius-pill); box-shadow: var(--shadow-1); padding: 16px 24px;
  font-size: 16px; line-height: 24px; font-weight: 600; color: var(--color-text);
}
.avail-chip__dot { width: 12px; height: 12px; border-radius: 50%; background: var(--green-500); flex: none; }
@media (max-width: 1023px) {
  .home-hero__grid { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: 32px; }
  .home-hero__text { padding-block: 32px 0; max-width: none; }
  .home-hero__visual { flex-direction: column-reverse; align-items: center; width: 100%; }
  .home-hero__photo { width: min(100%, 420px); border-radius: 48px; }
  .home-hero__stats { flex-direction: row; width: 100%; justify-content: center; padding-bottom: 32px; gap: 16px; }
  .stat-col { width: auto; min-width: 140px; }
  .stat-col__dot { display: none; }
}
@media (max-width: 599px) {
  .home-hero { border-end-end-radius: 48px; }
  .home-hero__stats { flex-wrap: wrap; }
  .stat-col strong { font-size: 24px; line-height: 32px; }
  .stat-col span { font-size: 14px; line-height: 22px; }
  .home-hero__photo { border-radius: 40px; }
}

/* ---------- Offers promo banner (Developer 279:115) ---------- */
.offers-banner { padding-block: 40px; }
.offers-banner__card {
  position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between;
  gap: 32px; padding: 40px; border-radius: 24px; color: var(--color-white);
  background: linear-gradient(90deg, var(--primary-500) 0%, var(--secondary-500) 100%);
}
[dir="rtl"] .offers-banner__card { background: linear-gradient(270deg, var(--primary-500) 0%, var(--secondary-500) 100%); }
.offers-banner__bg { position: absolute; inset: 0; opacity: .3; pointer-events: none; }
.offers-banner__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.offers-banner__text { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.offers-banner__card .btn { position: relative; flex: none; }
@media (max-width: 767px) {
  .offers-banner { padding-block: 24px; }
  .offers-banner__card { flex-direction: column; align-items: flex-start; padding: 28px 24px; }
  .offers-banner__card .btn { align-self: stretch; text-align: center; }
}

/* ---------- About doctor teaser / split blocks ---------- */
.split__text .btn-row, .split__text > .btn { margin-top: 32px; }
.split__text h2 { margin-top: 8px; }
.split__text .prose { margin-top: 16px; }

/* ---------- Egypt teaser (Home) ---------- */
.egypt { position: relative; color: var(--color-white); overflow: hidden; border-radius: var(--radius-hero); }
.egypt__bg { position: absolute; inset: 0; }
.egypt__bg img { width: 100%; height: 100%; object-fit: cover; }
.egypt__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 25, 39, .88) 0%, rgba(13, 32, 51, .7) 55%, rgba(13, 32, 51, .35) 100%); }
[dir="rtl"] .egypt__bg::after { background: linear-gradient(270deg, rgba(10, 25, 39, .88) 0%, rgba(13, 32, 51, .7) 55%, rgba(13, 32, 51, .35) 100%); }
.egypt__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 40px; align-items: center; padding: 80px 64px; }
.egypt__text .eyebrow { color: var(--green-200); }
.egypt__text h2 { margin-top: 8px; }
.egypt__text .lead { margin-top: 16px; color: rgba(255, 255, 255, .9); max-width: 560px; }
.egypt__note { margin-top: 24px; display: flex; gap: 16px; align-items: center; background: var(--primary-500); border-radius: var(--radius-lg); padding: 20px 24px; max-width: 520px; }
.egypt__note p { color: var(--color-white); }
.egypt__card { position: relative; border-radius: var(--radius-3xl); overflow: hidden; aspect-ratio: 589 / 636; }
.egypt__card img { width: 100%; height: 100%; object-fit: cover; }
.egypt__card blockquote { position: absolute; inset-inline: 24px; bottom: 24px; padding: 20px 24px; border-radius: var(--radius-lg); background: rgba(13, 32, 51, .55); -webkit-backdrop-filter: blur(var(--blur-md)); backdrop-filter: blur(var(--blur-md)); font-size: 18px; line-height: 28px; font-weight: 600; }
.egypt__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.egypt__tags li { padding: 6px 14px; border: 1px solid rgba(255, 255, 255, .45); border-radius: var(--radius-pill); font-size: 14px; line-height: 22px; }
@media (max-width: 1023px) { .egypt__grid { grid-template-columns: minmax(0, 1fr); padding: 48px 24px; } .egypt { border-radius: 40px; } .egypt__card { max-width: 520px; } }

/* ---------- Home contact ---------- */
.contact-block { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 40px; align-items: start; }
.contact-block h2 { margin-bottom: 16px; }
@media (max-width: 1023px) { .contact-block { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Clinic collage ---------- */
.collage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 16px; }
.collage__main { border-radius: var(--radius-lg); overflow: hidden; grid-row: span 2; min-height: 400px; }
.collage__main img, .collage__side img { width: 100%; height: 100%; object-fit: cover; }
.collage__side { border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 388 / 247; }
@media (max-width: 599px) { .collage { grid-template-columns: minmax(0, 1fr); } .collage__main { min-height: 280px; grid-row: auto; } }

/* ---------- Doctor page ---------- */
.doctor-intro { display: grid; grid-template-columns: minmax(0, 528px) minmax(0, 1fr); gap: 40px; align-items: start; }
.doctor-intro__photo { border-radius: var(--radius-4xl); overflow: hidden; aspect-ratio: 528 / 752; }
.doctor-intro__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 30% center; }
.credential { padding-block: 12px; }
.credential + .credential { border-top: 1px solid var(--color-border); }
.credential p { color: var(--color-text-muted); margin-top: 4px; }
@media (max-width: 1023px) { .doctor-intro { grid-template-columns: minmax(0, 1fr); } .doctor-intro__photo { max-width: 460px; aspect-ratio: 4 / 5; } }

/* ---------- Content + sidebar (service, article, offer pages) ---------- */
.with-aside { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 40px; align-items: start; }
.with-aside__aside { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 24px; }
.with-aside__main > * + * { margin-top: 32px; }
@media (max-width: 1023px) { .with-aside { grid-template-columns: minmax(0, 1fr); } .with-aside__aside { position: static; } }
.article-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.article-head .meta { display: flex; align-items: center; gap: 8px; color: var(--color-text-muted); font-size: 14px; }
.light-page { padding-top: 40px; }
.offer-title { color: var(--orange-700); }
.offer-detail { padding: 24px; border: 1px solid transparent; border-radius: var(--radius-lg); transition: border-color .2s var(--ease), background-color .2s var(--ease); }
.offer-detail.is-selected { border-color: var(--secondary-300); background: var(--color-white); }
@media (max-width: 767px) { .offer-detail { padding: 16px; } }

/* ---------- Dental tourism ---------- */
.dt-hero-rating { background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .4); -webkit-backdrop-filter: blur(var(--blur-md)); backdrop-filter: blur(var(--blur-md)); border-radius: var(--radius-lg); padding: 12px 16px; }
.process { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
@media (max-width: 1023px) { .process { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .process { grid-template-columns: minmax(0, 1fr); } }
.center-cta { display: flex; justify-content: center; margin-top: 40px; }

/* ---------- Legal / 404 ---------- */
.narrow { max-width: 820px; margin-inline: auto; }
.notfound { text-align: center; padding-block: 120px; }
.notfound .btn-row { justify-content: center; margin-top: 32px; }
