/* =============================================================
   LYB Cargo — responsive + RTL
   ============================================================= */

/* ---------- 1040 ---------- */

@media (max-width: 1040px) {
    .board-section::before {
        display: none;
    }

    .about-story {
        gap: 40px;
    }

    .timeline-row {
        grid-template-columns: 90px minmax(0, 0.8fr) minmax(0, 1.2fr);
        gap: 28px;
    }

    .shipment-body {
        grid-template-columns: 1fr;
    }

    .shipment-summary dl {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px 24px;
    }

    .contact-layout {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    }
}

/* ---------- 960 ---------- */

@media (max-width: 960px) {
    .primary-nav,
    .header-quote {
        display: none;
    }

    .menu-toggle {
        display: grid;
    }

    .header-inner {
        min-height: 70px;
    }

    .hero {
        grid-template-columns: 1fr;
    }

    .hero-copy {
        padding: clamp(44px, 6vw, 64px) var(--gutter);
    }

    .hero-title {
        font-size: clamp(70px, 13vw, 112px);
    }

    .hero-media {
        min-height: clamp(360px, 58vw, 500px);
    }

    .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .stat {
        padding: 22px 20px;
        border-top: 1px solid var(--line);
    }

    .stat:nth-child(1),
    .stat:nth-child(2) {
        border-top: 0;
    }

    .stat:nth-child(odd) {
        padding-inline-start: 0;
        border-inline-start: 0;
    }

    .section-head {
        grid-template-columns: 1fr;
        gap: 22px;
        align-items: start;
    }

    .section-lead {
        max-width: 62ch;
    }

    .services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .split {
        grid-template-columns: 1fr;
        gap: 46px;
    }

    .split-media {
        max-width: 540px;
        margin-inline-end: 0;
    }

    .split-media img {
        aspect-ratio: 4 / 3.4;
    }

    .split-media::before,
    .split-media::after {
        display: none;
    }

    .customs-stat {
        inset-inline-end: 14px;
        bottom: 14px;
    }

    .coverage-item {
        grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
        gap: 12px 28px;
    }

    .coverage-text {
        grid-column: 1 / -1;
        padding-top: 0;
        max-width: 66ch;
    }

    .process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .process-step {
        padding-bottom: 26px;
        border-bottom: 1px solid var(--line);
    }

    .process-step:nth-child(2n) {
        border-inline-end: 0;
        padding-inline-end: 0;
    }

    .process-step:nth-child(1),
    .process-step:nth-child(2) {
        padding-top: 24px;
    }

    .process-step:nth-child(3),
    .process-step:nth-child(4) {
        padding-top: 26px;
        border-bottom: 0;
    }

    .testimonial {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .testimonial blockquote {
        max-width: 26ch;
    }

    .testimonial cite {
        max-width: 34ch;
    }

    .cta-band-inner {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .cta-copy {
        max-width: 560px;
    }

    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 38px;
    }

    .footer-brand {
        grid-column: 1 / -1;
    }

    .footer-col-contact {
        grid-column: 1 / -1;
        max-width: 480px;
    }

    .page-hero-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .page-hero-aside {
        max-width: 420px;
    }

    .page-hero::after {
        width: 55%;
        opacity: 0.3;
    }

    .service-detail {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .service-detail--reverse .detail-media,
    .service-detail--reverse .detail-copy {
        grid-column: auto;
        grid-row: auto;
    }

    .service-detail .detail-media {
        order: -1;
    }

    .detail-media img {
        aspect-ratio: 16 / 9;
    }

    .more-grid {
        grid-template-columns: 1fr;
    }

    .more-card {
        min-height: 0;
    }

    .about-story {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .about-story-copy {
        max-width: 640px;
    }

    .about-numbers {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .about-numbers > div {
        border-top: 1px solid var(--line);
        padding: 20px 22px;
    }

    .about-numbers > div:nth-child(1),
    .about-numbers > div:nth-child(2) {
        border-top: 0;
    }

    .about-numbers > div:nth-child(odd) {
        padding-inline-start: 0;
        border-inline-start: 0;
    }

    .certs {
        grid-template-columns: 1fr;
    }

    .contact-layout {
        grid-template-columns: 1fr;
    }

    .contact-sidebar {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .faq-grid {
        grid-template-columns: 1fr;
    }

    .offices-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .office-card:last-child {
        grid-column: 1 / -1;
    }

    .track-help {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .track-help-actions {
        justify-content: flex-start;
    }
}

/* ---------- 760 ---------- */

@media (max-width: 760px) {
    :root {
        --header-h: 66px;
    }

    .topbar-email {
        display: none;
    }

    .topbar-tools {
        gap: 14px;
    }

    .brand-mark {
        width: 36px;
        height: 36px;
    }

    .brand-name {
        font-size: 21px;
    }

    .brand-sub {
        font-size: 7px;
        letter-spacing: 0.16em;
    }

    .hero-title {
        font-size: clamp(60px, 15.5vw, 96px);
        line-height: 0.83;
    }

    .hero-lead {
        font-size: 15.5px;
    }

    .hero-footnote {
        margin-top: 28px;
    }

    .section-title {
        font-size: clamp(38px, 10vw, 58px);
    }

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

    .service-card {
        min-height: 0;
        padding: 24px 20px 26px;
    }

    .service-icon {
        margin-bottom: 28px;
    }

    .service-tags {
        margin-top: 22px;
    }

    .board-bar {
        font-size: 8px;
    }

    .board-head {
        display: none;
    }

    .board-row {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "lane mode"
            "transit cutoff";
        row-gap: 10px;
        column-gap: 16px;
        padding-block: 15px;
    }

    .board-lane {
        grid-area: lane;
    }

    .board-mode {
        grid-area: mode;
        justify-self: end;
    }

    .board-transit {
        grid-area: transit;
        font-size: 17px;
    }

    .board-cutoff {
        grid-area: cutoff;
        justify-self: end;
        text-align: end;
    }

    .board-mobile-label {
        display: inline-block;
        margin-inline-end: 6px;
        font-family: var(--mono);
        font-size: 8px;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: rgba(239, 234, 223, 0.4);
    }

    .board-foot {
        gap: 18px;
    }

    .coverage-item {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .coverage-facilities {
        padding-top: 0;
    }

    .coverage-text {
        max-width: 60ch;
    }

    .process-grid {
        grid-template-columns: 1fr;
    }

    .process-step,
    .process-step:nth-child(2n),
    .process-step:nth-child(3),
    .process-step:nth-child(4) {
        padding: 22px 0;
        border-inline-end: 0;
        border-bottom: 1px solid var(--line);
    }

    .process-step:last-child {
        border-bottom: 0;
    }

    .process-step h3 {
        margin-top: 22px;
        max-width: none;
    }

    .process-step p {
        max-width: 52ch;
    }

    .cta-title {
        font-size: clamp(44px, 12vw, 70px);
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .footer-brand,
    .footer-col-contact {
        grid-column: auto;
    }

    .wa-float span {
        display: none;
    }

    .wa-float {
        padding: 13px;
        bottom: 16px;
        inset-inline-end: 16px;
    }

    .page-title {
        font-size: clamp(46px, 12.5vw, 78px);
    }

    .page-hero-lead {
        font-size: 15px;
    }

    .about-image img {
        aspect-ratio: 16 / 9;
    }

    .timeline-row {
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 12px 20px;
        padding-block: 18px;
    }

    .timeline-row p {
        grid-column: 2;
    }

    .values-grid {
        grid-template-columns: 1fr;
    }

    .about-numbers strong {
        font-size: 36px;
    }

    .contact-sidebar {
        grid-template-columns: 1fr;
    }

    .offices-grid {
        grid-template-columns: 1fr;
    }

    .office-card:last-child {
        grid-column: auto;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .shipment-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .shipment-meta > div:nth-child(2n) {
        border-inline-end: 0;
    }

    .route-code {
        font-size: 44px;
    }

    .route-line {
        min-width: 40px;
    }

    .shipment-head {
        padding: 14px 16px;
    }

    .shipment-body,
    .route-display {
        padding: 20px 16px;
    }

    .shipment-meta > div {
        padding: 12px 14px;
    }

    .timeline li {
        grid-template-columns: 1fr;
        gap: 2px;
        padding-inline-start: 18px;
    }

    .timeline time {
        order: 2;
        font-size: 8px;
    }

    .timeline strong {
        order: 1;
    }

    .timeline .tl-detail {
        display: none;
    }

    .shipment-summary dl {
        grid-template-columns: 1fr;
    }

    .page-cta {
        flex-direction: column;
        align-items: flex-start;
    }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

/* ---------- 540 ---------- */

@media (max-width: 540px) {
    .topbar-network {
        max-width: 55vw;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .topbar-link {
        display: none;
    }

    .hero-actions,
    .cta-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .hero-actions .btn,
    .cta-actions .btn {
        width: 100%;
    }

    .stats-grid {
        grid-template-columns: 1fr 1fr;
    }

    .stat-value {
        font-size: 36px;
    }

    .stat-label {
        font-size: 8px;
    }

    .customs-stat {
        width: 150px;
        padding: 14px;
    }

    .customs-stat strong {
        font-size: 24px;
    }

    .customs-quote p {
        font-size: 20px;
    }

    .track-form {
        flex-direction: column;
    }

    .track-form .btn {
        width: 100%;
    }

    .track-meta {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer-social {
        gap: 10px;
    }

    .route-display {
        gap: 8px;
    }

    .route-code {
        font-size: 38px;
    }

    .route-line::before,
    .route-line::after {
        display: none;
    }

    .shipment-ref strong {
        font-size: 17px;
    }

    .faq-item p {
        padding-inline-end: 0;
    }

    .form-success {
        flex-direction: column;
    }

    .form-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .form-actions .btn {
        width: 100%;
    }
}

/* =============================================================
   RTL — Arabic
   ============================================================= */

[dir="rtl"] body {
    font-family: var(--arabic);
    line-height: 1.8;
}

[dir="rtl"] .brand-name {
    font-family: var(--display);
    letter-spacing: 0.03em;
}

[dir="rtl"] .brand-sub {
    font-family: var(--arabic);
    letter-spacing: 0;
    text-transform: none;
    font-size: 9px;
}

[dir="rtl"] .nav-link {
    font-family: var(--arabic);
    font-size: 13px;
}

[dir="rtl"] .nav-link::after {
    transform-origin: right;
}

[dir="rtl"] .btn {
    font-family: var(--arabic);
    font-size: 12px;
    letter-spacing: 0;
    text-transform: none;
}

[dir="rtl"] .btn .icon,
[dir="rtl"] .link-arrow .icon {
    transform: scaleX(-1);
}

[dir="rtl"] .btn:hover .icon {
    transform: scaleX(-1) translateX(3px);
}

[dir="rtl"] .link-arrow:hover .icon {
    transform: scaleX(-1) translateX(3px);
}

[dir="rtl"] .topbar-inner {
    font-family: var(--arabic);
    font-size: 10px;
    letter-spacing: 0;
}

[dir="rtl"] .eyebrow {
    font-family: var(--arabic);
    font-size: 11px;
    letter-spacing: 0;
    text-transform: none;
}

[dir="rtl"] .section-title,
[dir="rtl"] .hero-title,
[dir="rtl"] .page-title,
[dir="rtl"] .cta-title,
[dir="rtl"] .detail-title,
[dir="rtl"] .about-story-title,
[dir="rtl"] .service-title,
[dir="rtl"] .process-step h3,
[dir="rtl"] .coverage-city,
[dir="rtl"] .office-card h3,
[dir="rtl"] .value-card h3,
[dir="rtl"] .timeline-row h3,
[dir="rtl"] .form-head h2,
[dir="rtl"] .empty-state h2,
[dir="rtl"] .track-help h2,
[dir="rtl"] .page-cta h2,
[dir="rtl"] .form-success h2,
[dir="rtl"] .footer-tagline {
    font-family: var(--arabic);
    letter-spacing: 0;
    line-height: 1.15;
    text-transform: none;
}

[dir="rtl"] .section-title {
    font-size: clamp(34px, 4.6vw, 62px);
}

[dir="rtl"] .hero-title {
    font-size: clamp(54px, 7.4vw, 104px);
    line-height: 1.06;
}

[dir="rtl"] .hero-title .line-2 {
    color: var(--green);
    -webkit-text-stroke: 0;
}

[dir="rtl"] .page-title {
    font-size: clamp(42px, 6.2vw, 84px);
    line-height: 1.1;
}

[dir="rtl"] .cta-title {
    font-size: clamp(36px, 5.2vw, 70px);
    line-height: 1.2;
}

[dir="rtl"] .testimonial blockquote {
    max-width: 34ch;
    font-family: var(--arabic);
    font-size: clamp(22px, 2.6vw, 34px);
    font-weight: 500;
    line-height: 1.55;
}

[dir="rtl"] .testimonial cite,
[dir="rtl"] .about-signature {
    font-family: var(--arabic);
    letter-spacing: 0;
    text-transform: none;
    font-size: 11px;
}

[dir="rtl"] .about-signature {
    font-size: 18px;
}

[dir="rtl"] .mono-label,
[dir="rtl"] .stat-label,
[dir="rtl"] .service-tags,
[dir="rtl"] .board-head,
[dir="rtl"] .board-city,
[dir="rtl"] .board-mode,
[dir="rtl"] .board-cutoff,
[dir="rtl"] .footer-heading,
[dir="rtl"] .footer-label,
[dir="rtl"] .footer-hours,
[dir="rtl"] .footer-bottom,
[dir="rtl"] .footer-social,
[dir="rtl"] .process-num,
[dir="rtl"] .coverage-tag,
[dir="rtl"] .coverage-index,
[dir="rtl"] .coverage-facilities,
[dir="rtl"] .timeline-year,
[dir="rtl"] .value-num,
[dir="rtl"] .detail-caption,
[dir="rtl"] .split-caption,
[dir="rtl"] .about-caption,
[dir="rtl"] .side-card h3,
[dir="rtl"] .field label,
[dir="rtl"] .spec-list dt,
[dir="rtl"] .compare-table thead th,
[dir="rtl"] .compare-table tbody th,
[dir="rtl"] .shipment-meta dt,
[dir="rtl"] .shipment-body h2,
[dir="rtl"] .timeline time,
[dir="rtl"] .timeline .tl-detail,
[dir="rtl"] .office-card .office-role,
[dir="rtl"] .office-card .office-meta,
[dir="rtl"] .chip,
[dir="rtl"] .status-pill,
[dir="rtl"] .track-meta,
[dir="rtl"] .track-form input,
[dir="rtl"] .sample-chips button,
[dir="rtl"] .hero-footnote,
[dir="rtl"] .customs-quote span,
[dir="rtl"] .form-privacy,
[dir="rtl"] .form-alert,
[dir="rtl"] .field-error,
[dir="rtl"] .page-hero-aside p,
[dir="rtl"] .page-hero-aside .page-index,
[dir="rtl"] .footer-after span,
[dir="rtl"] .side-card .side-hours,
[dir="rtl"] .about-numbers span,
[dir="rtl"] .about-numbers strong,
[dir="rtl"] .stat-value {
    font-family: var(--arabic);
    letter-spacing: 0;
    text-transform: none;
}

[dir="rtl"] .hero-footnote,
[dir="rtl"] .track-meta,
[dir="rtl"] .footer-bottom,
[dir="rtl"] .footer-heading,
[dir="rtl"] .footer-social,
[dir="rtl"] .field label,
[dir="rtl"] .spec-list dt,
[dir="rtl"] .compare-table th,
[dir="rtl"] .shipment-meta dt,
[dir="rtl"] .office-card .office-role,
[dir="rtl"] .status-pill,
[dir="rtl"] .chip {
    font-size: 9.5px;
}

[dir="rtl"] .board-code,
[dir="rtl"] .board-clock,
[dir="rtl"] .shipment-ref strong,
[dir="rtl"] .track-form input,
[dir="rtl"] .timeline-year,
[dir="rtl"] .sample-chips button {
    font-family: var(--mono);
    letter-spacing: 0.02em;
}

[dir="rtl"] .board-transit,
[dir="rtl"] .stat-value,
[dir="rtl"] .about-numbers strong,
[dir="rtl"] .customs-stat strong,
[dir="rtl"] .side-card .side-main,
[dir="rtl"] .footer-tagline {
    font-family: var(--display);
    letter-spacing: 0;
}

[dir="rtl"] .board-transit {
    font-family: var(--arabic);
    font-size: 16px;
}

[dir="rtl"] .board-city {
    font-size: 11px;
}

[dir="rtl"] .hero-title span,
[dir="rtl"] .cta-title span {
    line-height: inherit;
}

[dir="rtl"] .hero-lead,
[dir="rtl"] .section-lead,
[dir="rtl"] .split-text,
[dir="rtl"] .detail-text,
[dir="rtl"] .coverage-text,
[dir="rtl"] .service-text,
[dir="rtl"] .process-step p,
[dir="rtl"] .value-card p,
[dir="rtl"] .timeline-row p,
[dir="rtl"] .about-story-copy p,
[dir="rtl"] .faq-item p,
[dir="rtl"] .office-card address,
[dir="rtl"] .page-hero-lead {
    line-height: 1.9;
}

[dir="rtl"] .customs-quote {
    flex-wrap: wrap;
}

[dir="rtl"] .customs-quote p {
    font-size: 21px;
}

[dir="rtl"] .split-media {
    margin-inline-end: 0;
    margin-inline-start: 0;
}

[dir="rtl"] .split-media::before,
[dir="rtl"] .split-media::after {
    display: none;
}

[dir="rtl"] .page-hero::after {
    mask-image: linear-gradient(270deg, transparent, #000);
}

[dir="rtl"] .faq-item p {
    padding-inline-end: 40px;
    padding-inline-start: 0;
}

[dir="rtl"] .mobile-nav-link {
    font-family: var(--arabic);
    font-size: clamp(28px, 7vw, 44px);
    line-height: 1.25;
    text-transform: none;
}

[dir="rtl"] .footer-tagline {
    font-size: 21px;
    line-height: 1.5;
}

[dir="rtl"] .footer-arabic {
    font-family: var(--arabic);
}

[dir="rtl"] .footer-links a,
[dir="rtl"] .footer-contact-list,
[dir="rtl"] .footer-address {
    font-size: 14px;
}

[dir="rtl"] .side-card .side-main {
    font-family: var(--arabic);
    font-size: 20px;
    line-height: 1.4;
}

[dir="rtl"] .track-form input {
    font-size: 14px;
    direction: ltr;
    text-align: right;
}

[dir="rtl"] .compare-table th,
[dir="rtl"] .compare-table td {
    text-align: right;
}

[dir="rtl"] .spec-list dd {
    text-align: left;
}

[dir="rtl"] .shipment-meta dd,
[dir="rtl"] .shipment-summary dd {
    text-align: left;
}

[dir="rtl"] .route-point--end {
    text-align: left;
}

[dir="rtl"] .timeline li {
    padding-inline-start: 18px;
}

[dir="rtl"] .timeline li::before {
    inset-inline-start: 3px;
}

[dir="rtl"] .timeline .tl-dot {
    inset-inline-start: 0;
}

[dir="rtl"] .process-step h3,
[dir="rtl"] .value-card h3,
[dir="rtl"] .office-card h3,
[dir="rtl"] .timeline-row h3,
[dir="rtl"] .detail-title,
[dir="rtl"] .service-title {
    font-size: clamp(22px, 2.4vw, 30px);
    line-height: 1.35;
}

[dir="rtl"] .service-title {
    font-size: clamp(22px, 2.2vw, 28px);
}

[dir="rtl"] .coverage-city {
    font-size: clamp(30px, 3.2vw, 42px);
}

[dir="rtl"] .form-head h2,
[dir="rtl"] .empty-state h2,
[dir="rtl"] .track-help h2,
[dir="rtl"] .page-cta h2 {
    line-height: 1.3;
}

[dir="rtl"] .form-head h2 {
    font-size: clamp(28px, 3.2vw, 40px);
}

[dir="rtl"] .faq-item summary {
    font-size: 14.5px;
    line-height: 1.6;
}

[dir="rtl"] .track-help p,
[dir="rtl"] .side-card p {
    line-height: 1.8;
}

/* ---------- Motion / print ---------- */

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .will-reveal {
        opacity: 1;
        transform: none;
    }
}

@media print {
    .topbar,
    .site-header,
    .mobile-menu,
    .wa-float,
    .hero-media,
    .cta-band,
    .site-footer {
        display: none !important;
    }

    body {
        background: #fff;
        color: #000;
    }
}