/* =========================================================
   C-TRANS24 V6 COMPONENT SYSTEM
   ========================================================= */


/* HEADER */

.v6-header {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:20;
    padding:24px 0;
}


.v6-header-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
}


.v6-logo {
    height:64px;
}


.v6-nav {
    display:flex;
    gap:32px;
    align-items:center;
}


.v6-nav a {
    color:white;
    text-decoration:none;
    font-weight:600;
}


/* HERO */

.v6-hero {
    min-height:900px;
    position:relative;
    display:flex;
    align-items:center;
    overflow:hidden;
}


.v6-hero-overlay {
    position:absolute;
    inset:0;
    background:
    linear-gradient(
        90deg,
        rgba(6,29,53,.92),
        rgba(6,29,53,.35)
    );
}


.v6-hero-content {
    position:relative;
    z-index:2;
    max-width:620px;
    color:white;
}


.v6-hero h1 {
    font-size:
    clamp(3rem,6vw,5rem);

    line-height:1.05;
}


.v6-highlight {
    color:
    var(--ct-orange);
}


/* CALCULATOR */

.v6-calculator {
    position:relative;
    margin-top:-160px;
    z-index:5;
}


.v6-calculator-box {
    background:
    rgba(6,29,53,.96);

    border-radius:
    var(--ct-radius-lg);

    padding:32px;

    color:white;

    box-shadow:
    var(--ct-shadow);
}


.v6-input {
    height:52px;
    border-radius:8px;
    border:1px solid #ccd6e0;
    padding:0 16px;
}


/* SERVICE CARDS */

.v6-services {
    display:grid;
    grid-template-columns:
    repeat(4,1fr);

    gap:24px;
}


.v6-service-card {
    background:
    var(--ct-navy);

    color:white;

    padding:32px;

    border-radius:
    var(--ct-radius-md);
}


/* PARTNER */

.v6-partners {
    display:flex;
    justify-content:center;
    gap:50px;
    flex-wrap:wrap;
}


.v6-partner-logo {
    max-height:45px;
}


/* FOOTER */

.v6-footer {
    background:
    var(--ct-navy);

    color:white;

    padding:
    60px 0;
}


@media(max-width:900px){

.v6-nav {
    display:none;
}

.v6-services {
    grid-template-columns:
    1fr;
}

}


.v6-hero-bg {

position:absolute;
inset:0;

background-image:
url('/static/site/assets/hero/hero-logistics.webp');

background-size:cover;
background-position:center;

}


.v6-hero-actions {

display:flex;
gap:16px;
margin-top:32px;

}


.v6-button-secondary {

display:inline-flex;
align-items:center;

padding:
14px 28px;

border-radius:
var(--ct-radius-sm);

border:
1px solid white;

color:white;

text-decoration:none;

font-weight:700;

}


.v6-eyebrow {

color:
var(--ct-orange);

font-weight:800;

letter-spacing:
2px;

}


.v6-fleet {

position:absolute;

bottom:0;
right:0;

display:flex;

align-items:end;

gap:10px;

max-width:60%;

}


.v6-fleet img {

max-height:220px;

object-fit:contain;

}



@media(max-width:900px){

.v6-fleet {

display:none;

}

}




.v6-calculator-box {

background:
var(--ct-navy);

color:white;

padding:
40px;

border-radius:
var(--ct-radius-lg);

box-shadow:
var(--ct-shadow);

}


.v6-calculator-header {

margin-bottom:32px;

}


.v6-calculator-grid {

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:20px;

}


.v6-field {

display:flex;

flex-direction:column;

gap:8px;

}


.v6-field label {

font-weight:700;

color:white;

}


.v6-input {

width:100%;

height:52px;

background:white;

color:#102033;

}


.v6-calculator-footer {

margin-top:32px;

display:flex;

justify-content:flex-end;

}



@media(max-width:900px){

.v6-calculator-grid {

grid-template-columns:
1fr;

}

}




.v6-usp-grid {

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:24px;

}


.v6-usp-card {

background:white;

padding:32px;

border-radius:
var(--ct-radius-md);

box-shadow:
0 12px 35px rgba(0,0,0,.08);

text-align:center;

}


