/* Sestra Mare v5.9 — home page layout consistency.
   The v5.8 change only constrained Hero; About/Why/FAQ still stretched full bleed.
   This styles rendered homepage sections only, leaves Elementor documents intact.
   Uses the same 1180px frame as the standalone About, Services and Blog pages. */
.smrh-page { --sm-home-frame: 1180px; --sm-home-inset: 48px; }
/* The missed difference: homepage header was full-bleed while inner-page headers
   use a centered content rail. Align logo, menu, contact CTA, and language controls. */
.smrh-page .smrh-header .smrh-wrap.smrh-nav {
  width: min(var(--sm-home-frame), calc(100% - var(--sm-home-inset))) !important;
  max-width: var(--sm-home-frame) !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  grid-template-columns: minmax(190px,245px) minmax(0,1fr) auto !important;
  gap: 20px !important;
}
.smrh-page .smrh-header .smrh-links {gap: clamp(13px,1.5vw,23px) !important; font-size: 13.5px !important;}
.smrh-page .smrh-header .smrh-brand-logo {height: 46px !important; width: auto !important; max-width: 212px !important;}
.smrh-page .smrh-header .smrh-nav-right {gap: 7px !important;}
@media (max-width: 1180px) and (min-width: 901px) {
  .smrh-page .smrh-header .smrh-wrap.smrh-nav {
    grid-template-columns: minmax(165px,190px) minmax(0,1fr) auto !important;
    gap: 12px !important;
  }
  .smrh-page .smrh-header .smrh-links {gap: 12px !important; font-size: 12.5px !important;}
  .smrh-page .smrh-header .smrh-brand-logo {max-width: 175px !important;}
  .smrh-page .smrh-header .smrh-nav-right {gap: 5px !important;}
}
@media (max-width: 900px) {
  .smrh-page .smrh-header .smrh-wrap.smrh-nav {
    width: calc(100% - var(--sm-home-inset)) !important;
    max-width: 760px !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    gap: 10px !important;
    height: 70px !important;
    min-height: 70px !important;
  }
  .smrh-page .smrh-header .smrh-links,
  .smrh-page .smrh-header .smrh-nav-right>.smrh-social-mini,
  .smrh-page .smrh-header .smrh-nav-right>.smrh-btn {display: none !important;}
  .smrh-page .smrh-header .smrh-menu-mobile {display: block !important;}
  .smrh-page .smrh-header .smrh-brand-logo {height: auto !important; max-height: 52px !important; max-width: min(195px,48vw) !important;}
}
@media (max-width: 440px) {
  .smrh-page .smrh-header .smrh-brand-logo {max-height: 48px !important; max-width:min(160px,45vw) !important;}
}
.smrh-page .smrh-hero {
  padding: 58px 0 64px !important;
  background: linear-gradient(180deg,#fff 0%,#f7fafb 100%) !important;
}
.smrh-page .smrh-hero .smrh-wrap.smrh-hero-grid {
  width: min(var(--sm-home-frame), calc(100% - var(--sm-home-inset))) !important;
  max-width: var(--sm-home-frame) !important;
  margin-inline: auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0,1.04fr) minmax(0,1fr) !important;
  gap: 68px !important;
  align-items: center !important;
}
.smrh-page .smrh-hero .smrh-hero-copy {
  min-width: 0 !important; padding: 0 !important;
  text-align: left !important;
}
.smrh-page .smrh-hero h1 {
  font-size: clamp(46px,4.1vw,68px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.03em !important;
  max-width: 580px !important;
}
.smrh-page .smrh-hero .smrh-hero-media {
  width: 100% !important; min-width: 0 !important;
  height: 520px !important; min-height: 0 !important;
  margin: 0 !important; overflow: hidden !important;
  border-radius: 15px !important;
  box-shadow: 0 18px 44px rgba(31,86,116,.075) !important;
}
.smrh-page .smrh-hero .smrh-hero-media img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; object-position: 50% 53% !important;
}
/* Align the first section under the hero too. In v5.8 its image started at x=0. */
.smrh-page .smrh-about { padding: 64px 0 !important; background: #fff !important; }
.smrh-page .smrh-about .smrh-about-grid {
  width: min(var(--sm-home-frame), calc(100% - var(--sm-home-inset))) !important;
  max-width: var(--sm-home-frame) !important;
  margin-inline: auto !important;
  min-height: 0 !important;
  grid-template-columns: minmax(0, .91fr) minmax(0,1.09fr) !important;
  align-items: center !important;
  gap: 60px !important;
}
.smrh-page .smrh-about .smrh-about-photo {
  height: 530px !important; min-height: 0 !important;
  border-radius: 15px !important; overflow: hidden !important;
}
.smrh-page .smrh-about .smrh-about-photo img {object-fit: cover !important;object-position: 50% 33% !important;}
.smrh-page .smrh-about .smrh-about-copy {
  min-width: 0 !important; height: auto !important;
  padding: 34px 0 !important;
  background: transparent !important;
}
.smrh-page .smrh-about .smrh-about-main h2 {font-size: clamp(41px,4vw,62px) !important;}
/* Other photographic split sections keep their colors but use a common central rail. */
.smrh-page .smrh-why {
  width: min(var(--sm-home-frame), calc(100% - var(--sm-home-inset))) !important;
  max-width: var(--sm-home-frame) !important;
  margin: 0 auto 58px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  border-radius: 15px !important;
  overflow: hidden !important;
}
.smrh-page .smrh-why .smrh-why-copy {padding: 55px 52px !important;}
.smrh-page .smrh-why .smrh-why-media {min-height: 465px !important;}
.smrh-page .smrh-faq { padding: 62px 0 !important; background:#f7fafb !important; }
.smrh-page .smrh-faq .smrh-faq-grid {
  width: min(var(--sm-home-frame), calc(100% - var(--sm-home-inset))) !important;
  max-width: var(--sm-home-frame) !important;
  margin-inline: auto !important;
  min-height: 0 !important;
  grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr) !important;
  gap: 58px !important;
}
.smrh-page .smrh-faq .smrh-faq-media {
  height: 500px !important; min-height: 0 !important;
  top: 112px !important; border-radius: 15px !important;
}
.smrh-page .smrh-faq .smrh-faq-copy {padding: 16px 0 !important;}
@media (max-width: 1100px) and (min-width: 901px) {
  .smrh-page .smrh-hero .smrh-wrap.smrh-hero-grid {gap: 38px !important;}
  .smrh-page .smrh-hero h1 {font-size:clamp(42px,4.6vw,55px) !important;}
  .smrh-page .smrh-hero .smrh-hero-media {height: 490px !important;}
  .smrh-page .smrh-about .smrh-about-grid {gap: 34px !important;}
  .smrh-page .smrh-about .smrh-about-photo {height: 490px !important;}
  .smrh-page .smrh-about .smrh-about-main h2 {font-size: 46px !important;}
  .smrh-page .smrh-why .smrh-why-copy {padding: 42px !important;}
  .smrh-page .smrh-faq .smrh-faq-grid {gap: 36px !important;}
}
@media (max-width: 900px) {
  .smrh-page {--sm-home-inset: 36px;}
  .smrh-page .smrh-hero {padding: 45px 0 54px !important;}
  .smrh-page .smrh-hero .smrh-wrap.smrh-hero-grid,
  .smrh-page .smrh-about .smrh-about-grid,
  .smrh-page .smrh-why,
  .smrh-page .smrh-faq .smrh-faq-grid {
    width: min(760px,calc(100% - var(--sm-home-inset))) !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 28px !important;
  }
  .smrh-page .smrh-hero .smrh-hero-media {height: 435px !important;}
  .smrh-page .smrh-about {padding: 46px 0 !important;}
  .smrh-page .smrh-about .smrh-about-photo {height: 440px !important;}
  .smrh-page .smrh-about .smrh-about-copy {padding: 8px 0 0 !important;}
  .smrh-page .smrh-why {margin-bottom: 28px !important;}
  .smrh-page .smrh-why .smrh-why-copy {padding: 42px 34px !important;}
  .smrh-page .smrh-why .smrh-why-media {min-height: 350px !important;}
  .smrh-page .smrh-faq {padding: 42px 0 !important;}
  .smrh-page .smrh-faq .smrh-faq-grid {gap: 25px !important;}
  .smrh-page .smrh-faq .smrh-faq-media {height: 360px !important;position:relative !important;top:auto !important;}
  .smrh-page .smrh-faq .smrh-faq-copy {padding: 0 !important;}
}
@media (max-width: 600px) {
  .smrh-page {--sm-home-inset: 32px;}
  .smrh-page .smrh-hero {padding: 34px 0 42px !important;}
  .smrh-page .smrh-hero .smrh-wrap.smrh-hero-grid {gap: 26px !important;}
  .smrh-page .smrh-hero .smrh-hero-copy {padding: 0 !important;}
  .smrh-page .smrh-hero h1 {font-size: clamp(34px,9vw,41px) !important;}
  .smrh-page .smrh-hero .smrh-hero-media {height: 315px !important;border-radius: 12px !important;}
  .smrh-page .smrh-hero .smrh-hero-media img {object-position: 50% 56% !important;}
  .smrh-page .smrh-about {padding: 35px 0 45px !important;}
  .smrh-page .smrh-about .smrh-about-photo {height: 340px !important;border-radius: 12px !important;}
  .smrh-page .smrh-about .smrh-about-copy {padding: 0 !important;}
  .smrh-page .smrh-about .smrh-about-main h2 {font-size: clamp(34px,9vw,44px) !important;}
  .smrh-page .smrh-why {border-radius: 12px !important;margin-bottom:20px !important;}
  .smrh-page .smrh-why .smrh-why-copy {padding: 31px 24px !important;}
  .smrh-page .smrh-why .smrh-why-media {min-height: 295px !important;}
  .smrh-page .smrh-faq {padding: 35px 0 !important;}
  .smrh-page .smrh-faq .smrh-faq-media {height: 300px !important;border-radius: 12px !important;}
}
@media (max-width: 360px) {
  .smrh-page .smrh-hero .smrh-hero-media {height: 285px !important;}
  .smrh-page .smrh-about .smrh-about-photo {height: 310px !important;}
}