.elementor-6 .elementor-element.elementor-element-86436dd{--display:flex;--min-height:0px;}.elementor-6 .elementor-element.elementor-element-94065c3{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:-10px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-b88f77f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-0e886ac.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-0be1c07.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-0be1c07 .elementor-heading-title{font-family:"Cormorant Garamond", Sans-serif;font-size:74px;font-weight:700;color:#FFFFFF;}.elementor-6 .elementor-element.elementor-element-25a2bc8.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-25a2bc8.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-25a2bc8{font-family:"Times New Roman", Sans-serif;}.elementor-6 .elementor-element.elementor-element-68094e6.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-d1c304c.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-d1c304c.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-d1c304c .elementor-button-content-wrapper{flex-direction:row;}.elementor-6 .elementor-element.elementor-element-d1c304c .elementor-button .elementor-button-content-wrapper{gap:14px;}.elementor-6 .elementor-element.elementor-element-d1c304c .elementor-button{font-family:"Poppins", Sans-serif;font-weight:500;border-radius:9px 9px 9px 9px;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button,.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-skewFill:before,
								.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-flipSlide::before{background-color:#02010100;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-animation-none:hover,.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-button-2d-animation:hover,
								.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-button-bg-animation::before,.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-bubbleFromDown::before,
								.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-bubbleFromDown::after,.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-bubbleFromCenter::before,
								.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-bubbleFromCenter::after,.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-flipSlide,
								.elementor-6 .elementor-element.elementor-element-e675a8c [class*=xpro-elementor-button-hover-style-underline]:hover,.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-hover-style-skewFill,
								
								.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-animation-none:focus,.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-button-2d-animation:focus,
								.elementor-6 .elementor-element.elementor-element-e675a8c [class*=xpro-elementor-button-focus-style-underline]:focus{background-color:#FFFFFF21;}.elementor-6 .elementor-element.elementor-element-e675a8c{margin:-61px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 193px;}.elementor-6 .elementor-element.elementor-element-e675a8c.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-e675a8c.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-align-icon-right .xpro-elementor-button-media{margin-left:14px;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-align-icon-left .xpro-elementor-button-media{margin-right:14px;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button .xpro-button-text{font-family:"Poppins", Sans-serif;font-weight:500;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button{border-style:solid;border-width:1px 1px 1px 1px;border-color:#FFFFFF26;border-radius:9px 9px 9px 9px;padding:13px 14px 13px 14px;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-media > i{font-size:13px;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-media > svg{width:13px;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button-media{min-width:13px;}.elementor-6 .elementor-element.elementor-element-a57ba4d{margin:8px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6 .elementor-element.elementor-element-a57ba4d.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-a57ba4d.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-a57ba4d .elementor-counter-number-wrapper{color:#FFFFFF;font-family:"Roboto", Sans-serif;font-size:40px;font-weight:bold;}.elementor-6 .elementor-element.elementor-element-a57ba4d .elementor-counter-title{color:#FFFFFF66;font-family:"ABeeZee", Sans-serif;font-size:12px;font-weight:500;letter-spacing:0.5px;}.elementor-6 .elementor-element.elementor-element-64591a5{margin:-90px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 156px;}.elementor-6 .elementor-element.elementor-element-64591a5.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-64591a5.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-64591a5 .elementor-counter-number-wrapper{color:#FFFFFF;font-family:"Roboto", Sans-serif;font-size:40px;font-weight:bold;}.elementor-6 .elementor-element.elementor-element-64591a5 .elementor-counter-title{color:#FFFFFF66;font-family:"ABeeZee", Sans-serif;font-size:12px;font-weight:500;letter-spacing:0.5px;}.elementor-6 .elementor-element.elementor-element-df3003e{margin:-90px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 330px;}.elementor-6 .elementor-element.elementor-element-df3003e.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-df3003e.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-df3003e .elementor-counter-number-wrapper{color:#FFFFFF;font-family:"Roboto", Sans-serif;font-size:40px;font-weight:bold;}.elementor-6 .elementor-element.elementor-element-df3003e .elementor-counter-title{color:#FFFFFF66;font-family:"ABeeZee", Sans-serif;font-size:12px;font-weight:500;letter-spacing:0.5px;}.elementor-6 .elementor-element.elementor-element-43c47f7.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-ec103c5{--divider-border-style:solid;--divider-color:#9FE1CB5C;--divider-border-width:0.01px;width:var( --container-widget-width, 11% );max-width:11%;--e-transform-rotateZ:90deg;margin:-89px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 90px;--container-widget-width:11%;--container-widget-flex-grow:0;--e-transform-origin-x:center;--e-transform-origin-y:center;}.elementor-6 .elementor-element.elementor-element-ec103c5.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-ec103c5.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-ec103c5 .elementor-divider-separator{width:65%;margin:0 auto;margin-center:0;}.elementor-6 .elementor-element.elementor-element-ec103c5 .elementor-divider{text-align:center;padding-block-start:29px;padding-block-end:29px;}.elementor-6 .elementor-element.elementor-element-af76e08{--divider-border-style:solid;--divider-color:#9FE1CB5C;--divider-border-width:0.01px;width:var( --container-widget-width, 11% );max-width:11%;--e-transform-rotateZ:90deg;margin:-79px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 256px;--container-widget-width:11%;--container-widget-flex-grow:0;}.elementor-6 .elementor-element.elementor-element-af76e08.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-af76e08.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-af76e08 .elementor-divider-separator{width:65%;margin:0 auto;margin-center:0;}.elementor-6 .elementor-element.elementor-element-af76e08 .elementor-divider{text-align:center;padding-block-start:29px;padding-block-end:29px;}.elementor-6 .elementor-element.elementor-element-7c859a6{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-e1a8340{--display:flex;--margin-top:55px;--margin-bottom:0px;--margin-left:20px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-e6b6afb.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-e6b6afb .elementor-icon-box-wrapper{text-align:start;gap:15px;}.elementor-6 .elementor-element.elementor-element-e6b6afb .elementor-icon-box-title{margin-block-end:10px;color:#85D4AB;}.elementor-6 .elementor-element.elementor-element-e6b6afb.elementor-view-stacked .elementor-icon{background-color:#97ECC1D6;fill:#4DB8822E;color:#4DB8822E;}.elementor-6 .elementor-element.elementor-element-e6b6afb.elementor-view-framed .elementor-icon, .elementor-6 .elementor-element.elementor-element-e6b6afb.elementor-view-default .elementor-icon{fill:#97ECC1D6;color:#97ECC1D6;border-color:#97ECC1D6;}.elementor-6 .elementor-element.elementor-element-e6b6afb.elementor-view-framed .elementor-icon{background-color:#4DB8822E;}.elementor-6 .elementor-element.elementor-element-e6b6afb .elementor-icon{font-size:26px;border-width:0px 0px 0px 0px;border-radius:6px 6px 6px 6px;}.elementor-6 .elementor-element.elementor-element-e6b6afb .elementor-icon-box-title, .elementor-6 .elementor-element.elementor-element-e6b6afb .elementor-icon-box-title a{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:500;}.elementor-6 .elementor-element.elementor-element-e6b6afb .elementor-icon-box-description{color:#FFFFFFCC;}.elementor-6 .elementor-element.elementor-element-52f7e69{margin:-30px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Cormorant Garamond", Sans-serif;font-size:20px;font-weight:800;color:#FFFFFF;}.elementor-6 .elementor-element.elementor-element-52f7e69.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-52f7e69.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-b3526e4{margin:-15px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:14px;font-weight:400;color:#FFFFFF6B;}.elementor-6 .elementor-element.elementor-element-b3526e4.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-b3526e4.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-6c04b69{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:0px;--margin-bottom:0px;--margin-left:10px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-4395a97{--display:flex;}.elementor-6 .elementor-element.elementor-element-030cc5e.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-030cc5e .elementor-icon-box-wrapper{text-align:start;gap:15px;}.elementor-6 .elementor-element.elementor-element-030cc5e .elementor-icon-box-title{margin-block-end:10px;color:#85D4AB;}.elementor-6 .elementor-element.elementor-element-030cc5e.elementor-view-stacked .elementor-icon{background-color:#97ECC1D6;fill:#4DB8822E;color:#4DB8822E;}.elementor-6 .elementor-element.elementor-element-030cc5e.elementor-view-framed .elementor-icon, .elementor-6 .elementor-element.elementor-element-030cc5e.elementor-view-default .elementor-icon{fill:#97ECC1D6;color:#97ECC1D6;border-color:#97ECC1D6;}.elementor-6 .elementor-element.elementor-element-030cc5e.elementor-view-framed .elementor-icon{background-color:#4DB8822E;}.elementor-6 .elementor-element.elementor-element-030cc5e .elementor-icon{font-size:26px;border-width:0px 0px 0px 0px;border-radius:6px 6px 6px 6px;}.elementor-6 .elementor-element.elementor-element-030cc5e .elementor-icon-box-title, .elementor-6 .elementor-element.elementor-element-030cc5e .elementor-icon-box-title a{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:500;}.elementor-6 .elementor-element.elementor-element-030cc5e .elementor-icon-box-description{color:#FFFFFFCC;}.elementor-6 .elementor-element.elementor-element-949bdec{margin:-30px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Cormorant Garamond", Sans-serif;font-size:20px;font-weight:800;color:#FFFFFF;}.elementor-6 .elementor-element.elementor-element-949bdec.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-949bdec.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-9327228{margin:-15px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:14px;font-weight:400;color:#FFFFFF6B;}.elementor-6 .elementor-element.elementor-element-9327228.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-9327228.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-5be4b8d{--display:flex;--border-radius:6px 6px 6px 6px;}.elementor-6 .elementor-element.elementor-element-66e6a07.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-66e6a07 .elementor-icon-box-wrapper{text-align:start;gap:15px;}.elementor-6 .elementor-element.elementor-element-66e6a07 .elementor-icon-box-title{margin-block-end:10px;color:#85D4AB;}.elementor-6 .elementor-element.elementor-element-66e6a07.elementor-view-stacked .elementor-icon{background-color:#97ECC1D6;fill:#4DB8822E;color:#4DB8822E;}.elementor-6 .elementor-element.elementor-element-66e6a07.elementor-view-framed .elementor-icon, .elementor-6 .elementor-element.elementor-element-66e6a07.elementor-view-default .elementor-icon{fill:#97ECC1D6;color:#97ECC1D6;border-color:#97ECC1D6;}.elementor-6 .elementor-element.elementor-element-66e6a07.elementor-view-framed .elementor-icon{background-color:#4DB8822E;}.elementor-6 .elementor-element.elementor-element-66e6a07 .elementor-icon{font-size:26px;border-width:0px 0px 0px 0px;border-radius:6px 6px 6px 6px;}.elementor-6 .elementor-element.elementor-element-66e6a07 .elementor-icon-box-title, .elementor-6 .elementor-element.elementor-element-66e6a07 .elementor-icon-box-title a{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:500;}.elementor-6 .elementor-element.elementor-element-66e6a07 .elementor-icon-box-description{color:#FFFFFFCC;}.elementor-6 .elementor-element.elementor-element-114d45f{margin:-30px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Cormorant Garamond", Sans-serif;font-size:20px;font-weight:800;color:#FFFFFF;}.elementor-6 .elementor-element.elementor-element-114d45f.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-114d45f.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-d50ac02{margin:-15px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:14px;font-weight:400;color:#FFFFFF6B;}.elementor-6 .elementor-element.elementor-element-d50ac02.elementor-element{--align-self:flex-start;}.elementor-6 .elementor-element.elementor-element-d50ac02.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-c6dff2e{--display:flex;}.elementor-6 .elementor-element.elementor-element-69a03eb.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-81d4066{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-81d4066:not(.elementor-motion-effects-element-type-background), .elementor-6 .elementor-element.elementor-element-81d4066 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-6 .elementor-element.elementor-element-6ac6018.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-6 .elementor-element.elementor-element-971e68f{--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;}.elementor-6 .elementor-element.elementor-element-971e68f:not(.elementor-motion-effects-element-type-background), .elementor-6 .elementor-element.elementor-element-971e68f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F8FAF8;}.elementor-6 .elementor-element.elementor-element-911e4f9.xpro-widget-bg-overlay:before{transition:background 0.3s;}@media(min-width:768px){.elementor-6 .elementor-element.elementor-element-e1a8340{--width:96%;}}@media(max-width:1024px){.elementor-6 .elementor-element.elementor-element-94065c3{--grid-auto-flow:row;}.elementor-6 .elementor-element.elementor-element-6c04b69{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-6 .elementor-element.elementor-element-94065c3{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:-55px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-0be1c07 .elementor-heading-title{font-size:40px;}.elementor-6 .elementor-element.elementor-element-25a2bc8{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6 .elementor-element.elementor-element-68094e6{text-align:justify;}.elementor-6 .elementor-element.elementor-element-d1c304c{margin:10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6 .elementor-element.elementor-element-e675a8c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6 .elementor-element.elementor-element-e675a8c .xpro-elementor-button{width:800px;max-width:100%;}.elementor-6 .elementor-element.elementor-element-7c859a6{--margin-top:-30px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-e1a8340{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-6 .elementor-element.elementor-element-6c04b69{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}}/* Start custom CSS for html, class: .elementor-element-0e886ac */.hero-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 6px 16px;
      background: rgba(200, 162, 48, 0.14);
      border: 1px solid rgba(200, 162, 48, 0.28);
      border-radius: 40px;
      color: var(--gold-400);
      font-size: 11.5px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;

    }

    .hero-eyebrow .dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--gold-400);
      animation: pulseDot 2s ease-in-out infinite;
    }
    
    .hero-eyebrow{
  animation: eyebrowIn .7s cubic-bezier(.22,1,.36,1);
  box-shadow:
    0 0 0 rgba(200,162,48,0),
    0 8px 24px rgba(200,162,48,0.08);
}

@keyframes eyebrowIn{
  0%{
    opacity:0;
    transform:translateY(14px) scale(.92);
    filter:blur(4px);
  }

  60%{
    opacity:1;
    transform:translateY(-2px) scale(1.02);
    filter:blur(0);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1);
    filter:blur(0);
  }
}
    

    @keyframes pulseDot {

      0%,
      100% {
        opacity: 1;
        transform: scale(1);
      }

      50% {
        opacity: 0.4;
        transform: scale(1.5);
      }
    }
    
    @media (max-width:768px){

  .hero-eyebrow{
    padding:5px 12px;
    gap:6px;

    font-size:10px;
    letter-spacing:1.2px;

    border-radius:30px;

    max-width:100%;
    flex-wrap:wrap;

    text-align:center;
    justify-content:center;
  }

  .hero-eyebrow .dot{
    width:5px;
    height:5px;
  }

}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-0be1c07 */.hero-title {
      font-family: var(--font-display);
      font-size: clamp(54px, 5.5vw, 72px);
      font-weight: 700;
      color: var(--white);
      line-height: 1.05;
      margin-bottom: 8px;
      animation:titleReveal .9s cubic-bezier(.22,1,.36,1);
  transform-origin:left center;
    }

    .hero-title span {
      color: var(--gold-400);
      font-style: italic;
      display: block;
       animation:goldReveal 1.1s cubic-bezier(.22,1,.36,1);
    }
    
    @keyframes titleReveal{
  0%{
    opacity:0;
    transform:translateY(30px) scale(.96);
    filter:blur(10px);
  }

  60%{
    opacity:1;
    transform:translateY(-3px) scale(1.01);
    filter:blur(0);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1);
    filter:blur(0);
  }
}

