.elementor-53 .elementor-element.elementor-element-7d7491e{--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-53 .elementor-element.elementor-element-7d7491e:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-7d7491e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;background-image:url("https://ubuddigitalcreative.artsyanaid.com/wp-content/uploads/2026/09/just-married-stylish-happy-bride-and-groom-showing-hands-with-wedding-rings-e1612163516694.jpeg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-53 .elementor-element.elementor-element-7d7491e::before, .elementor-53 .elementor-element.elementor-element-7d7491e > .elementor-background-video-container::before, .elementor-53 .elementor-element.elementor-element-7d7491e > .e-con-inner > .elementor-background-video-container::before, .elementor-53 .elementor-element.elementor-element-7d7491e > .elementor-background-slideshow::before, .elementor-53 .elementor-element.elementor-element-7d7491e > .e-con-inner > .elementor-background-slideshow::before, .elementor-53 .elementor-element.elementor-element-7d7491e > .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-53 .elementor-element.elementor-element-edda45f{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-53 .elementor-element.elementor-element-edda45f .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:90px;font-weight:500;color:#D4AF37;}.elementor-53 .elementor-element.elementor-element-c7e674c{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-53 .elementor-element.elementor-element-c7e674c .elementor-heading-title{font-family:"Roboto Slab", Sans-serif;font-weight:600;color:#B5B5B5;}.elementor-53 .elementor-element.elementor-element-531b73a{--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:-40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-53 .elementor-element.elementor-element-0973897{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;}.elementor-53 .elementor-element.elementor-element-ba9d516 .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:50px;font-weight:500;color:var( --e-global-color-9aa40da );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-53 .elementor-element.elementor-element-6a0d97a{font-family:"Roboto Slab", Sans-serif;font-size:16px;font-weight:400;color:#FFFFFF;}.elementor-53 .elementor-element.elementor-element-f75dae4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-53 .elementor-element.elementor-element-976c277{--display:flex;--min-height:500px;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-53 .elementor-element.elementor-element-976c277:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-976c277 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ubuddigitalcreative.artsyanaid.com/wp-content/uploads/2026/09/images-6.jpeg");}.elementor-53 .elementor-element.elementor-element-48317e9 .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:30px;font-weight:500;color:var( --e-global-color-9aa40da );}.elementor-53 .elementor-element.elementor-element-75cb11f{font-family:"Roboto Slab", Sans-serif;font-size:15px;font-weight:400;color:#FFFFFF;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-53 .elementor-element.elementor-element-f7c8e60{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-53 .elementor-element.elementor-element-f7c8e60.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-53 .elementor-element.elementor-element-9c5f13a{--display:flex;--min-height:500px;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-53 .elementor-element.elementor-element-9c5f13a:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-9c5f13a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ubuddigitalcreative.artsyanaid.com/wp-content/uploads/2026/09/images-6.jpeg");}.elementor-53 .elementor-element.elementor-element-a345ff7 .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:30px;font-weight:500;color:var( --e-global-color-9aa40da );}.elementor-53 .elementor-element.elementor-element-356721f{font-family:"Roboto Slab", Sans-serif;font-size:15px;font-weight:400;color:#FFFFFF;}.elementor-53 .elementor-element.elementor-element-8664d08{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-53 .elementor-element.elementor-element-8664d08.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-53 .elementor-element.elementor-element-63ae69a{--display:flex;--min-height:500px;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-53 .elementor-element.elementor-element-63ae69a:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-63ae69a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ubuddigitalcreative.artsyanaid.com/wp-content/uploads/2026/09/images-6.jpeg");}.elementor-53 .elementor-element.elementor-element-211ed28 .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:30px;font-weight:500;color:var( --e-global-color-9aa40da );}.elementor-53 .elementor-element.elementor-element-28cecb9{font-family:"Roboto Slab", Sans-serif;font-size:15px;font-weight:400;color:#FFFFFF;}.elementor-53 .elementor-element.elementor-element-c3ff13d{width:var( --container-widget-width, 88% );max-width:88%;--container-widget-width:88%;--container-widget-flex-grow:0;}.elementor-53 .elementor-element.elementor-element-c3ff13d.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-53 .elementor-element.elementor-element-6e14003{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-53 .elementor-element.elementor-element-1ae9f28{--display:flex;--min-height:500px;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-53 .elementor-element.elementor-element-1ae9f28:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-1ae9f28 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ubuddigitalcreative.artsyanaid.com/wp-content/uploads/2026/09/images-6.jpeg");}.elementor-53 .elementor-element.elementor-element-7f77ed2 .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:30px;font-weight:500;color:var( --e-global-color-9aa40da );}.elementor-53 .elementor-element.elementor-element-1caa2dc{font-family:"Roboto Slab", Sans-serif;font-size:15px;font-weight:400;color:#FFFFFF;}.elementor-53 .elementor-element.elementor-element-4c33a00{width:var( --container-widget-width, 88% );max-width:88%;--container-widget-width:88%;--container-widget-flex-grow:0;}.elementor-53 .elementor-element.elementor-element-4c33a00.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-53 .elementor-element.elementor-element-b201e91{--display:flex;--min-height:500px;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-53 .elementor-element.elementor-element-b201e91:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-b201e91 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ubuddigitalcreative.artsyanaid.com/wp-content/uploads/2026/09/images-6.jpeg");}.elementor-53 .elementor-element.elementor-element-809f91e .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:30px;font-weight:500;color:var( --e-global-color-9aa40da );}.elementor-53 .elementor-element.elementor-element-49430f0{font-family:"Roboto Slab", Sans-serif;font-size:15px;font-weight:400;color:#FFFFFF;}.elementor-53 .elementor-element.elementor-element-5669a1a{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-53 .elementor-element.elementor-element-5669a1a.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-53 .elementor-element.elementor-element-8fc088e{--display:flex;--min-height:500px;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-53 .elementor-element.elementor-element-8fc088e:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-8fc088e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ubuddigitalcreative.artsyanaid.com/wp-content/uploads/2026/09/images-6.jpeg");}.elementor-53 .elementor-element.elementor-element-05c67e9 .elementor-heading-title{font-family:"DM Serif Display", Sans-serif;font-size:30px;font-weight:500;color:var( --e-global-color-9aa40da );}.elementor-53 .elementor-element.elementor-element-edab851{font-family:"Roboto Slab", Sans-serif;font-size:15px;font-weight:400;color:#FFFFFF;}.elementor-53 .elementor-element.elementor-element-7604af3{width:var( --container-widget-width, 70% );max-width:70%;--container-widget-width:70%;--container-widget-flex-grow:0;}.elementor-53 .elementor-element.elementor-element-7604af3.elementor-element{--flex-grow:0;--flex-shrink:0;}:root{--page-title-display:none;}@media(min-width:1025px){.elementor-53 .elementor-element.elementor-element-7d7491e:not(.elementor-motion-effects-element-type-background), .elementor-53 .elementor-element.elementor-element-7d7491e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:scroll;}}@media(max-width:767px){.elementor-53 .elementor-element.elementor-element-7d7491e{--min-height:650px;}.elementor-53 .elementor-element.elementor-element-edda45f{margin:-150px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-53 .elementor-element.elementor-element-edda45f .elementor-heading-title{font-size:75px;}.elementor-53 .elementor-element.elementor-element-0973897{--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;}.elementor-53 .elementor-element.elementor-element-ba9d516 .elementor-heading-title{font-size:40px;}.elementor-53 .elementor-element.elementor-element-6a0d97a{width:var( --container-widget-width, 1000px );max-width:1000px;--container-widget-width:1000px;--container-widget-flex-grow:0;}}/* Start custom CSS for container, class: .elementor-element-7d7491e *//* =====================================================================
   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-53 .elementor-element.elementor-element-7d7491e 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-53 .elementor-element.elementor-element-7d7491e).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-53 .elementor-element.elementor-element-7d7491e).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-53 .elementor-element.elementor-element-7d7491e) > .elementor-element,
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) > .e-con-inner > .elementor-element {
  position: relative;
  z-index: 2;
}

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


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

:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__subtitle.elementor-widget {
  width: 100%;
  margin-block-end: 0;
}

:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__tagline.elementor-widget {
  width: 100%;
  margin-block-end: 0;
}

:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__tagline.elementor-widget-heading .elementor-heading-title::before,
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons.elementor-widget {
  width: auto;
  margin-block-end: 0;
}

:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(1) { --ars-i: 0; }
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(2) { --ars-i: 1; }
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(3) { --ars-i: 2; }
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(4) { --ars-i: 3; }
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(5) { --ars-i: 4; }
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(6) { --ars-i: 5; }
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(7) { --ars-i: 6; }
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item:nth-child(8) { --ars-i: 7; }

:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-social-icon:hover,
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-social-icon:hover::before,
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-social-icon:focus-visible::before {
  transform: none;
}

:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-social-icon:hover i,
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-social-icon:hover svg,
:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-social-icons-wrapper:hover .elementor-grid-item:hover {
    opacity: 1;
  }
}

:where(.elementor-53 .elementor-element.elementor-element-7d7491e) .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-53 .elementor-element.elementor-element-7d7491e) .elementor-heading-title,
  :where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__social.e-con::before,
  :where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__social.e-con::after,
  :where(.elementor-53 .elementor-element.elementor-element-7d7491e) .ars-hero__icons .elementor-grid-item {
    animation: none;                         /* v1.1 */
  }

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


