/* 
Theme Name: Child Theme
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: ToffeeDev Team | Zahaby
Author URI: https://toffeedev.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Lang Switch */
.custom-lang-switcher {
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    gap: 15px; /* gap dibesarin biar garisnya nggak nempel ke text */
    margin: auto;
}

.custom-lang-switcher:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(50%, -50%);
    width: 2px;
    height: 70%; /* atau 100%, sesuai selera */
    background: #001689;
}

.custom-lang-switcher a {
    color: #71758A;
    font-weight: 800;
    text-decoration: none;
}

.custom-lang-switcher a.active {
    color: #001689;
}

/* BTN ICON 24 PX */
.btn-icon span.elementor-button-icon {
    font-size:24px;
}

.btn-icon .elementor-button-content-wrapper{
    align-items:center;
}

.btn-icon:hover span.elementor-button-text {
    font-weight:700;
}

/* ===== Brand & Communication Portal Form (ID: 3) BYW Page ===== */

/* Container form */
#gform_wrapper_3 {
    max-width: 1200px;
    margin: 0 auto;
}

/* Title */
#gform_wrapper_3 .gform_title {
    color: #fff;
    text-align: center;
    font-weight: 700;
    margin-bottom: 40px;
}

/* Hide all labels (pakai placeholder aja) */
#gform_wrapper_3 .gfield_label {
    display: none !important;
}

/* Grid 3 kolom */
#gform_wrapper_3 .gform_fields {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 16px !important;
}

/* Kolom 1: Name + Mail (stacked) */
#gform_wrapper_3 #field_3_1 {  /* Your Name */
    grid-column: 1;
    grid-row: 1;
    height:64px;
}
#gform_wrapper_3 #field_3_4 {  /* Your Mail */
    grid-column: 1;
    grid-row: 2;
    height:64px;
}

/* Kolom 2: Phone + Subject (stacked) */
#gform_wrapper_3 #field_3_3 {  /* Phone Number */
    grid-column: 2;
    grid-row: 1;
    height:64px;
}
#gform_wrapper_3 #field_3_5 {  /* Subject */
    grid-column: 2;
    grid-row: 2;
    height:64px;
}

/* Kolom 3: Message (span 2 rows, full height) */
#gform_wrapper_3 #field_3_6 {  /* Your Message */
    grid-column: 3;
    grid-row: 1 / span 2;
    height: 144px;
}

#gform_wrapper_3 #field_3_6 .ginput_container.ginput_container_textarea{
    height:100%;
}

/* Input & Textarea — glassmorphism style */
#gform_wrapper_3 input[type="text"],
#gform_wrapper_3 input[type="email"],
#gform_wrapper_3 input[type="tel"],
#gform_wrapper_3 textarea {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 12px !important;
    color: #fff !important;
    padding: 18px 20px !important;
    font-size: 14px !important;
    width: 100% !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: all 0.3s ease;
    box-sizing: border-box;
    height:64px;
	text-align:left;
}

/* Textarea height match dengan 2 input di kolom kiri */
#gform_wrapper_3 textarea {
    height: 100% !important;
    min-height: 130px;
    resize: none;
}

/* Placeholder color */
#gform_wrapper_3 input::placeholder,
#gform_wrapper_3 textarea::placeholder {
    color: rgba(255, 255, 255, 1) !important;
    opacity: 1;
}

/* Focus state */
#gform_wrapper_3 input:focus,
#gform_wrapper_3 textarea:focus {
    background: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Submit button container — align kanan */
#gform_wrapper_3 .gform_footer {
    display: flex !important;
    justify-content: flex-end !important;
    margin-top: 24px !important;
    padding: 0 !important;
}

/* Submit button — yellow pill */
#gform_wrapper_3 .gform_button {
    background: #FFC107 !important;
    color: #1a1a3e !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 14px 32px !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

#gform_wrapper_3 .gform_button:hover {
    background: #FFD54F !important;
}

/* Arrow icon setelah text */
/* Submit button — yellow pill */
#gform_wrapper_3 .gform_button {
    background: #FFC107 !important;
    color: #1a1a3e !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 14px 48px 14px 32px !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    cursor: pointer;
    transition: all 0.3s ease;
    
    /* Arrow icon dari URL */
    background-image: url('https://toffee-stg.site/lautan-luas/wp-content/uploads/2026/04/Icon-core-arrow-right-blue.svg') !important;
    background-repeat: no-repeat !important;
    background-position: right 20px center !important;
    background-size: 16px auto !important;
    background-color: #FFC107 !important;
}

#gform_wrapper_3 .gform_button:hover {
    background-color: #FFD54F !important;
    background-image: url('https://toffee-stg.site/lautan-luas/wp-content/uploads/2026/04/Icon-core-arrow-right-blue.svg') !important;
    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    background-size: 16px auto !important;
}

/* Responsive — mobile jadi 1 kolom */
@media (max-width: 768px) {
    #gform_wrapper_3 .gform_fields {
        grid-template-columns: 1fr !important;
    }
    
    #gform_wrapper_3 #field_3_1,
    #gform_wrapper_3 #field_3_3,
    #gform_wrapper_3 #field_3_4,
    #gform_wrapper_3 #field_3_5,
    #gform_wrapper_3 #field_3_6 {
        grid-column: 1 !important;
        grid-row: auto !important;
    }
    
    #gform_wrapper_3 textarea {
        min-height: 120px;
    }
    
    #gform_wrapper_3 .gform_footer {
        justify-content: center !important;
    }
	
	#gform_wrapper_3 .gform_button{
		width:100%;
		background-image: unset !important;
	}
	
	#gform_wrapper_3 .gform_button:hover{
		background-image: unset !important;
	}
}

