/* ===== Perbaikan responsif landing page ===== */
html,body{max-width:100%;overflow-x:hidden}
.w-container{max-width:100%}
.brand-title{font-size:clamp(16px,4.6vw,26px);line-height:1.3;padding:0 8px}

/* --- Marquee logo: dua grup identik, bergeser 50% = tanpa celah --- */
.brand-logo-area{display:block!important;overflow:hidden;position:relative;padding:12px 0;margin-top:40px}
.brand-logo-wrap{display:flex!important;align-items:center;justify-content:flex-start!important;width:max-content!important;min-width:0!important;gap:0!important;animation:asaMarquee 40s linear infinite!important;will-change:transform}
.brand-logo-holder{display:flex!important;align-items:center;flex:none;gap:80px;padding-right:80px;transform:none!important}
.brand-logo{flex:none;margin:0!important}
.brand-logo img{height:60px;width:auto;display:block}
@keyframes asaMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.brand-left-shade,.brand-right-shade{pointer-events:none;z-index:2}
@media(max-width:767px){
 .brand-logo-holder{gap:48px;padding-right:48px}
 .brand-logo img{height:40px}
 .brand-logo-wrap{animation-duration:28s!important}
 .brand-left-shade,.brand-right-shade{max-width:40px!important}}
@media(prefers-reduced-motion:reduce){.brand-logo-wrap{animation-duration:140s!important}}

/* --- Kartu hero: di HP/tablet jadi baris geser (swipe), kompak --- */
@media(max-width:991px){
 .home-banner-section{padding-top:80px}
 .home-banner-card-area{display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;align-items:stretch!important;gap:14px!important;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:20px 20px 26px!important;margin-top:32px!important}
 .home-banner-card-area::-webkit-scrollbar{display:none}
 .home-banner-card-holder{flex:0 0 min(62vw,230px)!important;max-width:none!important;margin:0!important;scroll-snap-align:center}
 .home-banner-card,.home-banner-card.second-card,.home-banner-card.third-card,.home-banner-card.fourth-card,.home-banner-card.fifth-card,.home-banner-card.first-card{margin:0!important;width:100%;height:100%;padding:14px!important;border-radius:18px!important;transform:none!important;box-sizing:border-box}
 .home-banner-card-wrap{font-size:13px!important;line-height:1.25;padding:6px 12px!important;text-align:left}
 .home-banner-card-image-wrap{margin-top:12px!important;border-radius:14px!important;width:100%}
 .home-banner-card-image-wrap img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}}

/* --- Kartu fitur: 3 kolom, 2 kolom, 1 kolom --- */
.service-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}
.service-card,.service-card.left-side,.service-card.right-side,.service-card.main{margin:0!important;min-width:0;animation:none!important;padding:clamp(22px,3.4vw,40px)!important;box-sizing:border-box}
.service-card-title{font-size:clamp(18px,4.6vw,24px)!important;line-height:1.2!important;margin-top:22px!important;margin-bottom:12px!important;overflow-wrap:anywhere}
.service-card-text{overflow-wrap:break-word;margin-bottom:18px!important}
.service-icon-wrap svg{max-width:100%;height:auto}
@media(hover:hover){.service-card:hover{transform:translateY(-6px)!important}}
@media(hover:none){.service-card:hover{transform:none!important;box-shadow:none!important}}
@media(max-width:991px){.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important}}
@media(max-width:600px){.service-grid{grid-template-columns:1fr!important;gap:16px!important}}

/* --- Logo teks, section fitur, navigasi responsif --- */
.logo-txt{font-weight:800;font-size:24px;color:#2a1410;font-family:inherit}
.logo-txt b{background:#ff6a3d;color:#2a1410;padding:2px 9px;border-radius:10px;margin-left:3px}
.nav-toggle-input,.nav-burger{display:none}
.service-section{padding-left:clamp(16px,5vw,120px)!important;padding-right:clamp(16px,5vw,120px)!important;padding-top:clamp(56px,9vw,120px)!important}
.foot1{padding-left:clamp(16px,5vw,50px)!important;padding-right:clamp(16px,5vw,50px)!important}
@media(max-width:991px){
 .navbar-new{position:relative}
 .nav-area{position:relative;flex-wrap:nowrap}
 .nav-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;border-radius:14px;background:#fff;box-shadow:0 2px 10px #0002;align-items:center;cursor:pointer;z-index:30}
 .nav-burger i,.nav-burger::before,.nav-burger::after{content:"";display:block;width:22px;height:3px;border-radius:3px;background:#2a1410}
 .nav-burger i{content:none}
 .nav-menu-new{display:none!important;position:absolute;top:calc(100% + 10px);left:0;right:0;z-index:25;flex-direction:column!important;align-items:stretch!important;max-width:none!important;background:#fff;border-radius:20px;padding:16px!important;box-shadow:0 14px 40px #0003}
 .nav-toggle-input:checked ~ .nav-menu-new{display:flex!important}
 .nav-menu-wrap{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:2px}
 .nav-menu-new .nav-link-new{display:block;padding:12px 14px!important;color:#2a1410!important}
 .navigation-dropdown .nav-dropdown-list{position:static!important;display:block!important;box-shadow:none!important;background:transparent!important;padding:0 0 0 14px!important}
 .nav-dropdown-link{display:block;padding:8px 14px!important;color:#2a1410!important}
 .nav-icon{display:none}
 .nav-button-wrap-new{margin-top:8px;padding-left:0!important;justify-content:stretch!important}
 .nav-button-wrap-new .nav-button-dark{width:100%;justify-content:center}}
.service-arrow-link .button-icon{display:none}
.service-arrow-link::after{content:"→";margin-left:8px;font-size:1.1em}
@media(max-width:991px){.nav-menu-new,.nav-menu-wrap,.nav-menu-new .nav-link-new,.nav-dropdown-link{text-align:left!important;justify-content:flex-start}}