/* ---------------------------------------------------------------------
   9. TABLET (≤ 1024px)
   --------------------------------------------------------------------- */
@media (max-width: 1024px) {
  :where(.elementor-53 .elementor-element.elementor-element-7d7491e).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-53 .elementor-element.elementor-element-7d7491e).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-53 .elementor-element.elementor-element-7d7491e) .ars-hero__tagline.elementor-widget-heading .elementor-heading-title {
    gap: 12px;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-531b73a *//* =====================================================================
   PORTFOLIO SECTION – PORTOFOLIO PHOTOGRAPHY  (v1.2)
   v1.1: teks kartu selalu tampil, bingkai emas di dalam kartu selalu tampil
   v1.2: susunan kartu jadi "ombak" (1 & 3 tinggi, 2 turun sedikit),
         + animasi muncul saat di-scroll (gaya AOS, murni CSS)
   Tempel di: Container Utama > Advanced > Custom CSS

   Class yang harus dipasang (Advanced > CSS Classes):

   Container utama ................................ ars-porto
   ├─ Container (header) .......................... ars-porto__header
   │   ├─ Heading ................................. ars-porto__title
   │   └─ Text Editor ............................. ars-porto__desc
   └─ Container (pembungkus semua kartu) .......... ars-porto__grid
       ├─ Container (kartu, foto = Background) .... ars-porto__card
       │   ├─ Heading ............................. ars-porto__card-title
       │   ├─ Text Editor ......................... ars-porto__card-text
       │   └─ Button .............................. ars-porto__btn
       ├─ Container (kartu) ....................... ars-porto__card
       └─ ... dst (semua kartu memakai class yang sama)

   Opsional (tambahkan di Container utama, di samping ars-porto):
   - ars-porto--stack ....... di mobile kartu bertumpuk ke bawah
                              (default mobile: geser/swipe ke samping)
   (v1.1 – opsi ars-porto--show-text dihapus, teks kini selalu tampil)

   CATATAN: semua .elementor-53 .elementor-element.elementor-element-531b73a dibungkus :where() supaya specificity rendah.
   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.
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. PENGATURAN UTAMA – ubah nilai di sini
   --------------------------------------------------------------------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a).e-con {
  /* Warna (sama dengan section lain) */
  --porto-bg: #0a0908;
  --porto-gold: #D4AF37;
  --porto-gold-light: #F0D98C;
  --porto-gold-rgb: 212, 175, 55;
  --porto-white: #ffffff;
  --porto-muted: rgba(255, 255, 255, .66);

  /* Font */
  --porto-font-display: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --porto-font-body: "DM Sans", "Helvetica Neue", Arial, sans-serif;

  /* Layout section */
  --porto-pad-y: 130px;
  --porto-pad-x: 48px;
  --porto-content-max: 1240px;
  --porto-header-gap: 56px;          /* v1.2 – jarak header ke kartu */

  /* Header */
  --porto-eyebrow: "Portfolio";      /* label kecil di atas judul, "" = hilang */
  --porto-eyebrow-size: 13px;
  --porto-eyebrow-ls: .32em;
  --porto-eyebrow-color: var(--porto-gold);
  --porto-title-size: clamp(38px, 4.4vw, 64px);
  --porto-title-weight: 500;
  --porto-title-color: var(--porto-white);
  --porto-title-lh: 1.05;
  --porto-desc-size: 16px;
  --porto-desc-color: var(--porto-muted);
  --porto-desc-lh: 1.8;
  --porto-desc-max: 420px;
  --porto-desc-line: var(--porto-gold);   /* garis kiri deskripsi, transparent = hilang */

  /* Grid & efek ombak (v1.2) */
  --porto-cols: 3;                   /* jumlah kolom desktop */
  --porto-col-gap: 30px;
  --porto-row-gap: 40px;
  --porto-step: 64px;                /* v1.2 – seberapa jauh kartu tengah turun, 0px = rata */

  /* Animasi muncul saat scroll (v1.2) */
  --porto-reveal-distance: 70px;     /* v1.2 – jarak naik saat muncul, 0px = hanya fade */
  --porto-reveal-scale: .96;         /* v1.2 – sedikit membesar saat muncul, 1 = tanpa zoom */
  --porto-reveal-stagger: 12%;       /* v1.2 – jeda antar kolom (kiri → kanan) */

  /* Kartu */
  --porto-card-ratio: 3 / 4.3;       /* rasio kartu (lebar / tinggi) */
  --porto-card-radius: 0px;          /* misal 8px untuk sudut membulat */
  --porto-card-pad: 30px;
  --porto-card-bg: #16130f;          /* warna dasar sebelum foto termuat */
  --porto-card-shadow: 0 25px 50px rgba(0, 0, 0, .45);
  --porto-card-shadow-hover: 0 35px 70px rgba(0, 0, 0, .6);
  --porto-card-overlay: linear-gradient(0deg,
                          rgba(10, 9, 8, .96) 0%,
                          rgba(10, 9, 8, .72) 28%,
                          rgba(10, 9, 8, .12) 58%,
                          rgba(10, 9, 8, 0) 100%);
  --porto-card-lift: -10px;          /* kartu naik saat hover, 0px = diam */
  --porto-frame-color: rgba(var(--porto-gold-rgb), .55);        /* v1.1 – bingkai emas (selalu tampil), transparent = hilang */
  --porto-frame-color-hover: rgba(var(--porto-gold-rgb), .95);  /* v1.1 – bingkai lebih terang saat hover */
  --porto-frame-width: 1px;          /* v1.1 – tebal bingkai */
  --porto-frame-inset: 14px;         /* jarak bingkai dari tepi kartu */
  --porto-card-align: center;        /* center / flex-start (rata kiri) */
  --porto-card-text-align: center;   /* center / left */

  /* Nomor kartu (— 01) */
  --porto-num-display: block;        /* none = sembunyikan */
  --porto-num-size: 12px;
  --porto-num-color: var(--porto-gold);

  /* Judul kartu */
  --porto-card-title-size: clamp(24px, 2.2vw, 32px);
  --porto-card-title-weight: 500;
  --porto-card-title-color: var(--porto-white);
  --porto-card-title-lh: 1.1;

  /* Teks kartu */
  --porto-card-text-size: 14.5px;
  --porto-card-text-color: rgba(255, 255, 255, .72);
  --porto-card-text-lh: 1.7;
  --porto-card-text-gap: 12px;       /* v1.1 – jarak judul ke teks */

  /* Tombol "View More" */
  --porto-btn-size: 12.5px;
  --porto-btn-weight: 500;
  --porto-btn-ls: .22em;
  --porto-btn-transform: uppercase;  /* none / uppercase */
  --porto-btn-color: var(--porto-gold);
  --porto-btn-color-hover: var(--porto-gold-light);
  --porto-btn-arrow: "→";            /* "" = tanpa panah */

  /* Animasi */
  --porto-speed: .6s;
  --porto-ease: cubic-bezier(.22, .8, .25, 1);

  /* ---- Pengaturan container (variabel bawaan Elementor) ---- */
  --flex-direction: column;
  --align-items: stretch;
  --gap: 0px;
  --row-gap: 0px;
  --padding-top: var(--porto-pad-y);
  --padding-bottom: var(--porto-pad-y);
  --padding-left: var(--porto-pad-x);
  --padding-right: var(--porto-pad-x);

  background-color: var(--porto-bg);
  counter-reset: ars-porto;
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) > .e-con-inner {
  max-width: var(--porto-content-max);
}