/* BYW - BYW Page */
/* nav */
.wrap-carousel-byw {
    position: relative;
    padding-bottom: 60px; /* ruang untuk arrow di bawah */
}

.wrap-carousel-byw .owl-nav {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 5px;
    margin: 0;
}

.wrap-carousel-byw .owl-nav > button {
    position: static !important;
    background: #ffffff4f !important;
    height: 40px;
    width: 40px;
    border-radius: 100% !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wrap-carousel-byw .owl-nav > button i {
    color: #fff;
}

.wrap-carousel-byw .owl-nav > button.owl-next:focus,
.wrap-carousel-byw .owl-nav > button.owl-prev:focus,
.wrap-carousel-byw .owl-nav > button.owl-next:hover,
.wrap-carousel-byw .owl-nav > button.owl-prev:hover {
    outline: none !important;
}

/* News Home Slider */
a.card-news-home:hover{
    text-decoration:none;
}

a.card-news-home {
    height:420px;
    overflow:hidden;
    display:inline-block;
    background:#001689;
    border-radius:20px;
}

a.card-news-home .image-news-home{
    height:65%;
    transition:.3s !important;
}

a.card-news-home .image-news-home img{
    height:100%;
    width:100%;
    object-fit:cover;
}

a.card-news-home .content-news-home{
    padding:20px;
    transition:.3s !important;
    height:35%;
}

a.card-news-home:hover .content-news-home,
a.card-news-home:hover .image-news-home{
    height:50% !important;
}

a.card-news-home .content-news-home p.date{
    color:#FED737;
    font-style:italic;
}

a.card-news-home .content-news-home h3{
    font-size:24px;
    color:white;
    margin-top:10px;
}

a.card-news-home .content-news-home .excerpt-news p{
    color:#fff;
    transition:.3s;
    opacity:0;
}

a.card-news-home:hover .content-news-home .excerpt-news p{
    opacity:1;
}

/* nav */
.wrap-carousel-news .owl-nav{
    position: absolute;
    width: 100%;
    bottom:0px;
}

.wrap-carousel-news .owl-nav > button{
    position: absolute;
    background:#00168930 !important;
    height:40px;
    width:40px;
    border-radius:100% !Important;
}

.wrap-carousel-news .owl-nav > button i{
    color:#001689;
}

.wrap-carousel-news .owl-nav > button.owl-prev {
    left: 0;
}

.wrap-carousel-news .owl-nav > button.owl-next {
    left: 45px;
}

.wrap-carousel-news .owl-nav > button.owl-next:focus,
.wrap-carousel-news .owl-nav > button.owl-prev:focus,
.wrap-carousel-news .owl-nav > button.owl-next:hover,
.wrap-carousel-news .owl-nav > button.owl-prev:hover{
    outline:none !Important;
}

.wrap-carousel-news .owl-nav > button:focus{
    outline: none;
}


/* ATF Home Slider */
.main-wrapper-slider {
    position:relative;
}

.main-wrapper-slider .slider-nav-titles{
    width:unset;
    margin:auto;
    position:absolute;
    bottom:10%;
    z-index:2;
    display:flex;
    gap:16px;
}
/*  */

.wrapper-slider .slider{
    position:relative;
}

.wrapper-slider .slider .overlay{
    height:50%;
    width:100%;
    position:absolute;
    background:linear-gradient(#00000000,#121735);
    bottom:0;
}

/*  */
.main-wrapper-slider .slider-nav-titles a{
    color:#fff;
    opacity:.7;
    font-weight:300;
    padding-bottom:10px;
    border-bottom:1px solid #fff00;
    font-size:20px;
}

.main-wrapper-slider .slider-nav-titles a:hover{
    text-decoration:none;
}

.main-wrapper-slider .slider-nav-titles a.slides-active,
.main-wrapper-slider .slider-nav-titles a:hover{
    opacity:1;
    border-bottom:1px solid #fff;
}

/* nav */
.wrap-carousel-slides .owl-nav > button i{
    color:#Fff;
    font-size:20px;
}

.wrap-carousel-slides .owl-nav > button.owl-next:focus,
.wrap-carousel-slides .owl-nav > button.owl-prev:focus,
.wrap-carousel-slides .owl-nav > button.owl-next:hover,
.wrap-carousel-slides .owl-nav > button.owl-prev:hover{
    outline:none !Important;
}

.wrap-carousel-slides .owl-nav > button:focus{
    outline: none;
}

/* ATF BYW SLIDER */

.wrap-carousel-slides-byw .owl-nav > button i{
    color:#Fff;
    font-size:20px;
}

.wrap-carousel-slides-byw .owl-nav > button.owl-next:focus,
.wrap-carousel-slides-byw .owl-nav > button.owl-prev:focus,
.wrap-carousel-slides-byw .owl-nav > button.owl-next:hover,
.wrap-carousel-slides-byw .owl-nav > button.owl-prev:hover{
    outline:none !Important;
}

.wrap-carousel-slides-byw .owl-nav > button:focus{
    outline: none;
}

/* PDP Industries */
/* nav */
.wrap-carousel-app {
    position: relative;
    padding-bottom: 60px; /* ruang untuk arrow di bawah */
}

.wrap-carousel-app .owl-nav {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 5px;
    margin: 0;
}

.wrap-carousel-app .owl-nav > button {
    position: static !important;
    background: #00168930 !important;
    height: 40px;
    width: 40px;
    border-radius: 100% !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wrap-carousel-app .owl-nav > button i {
    color: #001689;
}

.wrap-carousel-app .owl-nav > button.owl-next:focus,
.wrap-carousel-app .owl-nav > button.owl-prev:focus,
.wrap-carousel-app .owl-nav > button.owl-next:hover,
.wrap-carousel-app .owl-nav > button.owl-prev:hover {
    outline: none !important;
}

/*  */

.card-app-link{
    display:inline-block;
    height:166px;
    overflow:hidden;
    position:relative;
    border-radius:10px;
	width:100%;
}

.card-app-link .card-app,
.card-app-link .card-app .card-app-thumb,
.card-app-link .card-app .card-app-thumb img{
    height:100%;
}

.card-app-link .card-app .overlay{
    position:absolute;
    height:100%;
    width:100%;
    background:#001689;
    opacity:0.3;
    bottom:0;
}

.card-app-link .card-app .card-app-thumb img{
    object-fit:cover;
}

.card-app-body{
    position:absolute;
    bottom:0;
    width:100%;
    height:100%;
    text-align:center;
    display:flex;
    flex-flow:column;
    justify-content:center;
    z-index:1;
}

.card-app-body h3{
    font-size:20px;
    color:#fff;
}

/* Menu Industries */
.menu-industries{
    display:flex;
    flex-flow:column;
    gap:5px;
}

.menu-industries a:hover{
    text-decoration:none;
    background:#F2F3F9;
}

.menu-industries a {
    padding:13px 20px;
    border-radius:10px;
    text-decoration:none;
    color:#000;
    font-weight:700;
    transition:.2s;
}

/* LTLS Experience Center */
.card-exp {
    height:300px;
    overflow:hidden;
    border-radius:20px;
    position:relative;
}

.card-exp .card-exp-body{
    position:absolute;
    bottom:0;
    height:100%;
    background:linear-gradient(#00168991,#0016896e);
    display:flex;
    align-items:end;
    padding:20px;
    transition:.2s;
	width:100%;
	justify-content:center;
}

.card-exp:hover .card-exp-body{
    background:linear-gradient(#00168900,#00168970);
}

.card-exp .card-exp-body h3{
    color:#fff;
    text-align:center;
    font-size:20px;
}

.card-exp-thumb{
    height:100%;
}

.card-exp-thumb img{
    height:100%;
    object-fit:cover
}

/* nav */
.wrap-carousel-exp {
    position: relative;
    padding-bottom: 60px; /* ruang untuk arrow di bawah */
}

.wrap-carousel-exp .owl-nav {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 5px;
    margin: 0;
}

.wrap-carousel-exp .owl-nav > button {
    position: static !important;
    background: #00168930 !important;
    height: 40px;
    width: 40px;
    border-radius: 100% !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wrap-carousel-exp .owl-nav > button i {
    color: #001689;
}

.wrap-carousel-exp .owl-nav > button.owl-next:focus,
.wrap-carousel-exp .owl-nav > button.owl-prev:focus,
.wrap-carousel-exp .owl-nav > button.owl-next:hover,
.wrap-carousel-exp .owl-nav > button.owl-prev:hover {
    outline: none !important;
}

/* Partner Gallery */
.wrap-carousel-partner .image-partner{
    height:150px;
}

.wrap-carousel-partner .image-partner img{
    height:100%;
    object-fit:contain;
}

/* nav */

.wrap-carousel-partner .owl-nav{
    position: absolute;
    width: 100%;
    bottom:-50px;
}

.wrap-carousel-partner .owl-nav > button{
    position: absolute;
    background:#00168930 !important;
    height:40px;
    width:40px;
    border-radius:100% !Important;
}

.wrap-carousel-partner .owl-nav > button i{
    color:#001689;
}

.wrap-carousel-partner .owl-nav > button.owl-prev {
    right: 45px;
}

.wrap-carousel-partner .owl-nav > button.owl-next {
    right: 0;
}

.wrap-carousel-partner .owl-nav > button.owl-next:focus,
.wrap-carousel-partner .owl-nav > button.owl-prev:focus,
.wrap-carousel-partner .owl-nav > button.owl-next:hover,
.wrap-carousel-partner .owl-nav > button.owl-prev:hover{
    outline:none !Important;
}

.wrap-carousel-partner .owl-nav > button:focus{
    outline: none;
}


/* Distribution / Industries - Distribution / Industries Archive Page */
.card-industries {
    height:400px;
    overflow:hidden;
    margin-bottom:30px;
    border-radius:20px;
    position:relative;
}

.card-industries a.image-industries{
    height:100%;
    display:inline-block;
}

.card-industries a.image-industries img{
    height:100%;
    object-fit:cover;
}

.card-industries .content-industries{
    position:absolute;
    padding:20px;
    background:#001689;
    bottom:0;
    height:25%;
    transition:.3s;
    text-align:left;
    /* display:flex;
    flex-flow:column;
    justify-content:space-between; */
}

.card-industries:hover .content-industries{
    height:56%;
}

.card-industries .content-industries *{
    color:white;
}

.card-industries:hover .content-industries *{
    text-decoration:none;
}

.card-industries .content-industries a h3{
    font-size:24px;
    font-weight:700;
}

.card-industries .content-industries p.excerpt{
    display:inline-block;
    max-height:72px;
}

.card-industries .content-industries .btn-industries{
    display:inline-block;
    margin-top:16px;
    padding-bottom:10px;
    border-bottom:1px solid;
	font-weight:700;
}

.card-industries .content-industries .btn-industries img{
    height:12px;
    margin-left:16px;
}

.card-industries .content-industries .excerpt,
.card-industries .content-industries .btn-industries{
    opacity:0;
    transition:.3s;
}

.card-industries:hover .content-industries .excerpt,
.card-industries:hover .content-industries .btn-industries{
    opacity:1;
}

/* Industries Home */
.card-industries .content-industries .btn-industries.home{
    display:flex;
    align-items:center;
    width: 40% !important;
    justify-content:space-between;
}

.card-industries .content-industries .btn-industries.home img{
    width:auto !important;
}

.wrap-carousel-industries .owl-nav{
    position: absolute;
    width: 100%;
    bottom:16px;
}

.wrap-carousel-industries .owl-nav > button{
    position: absolute;
    background:#00168930 !important;
    height:40px;
    width:40px;
    border-radius:100% !Important;
}

.wrap-carousel-industries .owl-nav > button i{
    color:#001689;
}

.wrap-carousel-industries .owl-nav > button.owl-prev {
    left: 0px;
}

.wrap-carousel-industries .owl-nav > button.owl-next {
    left: 42px;
}

.wrap-carousel-industries .owl-nav > button.owl-next:focus,
.wrap-carousel-industries .owl-nav > button.owl-prev:focus,
.wrap-carousel-industries .owl-nav > button.owl-next:hover,
.wrap-carousel-industries .owl-nav > button.owl-prev:hover{
    outline:none !Important;
}

.wrap-carousel-industries .owl-nav > button:focus{
    outline: none;
}


/* Our Business Category Archive */
a.card-business-cat {
    height:300px;
    overflow:hidden;
    display:inline-block;
    border-radius:20px;
    position:relative;
    width: 100%;
	margin-bottom:30px;
}

a.card-business-cat .image-business-cat{
    height:100%;
    width:100%;
    object-fit:cover;
}

a.card-business-cat .overlay{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    background:#00168978;
    transition:.3s;
}

a.card-business-cat:hover .overlay{
    background:#ffffffc9;
}

.content-business-cat{
    position:absolute;
    top:0;
    padding:20px 20px 20px 20px;
    display:flex;
    flex-flow:column;
    height:100%;
    width: 100%;
    justify-content: end;
}

.content-business-cat img{
    height:80px;
    width:auto;
    margin:0 auto;
    object-fit:contain;
    filter: brightness(0) invert(1);
    transition:.3s;
}

a.card-business-cat:hover .content-business-cat img{
    filter: brightness(1) invert(0);
}

.content-business-cat h3{
    font-size:20px;
    margin-top:60px;
    transition:.3s;
    color:#fff;
	height:50px;
}

a.card-business-cat:hover .content-business-cat h3{
    color:#001689;
}

/* Activity - Career Page */
.image-activity{
    height:265px;
    border-radius:10px;
    overflow:hidden;
}

.image-activity img{
    height:100%;
    object-fit:cover;
}

.wrap-carousel-activity .owl-item.active.center{
    transform:scale(1) !important;
}

.wrap-carousel-activity .owl-item{
    transform:scale(.8) !important;
}

/* nav */
.wrap-carousel-activity .owl-nav{
    position: absolute;
    width: 100%;
    top:35%;
}

.wrap-carousel-activity .owl-nav > button{
    position: absolute;
    background:#00168930 !important;
    height:40px;
    width:40px;
    border-radius:100% !Important;
}

.wrap-carousel-activity .owl-nav > button.owl-prev {
    left: -80px;
}

.wrap-carousel-activity .owl-nav > button.owl-next {
    right: -80px;
}

.wrap-carousel-activity .owl-nav > button.owl-next:focus,
.wrap-carousel-activity .owl-nav > button.owl-prev:focus,
.wrap-carousel-activity .owl-nav > button.owl-next:hover,
.wrap-carousel-activity .owl-nav > button.owl-prev:hover{
    outline:none !Important;
}

.wrap-carousel-activity .owl-nav > button:focus{
    outline: none;
}

/* dots */
.wrap-carousel-activity .owl-dots{
    margin-top:30px;
}

.wrap-carousel-activity .owl-dots span{
    background: #00168947 !important;
}

.wrap-carousel-activity .owl-dots .active span{
    background: #001689 !important;
}

/* Press Release - Press Release Page */
.card-press {
    margin-bottom:30px;
    display:flex;
    align-items:self-start;
    padding:30px;
    transition:.4s;
    border-bottom:5px solid #00000000;
}

.card-press:hover{
    background:#F2F3F9;
    border-bottom:5px solid #DCE2FF;
}

.card-press .date-press{
    width:25%;
    margin-top:-20px;
}

.card-press .date-press .date{
    color:#001689;
    font-size:52px;
	font-weight:800;
}

.card-press .date-press .month{
    font-weight:600;
}

.card-press .content-press{
    width:75%;
    display:flex;
    flex-flow:column;
    align-items:end;
}

.card-press .content-press a.title-press{
    width:100%;
}

.card-press .content-press a.title-press:hover,
.card-press .content-press .btn-press:hover{
    text-decoration:none;
}

.card-press .content-press .btn-press{
    margin-top:30px;
    gap:10px;
    align-items:center;
    display:flex;
    padding-bottom:6px;
    border-bottom:2px solid #001689
}

.card-press .content-press .btn-press span{
    text-transform:uppercase;
    color:#001689;
	font-weight:800;
}

.card-press .content-press .btn-press img{
    height:12px;
}

/* pagination */

.row-press .pagination{
    justify-content:start;
    gap:10px;
}

.row-press .pagination span,
.row-press .pagination a{
    color:#001689;
}

.row-press .pagination span.current{
    font-weight:bold;
}

/* News - News Page */
.row.row-news {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px;
    justify-content:start;
}

.row.row-news > [class*="col-"] {
    padding: 0;
    flex: 0 0 auto;
    max-width: none; /* override default Bootstrap */
}

/* Mobile: 1 column */
.row.row-news > .col-12 {
    width: 100%;
}

/* Tablet: 3 column */
@media (min-width: 768px) {
    .row.row-news > .col-md-4 {
        width: calc((100% - 40px) / 3); /* 20px gap × 2 = 40px */
    }
}

/* Desktop: 4 column */
@media (min-width: 992px) {
    .row.row-news > .col-lg-3 {
        width: calc((100% - 60px) / 4); /* 20px gap × 3 = 60px */
    }
}

@media (max-width: 767px) {
	.row.row-news {
		gap: 0;
		justify-content:space-between;
	}
}

a.card-news {
    display:inline-block;
    margin-bottom:30px;
    padding:10px;
    background:#F2F3F9;
    transition:.3s;
    border-radius:20px;
    text-align:center;
    height:425px;
}

a.card-news:hover{
	text-decoration:none;
    box-shadow:0px 3px 29px rgb(0,22,137,18%);
}

a.card-news .image-news{
    height:220px;
    width:100%;
    margin-bottom:16px;
	border-radius:16px;
	overflow:hidden;
}

a.card-news .image-news img{
    height:100%;
    width:100%;
    object-fit:cover;

}

a.card-news h3{
    font-size:20px;
    color:#001689;
    font-weight:300;
	font-weight:800;
    margin:16px 0;
	
	display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

a.card-news:hover .excerpt-news *,
a.card-news .excerpt-news *{
    color:#121735;
}

/* pagination */
.row-news .pagination{
    justify-content:start;
    gap:10px;
}

.row-news .pagination span,
.row-news .pagination a{
    color:#001689;
}

.row-news .pagination span.current{
    font-weight:bold;
}

/* Breadcrumb Chevron All */
img.chev-breadcrumb {
    height:6px;
    margin:0 5px;
    opacity:.7;
}

/* History : Single Page */
.card-history {
    position:relative;
    border-radius:10px;
    overflow:hidden;
    height:300px;
}

.card-history img{
    height:300px;
    width:100%;
    object-fit:cover;
	object-position:top center;
}

.content-history{
    position:absolute;
    bottom:-232px;
    height:100%;
    display:flex;
    flex-flow:column;
    justify-content:start;
    align-items:center;
    text-align:center;
    padding:12px;
    transition:.4s;
}

.card-history:hover .content-history{
    bottom:-60px;
}

.content-history *{
    color:#fff !important;
}

.content-history h3{
    font-size:38px;
    font-weight:800;
}

.card-history .overlay{
    background: #0016899e;
    position:absolute;
    bottom:0;
    width: 100%;
    height:100%;
    opacity:0;
    transition:.3s;
}

.card-history:hover .overlay{
    opacity:1;
}

/* nav */

.wrap-carousel-history .owl-nav{
    position: absolute;
    width: 100%;
    top:-70px;
}

.wrap-carousel-history .owl-nav > button{
    position: absolute;
    background:#00168930 !important;
    height:40px;
    width:40px;
    border-radius:100% !Important;
}

.wrap-carousel-history .owl-nav > button i{
    color:#001689;
}

.wrap-carousel-history .owl-nav > button.owl-prev {
    right: 45px;
}

.wrap-carousel-history .owl-nav > button.owl-next {
    right: 0;
}

.wrap-carousel-history .owl-nav > button.owl-next:focus,
.wrap-carousel-history .owl-nav > button.owl-prev:focus,
.wrap-carousel-history .owl-nav > button.owl-next:hover,
.wrap-carousel-history .owl-nav > button.owl-prev:hover{
    outline:none !Important;
}

.wrap-carousel-history .owl-nav > button:focus{
    outline: none;
}

/* Single Page : Contact Us */
.contact-forms-custom form h4{
    margin:0;
    color:#001689;
    font-weight:300;
}

.contact-forms-custom #field_1_8,
.contact-forms-custom #field_1_5{
	margin-bottom:-20px;
}

.contact-forms-custom #field_1_5{
	margin-top:20px;
}

.contact-forms-custom form .gform-field-label.gform-field-label--type-inline{
    color:#001689;
    font-weight:700;
}

.contact-forms-custom form select{
    display:flex;
    align-items:center;
}

.contact-forms-custom form select,
.contact-forms-custom form input[type="text"],
.contact-forms-custom form input[type="email"]{
    height:58px !Important;
}

.contact-forms-custom form select:focus,
.contact-forms-custom form input:focus{
    outline:none;
}

.contact-forms-custom .gform_footer.top_label:after {
    content:'';
    height:22px;
    width:22px;
    position:absolute;
    z-index:999;
    right:28px;
    background:url(https://toffee-stg.site/lautan-luas/wp-content/uploads/2026/04/Icon-core-arrow-right-blue.svg);
    background-size:100% 100%;
    background-repeat:no-repeat;
    /* background-color:red; */
}

.contact-forms-custom .gform_footer.top_label{
    display:flex;
    align-items:center;
    justify-content:center;
}

/* Sidebar Menu All Pages */
.sidebar-menu-custom a.elementor-item {
    display: inline-block;
}

.sidebar-menu-custom a.elementor-item:before{
    border-radius: 10px !important;
}

@media only screen and (max-width: 890px){
    .sidebar-menu-custom ul.elementor-nav-menu{
		flex-wrap:nowrap;
		width:100%;
		overflow-x:scroll;
		padding-bottom:10px;
	}
}

/* Bod - Single Page */
.bod-wrapper-child h3.bod-title {
    margin-bottom:25px;
    font-weight:300;
    color:#001689;
	font-weight:700;
}

.bod-wrapper-child{
    margin-bottom:15px;
}

.bod-wrapper-child .card-bod{
    margin-bottom: 30px;
	width:100%;
    display: inline-block;
}

.bod-wrapper-child .card-bod:hover{
    text-decoration:none;
}

.bod-wrapper-child .card-bod img{
    height:320px;
    width:100%;
	border-radius:16px;
    object-fit:cover;
}

.bod-wrapper-child .card-bod h3{
    color:#001689;
    margin-top:8px;
    font-size:24px;
    font-weight:700;
    margin-bottom: 0;
}

.bod-wrapper-child .card-bod:focus{
    outline:none;
}

/* popup */
.popup-bod-flex{
    display:flex;
    gap:20px;
    align-items:center;
}

.popup-bod-flex img{
    width:50%;
    height:456px;
    object-fit:cover;
	border-radius:20px;
}

.popup-bod-content p{
    font-weight:700;
    font-size:18px;
}

.popup-bod-content span{
    display:inline-block;
    margin-top:16px;
}

.popup-bod-content span p{
    font-weight:300;
    font-size:16px;
}


/* Awards & Certification : Single Page */
.tab-awards li a{
    font-weight:500;
}

.tab-awards{
    gap:5px;
}

.tab-awards li a.active.show,
.tab-awards li a:hover{
    background:#F2F3F9;
    border-radius:5px;
    color:#001689;
	font-weight:700;
}

/*  */

.show-awards .tab-pane{
    margin-top:20px;
}

.awards-desc{
    display:inline-block;
    margin-bottom:30px;
}

/*  */

.card-award{
    margin-bottom:20px;
}

.card-award h3{
    color:#001689;
    font-size:24px;
    margin-top:8px;
}

.card-award img{
    height:320px;
    width:100%;
    object-fit:cover;
}

/* Reports - Reports Page */
.tab-reports li a{
    font-weight:700;
}

.tab-reports{
    gap:5px;
    margin-bottom:30px !Important;
}

.tab-reports li a.active.show,
.tab-reports li a:hover{
    background:#F2F3F9;
    border-radius:5px;
    color:#001689;
}

/*  */

.card-reports{
    position:relative;
    height:360px;
    overflow:hidden;
    margin-bottom:30px;
}

.card-reports .content-reports{
    position:absolute;
    text-align:center;
    background:#0016899e;
    height:100%;
    display:flex;
    flex-flow:column;
    justify-content:center;
    padding:20px;
    transition:.2s;
    opacity:0;
    width: 100%;
}

.card-reports:hover .content-reports{
    opacity:1;
}

.card-reports .content-reports h3,
.card-reports .content-reports a{
    color:#fff;
}

.card-reports .content-reports h3{
    font-weight:800;
}

.card-reports .content-reports a{
    font-weight:bold;
    text-transform:uppercase;
    border:1px solid #fff;
    border-radius:20px;
    padding:8px 0;
    width:70%;
    margin:10px auto 0 auto;
    transition:.2s;
}

.card-reports .content-reports a:hover{
    text-decoration:none;
    background:#001689;
}

.card-reports img.image-reports{
    height:100%;
    width:100%;
    object-fit:cover;
}

/* BYW Popup */
.popup-byw img {
    height:400px;
    width:100%;
    object-fit:cover;
}

.popup-byw-vid .popup-byw-body h2{
	text-align:center;
}

.popup-byw-body h2{
	margin:16px 0 10px 0;
}

/* Container video full width mengikuti popup */
.popup-byw-body .popup-exp-content,
.popup-byw-body .wp-video,
.popup-byw-body .mejs-container,
.popup-byw-body .mejs-inner,
.popup-byw-body .mejs-mediaelement,
.popup-byw-body .mediaelementwrapper {
    width: 100% !important;
    max-width: 100% !important;
}

/* Aspect ratio 16:9 untuk container video */
.popup-byw-body .mejs-container {
    padding-top: 56.25%; /* 16:9 ratio = 450/800 */
    height: 0 !important;
    position: relative;
}

/* Video element ngikut container */
.popup-byw-body .mejs-inner,
.popup-byw-body .mejs-mediaelement,
.popup-byw-body video.wp-video-shortcode {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/* Override inline width dari wrapper div WordPress */
.popup-byw-body .wp-video {
    width: 100% !important;
}

/* RESPONSIVE ALL */

/* @media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

} */

@media only screen and (min-width: 1040px){
	
	/* Pertahankan style "active" pada parent menu saat sub-menu di-hover */
	.two-column:hover > a,
	.two-column:focus-within > a {
		color: #001689 !important; /* warna biru sesuaikan dengan default Elementor kamu */
		cursor: pointer !important;
	}
	
	/* Default: dropdown tersembunyi */
	.two-column > .sub-menu {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		width: 500px !important;
		padding: 10px !important;
		opacity: 0 !important;
		visibility: hidden !important;
		transition: opacity 0.3s ease, visibility 0.3s ease !important;
		pointer-events: none;
	}

	/* Saat di-hover: muncul dengan transition */
	.two-column:hover > .sub-menu,
	.two-column.focus > .sub-menu {
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto;
	}

	.two-column > .sub-menu > li {
		width: 100% !important;
	}

	/* INVISIBLE BRIDGE - jembatan hover antara parent dan sub-menu */
	.two-column > .sub-menu::before {
		content: "";
		position: absolute;
		top: -20px; /* sesuaikan dengan jarak gap */
		left: 0;
		right: 0;
		height: 20px; /* tinggi area hover invisible */
		background: transparent;
	}
}

@media only screen and (min-width: 1366px){
	/* Header */
	.pointer-custom nav ul li a.elementor-item:after {
		content: '';
		position: absolute;
		background-color: #001689 !Important;
		width: 80%;
		height: 4px;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0 auto; 
		border-radius: 2px;
	}
	
	/* Pertahankan pointer underline saat sub-menu di-hover */
	.pointer-custom nav ul li.two-column:hover > a.elementor-item::after,
	.pointer-custom nav ul li.two-column:focus-within > a.elementor-item::after {
		content: '';
		position: absolute;
		background-color: #001689 !important;
		width: 80%;
		height: 4px;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
		border-radius: 2px;
		opacity: 1 !important;
	}
	
	/* Segitiga lancip di atas sub-menu */
	.pointer-custom li > .sub-menu::after {
		content: "";
		position: absolute;
		top: -10px; /* posisi segitiga, di atas sub-menu */
		left: 30px; /* posisi horizontal segitiga, sesuaikan dengan parent menu */
		width: 0;
		height: 0;
		border-left: 12px solid transparent;
		border-right: 12px solid transparent;
		border-bottom: 12px solid #001689; /* warna sama dengan sub-menu */
	}
}

/* Max */

@media only screen and (max-width: 1040px){
	
	/* BYW Popup */
	.popup-byw,
	.popup-byw-vid{
		padding:20px !Important;
	}

	/* BOD - Single Page */
	.row.row-bod .card-bod img{
		height:unset;
	}
	
	.row.row-bod {
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .row.row-bod > [class*="col-"] {
        padding: 0;
        flex: 0 0 auto;
        max-width: none;
    }

    .row.row-bod > .col-6 {
        width: calc((100% - 10px) / 2);
    }

	/* Industries Menu - PLP Archive Industries */
	.menu-industries {
		flex-direction: row;       
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
	}

	.menu-industries a {
		display: inline-block;
		flex-shrink: 0; 
		white-space: nowrap;
	}
	
	/* 	News - News Page */
	a.card-news{
		height:unset;
		padding-bottom:30px;
	}
	
	/* Reports */
	.card-reports{
		height:unset;
	}
	
	/* Activity Page */
	.wrap-carousel-activity .owl-item{
		transform:scale(1) !important;
	}
	
}

@media only screen and (max-width: 640px){
	
	/* BOD - Single Page */
	.row.row-bod .card-bod{
		width:100%;
	}
	
	/* Popup */
	.popup-bod{
		padding:20px !important;
	}

	.popup-bod-flex{
		flex-flow:column;
	}

	.popup-bod-flex img{
		width:100%;
	}
	
	/* Awards */
	.card-award h3{
		font-size:20px;
	}
	.card-award img{
		height:unset;
	}
	
	.row.row-awards .card-award{
		padding:0;
		max-width:48% !important;
	}

	.row.row-awards{
		width:100%;
		margin:auto;
		justify-content:space-between;
	}
	
	/* Press Release - Press Release Page */
	.card-press {
		flex-flow:column;
		gap:10px;
		padding: 10px 5px !important;
	}

	.card-press .date-press,
	.card-press .content-press{
		width:100%;
	}

	.card-press .date-press{
		margin:0;
	}

	.card-press .content-press .title-press h3{
		font-size:24px;
	}
}

@media only screen and (max-width: 480px) {
	

}


/* Responsive Khusus ATF Slider Home/BYW  Nav & Arrow*/

/* Desktop & Full Screen */

@media only screen and (min-width:1041px){
	/* ATF Slider Home */
	.slider-atf-home{
		height:589px;
	}
}

/* normal */
@media only screen and (min-width: 1366px){
	/* ATF Slider Home */
	.slider-atf-home{
		height:650px;
	}
	
	.wrap-carousel-slides .owl-nav > button i{
		color:#Fff;
		font-size:18px;
	}

	.wrap-carousel-slides .owl-nav{
		position: absolute;
		width: 100%;
		top:65%;
	}

	.wrap-carousel-slides .owl-nav > button{
		position: absolute;
		background:#FFFFFF30 !important;
		height:50px;
		width:50px;
		border-radius:100% !Important;
	}

	.wrap-carousel-slides .owl-nav > button.owl-prev {
		left:13.1%;
	}

	.wrap-carousel-slides .owl-nav > button.owl-next {
		left:17.1%;
	}
	
	.main-wrapper-slider .slider-nav-titles{
		left:13.1% !important;
	}
	
	/* ATF Slider BYW */
	.wrap-carousel-slides-byw .owl-nav > button i{
		color:#Fff;
		font-size:18px;
	}

	.wrap-carousel-slides-byw .owl-nav{
		position: absolute;
		width: 100%;
		top:65%;
	}

	.wrap-carousel-slides-byw .owl-nav > button{
		position: absolute;
		background:#FFFFFF30 !important;
		height:50px;
		width:50px;
		border-radius:100% !Important;
	}

	.wrap-carousel-slides-byw .owl-nav > button.owl-prev {
		left:13.1%;
	}

	.wrap-carousel-slides-byw .owl-nav > button.owl-next {
		left:17.1%;
	}
}

/* FW */

@media only screen and (min-width: 1919px){
	/* ATF Slider Home */
	.slider-atf-home{
		height:800px;
	}
	
	.wrap-carousel-slides .owl-nav{
		position: absolute;
		width: 100%;
		top:65%;
	}

	.wrap-carousel-slides .owl-nav > button{
		position: absolute;
		background:#FFFFFF30 !important;
		height:60px;
		width:60px;
		border-radius:100% !Important;
	}

	.wrap-carousel-slides .owl-nav > button.owl-prev {
		left:20.5% !important;
	}

	.wrap-carousel-slides .owl-nav > button.owl-next {
		left:24% !important;
	}
	
	.main-wrapper-slider .slider-nav-titles{
		left:20.5% !Important;
	}
	
	/* ATF Slider BYW */
	.wrap-carousel-slides-byw .owl-nav{
		position: absolute;
		width: 100%;
		top:65%;
	}

	.wrap-carousel-slides-byw .owl-nav > button{
		position: absolute;
		background:#FFFFFF30 !important;
		height:60px;
		width:60px;
		border-radius:100% !Important;
	}

	.wrap-carousel-slides-byw .owl-nav > button.owl-prev {
		left:20.5% !important;
	}

	.wrap-carousel-slides-byw .owl-nav > button.owl-next {
		left:24% !important;
	}
	
}

/* Tab */
@media only screen and (max-width:1040px){
	/* ATF Slider Home */
	.slider-atf-home{
		height:370px;
	}
	
	.main-wrapper-slider .slider-nav-titles{
		left:20px;
		bottom: 5%;
		width:unset;
	}
	
	/* nav */
	.wrap-carousel-slides .owl-nav{
		position: absolute;
		width: 100%;
		bottom:35%;
	}

	.wrap-carousel-slides .owl-nav > button{
		position: absolute;
		background:#FFFFFF30 !important;
		height:50px;
		width:50px;
		border-radius:100% !Important;	
	}

	.wrap-carousel-slides .owl-nav > button.owl-prev {
		left:10px;
	}
	.wrap-carousel-slides .owl-nav > button.owl-next {
		left:66px;
	}
	
	/* ATF Slider BYW */
	
	/* nav */
	.wrap-carousel-slides-byw .owl-nav{
		position: absolute;
		width: 100%;
		bottom:25%;
	}

	.wrap-carousel-slides-byw .owl-nav > button{
		position: absolute;
		background:#FFFFFF30 !important;
		height:50px;
		width:50px;
		border-radius:100% !Important;	
	}

	.wrap-carousel-slides-byw .owl-nav > button.owl-prev {
		left:10px;
	}
	.wrap-carousel-slides-byw .owl-nav > button.owl-next {
		left:66px;
	}
}

/* mobile */
@media only screen and (max-width:640px){
	/* ATF Slider Home */
	.main-wrapper-slider .slider-nav-titles{
		display:none;
	}
	
	.slider-atf-home{
		height:200px;
	}
	
	/* nav */
	
	.wrap-carousel-slides {
		position: relative;
	}

	.wrap-carousel-slides .owl-nav {
		position: absolute;
		bottom: 8%;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		gap: 5px;
		width:unset;
		margin: 0;
	}

	.wrap-carousel-slides .owl-nav > button {
		position: static !important;
		background: #fff !important;
		height: 40px;
		width: 40px;
		border-radius: 100% !important;
		margin: 0 !important;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.wrap-carousel-slides .owl-nav > button i {
		color: #001689;
	}

	.wrap-carousel-slides .owl-nav > button.owl-next:focus,
	.wrap-carousel-slides .owl-nav > button.owl-prev:focus,
	.wrap-carousel-slides .owl-nav > button.owl-next:hover,
	.wrap-carousel-slides .owl-nav > button.owl-prev:hover {
		outline: none !important;
	}
	
	.wrap-carousel-slides .owl-nav > button.owl-prev {
		left:unset;
	}
	.wrap-carousel-slides .owl-nav > button.owl-next {
		left:unset;
	}
	
	/* ATF Slider BYW */
	/* nav */
	
	.wrap-carousel-slides-byw {
		position: relative;
		padding-bottom: 60px; 
	}

	.wrap-carousel-slides-byw .owl-nav {
		position: absolute;
		bottom: 25%;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		gap: 5px;
		width:unset;
		margin: 0;
	}

	.wrap-carousel-slides-byw .owl-nav > button {
		position: static !important;
		background: #fff !important;
		height: 40px;
		width: 40px;
		border-radius: 100% !important;
		margin: 0 !important;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.wrap-carousel-slides-byw .owl-nav > button i {
		color: #001689;
	}

	.wrap-carousel-slides-byw .owl-nav > button.owl-next:focus,
	.wrap-carousel-slides-byw .owl-nav > button.owl-prev:focus,
	.wrap-carousel-slides-byw .owl-nav > button.owl-next:hover,
	.wrap-carousel-slides-byw .owl-nav > button.owl-prev:hover {
		outline: none !important;
	}
	
	.wrap-carousel-slides-byw .owl-nav > button.owl-prev {
		left:unset;
	}
	.wrap-carousel-slides-byw .owl-nav > button.owl-next {
		left:unset;
	}
}