.elementor-1070 .elementor-element.elementor-element-b1a0b08{--display:flex;--min-height:600px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:0.5;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-1070 .elementor-element.elementor-element-b1a0b08::before, .elementor-1070 .elementor-element.elementor-element-b1a0b08 > .elementor-background-video-container::before, .elementor-1070 .elementor-element.elementor-element-b1a0b08 > .e-con-inner > .elementor-background-video-container::before, .elementor-1070 .elementor-element.elementor-element-b1a0b08 > .elementor-background-slideshow::before, .elementor-1070 .elementor-element.elementor-element-b1a0b08 > .e-con-inner > .elementor-background-slideshow::before, .elementor-1070 .elementor-element.elementor-element-b1a0b08 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1070 .elementor-element.elementor-element-da26a7a{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1070 .elementor-element.elementor-element-da26a7a .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:90px;font-weight:500;color:#D4AF37;}.elementor-1070 .elementor-element.elementor-element-7666f4b{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1070 .elementor-element.elementor-element-7666f4b .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-weight:600;color:#B5B5B5;}.elementor-1070 .elementor-element.elementor-element-38f4fb4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-11px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1070 .elementor-element.elementor-element-20a5d75{--display:flex;}.elementor-1070 .elementor-element.elementor-element-20a5d75:not(.elementor-motion-effects-element-type-background), .elementor-1070 .elementor-element.elementor-element-20a5d75 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-1070 .elementor-element.elementor-element-b1a0b08{--min-height:650px;}.elementor-1070 .elementor-element.elementor-element-da26a7a{margin:-150px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1070 .elementor-element.elementor-element-da26a7a .elementor-heading-title{font-size:75px;}}/* Start custom CSS for container, class: .elementor-element-b1a0b08 *//* =====================================================================
   HERO SECTION – PORTOFOLIO PHOTOGRAPHY  (v1.1)
   Tempel di: Container Utama > Advanced > Custom CSS

   Class yang harus dipasang (Advanced > CSS Classes):
   - Container utama ............ ars-hero
   - Heading 1 (judul besar) .... ars-hero__title
   - Heading 2 (sub judul) ...... ars-hero__subtitle
   - Heading 3 (tagline kecil) .. ars-hero__tagline
   - Container social ........... ars-hero__social
   - Widget Social Icons ........ ars-hero__icons
   - (opsional) tambah "ars-gold-gradient" di judul untuk efek emas gradasi

   CATATAN: semua .elementor-1070 .elementor-element.elementor-element-b1a0b08 dibungkus :where() supaya specificity rendah.
   Artinya pengaturan dari panel Elementor (Style tab) TETAP MENANG,
   jadi Anda bebas ubah font, ukuran, warna, dll dari panel atau dari
   variabel di bagian 1 di bawah ini.

   v1.1: warna gold #D4AF37, social icons horizontal (tidur ke samping),
         animasi masuk berurutan + efek hover isi emas.
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. PENGATURAN UTAMA – ubah nilai di sini
   --------------------------------------------------------------------- */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08).e-con {
  /* Layout */
  --ars-hero-height: 100svh;
  --ars-content-max: 1100px;
  --ars-pad-x: 48px;
  --ars-pad-y: 120px;

  /* Overlay gelap di atas foto/video background */
  --ars-overlay: linear-gradient(180deg,
                   rgba(10, 8, 6, .55) 0%,
                   rgba(10, 8, 6, .30) 45%,
                   rgba(10, 8, 6, .80) 100%);
  --ars-vignette: radial-gradient(ellipse at center,
                   rgba(0, 0, 0, 0) 45%,
                   rgba(0, 0, 0, .55) 100%);

  /* Warna */
  --ars-gold: #D4AF37;                       /* v1.1 */
  --ars-gold-light: #F0D98C;                 /* v1.1 */
  --ars-gold-dark: #A8862A;                  /* v1.1 */
  --ars-gold-rgb: 212, 175, 55;              /* v1.1 – untuk efek glow transparan */
  --ars-white: #ffffff;
  --ars-muted: rgba(255, 255, 255, .72);

  /* Font (pilih font yang sama di panel Elementor agar Google Font ter-load) */
  --ars-font-display: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --ars-font-sans: "Jost", "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --ars-font-serif-small: "Cormorant Garamond", Georgia, serif;

  /* Judul besar (Heading 1) */
  --ars-title-size: clamp(64px, 9vw, 150px);
  --ars-title-weight: 600;
  --ars-title-color: var(--ars-gold);
  --ars-title-lh: .95;
  --ars-title-ls: -0.01em;
  --ars-title-gap: 28px;

  /* Sub judul (Heading 2) */
  --ars-subtitle-size: clamp(20px, 2.6vw, 44px);
  --ars-subtitle-weight: 300;
  --ars-subtitle-color: var(--ars-white);
  --ars-subtitle-ls: .42em;
  --ars-subtitle-gap: 26px;

  /* Tagline kecil (Heading 3) */
  --ars-tagline-size: 14px;
  --ars-tagline-weight: 500;
  --ars-tagline-color: var(--ars-muted);
  --ars-tagline-ls: .5em;
  --ars-tagline-line: 40px;          /* panjang garis kiri-kanan tagline, 0 = hilang */

  /* Social icons (pojok kiri bawah, horizontal) */                        /* v1.1 */
  --ars-social-left: 48px;
  --ars-social-bottom: 48px;
  --ars-social-gap: 18px;            /* v1.1 – jarak label, garis, dan icon */
  --ars-social-line: 60px;           /* v1.1 – garis horizontal sebelum icon, 0 = hilang */
  --ars-social-line-color: var(--ars-gold);                                 /* v1.1 */
  --ars-social-label: "Follow";      /* v1.1 – teks sebelum garis, isi "" untuk hilangkan */
  --ars-social-label-font: var(--ars-font-display);                         /* v1.1 */
  --ars-social-label-size: 17px;     /* v1.1 */
  --ars-social-label-weight: 500;    /* v1.1 */
  --ars-social-label-style: italic;  /* v1.1 – normal / italic */
  --ars-social-label-ls: .04em;      /* v1.1 */
  --ars-social-label-color: var(--ars-muted);                               /* v1.1 */

  --ars-icon-box: 44px;
  --ars-icon-size: 16px;
  --ars-icon-gap: 12px;
  --ars-icon-radius: 50%;
  --ars-icon-border-width: 1px;      /* v1.1 */
  --ars-icon-bg: rgba(255, 255, 255, .06);
  --ars-icon-border: rgba(255, 255, 255, .28);
  --ars-icon-color: var(--ars-white);
  --ars-icon-blur: 6px;              /* v1.1 – efek kaca, 0px = matikan */

  /* Hover social icons */                                                  /* v1.1 */
  --ars-icon-bg-hover: var(--ars-gold);
  --ars-icon-border-hover: var(--ars-gold);
  --ars-icon-color-hover: #14100b;
  --ars-icon-fill-from: translateY(101%);   /* v1.1 – arah isi emas: translateY(101%) = dari bawah, scale(0) = dari tengah, translateX(-101%) = dari kiri */
  --ars-icon-hover-lift: -4px;              /* v1.1 – naik saat hover, 0px = diam */
  --ars-icon-hover-icon-scale: 1.12;        /* v1.1 – icon membesar saat hover */
  --ars-icon-hover-rotate: 0deg;            /* v1.1 – misal 8deg untuk sedikit miring */
  --ars-icon-glow: 0 10px 28px rgba(var(--ars-gold-rgb), .35);              /* v1.1 */
  --ars-icon-ring: 0 0 0 5px rgba(var(--ars-gold-rgb), .15);                /* v1.1 – cincin tipis saat hover */
  --ars-icon-speed: .45s;                   /* v1.1 – kecepatan transisi hover */
  --ars-icon-ease: cubic-bezier(.22, .8, .25, 1);                           /* v1.1 */

  /* Animasi masuk (0s = matikan) */
  --ars-anim-duration: 1.2s;
  --ars-social-delay: .7s;           /* v1.1 – jeda sebelum social muncul */
  --ars-icon-stagger: .12s;          /* v1.1 – jeda antar icon muncul berurutan */
  --ars-icon-in-duration: .8s;       /* v1.1 */

  /* ---- Pengaturan container (pakai variabel bawaan Elementor) ---- */
  --min-height: var(--ars-hero-height);
  --flex-direction: column;
  --justify-content: center;
  --align-items: center;
  --gap: 0px;
  --row-gap: 0px;
  --padding-top: var(--ars-pad-y);
  --padding-bottom: var(--ars-pad-y);
  --padding-left: var(--ars-pad-x);
  --padding-right: var(--ars-pad-x);

  position: relative;
  overflow: hidden;
  isolation: isolate;
  text-align: center;
  background-color: #0d0a08;
  background-size: cover;
  background-position: center;
}


/* ---------------------------------------------------------------------
   2. OVERLAY & LAPISAN
   (Jika pakai overlay dari panel Elementor, set --ars-overlay: none)
   --------------------------------------------------------------------- */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08).e-con::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: var(--ars-vignette), var(--ars-overlay);
}