/* ---------------------------------------------------------------------
   2. HEADER – .ars-porto__header
   --------------------------------------------------------------------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__header.e-con {
  --width: 100%;
  --flex-direction: row;
  --flex-wrap: nowrap;
  --align-items: flex-end;
  --justify-content: space-between;
  --gap: 60px;
  --column-gap: 60px;
  --padding-top: 0px;
  --padding-bottom: 44px;
  --padding-left: 0px;
  --padding-right: 0px;

  margin-bottom: var(--porto-header-gap);
  /* garis tipis emas di bawah header, memudar ke kanan */
  background-image: linear-gradient(90deg, rgba(var(--porto-gold-rgb), .45), rgba(var(--porto-gold-rgb), .08) 70%, transparent);
  background-size: 100% 1px;
  background-position: left bottom;
  background-repeat: no-repeat;
}

/* ---------- Judul section ---------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__title.elementor-widget {
  flex: 1 1 auto;
  margin-block-end: 0;
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__title.elementor-widget-heading .elementor-heading-title {
  margin: 0;
  font-family: var(--porto-font-display);
  font-size: var(--porto-title-size);
  font-weight: var(--porto-title-weight);
  line-height: var(--porto-title-lh);
  color: var(--porto-title-color);
}

/* Label kecil di atas judul */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__title.elementor-widget-heading .elementor-heading-title::before {
  content: var(--porto-eyebrow);
  display: block;
  margin-bottom: 18px;
  font-family: var(--porto-font-body);
  font-size: var(--porto-eyebrow-size);
  font-weight: 500;
  font-style: normal;
  line-height: 1;
  letter-spacing: var(--porto-eyebrow-ls);
  text-transform: uppercase;
  color: var(--porto-eyebrow-color);
}

