/* v1.4.6 — Small visual refinements, shared by public hero and block editor. */
.arslan-module-hero .hero-grid,
.editor-styles-wrapper .arslan-module-hero .hero-grid {
  gap:clamp(28px,2.6vw,44px);
  grid-template-columns:minmax(0,calc(100% - var(--arslan-image-column,53%) - clamp(28px,2.6vw,44px))) minmax(0,var(--arslan-image-column,53%));
  padding-block:clamp(48px,4vw,66px);
}
.arslan-module-hero .hero-copy h1,
.editor-styles-wrapper .arslan-module-hero .hero-copy h1 {
  max-width:560px;
  text-wrap:balance;
  line-height:1.09;
  margin-bottom:18px;
}
.arslan-module-hero .hero-copy .hero-lead,
.editor-styles-wrapper .arslan-module-hero .hero-copy .hero-lead {max-width:540px;line-height:1.6;}
.arslan-module-hero .hero-visual,
.editor-styles-wrapper .arslan-module-hero .hero-visual {
  border-radius:var(--arslan-block-radius,28px);
  isolation:isolate;
  box-shadow:0 20px 52px rgba(30,24,26,.11);
}
.arslan-module-hero .hero-visual .hero-photo,
.editor-styles-wrapper .arslan-module-hero .hero-visual .hero-photo {
  border-radius:var(--arslan-block-radius,28px);
  box-shadow:none;
}
.arslan-module-hero .arslan-hero-benefits,
.editor-styles-wrapper .arslan-module-hero .arslan-hero-benefits {
  margin-top:var(--benefit-top-space,32px);
  gap:var(--benefit-gap,12px);
}
.arslan-module-hero .arslan-hero-benefit strong,
.editor-styles-wrapper .arslan-module-hero .arslan-hero-benefit strong {
  font-size:var(--benefit-title-size,15px);
  line-height:1.4;
}
.arslan-module-hero .arslan-hero-benefit small,
.editor-styles-wrapper .arslan-module-hero .arslan-hero-benefit small {
  font-size:var(--benefit-description-size,12px);
  line-height:1.5;
}
.arslan-module-hero .arslan-hero-benefit .arslan-benefit-symbol,
.editor-styles-wrapper .arslan-module-hero .arslan-hero-benefit .arslan-benefit-symbol {
  flex-shrink:0;
  line-height:1.3;
}
/* A soft visual handoff to the next section, without changing the selected background. */
.arslan-module-hero {border-bottom:1px solid rgba(40,35,35,.035);}
@media(max-width:850px){
  .arslan-module-hero .hero-grid,
  .editor-styles-wrapper .arslan-module-hero .hero-grid {
    grid-template-columns:minmax(0,1fr);
    gap:24px;
    padding-block:38px;
  }
  .arslan-module-hero .hero-copy h1,
  .editor-styles-wrapper .arslan-module-hero .hero-copy h1 {max-width:100%;}
  .arslan-module-hero .hero-visual,
  .editor-styles-wrapper .arslan-module-hero .hero-visual {box-shadow:0 12px 35px rgba(30,24,26,.09);}
}

/* v1.4.7 — Keep a genuine safety gap between headline and image.
   Shared stylesheet is loaded in both the frontend and Gutenberg preview. */
@media (min-width:851px) {
  .arslan-module-hero .hero-grid,
  .editor-styles-wrapper .arslan-module-hero .hero-grid {
    --arslan-safe-gap:clamp(36px,3.2vw,52px);
    column-gap:var(--arslan-safe-gap);
    grid-template-columns:minmax(0,calc(100% - var(--arslan-image-column,53%) - var(--arslan-safe-gap))) minmax(0,var(--arslan-image-column,53%));
  }
  .arslan-module-hero .hero-copy,
  .editor-styles-wrapper .arslan-module-hero .hero-copy {
    min-width:0;max-width:100%;
  }
  .arslan-module-hero .hero-copy h1,
  .editor-styles-wrapper .arslan-module-hero .hero-copy h1 {
    max-width:100%;
    overflow-wrap:break-word;
    font-size:clamp(32px,4cqw,66px);
  }
}
@media (min-width:851px) and (max-width:1150px) {
  .arslan-module-hero .hero-copy h1,
  .editor-styles-wrapper .arslan-module-hero .hero-copy h1 {
    font-size:clamp(30px,3.5vw,49px);
  }
}