@keyframes goldReveal{
  0%{
    opacity:0;
    transform:translateX(-18px);
    letter-spacing:6px;
  }

  100%{
    opacity:1;
    transform:translateX(0);
    letter-spacing:normal;
  }
}
    
    @media (max-width:768px){

  .hero-title{
    font-size:clamp(34px, 9vw, 48px);
    line-height:1.12;

  }

  .hero-title span{
    display:block;
    margin-top:4px;
  }

 

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-25a2bc8 */.hero-arabic {
      font-family: var(--font-display);
      font-size: clamp(16px, 1.8vw, 22px);
      color: rgba(168, 213, 181, 0.5);
      letter-spacing: 4px;
      margin-bottom: 22px;
      animation:arabicReveal 1s cubic-bezier(.22,1,.36,1);
       text-shadow:
    0 0 20px rgba(168,213,181,.08),
    0 0 40px rgba(168,213,181,.04);
    }
    
    @keyframes arabicReveal{
  0%{
    opacity:0;
    transform:translateY(18px);
    letter-spacing:14px;
    filter:blur(8px);
  }

  60%{
    opacity:.8;
    transform:translateY(-2px);
    filter:blur(0);
  }

  100%{
    opacity:1;
    transform:translateY(0);
    letter-spacing:4px;
    filter:blur(0);
  }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-68094e6 */.hero-desc {
      font-size: 15.5px;
      line-height: 1.82;
      color: rgba(255, 255, 255, 0.52);
      font-weight: 300;
      max-width: 430px;
      margin-bottom: 38px;
    }/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-d1c304c */:root {
      /* Hijau */
      --green-950: #071a0e;
      --green-900: #0d2b1a;
      --green-800: #163d27;
      --green-700: #1e5435;
      --green-600: #286b44;
      --green-500: #34895a;
      --green-400: #4db882;
      --green-300: #85d4ab;
      --green-200: #b7e8cc;
      --green-100: #dff3e8;
      --green-50: #f0faf4;

      /* Emas */
      --gold-600: #a07820;
      --gold-500: #c8a230;
      --gold-400: #dfc05a;
      --gold-100: #fdf4db;

      /* Netral */
      --white: #ffffff;
      --gray-50: #f8faf8;
      --gray-100: #eef2ee;
      --gray-200: #d8e0d8;
      --gray-400: #8fa88f;
      --gray-600: #4a5e4a;
      --gray-900: #111a11;
}

.elementor-button {
      background: linear-gradient(135deg, var(--gold-500), var(--gold-600));
      color: var(--green-950);
      box-shadow: 0 6px 22px rgba(200, 162, 48, 0.32);
    }

.elementor-button:hover {
      transform: translateY(-3px);
      box-shadow: 0 12px 32px rgba(200, 162, 48, 0.45);
    }
    
    @media (max-width:768px){

  .elementor-widget-button,
  .elementor-widget-button .elementor-widget-container,
  .elementor-button-wrapper{
    width:100%;
  }

  .elementor-button{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
  }

}/* End custom CSS */
/* Start custom CSS for xpro-button, class: .elementor-element-e675a8c */.xpro-elementor-button:hover {
    transform: translateY(-2px);
}/* End custom CSS */
/* Start custom CSS for counter, class: .elementor-element-df3003e */.elementor-counter-number-suffix {
      font-size: 20px;
      color: var(--gold-400);
    }/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-e1a8340 */.elementor-6 .elementor-element.elementor-element-e1a8340 {
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 19px;
  padding: 24px 26px;
  backdrop-filter: blur(16px);

  /* penting untuk smooth */
  transition: 
    background 0.4s cubic-bezier(0.25, 0.8, 0.25, 1),
    transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);

  will-change: transform, background;
}

.elementor-6 .elementor-element.elementor-element-e1a8340:hover {
  background: rgba(255, 255, 255, 0.09);
  transform: translateX(6px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4395a97 */.elementor-6 .elementor-element.elementor-element-4395a97 {
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 19px;
  padding: 24px 26px;
  backdrop-filter: blur(16px);

  /* penting untuk smooth */
  transition: 
    background 0.4s cubic-bezier(0.25, 0.8, 0.25, 1),
    transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);

  will-change: transform, background;
}

.elementor-6 .elementor-element.elementor-element-4395a97:hover {
  background: rgba(255, 255, 255, 0.09);
  transform: translateX(6px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-5be4b8d */.elementor-6 .elementor-element.elementor-element-5be4b8d {
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 19px;
  padding: 24px 26px;
  backdrop-filter: blur(16px);

  /* penting untuk smooth */
  transition: 
    background 0.4s cubic-bezier(0.25, 0.8, 0.25, 1),
    transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);

  will-change: transform, background;
}

.elementor-6 .elementor-element.elementor-element-5be4b8d:hover {
  background: rgba(255, 255, 255, 0.09);
  transform: translateX(6px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-86436dd */:root {
      /* Hijau */
      --green-950: #071a0e;
      --green-900: #0d2b1a;
      --green-800: #163d27;
      --green-700: #1e5435;
      --green-600: #286b44;
      --green-500: #34895a;
      --green-400: #4db882;
      --green-300: #85d4ab;
      --green-200: #b7e8cc;
      --green-100: #dff3e8;
      --green-50: #f0faf4;

      /* Emas */
      --gold-600: #a07820;
      --gold-500: #c8a230;
      --gold-400: #dfc05a;
      --gold-100: #fdf4db;

      /* Netral */
      --white: #ffffff;
      --gray-50: #f8faf8;
      --gray-100: #eef2ee;
      --gray-200: #d8e0d8;
      --gray-400: #8fa88f;
      --gray-600: #4a5e4a;
      --gray-900: #111a11;

}

.hero {
      min-height: clamp(520px, 70vh, 760px);

      display: flex;
      align-items: center;

      padding-top: var(--nav-height);

      position: relative;
      overflow: hidden;

      background:
        radial-gradient(
          ellipse 65% 55% at 85% 45%,
          rgba(52, 137, 90, 0.18) 0%,
          transparent 65%
        ),

        radial-gradient(
          ellipse 50% 70% at 5% 90%,
          rgba(30, 84, 53, 0.22) 0%,
          transparent 60%
        ),

        linear-gradient(
          155deg,
          var(--green-950) 0%,
          var(--green-900) 55%,
          #102218 100%
        );
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-69a03eb */.section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: var(--green-600);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 2.5px;
        text-transform: uppercase;
        margin-bottom: 12px;
      }

      .section-tag::before {
        content: "";
        width: 24px;
        height: 2px;
        background: var(--green-500);
        border-radius: 2px;
      }

      .section-heading {
        font-family: var(--font-display);
        font-size: clamp(30px, 4vw, 48px);
        font-weight: 700;
        color: var(--green-900);
        line-height: 1.1;
        margin-bottom: 14px;
      }

      .section-lead {
        font-size: 15.5px;
        color: var(--gray-600);
        line-height: 1.8;
        max-width: 500px;
        font-weight: 400;
      }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6ac6018 */:root {
        /* Hijau */
        --green-950: #071a0e;
        --green-900: #0d2b1a;
        --green-800: #163d27;
        --green-700: #1e5435;
        --green-600: #286b44;
        --green-500: #34895a;
        --green-400: #4db882;
        --green-300: #85d4ab;
        --green-200: #b7e8cc;
        --green-100: #dff3e8;
        --green-50: #f0faf4;

        /* Emas */
        --gold-600: #a07820;
        --gold-500: #c8a230;
        --gold-400: #dfc05a;
        --gold-100: #fdf4db;

        /* Netral */
        --white: #ffffff;
        --gray-50: #f8faf8;
        --gray-100: #eef2ee;
        --gray-200: #d8e0d8;
        --gray-400: #8fa88f;
        --gray-600: #4a5e4a;
        --gray-900: #111a11;

        /* Tipografi */
        --font-display: "Cormorant Garamond", Georgia, serif;
        --font-body: "Plus Jakarta Sans", sans-serif;

        /* Ukuran & Radius */
        --nav-height: 72px;
        --radius-sm: 6px;
        --radius-md: 12px;
        --radius-lg: 20px;
        --radius-xl: 28px;

        /* Shadow */
        --shadow-sm: 0 2px 8px rgba(13, 43, 26, 0.08);
        --shadow-md: 0 6px 24px rgba(13, 43, 26, 0.12);
        --shadow-lg: 0 16px 56px rgba(13, 43, 26, 0.18);

        /* Transisi */
        --ease: cubic-bezier(0.4, 0, 0.2, 1);
        --dur: 0.25s;
      }



/* ============================================================
       SILABUS SECTION
    ============================================================ */
    .section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: var(--green-600);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 2.5px;
        text-transform: uppercase;
        margin-bottom: 12px;
      }

      .section-tag::before {
        content: "";
        width: 24px;
        height: 2px;
        background: var(--green-500);
        border-radius: 2px;
      }

      .section-heading {
        font-family: var(--font-display);
        font-size: clamp(30px, 4vw, 48px);
        font-weight: 700;
        color: var(--green-900);
        line-height: 1.1;
        margin-bottom: 14px;
      }

      .section-lead {
        font-size: 15.5px;
        color: var(--gray-600);
        line-height: 1.8;
        max-width: 500px;
        font-weight: 400;
      }
    
    
      .silabus-section {
        padding: 50px 0;
        background: var(--white);
      }

      .silabus-layout {
        display: grid;
        grid-template-columns: 260px 1fr;
        gap: 36px;
        margin-top: 56px;
        align-items: start;
      }

      .kelas-sidebar {
        background: var(--gray-50);
        border: 1px solid var(--gray-200);
        border-radius: var(--radius-lg);
        padding: 10px;
        position: sticky;
        top: calc(var(--nav-height) + 20px);
      }

      .kelas-sidebar-title {
        font-size: 10.5px;
        font-weight: 700;
        color: var(--gray-400);
        letter-spacing: 2px;
        text-transform: uppercase;
        padding: 8px 12px 12px;
        border-bottom: 1px solid var(--gray-200);
        margin-bottom: 8px;
      }

      .kelas-btn {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px 14px;
        border-radius: var(--radius-md);
        background: none;
        cursor: pointer;
        text-align: left;
        transition: all var(--dur) var(--ease);
        color: var(--gray-600);
      }

      .kelas-btn:hover {
        background: rgba(40, 107, 68, 0.07);
        color: var(--green-700);
      }

      .kelas-btn.active {
        background: linear-gradient(135deg, var(--green-700), var(--green-500));
        color: var(--white);
        box-shadow: 0 6px 20px rgba(40, 107, 68, 0.25);
      }

      .kelas-badge {
        width: 50px;
        height: 50px;
        border-radius: 9px;
        background: rgba(40, 107, 68, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: var(--font-display);
        font-size: 16px;
        font-weight: 700;
        flex-shrink: 0;
      }

      .kelas-btn.active .kelas-badge {
        background: rgba(255, 255, 255, 0.2);
        color: var(--white);
      }

      .kelas-info strong {
        display: block;
        font-size: 13.5px;
        font-weight: 600;
      }

      .kelas-info small {
        font-size: 11.5px;
        opacity: 0.65;
      }

      .silabus-panel {
        display: none;
        animation: panelIn 0.3s var(--ease);
      }

      .silabus-panel.active {
        display: block;
      }

      @keyframes panelIn {
        from {
          opacity: 0;
          transform: translateY(10px);
        }

        to {
          opacity: 1;
          transform: none;
        }
      }

      .panel-header {
        background: linear-gradient(135deg, var(--green-900), var(--green-700));
        border-radius: var(--radius-lg);
        padding: 28px 32px;
        margin-bottom: 22px;
        position: relative;
        overflow: hidden;
      }

      .panel-header::after {
        content: attr(data-num);
        position: absolute;
        right: 24px;
        top: 50%;
        transform: translateY(-50%);
        font-family: var(--font-display);
        font-size: 120px;
        font-weight: 700;
        color: rgba(255, 255, 255, 0.04);
        line-height: 1;
        pointer-events: none;
      }

      .ph-tag {
        font-size: 10.5px;
        color: var(--green-200);
        letter-spacing: 2px;
        text-transform: uppercase;
        font-weight: 700;
        margin-bottom: 6px;
      }

      .ph-title {
        font-family: Cormorant Garamond;
        font-size: 26px;
        font-weight: 700;
        color: var(--white);
        margin-bottom: 4px;
      }

      .ph-sub {
        font-size: 13px;
        color: rgba(255, 255, 255, 0.45);
      }

      .mapel-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
        gap: 13px;
      }

      .mapel-card {
        display: flex;
        gap: 14px;
        align-items: flex-start;
        padding: 18px;
        background: var(--white);
        border: 1px solid var(--gray-200);
        border-radius: var(--radius-md);
        border-left: 4px solid transparent;
        transition:
          border-color var(--dur),
          box-shadow var(--dur),
          transform var(--dur);
      }

      .mapel-card:hover {
        border-left-color: var(--green-500);
        box-shadow: var(--shadow-sm);
        transform: translateY(-2px);
      }

      .mapel-icon {
        width: 42px;
        height: 42px;
        border-radius: var(--radius-sm);
        background: var(--green-100);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        flex-shrink: 0;
      }
      
      .mapel-icon img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

      .mapel-name {
        font-size: 14px;
        font-weight: 600;
        color: var(--green-900);
        line-height: 1.3;
      }

      .mapel-desc {
        font-size: 12px;
        color: var(--gray-400);
        margin-top: 3px;
        line-height: 1.55;
      }

      .mapel-pill {
  display: inline-block;
  margin-top: 7px;
  padding: 2px 10px;
  background: var(--green-100);
  color: var(--green-600);
  border: 1px solid rgba(77, 184, 130, 0.25);
  border-radius: 20px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  text-decoration: none;
  transition: all 0.25s ease;
}

.mapel-pill:hover {
  background: var(--green-500);
  color: white;
  transform: translateY(-1px);
}

.lihat-semua-item {
  display: flex;
  align-items: center;
  justify-content:flex-end;
}

.lihat-semua {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  color: var(--green-700);
  transition: all 0.25s ease;
}

.lihat-semua span {
  transition: transform 0.25s ease;
}

.lihat-semua:hover {
  color: var(--green-500);
}

.lihat-semua:hover span {
  transform: translateX(5px);
}
      
       /* ============================================================
       RESPONSIVE
    ============================================================ */
      @media (max-width: 960px) {
        .hero-inner {
          grid-template-columns: 1fr;
          gap: 40px;
        }

        .hero-cards {
          display: none;
        }

        .silabus-layout {
          grid-template-columns: 1fr;
        }

        .kelas-sidebar {
          position: static;
          display: flex;
          flex-wrap: wrap;
          gap: 8px;
        }

        .kelas-btn {
          width: auto;
          flex: 1;
          min-width: 130px;
        }

        .footer-grid {
          grid-template-columns: 1fr;
          gap: 36px;
        }

        .nav-links {
          display: none;
        }

        .nav-hamburger {
          display: flex;
        }

        .f-row {
          grid-template-columns: 1fr;
        }

        .form-banner,
        .form-body {
          padding: 32px 28px;
        }

        .footer-bottom {
          flex-direction: column;
          gap: 12px;
          text-align: center;
        }
      }
      
      /* ============================================================
   REVEAL ANIMATION
============================================================ */
.reveal{
  opacity:1;
  transform:none;
}

.js-reveal .reveal{
  opacity:0;
  transform:translateY(28px);
  transition:
    opacity .9s ease,
    transform .9s cubic-bezier(.22,1,.36,1);
  will-change:transform,opacity;
}

.js-reveal .reveal.show{
  opacity:1;
  transform:none;
}

.reveal-d1{ transition-delay:.12s; }
.reveal-d2{ transition-delay:.22s; }
.reveal-d3{ transition-delay:.32s; }


/* ============================================================
   PANEL ANIMATION
============================================================ */
.silabus-panel{
  display:none;
  opacity:0;
  transform:translateY(20px);
}

.silabus-panel.active{
  display:block;
  animation:panelSmooth .6s cubic-bezier(.22,1,.36,1) forwards;
}

@keyframes panelSmooth{
  from{
    opacity:0;
    transform:translateY(24px);
  }
  to{
    opacity:1;
    transform:none;
  }
}


/* ============================================================
   CARD STAGGER ANIMATION
============================================================ */
.mapel-card{
  opacity:0;
  transform:translateY(18px) scale(.98);
  animation:cardFade .55s ease forwards;
}

.mapel-card:nth-child(1){animation-delay:.04s;}
.mapel-card:nth-child(2){animation-delay:.08s;}
.mapel-card:nth-child(3){animation-delay:.12s;}
.mapel-card:nth-child(4){animation-delay:.16s;}
.mapel-card:nth-child(5){animation-delay:.20s;}
.mapel-card:nth-child(6){animation-delay:.24s;}
.mapel-card:nth-child(7){animation-delay:.28s;}
.mapel-card:nth-child(8){animation-delay:.32s;}
.mapel-card:nth-child(9){animation-delay:.36s;}

@keyframes cardFade{
  from{
    opacity:0;
    transform:translateY(18px) scale(.98);
  }
  to{
    opacity:1;
    transform:none;
  }
}


/* ============================================================
   SIDEBAR BUTTON ANIMATION
============================================================ */
.kelas-btn{
  position:relative;
  overflow:hidden;
}

.kelas-btn::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    120deg,
    transparent,
    rgba(255,255,255,.12),
    transparent
  );
  transform:translateX(-120%);
  transition:transform .7s ease;
}

.kelas-btn:hover::before{
  transform:translateX(120%);
}


/* ============================================================
   HEADER GLOW
============================================================ */
.panel-header{
  position:relative;
  isolation:isolate;
}

.panel-header::before{
  content:"";
  position:absolute;
  width:220px;
  height:220px;
  border-radius:50%;
  background:rgba(223,192,90,.08);
  top:-80px;
  right:-60px;
  filter:blur(10px);
  z-index:-1;
}

      @media (max-width: 600px) {
        .container{
  padding-inline:16px;
}  
          
        .hero-stats {
          gap: 18px;
        }

        .stat-sep {
          display: none;
        }

        .staff-grid {
          grid-template-columns: 1fr 1fr;
        }

        .rating-row {
          flex-wrap: wrap;
        }

        .buku-grid {
          grid-template-columns: 1fr;
        }
      }
      
      
      /* ============================================================
   SIDEBAR STAGGER ANIMATION
============================================================ */
.kelas-sidebar{
  overflow:hidden;
}

.kelas-btn{
  opacity:0;
  transform:translateX(-28px);
  animation:kelasSlide .65s cubic-bezier(.22,1,.36,1) forwards;
}

/* stagger */
.kelas-btn:nth-child(1){animation-delay:.04s;}
.kelas-btn:nth-child(2){animation-delay:.08s;}
.kelas-btn:nth-child(3){animation-delay:.12s;}
.kelas-btn:nth-child(4){animation-delay:.16s;}
.kelas-btn:nth-child(5){animation-delay:.20s;}
.kelas-btn:nth-child(6){animation-delay:.24s;}
.kelas-btn:nth-child(7){animation-delay:.28s;}
.kelas-btn:nth-child(8){animation-delay:.32s;}
.kelas-btn:nth-child(9){animation-delay:.36s;}

@keyframes kelasSlide{
  from{
    opacity:0;
    transform:translateX(-28px);
  }

  to{
    opacity:1;
    transform:none;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-911e4f9 */.buku-section {
        padding: 50px 0;
        background: var(--gray-50);
      }

.buku-grid,
.buku-card,
.buku-card * {
  user-select: none;
  -webkit-user-select: none;
}

      .buku-grid {
  display: flex;
  gap: 1px;
  overflow-x: auto;
  scroll-behavior: smooth;
   padding: 24px 4px;
  cursor: grab;
  align-items: stretch;

  scrollbar-width: none;
}

.buku-grid::-webkit-scrollbar {
  height: 6px;
}

.buku-grid::-webkit-scrollbar-thumb {
  background: rgba(40, 107, 68, 0.25);
  border-radius: 20px;
}

.buku-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-width: 320px;
  max-width: 320px;
  flex-shrink: 0;
  transition:
    transform .45s cubic-bezier(.22,1,.36,1),
    box-shadow .45s ease,
    opacity .45s ease;
  transform: scale(.88);
}

      .buku-card:hover {
  transform: translateY(-8px) scale(1.03);
  box-shadow: var(--shadow-lg);
}



      .buku-cover {
        height: 130px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 52px;
      }

      .buku-cover.g1 {
        background: linear-gradient(135deg, #163d27, #34895a);
      }

      .buku-cover.g2 {
        background: linear-gradient(135deg, #14305a, #2a6ab8);
      }

      .buku-cover.g3 {
        background: linear-gradient(135deg, #3d2010, #b86030);
      }

      .buku-cover.g4 {
        background: linear-gradient(135deg, #2a1040, #8030b0);
      }

      .buku-cover.g5 {
        background: linear-gradient(135deg, #103838, #20a0a0);
      }

      .buku-cover.g6 {
        background: linear-gradient(135deg, #383010, #a0a020);
      }

      .buku-body {
        padding: 22px;
        flex: 1;
      }

      .buku-cat {
        font-size: 10.5px;
        color: var(--green-600);
        font-weight: 700;
        letter-spacing: 1.8px;
        text-transform: uppercase;
        margin-bottom: 7px;
      }

      .buku-title {
        font-family: var(--font-display);
        font-size: 19px;
        font-weight: 700;
        color: var(--green-900);
        line-height: 1.3;
        margin-bottom: 6px;
      }

      .buku-author {
        font-size: 13px;
        color: var(--gray-400);
      }

      .buku-foot {
        padding: 14px 22px;
        border-top: 1px solid var(--gray-100);
        display: flex;
        align-items: center;
        justify-content: space-between;
      }

      .buku-edition {
        font-size: 12px;
        color: var(--gray-400);
      }

      .btn-dl {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 7px 16px;
        background: var(--green-100);
        color: var(--green-700);
        border: 1px solid rgba(77, 184, 130, 0.28);
        border-radius: var(--radius-sm);
        font-size: 12.5px;
        font-weight: 700;
        transition: all var(--dur);
        cursor: pointer;
      }

      .btn-dl:hover {
        background: var(--green-600);
        color: var(--white);
        border-color: var(--green-600);
      }
      
.buku-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  display: block;
}

.lihat-semua-wrap {
  margin-top: 4px;
  text-align: center;
}

.lihat-semua-buku {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--green-700);
  text-decoration: none;
  transition: all .3s ease;
}

.lihat-semua-buku span {
  transition: transform .3s ease;
}

.lihat-semua-buku:hover {
  color: var(--gold-600);
}

.lihat-semua-buku:hover span {
  transform: translateX(5px);
}

.buku-slider-wrap {
  position: relative;
}

.buku-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;

  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: none;

  background: rgba(255,255,255,.92);
  box-shadow: 0 8px 24px rgba(0,0,0,.08);

  cursor: pointer;
  transition: all .25s ease;

  font-size: 24px;
  color: var(--green-700);
}

.buku-arrow:hover {
  transform: translateY(-50%) scale(1.08);
  background: var(--green-700);
  color: white;
}

.buku-arrow.prev {
  left: -18px;
}

.buku-arrow.next {
  right: -18px;
}

@media (max-width:768px){

  .buku-section{
    padding:20px 1px;
    overflow:hidden;
  }

  .buku-grid{

  gap:14px;
  padding:18px 16px 10px;

  overflow-x:auto;
  -webkit-overflow-scrolling:touch;

  touch-action:pan-x;

  scroll-snap-type:x mandatory;
}

.buku-card{

  min-width:100%;
  max-width:100%;

  transform:none;

  scroll-snap-align:center;
}

  .buku-card:hover{
  transform:translateY(-4px);
}

  .buku-cover{
    height:110px;
    font-size:42px;
  }

  .buku-body{
    padding:18px;
  }

  .buku-title{
    font-size:17px;
    line-height:1.35;
  }

  .buku-author{
    font-size:12px;
  }

  .buku-foot{
    padding:12px 18px;
    gap:10px;
  }

  .btn-dl{
    padding:8px 14px;
    font-size:12px;
    white-space:nowrap;
  }

  .lihat-semua-wrap{
    margin-top:14px;
    text-align:right;
  }

  .lihat-semua-buku{
    font-size:14px;
  }

  .buku-arrow{
  width:36px;
  height:36px;

  font-size:20px;
}

.buku-arrow.prev{
  left:4px;
}

.buku-arrow.next{
  right:4px;
}
}/* End custom CSS */