
/* Hairdresser Antalya V6 – Service Detail Image Readability Hard Fix
   Goal: show full service hero image without cropping the text embedded in the image.
*/

:root{
  --ha-v6-cream:#fbf4ed;
  --ha-v6-paper:#fffaf5;
  --ha-v6-ink:#17110d;
  --ha-v6-muted:#6f655f;
  --ha-v6-gold:#a98567;
  --ha-v6-shadow:0 22px 70px rgba(71,48,35,.14);
}

/* Service detail hero: desktop */
body.page-service_detail .service-detail-hero,
.service-detail-hero{
  overflow:visible !important;
}

body.page-service_detail .service-detail-hero__image,
.service-detail-hero__image{
  position:relative !important;
  overflow:visible !important;
  height:auto !important;
  min-height:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
  background:linear-gradient(135deg, rgba(255,250,245,.96), rgba(245,236,226,.92)) !important;
  border-radius:30px !important;
  box-shadow:var(--ha-v6-shadow) !important;
}

/* Remove decorative border/frames that cross over image text */
body.page-service_detail .service-detail-hero__image::before,
body.page-service_detail .service-detail-hero__image::after,
.service-detail-hero__image::before,
.service-detail-hero__image::after{
  display:none !important;
  content:none !important;
}

/* The actual fix: never crop service images */
body.page-service_detail .service-detail-hero__image img,
.service-detail-hero__image img{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  max-height:680px !important;
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
  border-radius:22px !important;
  box-shadow:0 14px 38px rgba(71,48,35,.10) !important;
  background:var(--ha-v6-paper) !important;
}

/* If previous patches wrapped images or set fixed cover on picture/source */
body.page-service_detail .service-detail-hero__image picture,
.service-detail-hero__image picture{
  display:block !important;
  width:100% !important;
  height:auto !important;
}

/* Keep service detail layout elegant */
@media (min-width: 821px){
  body.page-service_detail .service-detail-hero,
  .service-detail-hero{
    grid-template-columns:minmax(0, .88fr) minmax(440px, 1.12fr) !important;
    gap:44px !important;
    align-items:center !important;
    min-height:auto !important;
    padding:72px 62px !important;
  }

  body.page-service_detail .service-detail-hero__text,
  .service-detail-hero__text{
    padding:0 !important;
  }

  body.page-service_detail .service-detail-hero__text h1,
  .service-detail-hero__text h1{
    font-size:clamp(48px,4.2vw,74px) !important;
    line-height:1.02 !important;
    letter-spacing:-.035em !important;
  }
}

/* Mobile: show full image below the floating top bar, no crop, no text cutting */
@media (max-width: 820px){
  body.page-service_detail .service-detail-hero,
  .service-detail-hero{
    display:flex !important;
    flex-direction:column !important;
    min-height:auto !important;
    padding:112px 16px 36px !important;
    gap:22px !important;
    background:linear-gradient(180deg, var(--ha-v6-cream) 0%, #fff 100%) !important;
  }

  body.page-service_detail .service-detail-hero__image,
  .service-detail-hero__image{
    order:1 !important;
    width:100% !important;
    margin:0 !important;
    padding:10px !important;
    border-radius:24px !important;
    box-shadow:0 16px 40px rgba(71,48,35,.12) !important;
    background:rgba(255,250,245,.96) !important;
  }

  body.page-service_detail .service-detail-hero__image img,
  .service-detail-hero__image img{
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    min-height:0 !important;
    object-fit:contain !important;
    object-position:center center !important;
    border-radius:18px !important;
  }

  body.page-service_detail .service-detail-hero__text,
  .service-detail-hero__text{
    order:2 !important;
    padding:8px 8px 8px !important;
    width:100% !important;
  }

  body.page-service_detail .service-detail-hero__text .eyebrow,
  .service-detail-hero__text .eyebrow{
    font-size:12px !important;
    letter-spacing:.18em !important;
    margin-bottom:12px !important;
  }

  body.page-service_detail .service-detail-hero__text h1,
  .service-detail-hero__text h1{
    font-size:clamp(40px,11vw,58px) !important;
    line-height:1.02 !important;
    margin:8px 0 16px !important;
    letter-spacing:-.035em !important;
  }

  body.page-service_detail .service-detail-hero__text p,
  .service-detail-hero__text p{
    font-size:17px !important;
    line-height:1.68 !important;
    color:var(--ha-v6-muted) !important;
  }

  body.page-service_detail .service-detail-hero__actions,
  .service-detail-hero__actions{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:12px !important;
  }

  body.page-service_detail .service-detail-hero__actions .btn,
  body.page-service_detail .service-detail-hero__actions .outline-btn,
  .service-detail-hero__actions .btn,
  .service-detail-hero__actions .outline-btn{
    width:100% !important;
    min-height:52px !important;
    border-radius:0 !important;
  }
}

/* Extra safety for service images inside gallery/detail sections */
body.page-service_detail .service-gallery img,
.service-gallery img{
  object-fit:cover !important;
  object-position:center center !important;
}

/* Prevent accidental horizontal overflow from earlier image templates */
body.page-service_detail,
body.page-service_detail main,
.service-detail-hero{
  max-width:100vw !important;
}