/* ---------- Deskripsi header ---------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__desc.elementor-widget {
  flex: 0 1 var(--porto-desc-max);
  max-width: var(--porto-desc-max);
  margin-block-end: 0;
  padding-left: 22px;
  border-left: 1px solid var(--porto-desc-line);
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__desc.elementor-widget-text-editor {
  font-family: var(--porto-font-body);
  font-size: var(--porto-desc-size);
  line-height: var(--porto-desc-lh);
  color: var(--porto-desc-color);
  text-align: left;
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__desc.elementor-widget-text-editor p {
  margin: 0 0 1em;
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__desc.elementor-widget-text-editor p:last-child {
  margin-bottom: 0;
}


/* ---------------------------------------------------------------------
   3. GRID KARTU + EFEK OMBAK – .ars-porto__grid                  (v1.2)
   Kolom 1 & 3 tinggi, kolom 2 (tengah) turun sedikit
   --------------------------------------------------------------------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__grid.e-con {
  --width: 100%;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;

  display: grid;
  grid-template-columns: repeat(var(--porto-cols), minmax(0, 1fr));
  column-gap: var(--porto-col-gap);
  row-gap: var(--porto-row-gap);
  align-items: start;
  padding-top: 0;                    /* v1.2 – ruang tangga tidak diperlukan lagi */
}

/* Jika container grid masih "Boxed", inner-nya dilebur ke grid */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__grid > .e-con-inner {
  display: contents;
}