.v6-usp-card img {

height:48px;

margin-bottom:20px;

}


.v6-usp-card h3 {

margin:
0 0 12px;

color:
var(--ct-navy);

}


.v6-usp-card p {

color:
var(--ct-muted);

}



@media(max-width:900px){

.v6-usp-grid {

grid-template-columns:
1fr;

}

}




.v6-section-header {

max-width:700px;

margin-bottom:50px;

}


.v6-fleet-grid {

display:grid;

grid-template-columns:
repeat(5,1fr);

gap:20px;

}


.v6-fleet-card {

background:white;

border-radius:
var(--ct-radius-md);

padding:24px;

box-shadow:
0 12px 35px rgba(0,0,0,.08);

text-align:center;

overflow:hidden;

}


.v6-fleet-card img {

width:100%;

height:150px;

object-fit:contain;

margin-bottom:20px;

}


.v6-fleet-card h3 {

color:
var(--ct-navy);

}


.v6-fleet-card p {

color:
var(--ct-muted);

font-size:.95rem;

}



@media(max-width:1100px){

.v6-fleet-grid {

grid-template-columns:
repeat(2,1fr);

}

}


@media(max-width:600px){

.v6-fleet-grid {

grid-template-columns:
1fr;

}

}




.v6-header-actions {

display:flex;

gap:12px;

align-items:center;

}


.v6-login {

color:white;

text-decoration:none;

font-weight:700;

}


.v6-footer-grid {

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:40px;

}


.v6-footer a {

display:block;

color:white;

text-decoration:none;

margin-bottom:10px;

opacity:.85;

}


.v6-footer h4 {

margin-bottom:20px;

}


.v6-footer-bottom {

margin-top:40px;

padding-top:25px;

border-top:1px solid rgba(255,255,255,.2);

}



@media(max-width:900px){

.v6-footer-grid {

grid-template-columns:
1fr;

}

}




.v6-partner-box {

height:120px;

padding:25px;

background:white;

border-radius:
var(--ct-radius-md);

display:flex;

align-items:center;

justify-content:center;

box-shadow:
0 10px 30px rgba(0,0,0,.08);

}


.v6-partner-box img {

max-width:160px;

max-height:60px;

object-fit:contain;

}


.v6-partners {

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:30px;

}


@media(max-width:900px){

.v6-partners {

grid-template-columns:
1fr;

}

}




.v6-services-grid {

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:24px;

}


.v6-service-card {

background:white;

padding:32px;

border-radius:
var(--ct-radius-md);

box-shadow:
0 12px 35px rgba(0,0,0,.08);

transition:.25s ease;

}


.v6-service-card:hover {

transform:translateY(-8px);

}


.v6-service-card h3 {

color:
var(--ct-navy);

margin-bottom:14px;

}


.v6-service-card p {

color:
var(--ct-muted);

line-height:1.6;

}



@media(max-width:1000px){

.v6-services-grid {

grid-template-columns:
repeat(2,1fr);

}

}


@media(max-width:600px){

.v6-services-grid {

grid-template-columns:
1fr;

}

}




.v6-trust-grid {

display:grid;

grid-template-columns:
1.3fr .7fr;

gap:60px;

align-items:center;

}



.v6-trust-list {

list-style:none;

padding:0;

margin-top:30px;

}


.v6-trust-list li {

margin-bottom:15px;

font-weight:700;

color:
var(--ct-navy);

}



.v6-trust-panel {

background:
var(--ct-navy);

padding:35px;

border-radius:
var(--ct-radius-lg);

color:white;

}



.v6-trust-panel div {

padding:25px 0;

border-bottom:
1px solid rgba(255,255,255,.15);

}


.v6-trust-panel div:last-child {

border-bottom:none;

}



.v6-trust-panel strong {

display:block;

font-size:2rem;

color:#ff7a00;

}



.v6-trust-panel span {

opacity:.9;

}



@media(max-width:900px){

.v6-trust-grid {

grid-template-columns:
1fr;

}

}