/* Konten di atas overlay (support container Boxed & Full Width) */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) > .elementor-element,
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) > .e-con-inner > .elementor-element {
  position: relative;
  z-index: 2;
}

/* Agar social icons menempel ke pojok container utama, bukan ke inner */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) > .e-con-inner {
  position: static;
  max-width: var(--ars-content-max);
}


/* ---------------------------------------------------------------------
   3. JUDUL BESAR – .ars-hero__title
   --------------------------------------------------------------------- */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__title.elementor-widget {
  width: 100%;
  margin-block-end: 0;
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__title.elementor-widget-heading .elementor-heading-title {
  margin: 0 0 var(--ars-title-gap);
  font-family: var(--ars-font-display);
  font-size: var(--ars-title-size);
  font-weight: var(--ars-title-weight);
  line-height: var(--ars-title-lh);
  letter-spacing: var(--ars-title-ls);
  color: var(--ars-title-color);
  text-shadow: 0 6px 40px rgba(0, 0, 0, .35);
  animation: arsHeroFadeUp var(--ars-anim-duration) cubic-bezier(.2, .7, .2, 1) both;
}

/* Opsional: tambahkan class "ars-gold-gradient" pada widget judul */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__title.ars-gold-gradient .elementor-heading-title {
  background: linear-gradient(180deg,
              var(--ars-gold-light) 0%,
              var(--ars-gold) 55%,
              var(--ars-gold-dark) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter: drop-shadow(0 6px 30px rgba(0, 0, 0, .35));
}


/* ---------------------------------------------------------------------
   4. SUB JUDUL – .ars-hero__subtitle
   --------------------------------------------------------------------- */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__subtitle.elementor-widget {
  width: 100%;
  margin-block-end: 0;
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__subtitle.elementor-widget-heading .elementor-heading-title {
  margin: 0 0 var(--ars-subtitle-gap);
  /* padding-left = letter-spacing agar teks tetap presisi di tengah */
  padding-left: var(--ars-subtitle-ls);
  font-family: var(--ars-font-sans);
  font-size: var(--ars-subtitle-size);
  font-weight: var(--ars-subtitle-weight);
  line-height: 1.2;
  letter-spacing: var(--ars-subtitle-ls);
  text-transform: uppercase;
  color: var(--ars-subtitle-color);
  animation: arsHeroFadeUp var(--ars-anim-duration) cubic-bezier(.2, .7, .2, 1) .2s both;
}


/* ---------------------------------------------------------------------
   5. TAGLINE KECIL – .ars-hero__tagline
   --------------------------------------------------------------------- */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__tagline.elementor-widget {
  width: 100%;
  margin-block-end: 0;
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__tagline.elementor-widget-heading .elementor-heading-title {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin: 0;
  font-family: var(--ars-font-serif-small);
  font-size: var(--ars-tagline-size);
  font-weight: var(--ars-tagline-weight);
  line-height: 1.4;
  letter-spacing: var(--ars-tagline-ls);
  text-transform: uppercase;
  color: var(--ars-tagline-color);
  animation: arsHeroFadeUp var(--ars-anim-duration) cubic-bezier(.2, .7, .2, 1) .4s both;
}

/* Garis emas tipis kiri & kanan tagline */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__tagline.elementor-widget-heading .elementor-heading-title::before,
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__tagline.elementor-widget-heading .elementor-heading-title::after {
  content: "";
  flex: none;
  width: var(--ars-tagline-line);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--ars-gold));
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__tagline.elementor-widget-heading .elementor-heading-title::after {
  background: linear-gradient(90deg, var(--ars-gold), transparent);
  /* kompensasi letter-spacing di huruf terakhir */
  margin-left: calc(var(--ars-tagline-ls) * -1);
}


/* ---------------------------------------------------------------------
   6. CONTAINER SOCIAL – .ars-hero__social (pojok kiri bawah, horizontal)
   Urutan tampilan: [Follow] ——— (icon) (icon) (icon)                v1.1
   --------------------------------------------------------------------- */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__social.e-con {
  --width: auto;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
  --flex-direction: row;                     /* v1.1 – tidur ke samping */
  --align-items: center;                     /* v1.1 */
  --justify-content: flex-start;             /* v1.1 */
  --flex-wrap: nowrap;                       /* v1.1 */
  --gap: var(--ars-social-gap);              /* v1.1 */
  --row-gap: var(--ars-social-gap);          /* v1.1 */
  --column-gap: var(--ars-social-gap);       /* v1.1 */

  position: absolute;
  left: var(--ars-social-left);
  bottom: var(--ars-social-bottom);
  z-index: 3;
  width: auto;
  margin: 0;
  border: 0;
  background: transparent;
}

/* Label "Follow" di paling kiri */                                          /* v1.1 */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__social.e-con::after {
  content: var(--ars-social-label);
  order: -2;
  font-family: var(--ars-social-label-font);
  font-size: var(--ars-social-label-size);
  font-weight: var(--ars-social-label-weight);
  font-style: var(--ars-social-label-style);
  letter-spacing: var(--ars-social-label-ls);
  line-height: 1;
  color: var(--ars-social-label-color);
  white-space: nowrap;
  animation: arsHeroFade var(--ars-anim-duration) ease var(--ars-social-delay) both;
}

/* Garis emas horizontal, tergambar dari kiri ke kanan */                   /* v1.1 */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__social.e-con::before {
  content: "";
  order: -1;
  display: block;
  flex: none;
  width: var(--ars-social-line);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--ars-social-line-color));
  transform-origin: left center;
  animation: arsLineDraw var(--ars-icon-in-duration) var(--ars-icon-ease) var(--ars-social-delay) both;
}


/* ---------------------------------------------------------------------
   7. SOCIAL ICONS – .ars-hero__icons
   --------------------------------------------------------------------- */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons.elementor-widget {
  width: auto;
  margin-block-end: 0;
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icons-wrapper {
  display: flex;
  flex-direction: row;                       /* v1.1 */
  flex-wrap: nowrap;                         /* v1.1 */
  align-items: center;
  gap: var(--ars-icon-gap);
  font-size: 0;
  line-height: 1;
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons.elementor-widget-social-icons .elementor-grid-item {
  margin: 0;
  /* v1.1 – animasi masuk berurutan satu per satu */
  animation: arsIconIn var(--ars-icon-in-duration) var(--ars-icon-ease)
             calc(var(--ars-social-delay) + .25s + var(--ars-i, 0) * var(--ars-icon-stagger)) both;
}

/* v1.1 – nomor urut tiap icon untuk jeda animasi */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(1) { --ars-i: 0; }
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(2) { --ars-i: 1; }
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(3) { --ars-i: 2; }
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(4) { --ars-i: 3; }
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(5) { --ars-i: 4; }
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(6) { --ars-i: 5; }
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(7) { --ars-i: 6; }
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item:nth-child(8) { --ars-i: 7; }

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon {
  position: relative;                        /* v1.1 */
  overflow: hidden;                          /* v1.1 */
  isolation: isolate;                        /* v1.1 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ars-icon-box);
  height: var(--ars-icon-box);
  padding: 0;
  border: var(--ars-icon-border-width) solid var(--ars-icon-border);        /* v1.1 */
  border-radius: var(--ars-icon-radius);
  background-color: var(--ars-icon-bg);
  -webkit-backdrop-filter: blur(var(--ars-icon-blur));                      /* v1.1 */
  backdrop-filter: blur(var(--ars-icon-blur));                              /* v1.1 */
  transition: border-color var(--ars-icon-speed) var(--ars-icon-ease),
              transform var(--ars-icon-speed) var(--ars-icon-ease),
              box-shadow var(--ars-icon-speed) var(--ars-icon-ease);        /* v1.1 */
}

/* v1.1 – lapisan emas yang mengisi icon saat hover */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: var(--ars-icon-bg-hover);
  transform: var(--ars-icon-fill-from);
  transition: transform var(--ars-icon-speed) var(--ars-icon-ease);
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon i {
  position: relative;                        /* v1.1 */
  font-size: var(--ars-icon-size);
  color: var(--ars-icon-color);
  transition: color var(--ars-icon-speed) var(--ars-icon-ease),
              transform var(--ars-icon-speed) var(--ars-icon-ease);         /* v1.1 */
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon svg {
  position: relative;                        /* v1.1 */
  width: var(--ars-icon-size);
  height: var(--ars-icon-size);
  fill: var(--ars-icon-color);
  transition: fill var(--ars-icon-speed) var(--ars-icon-ease),
              transform var(--ars-icon-speed) var(--ars-icon-ease);         /* v1.1 */
}

/* Hover & fokus keyboard */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:hover,
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:focus-visible {
  border-color: var(--ars-icon-border-hover);
  transform: translateY(var(--ars-icon-hover-lift));                        /* v1.1 */
  box-shadow: var(--ars-icon-ring), var(--ars-icon-glow);                   /* v1.1 */
}

/* v1.1 – isi emas masuk */
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:hover::before,
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:focus-visible::before {
  transform: none;
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:hover i,
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:focus-visible i {
  color: var(--ars-icon-color-hover);
  transform: scale(var(--ars-icon-hover-icon-scale)) rotate(var(--ars-icon-hover-rotate));   /* v1.1 */
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:hover svg,
:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:focus-visible svg {
  fill: var(--ars-icon-color-hover);
  transform: scale(var(--ars-icon-hover-icon-scale)) rotate(var(--ars-icon-hover-rotate));   /* v1.1 */
}

/* v1.1 – icon lain sedikit meredup saat salah satu di-hover */
@media (hover: hover) {
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icons-wrapper:hover .elementor-grid-item {
    opacity: .55;
    transition: opacity var(--ars-icon-speed) var(--ars-icon-ease);
  }

  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icons-wrapper:hover .elementor-grid-item:hover {
    opacity: 1;
  }
}

:where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon:focus-visible {
  outline: 2px solid var(--ars-gold-light);
  outline-offset: 3px;
}


/* ---------------------------------------------------------------------
   8. ANIMASI
   --------------------------------------------------------------------- */
@keyframes arsHeroFadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes arsHeroFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* v1.1 – garis tergambar dari kiri */
@keyframes arsLineDraw {
  from { transform: scaleX(0); opacity: 0; }
  to   { transform: scaleX(1); opacity: 1; }
}

/* v1.1 – icon muncul dari kiri dengan sedikit membesar */
@keyframes arsIconIn {
  from { opacity: 0; transform: translateX(-16px) scale(.7); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .elementor-heading-title,
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__social.e-con::before,
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__social.e-con::after,
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-grid-item {
    animation: none;                         /* v1.1 */
  }

  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon,
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__icons .elementor-social-icon::before {
    transition: none;                        /* v1.1 */
  }
}


/* ---------------------------------------------------------------------
   9. TABLET (≤ 1024px)
   --------------------------------------------------------------------- */
@media (max-width: 1024px) {
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08).e-con {
    --ars-pad-x: 32px;
    --ars-pad-y: 100px;
    --ars-title-size: clamp(56px, 11vw, 110px);
    --ars-title-gap: 22px;
    --ars-subtitle-size: clamp(18px, 3.2vw, 30px);
    --ars-subtitle-ls: .35em;
    --ars-subtitle-gap: 22px;
    --ars-tagline-size: 13px;
    --ars-tagline-ls: .42em;
    --ars-social-left: 32px;
    --ars-social-bottom: 32px;
    --ars-social-gap: 14px;                  /* v1.1 */
    --ars-social-line: 44px;                 /* v1.1 */
    --ars-social-label-size: 16px;           /* v1.1 */
    --ars-icon-box: 40px;
    --ars-icon-size: 15px;
  }
}


/* ---------------------------------------------------------------------
   10. MOBILE (≤ 767px)
   Social icons tetap di kiri bawah dan horizontal, ukuran diperkecil.
   --------------------------------------------------------------------- */
@media (max-width: 767px) {
  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08).e-con {
    --ars-pad-x: 22px;
    --ars-pad-y: 90px;
    --ars-title-size: clamp(46px, 15vw, 72px);
    --ars-title-gap: 18px;
    --ars-subtitle-size: clamp(14px, 4.4vw, 20px);
    --ars-subtitle-ls: .3em;
    --ars-subtitle-gap: 18px;
    --ars-tagline-size: 11px;
    --ars-tagline-ls: .32em;
    --ars-tagline-line: 22px;
    --ars-social-left: 22px;
    --ars-social-bottom: 24px;
    --ars-social-gap: 10px;                  /* v1.1 */
    --ars-social-line: 28px;                 /* v1.1 */
    --ars-social-label-size: 15px;           /* v1.1 */
    --ars-icon-box: 38px;
    --ars-icon-size: 14px;
    --ars-icon-gap: 10px;
  }

  :where(.elementor-1070 .elementor-element.elementor-element-b1a0b08) .ars-hero__tagline.elementor-widget-heading .elementor-heading-title {
    gap: 12px;
  }
}/* End custom CSS */