/* Hero Aesthetics/Injectables: dua bidang, foto statis tanpa mask/blur.
   Selektor terisolasi; tidak dimuat homepage atau halaman peptide. */
#hero.service-hero {
  position:relative; display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);
  width:100%; max-width:1600px; min-height:0; height:auto; margin:0 auto;
  padding:var(--site-nav-height,60px) 0 0; overflow:visible;
  color:#252527; background:#f5f4f1; text-align:left;
}
#hero.service-hero, #hero.service-hero * { box-sizing:border-box; }
#hero .service-hero__inner { display:flex; align-items:center; min-width:0; min-height:clamp(640px,48vw,760px); padding:90px clamp(36px,6vw,96px) 74px; }
#hero .service-hero__copy { width:100%; max-width:520px; }
#hero .service-hero__eyebrow { display:flex; align-items:center; gap:13px; margin:0 0 28px; color:#68615a; font:500 10px/1.6 Arial,Helvetica,sans-serif; letter-spacing:.14em; text-transform:uppercase; }
#hero .service-hero__eyebrow::before { content:''; width:26px; height:1px; flex:none; background:#aa8d59; }
#hero.service-hero h1 { margin:0; padding:0; max-width:none; color:#252527; font:500 calc(clamp(72px,6.8vw,98px) * var(--hero-type-scale,1))/1.02 -apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif; letter-spacing:-.052em; text-transform:none; }
#hero .service-hero__line { display:block; }
#hero .service-hero__line + .service-hero__line { margin-top:2px; }
#hero.service-hero h1 em { display:inline-block; padding:0 .14em .12em 0; font:italic 400 1.14em/.98 Georgia,'Times New Roman',serif; letter-spacing:-.055em; color:#846c42; background:linear-gradient(115deg,#715b39 10%,#9b7d49 55%,#796444 100%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
#hero .service-hero__subtitle { display:block; margin:18px 0 0; color:#79613d; font:500 12px/1.65 Arial,Helvetica,sans-serif; letter-spacing:.015em; }
#hero .service-hero__intro { max-width:365px; margin:26px 0 30px; color:#616166; font:400 16px/1.75 Arial,Helvetica,sans-serif; letter-spacing:normal; }
#hero .service-hero__subtitle + .service-hero__intro { margin-top:16px; }
#hero .service-hero__actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
#hero .service-hero__button { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:14px 21px; border-radius:999px; gap:22px; font:500 12px/1.4 Arial,Helvetica,sans-serif; letter-spacing:normal; text-decoration:none; white-space:nowrap; transition:background .2s,border-color .2s; }
#hero .service-hero__button--primary { background:#272729; border:1px solid #272729; color:#fff; }
#hero .service-hero__button--primary:hover { background:#444447; border-color:#444447; }
#hero .service-hero__button--primary>span:last-child { color:#d2bd97; font-size:18px; line-height:1; }
#hero .service-hero__button--secondary { background:rgba(255,255,255,.28); border:1px solid #cdccd0; color:#45454b; }
#hero .service-hero__button--secondary:hover { background:#fff; border-color:#a7977c; }
#hero .service-hero__button--secondary>span:last-child { color:#887249; font-size:17px; line-height:1; }
#hero .service-hero__button:focus-visible { outline:2px solid #846c42; outline-offset:5px; }
#hero .service-hero__media { position:relative; min-width:0; min-height:0; overflow:hidden; background:#e5e6e8; }
#hero .service-hero__media picture { position:absolute; inset:0; display:block; }
#hero .service-hero__media img { display:block; width:100%; height:100%; max-width:none; object-fit:cover; object-position:var(--hero-photo-position,50% 0%); mask-image:none; -webkit-mask-image:none; filter:none; }
#hero.service-hero--full .service-hero__media { align-self:center; justify-self:center; width:calc(100% - 56px); max-width:560px; aspect-ratio:1122/1402; margin:44px 28px 36px 0; }
#hero.service-hero--foot .service-hero__media { align-self:center; justify-self:center; width:calc(100% - 56px); max-width:560px; aspect-ratio:4/5; margin:44px 28px 36px 0; }
@media(min-width:681px) and (max-width:1024px) {
  #hero.service-hero { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  #hero .service-hero__inner { min-height:610px; padding:88px 36px 64px; }
  #hero .service-hero__media, #hero.service-hero--full .service-hero__media, #hero.service-hero--foot .service-hero__media { width:auto; justify-self:stretch; align-self:center; aspect-ratio:4/5; margin:54px 28px 28px 0; }
  #hero.service-hero h1 { font-size:calc(clamp(50px,6.5vw,68px) * var(--hero-type-scale,1)); }
  #hero .service-hero__eyebrow { font-size:9px; gap:9px; margin-bottom:25px; letter-spacing:.08em; }
  #hero .service-hero__eyebrow::before { width:17px; }
  #hero .service-hero__intro { font-size:14px; margin:22px 0 26px; }
  #hero .service-hero__button { min-height:48px; padding:12px 18px; gap:17px; }
}
@media(max-width:680px) {
  #hero.service-hero { display:flex; flex-direction:column; padding-top:var(--site-nav-height,56px); }
  #hero .service-hero__inner { display:block; min-height:0; padding:72px 24px 36px; }
  #hero .service-hero__copy { max-width:430px; margin:0 auto; }
  #hero .service-hero__eyebrow { margin:0 0 20px; font-size:9px; letter-spacing:.09em; gap:11px; }
  #hero .service-hero__eyebrow::before { width:20px; }
  #hero.service-hero h1 { font-size:calc(clamp(52px,13.6vw,74px) * var(--hero-type-scale,1)); letter-spacing:-.045em; }
  #hero .service-hero__intro { max-width:360px; margin:18px 0 24px; font-size:14px; line-height:1.7; }
  #hero .service-hero__subtitle { font-size:11px; margin-top:14px; }
  #hero .service-hero__actions { gap:10px; }
  #hero .service-hero__button { min-height:48px; padding:13px 16px; gap:13px; font-size:11px; }
  #hero .service-hero__media, #hero.service-hero--full .service-hero__media, #hero.service-hero--foot .service-hero__media { flex:none; align-self:stretch; width:100%; max-width:none; aspect-ratio:1/1; margin:0; }
  #hero.service-hero--full .service-hero__media, #hero.service-hero--foot .service-hero__media { aspect-ratio:4/5; }
}
@media(max-width:359px) {
  #hero .service-hero__inner { padding-inline:22px; }
  #hero .service-hero__actions { gap:9px; }
  #hero .service-hero__button { padding:12px 13px; gap:8px; font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { #hero .service-hero__button { transition:none; } }
@media(forced-colors:active) { #hero.service-hero h1 em { background:none; -webkit-text-fill-color:currentColor; } }