/* v1.2 – Posisi ombak per kolom (desktop 3 kolom)
   --porto-i  : 1 = kartu turun, 0 = kartu tinggi
   --porto-col: urutan kolom untuk jeda animasi scroll */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card:nth-child(3n + 1) { --porto-i: 0; --porto-col: 0; }
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card:nth-child(3n + 2) { --porto-i: 1; --porto-col: 1; }
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card:nth-child(3n + 3) { --porto-i: 0; --porto-col: 2; }


/* ---------------------------------------------------------------------
   4. KARTU – .ars-porto__card
   Foto dipasang sebagai Background Image container kartu
   --------------------------------------------------------------------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con {
  --porto-shift: 0px;                /* v1.2 – efek tangga dimatikan */
  --width: 100%;
  --min-height: 0px;
  --flex-direction: column;
  --justify-content: flex-end;
  --align-items: var(--porto-card-align);
  --gap: 0px;
  --row-gap: 0px;
  --padding-top: var(--porto-card-pad);
  --padding-bottom: var(--porto-card-pad);
  --padding-left: var(--porto-card-pad);
  --padding-right: var(--porto-card-pad);

  position: relative;
  overflow: hidden;
  isolation: isolate;
  width: 100%;
  margin-top: calc(var(--porto-i, 0) * var(--porto-step));   /* v1.2 – efek ombak */
  aspect-ratio: var(--porto-card-ratio);
  text-align: var(--porto-card-text-align);
  counter-increment: ars-porto;
  border-radius: var(--porto-card-radius);
  background-color: var(--porto-card-bg);
  background-size: cover;
  background-position: center;
  box-shadow: var(--porto-card-shadow);
  outline: var(--porto-frame-width) solid var(--porto-frame-color);    /* v1.1 – bingkai selalu tampil */
  outline-offset: calc(var(--porto-frame-inset) * -1);
  transform: translateY(var(--porto-shift));
  transition: transform var(--porto-speed) var(--porto-ease),
              outline-color var(--porto-speed) var(--porto-ease),
              box-shadow var(--porto-speed) var(--porto-ease);
}

/* Gradasi gelap di bawah agar teks terbaca */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--porto-card-overlay);
  pointer-events: none;
}

/* Konten kartu di atas gradasi (support container Boxed & Full Width) */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card > .elementor-element,
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card > .e-con-inner > .elementor-element {
  position: relative;
  z-index: 2;
  width: 100%;
  margin-block-end: 0;
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card > .e-con-inner {
  justify-content: flex-end;
  align-items: var(--porto-card-align);
}

/* Hover kartu: naik + bingkai emas lebih terang */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con:hover {
  transform: translateY(calc(var(--porto-shift) + var(--porto-card-lift)));
  outline-color: var(--porto-frame-color-hover);                        /* v1.1 */
  box-shadow: var(--porto-card-shadow-hover);
}


/* ---------------------------------------------------------------------
   5. JUDUL KARTU – .ars-porto__card-title (+ nomor otomatis)
   --------------------------------------------------------------------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card-title.elementor-widget-heading .elementor-heading-title {
  margin: 0;
  font-family: var(--porto-font-display);
  font-size: var(--porto-card-title-size);
  font-weight: var(--porto-card-title-weight);
  line-height: var(--porto-card-title-lh);
  color: var(--porto-card-title-color);
}

/* Nomor "— 01" di atas judul, urut otomatis */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card-title.elementor-widget-heading .elementor-heading-title::before {
  content: "— " counter(ars-porto, decimal-leading-zero);
  display: var(--porto-num-display);
  margin-bottom: 12px;
  font-family: var(--porto-font-body);
  font-size: var(--porto-num-size);
  font-weight: 500;
  line-height: 1;
  letter-spacing: .28em;
  color: var(--porto-num-color);
}


/* ---------------------------------------------------------------------
   6. TEKS KARTU – .ars-porto__card-text
   --------------------------------------------------------------------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card-text.elementor-widget-text-editor {
  margin-top: var(--porto-card-text-gap);                               /* v1.1 */
  font-family: var(--porto-font-body);
  font-size: var(--porto-card-text-size);
  line-height: var(--porto-card-text-lh);
  color: var(--porto-card-text-color);
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card-text.elementor-widget-text-editor p {
  margin: 0;
}


/* ---------------------------------------------------------------------
   7. TOMBOL – .ars-porto__btn (gaya link "View More →")
   --------------------------------------------------------------------- */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn.elementor-widget {
  margin-top: 20px;
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn.elementor-widget-button .elementor-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  position: relative;
  padding: 6px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font-family: var(--porto-font-body);
  font-size: var(--porto-btn-size);
  font-weight: var(--porto-btn-weight);
  line-height: 1;
  letter-spacing: var(--porto-btn-ls);
  text-transform: var(--porto-btn-transform);
  color: var(--porto-btn-color);
  transition: color .35s ease;
}

/* Panah */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn.elementor-widget-button .elementor-button::after {
  content: var(--porto-btn-arrow);
  font-size: 1.25em;
  letter-spacing: 0;
  transition: transform .45s var(--porto-ease);
}

/* Garis bawah emas yang melebar saat hover */
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn.elementor-widget-button .elementor-button::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .45s var(--porto-ease);
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con:hover .ars-porto__btn .elementor-button,
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn .elementor-button:focus-visible {
  color: var(--porto-btn-color-hover);
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con:hover .ars-porto__btn .elementor-button::after {
  transform: translateX(6px);
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con:hover .ars-porto__btn .elementor-button::before,
:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn .elementor-button:focus-visible::before {
  transform: scaleX(1);
}

:where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn .elementor-button:focus-visible {
  outline: 1px solid var(--porto-gold-light);
  outline-offset: 4px;
}


/* ---------------------------------------------------------------------
   8. ANIMASI MUNCUL SAAT SCROLL (gaya AOS, murni CSS)            (v1.2)
   Header & kartu naik + fade in saat masuk layar, kolom kiri → kanan
   berurutan. Browser yang belum mendukung (mis. Firefox) tetap
   menampilkan kartu normal tanpa animasi.
   (v1.1: efek reveal teks saat hover sudah dihapus – teks selalu tampil)
   --------------------------------------------------------------------- */
@keyframes arsPortoReveal {
  from {
    opacity: 0;
    translate: 0 var(--porto-reveal-distance);
    scale: var(--porto-reveal-scale);
  }
  to {
    opacity: 1;
    translate: 0 0;
    scale: 1;
  }
}

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__header.e-con {
      animation: arsPortoReveal linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 90%;
    }

    :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con {
      animation: arsPortoReveal cubic-bezier(.22, .8, .25, 1) both;
      animation-timeline: view();
      animation-range: entry calc(var(--porto-col, 0) * var(--porto-reveal-stagger))
                       entry calc(70% + var(--porto-col, 0) * var(--porto-reveal-stagger));
    }
  }
}


/* ---------------------------------------------------------------------
   9. TABLET (≤ 1024px) – 2 kolom, ombak zig-zag (kolom kanan turun)
   --------------------------------------------------------------------- */
@media (max-width: 1024px) {
  :where(.elementor-53 .elementor-element.elementor-element-531b73a).e-con {
    --porto-pad-y: 100px;
    --porto-pad-x: 32px;
    --porto-cols: 2;
    --porto-col-gap: 22px;
    --porto-row-gap: 30px;
    --porto-step: 48px;              /* v1.2 */
    --porto-header-gap: 44px;        /* v1.2 */
    --porto-reveal-distance: 50px;   /* v1.2 */
    --porto-card-pad: 24px;
    --porto-title-size: clamp(36px, 6vw, 52px);
    --porto-card-title-size: 26px;
    --porto-card-lift: 0px;
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__header.e-con {
    --flex-direction: column;
    --align-items: flex-start;
    --gap: 26px;
    --row-gap: 26px;
    --padding-bottom: 36px;
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__desc.elementor-widget {
    flex: none;
    max-width: 560px;
  }

  /* v1.2 – Pola ombak 2 kolom */
  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card:nth-child(odd)  { --porto-i: 0; --porto-col: 0; }
  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card:nth-child(even) { --porto-i: 1; --porto-col: 1; }
}


/* ---------------------------------------------------------------------
   10. MOBILE (≤ 767px) – kartu geser ke samping (swipe)
   --------------------------------------------------------------------- */
@media (max-width: 767px) {
  :where(.elementor-53 .elementor-element.elementor-element-531b73a).e-con {
    --porto-pad-y: 80px;
    --porto-pad-x: 20px;
    --porto-step: 0px;
    --porto-card-ratio: 3 / 4.2;
    --porto-card-pad: 22px;
    --porto-frame-inset: 10px;
    --porto-eyebrow-size: 11px;
    --porto-eyebrow-ls: .26em;
    --porto-title-size: clamp(32px, 9vw, 42px);
    --porto-desc-size: 15px;
    --porto-card-title-size: 25px;
    --porto-card-text-size: 14px;
    --porto-mobile-card-w: 80%;      /* lebar kartu saat swipe (sisanya mengintip) */
    --porto-header-gap: 36px;        /* v1.2 */
    --porto-reveal-distance: 40px;   /* v1.2 */
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__desc.elementor-widget {
    padding-left: 16px;
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card:nth-child(n) { --porto-i: 0; --porto-col: 0; }   /* v1.2 */

  /* Kartu berjajar dan bisa digeser */
  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__grid.e-con {
    display: flex;
    flex-direction: row;             /* v1.2 – pastikan kartu berjajar ke samping */
    flex-wrap: nowrap;
    gap: 16px;
    padding-top: 0;
    padding-bottom: 20px;
    margin-right: calc(var(--porto-pad-x) * -1);   /* kartu terakhir sampai tepi layar */
    padding-right: var(--porto-pad-x);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--porto-gold-rgb), .5) transparent;
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__grid.e-con::-webkit-scrollbar {
    height: 2px;
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__grid.e-con::-webkit-scrollbar-thumb {
    background: rgba(var(--porto-gold-rgb), .5);
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con {
    flex: 0 0 var(--porto-mobile-card-w);
    width: var(--porto-mobile-card-w);
    scroll-snap-align: start;
    box-shadow: none;
  }

  /* --- Opsi: class ars-porto--stack = kartu bertumpuk ke bawah --- */
  :where(.elementor-53 .elementor-element.elementor-element-531b73a).ars-porto--stack .ars-porto__grid.e-con {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 22px;
    margin-right: 0;
    padding-right: 0;
    padding-bottom: 0;
    overflow: visible;
  }

  :where(.elementor-53 .elementor-element.elementor-element-531b73a).ars-porto--stack .ars-porto__card.e-con {
    --porto-card-ratio: 4 / 5;
    width: 100%;
  }

  /* v1.2 – Animasi scroll di mobile:
     mode swipe  → seluruh baris kartu muncul bersamaan
     mode stack  → tiap kartu muncul satu per satu */
  @supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
      :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con {
        animation: none;
      }

      :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__grid.e-con {
        animation: arsPortoReveal cubic-bezier(.22, .8, .25, 1) both;
        animation-timeline: view();
        animation-range: entry 0% entry 70%;
      }

      :where(.elementor-53 .elementor-element.elementor-element-531b73a).ars-porto--stack .ars-porto__grid.e-con {
        animation: none;
      }

      :where(.elementor-53 .elementor-element.elementor-element-531b73a).ars-porto--stack .ars-porto__card.e-con {
        animation: arsPortoReveal cubic-bezier(.22, .8, .25, 1) both;
        animation-timeline: view();
        animation-range: entry 0% entry 70%;
      }
    }
  }
}


/* ---------------------------------------------------------------------
   11. KURANGI ANIMASI
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__card.e-con,
  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn .elementor-button,
  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn .elementor-button::before,
  :where(.elementor-53 .elementor-element.elementor-element-531b73a) .ars-porto__btn .elementor-button::after {
    transition: none;
  }
}/* End custom CSS */