/* =========================================================================
   MDCS — Corporate Logistics
   Design system: minimal, spacious, precision-engineered corporate identity.
   Display: Plus Jakarta Sans | Body: Manrope | Data/Label: IBM Plex Mono
   Signature element: "precision frame" — thin corner-bracket marks that
   draw themselves in on scroll, referencing engineering drafting marks.
   ========================================================================= */

:root{
  --navy:        #0B2545;
  --navy-deep:   #071A33;
  --navy-ink:    #061426;
  --red:         #C81E3A;
  --red-soft:    #E4536A;
  --white:       #FFFFFF;
  --gray-100:    #F5F7FA;
  --gray-200:    #E9EDF3;
  --gray-300:    #D7DEE8;
  --gray-mid:    #8A96A6;
  --text:        #10192B;
  --text-soft:   #55647A;

  --font-display: 'Plus Jakarta Sans', sans-serif;
  --font-body:    'Manrope', sans-serif;
  --font-mono:    'IBM Plex Mono', monospace;

  --r-sm: 4px;
  --r-md: 10px;
  --r-lg: 20px;

  --shadow-sm: 0 1px 3px rgba(11,37,69,.06);
  --shadow-md: 0 18px 44px rgba(11,37,69,.09);
  --shadow-lg: 0 30px 70px rgba(11,37,69,.14);

  --ease: cubic-bezier(.19,1,.22,1);
  --container: 1360px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family: var(--font-body);
  color: var(--text);
  background: var(--white);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  font-size: 16px;
  line-height: 1.65;
}
h1,h2,h3,h4,h5,.font-display{ font-family: var(--font-display); color: var(--navy); letter-spacing:-0.025em; font-weight:700; }
p{ color: var(--text-soft); }
a{ text-decoration:none; color:inherit; }
img{ max-width:100%; display:block; }
::selection{ background: var(--red); color:#fff; }
:focus-visible{ outline: 2px solid var(--red); outline-offset: 3px; border-radius: 2px; }

.container-xl{ width:100%; max-width: var(--container); margin:0 auto; padding: 0 32px; }
.section{ padding: 160px 0; }
.section-tight{ padding: 110px 0; }
.bg-gray{ background: var(--gray-100); }
.bg-navy{ background: var(--navy-deep); color: rgba(255,255,255,.68); }
.bg-navy h2, .bg-navy h3, .bg-navy h4{ color:#fff; }

@media (max-width: 991.98px){
  .section{ padding: 100px 0; }
  .section-tight{ padding: 76px 0; }
  .container-xl{ padding: 0 22px; }
}

/* ---------- Typographic system ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family: var(--font-mono); font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
  color: var(--red); margin-bottom: 22px; font-weight:500;
}
.eyebrow::before{ content:''; width:22px; height:1px; background: var(--red); }

.h-display{ font-size: clamp(2.6rem, 5vw, 4.6rem); line-height:1.04; font-weight:700; }
.h-section{ font-size: clamp(2rem, 3.4vw, 3rem); line-height:1.12; font-weight:700; }
.p-lead{ font-size: 1.2rem; color: var(--text-soft); max-width: 560px; line-height:1.75; }
.measure{ max-width: 640px; }

/* ---------- Signature: precision frame corner marks ---------- */
.precision-frame{ position:relative; }
.precision-frame::before,
.precision-frame::after,
.precision-frame .pf-tl,
.precision-frame .pf-tr,
.precision-frame .pf-bl,
.precision-frame .pf-br{ content:''; }
.pf-corner{
  position:absolute; width: 26px; height: 26px; z-index:3; pointer-events:none;
}
.pf-corner::before,.pf-corner::after{ content:''; position:absolute; background: var(--red); }
.pf-tl{ top:-1px; left:-1px; } .pf-tl::before{ top:0; left:0; width:2px; height:0; } .pf-tl::after{ top:0; left:0; height:2px; width:0; }
.pf-tr{ top:-1px; right:-1px; } .pf-tr::before{ top:0; right:0; width:2px; height:0; } .pf-tr::after{ top:0; right:0; height:2px; width:0; }
.pf-bl{ bottom:-1px; left:-1px; } .pf-bl::before{ bottom:0; left:0; width:2px; height:0; } .pf-bl::after{ bottom:0; left:0; height:2px; width:0; }
.pf-br{ bottom:-1px; right:-1px; } .pf-br::before{ bottom:0; right:0; width:2px; height:0; } .pf-br::after{ bottom:0; right:0; height:2px; width:0; }
.precision-frame.pf-in .pf-corner::before{ height:26px; transition: height .6s var(--ease) .1s; }
.precision-frame.pf-in .pf-corner::after{ width:26px; transition: width .6s var(--ease) .1s; }

/* ---------- Buttons (understated, no gradient blocks) ---------- */
.btn-primary{
  display:inline-flex; align-items:center; gap:10px;
  background: var(--navy); color:#fff !important; border:1px solid var(--navy);
  padding: 15px 30px; font-weight:600; font-size:.92rem; border-radius: var(--r-sm);
  transition: all .4s var(--ease);
}
.btn-primary:hover{ background: var(--navy-ink); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.btn-line{
  display:inline-flex; align-items:center; gap:10px;
  background:transparent; color: var(--navy) !important; border:1px solid var(--gray-300);
  padding: 14px 28px; font-weight:600; font-size:.92rem; border-radius: var(--r-sm);
  transition: all .35s var(--ease);
}
.btn-line:hover{ border-color: var(--navy); background: var(--gray-100); }
.btn-line-light{
  display:inline-flex; align-items:center; gap:10px;
  background:transparent; color:#fff !important; border:1px solid rgba(255,255,255,.32);
  padding: 14px 28px; font-weight:600; font-size:.92rem; border-radius: var(--r-sm);
  transition: all .35s var(--ease);
}
.btn-line-light:hover{ border-color:#fff; background: rgba(255,255,255,.08); }

/* ---------- Underline-animated links (nav, in-text) ---------- */
.link-underline{ position:relative; display:inline-block; }
.link-underline::after{
  content:''; position:absolute; left:0; bottom:-3px; width:100%; height:1px; background: currentColor;
  transform: scaleX(0); transform-origin: right; transition: transform .4s var(--ease);
}
.link-underline:hover::after{ transform: scaleX(1); transform-origin: left; }

/* =========================================================================
   NAVBAR — transparent to solid on scroll
   ========================================================================= */
.mdcs-nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  padding: 10px 0; transition: all .5s var(--ease);
  padding: 10px 0; background: rgba(255,255,255,.92); backdrop-filter: blur(14px);
  box-shadow: 0 1px 0 var(--gray-200);
}
.mdcs-nav.scrolled{
  padding: 10px 0; background: rgba(255,255,255,.92); backdrop-filter: blur(14px);
  box-shadow: 0 1px 0 var(--gray-200);
}
.mdcs-nav .nav-row{ display:flex; align-items:center; justify-content:space-between; }
.mdcs-nav .brand img{ height: 68px; }
.mdcs-nav .brand .lg-dark{ display:none; }
.mdcs-nav .brand .lg-light{ display:block; }
.mdcs-nav.scrolled .brand .lg-dark{ display:block; }
.mdcs-nav.scrolled .brand .lg-light{ display:none; }

.nav-list{ display:flex; align-items:center; gap:38px; list-style:none; margin:0; padding:0; }
.nav-list a{ font-size:.92rem; font-weight:600; color: var(--text); }
.mdcs-nav.scrolled .nav-list a{ color: var(--text); }

.nav-actions{ display:flex; align-items:center; gap:14px; }
.nav-actions a.nav-outline{
  font-size:.85rem; font-weight:700; color:var(--navy); border:1px solid rgba(255,255,255,.4);
  padding:10px 20px; border-radius: var(--r-sm); transition: all .35s var(--ease); display:inline-flex; align-items:center; gap:8px;
}
.mdcs-nav.scrolled .nav-actions a.nav-outline{ color: var(--navy); border-color: var(--gray-300); }
.nav-actions a.nav-outline:hover{ background: rgba(255,255,255,.1); }
.mdcs-nav.scrolled .nav-actions a.nav-outline:hover{ background: var(--gray-100); }
.nav-actions a.nav-solid{ background: var(--red); color:#fff; padding:10px 22px; border-radius: var(--r-sm); font-size:.85rem; font-weight:700; transition: all .3s var(--ease); }
.nav-actions a.nav-solid:hover{ background:#A6172F; }

.nav-burger{ display:none; background:transparent; border:none; color:var(--navy); font-size:1.4rem; z-index: 1200; }
.mdcs-nav.scrolled .nav-burger{ color: var(--navy); }

@media (max-width: 991.98px){
  .nav-list{
    position:fixed; top:0; right:-100%; height:100vh; width: min(340px,86vw); background: var(--navy-deep);
    flex-direction:column; align-items:flex-start; gap:2px; padding: 110px 30px 30px;
    transition: right .5s var(--ease); z-index:1100; box-shadow: -24px 0 60px rgba(0,0,0,.3);
  }
  .nav-list.open{ right:0; }
  .nav-list li{ width:100%; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .nav-list a{ color:#fff !important; }
  .nav-actions{ order:3; }
  .nav-burger{ display:block; }
  .nav-scrim{ position:fixed; inset:0; background: rgba(4,12,24,.55); opacity:0; pointer-events:none; transition: opacity .4s var(--ease); z-index:1050; }
  .nav-scrim.show{ opacity:1; pointer-events:auto; }
}

/* =========================================================================
   HERO — cinematic split screen
   ========================================================================= */
.hero-split{ position:relative; min-height: 100vh; display:flex; align-items:stretch; overflow:hidden; }
.hero-split .hs-left{
  width: 48%; display:flex; flex-direction:column; justify-content:center;
  padding: 160px 6vw 90px 6vw; position:relative; z-index:2; background: var(--white);
}
.hero-split .hs-right{ width:52%; position:relative; overflow:hidden; }
.hero-split .hs-right img{ width:100%; height:100%; object-fit:cover; transform: scale(1.1); }
.hero-split .hs-right .hs-overlay{ position:absolute; inset:0; background: linear-gradient(90deg, rgba(11,37,69,.18), rgba(11,37,69,0) 35%); }

.hero-tag{ font-family: var(--font-mono); font-size:.72rem; letter-spacing:.2em; color: var(--gray-mid); text-transform:uppercase; margin-bottom:26px; }
.hero-split h1{ font-size: clamp(2.4rem, 4.4vw, 3.9rem); line-height:1.06; margin-bottom:26px; }
.hero-split h1 .accent{ color: var(--red); }
.hero-split p{ font-size:1.08rem; max-width: 460px; margin-bottom: 40px; line-height:1.75; }

/* Floating info panels over the image */
.hs-panel{
  position:absolute; background: rgba(255,255,255,.86); backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.5); border-radius: var(--r-md); padding: 20px 24px;
  box-shadow: var(--shadow-lg); z-index:3; max-width: min(240px, calc(100% - 48px));
}
.hs-panel .p-num{ font-family: var(--font-mono); font-weight:700; font-size:1.5rem; color: var(--navy); line-height:1; }
.hs-panel .p-label{ font-size:.76rem; color: var(--text-soft); margin-top:6px; }
.hs-panel-1{ top: 14%; left: 24px; }
.hs-panel-2{ bottom: 12%; left: 24px; }
@media (max-width: 1199.98px){ .hs-panel{ display:none; } }

/* Animated geometric shape accents */
.hs-shape{ position:absolute; z-index:2; pointer-events:none; }
.hs-shape.circle{ width:120px; height:120px; border:1px solid rgba(255,255,255,.5); border-radius:50%; top:8%; right:6%; }
.hs-shape.dash{ width:1px; height:120px; background: repeating-linear-gradient(#fff 0 8px, transparent 8px 16px); bottom:10%; right:14%; opacity:.55; }

@media (max-width: 991.98px){
  .hero-split{ flex-direction:column; min-height:auto; }
  .hero-split .hs-left,.hero-split .hs-right{ width:100%; }
  .hero-split .hs-left{ padding: 150px 24px 60px; }
  .hero-split .hs-right{ height: 420px; }
}

/* =========================================================================
   PAGE HEADER (About / Services / Contact)
   ========================================================================= */
.page-head{ position:relative; padding: 210px 0 100px; background: var(--navy-deep); color:#fff; overflow:hidden; }
.page-head .ph-img{ position:absolute; inset:0; opacity:.28; background-size:cover; background-position:center; }
.page-head .ph-overlay{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(7,26,51,.4), var(--navy-deep) 92%); }
.page-head-inner{ position:relative; z-index:2; }
.page-head .crumb{ font-family: var(--font-mono); font-size:.78rem; color: rgba(255,255,255,.55); letter-spacing:.08em; margin-bottom:20px; }
.page-head .crumb a{ color: rgba(255,255,255,.85); }
.page-head h1{ color:#fff; font-size: clamp(2.3rem, 4vw, 3.4rem); }

/* =========================================================================
   COMPANY INTRODUCTION (custom panel, not bootstrap card)
   ========================================================================= */
.intro-row{ display:flex; flex-wrap:wrap; gap:0; border-top:1px solid var(--gray-200); }
.intro-cell{ flex:1 1 260px; padding: 40px 36px; border-right:1px solid var(--gray-200); border-bottom:1px solid var(--gray-200); }
.intro-cell:last-child{ border-right:none; }
.intro-cell .ic-index{ font-family: var(--font-mono); font-size:.75rem; color: var(--red); margin-bottom:16px; }
.intro-cell h5{ font-size:1.1rem; margin-bottom:10px; }
.intro-cell p{ font-size:.92rem; margin:0; }
@media (max-width: 767.98px){ .intro-cell{ border-right:none; flex:1 1 100%; } }

/* =========================================================================
   STATS — glass panels
   ========================================================================= */
.stats-wrap{ position:relative; background: var(--navy-deep); overflow:hidden; }
.stats-wrap .stw-bg{ position:absolute; inset:0; opacity:.14; background-size:cover; background-position:center; }
.stat-panel{
  position:relative; z-index:1; background: rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px); border-radius: var(--r-md); padding: 40px 28px; text-align:center; height:100%;
}
.stat-panel .st-num{ font-family: var(--font-mono); font-weight:700; color:#fff; font-size: clamp(2.1rem,3.6vw,2.9rem); display:flex; justify-content:center; gap:2px; }
.stat-panel .st-label{ color: rgba(255,255,255,.55); font-size:.85rem; margin-top:12px; letter-spacing:.02em; }

/* =========================================================================
   PHILOSOPHY QUOTE
   ========================================================================= */
.philosophy{ position:relative; padding: 200px 0; color:#fff; overflow:hidden; }
.philosophy .phi-bg{ position:absolute; inset:0; background-size:cover; background-position:center; }
.philosophy .phi-overlay{ position:absolute; inset:0; background: rgba(6,20,38,.72); }
.philosophy blockquote{ position:relative; z-index:1; font-family: var(--font-display); font-weight:600; font-size: clamp(1.7rem,3.4vw,2.8rem); line-height:1.35; max-width:920px; margin:0 auto; text-align:center; color:#fff; }
.philosophy cite{ position:relative; z-index:1; display:block; text-align:center; margin-top:34px; font-style:normal; font-family: var(--font-mono); font-size:.78rem; letter-spacing:.16em; color: rgba(255,255,255,.55); text-transform:uppercase; }

/* =========================================================================
   WORKFLOW — connected blocks, not circles
   ========================================================================= */
.workflow{ position:relative; }
.wf-row{ display:flex; border:1px solid var(--gray-200); border-radius: var(--r-md); overflow:hidden; }
.wf-block{ flex:1; padding: 40px 30px; position:relative; border-right:1px solid var(--gray-200); }
.wf-block:last-child{ border-right:none; }
.wf-block .wf-index{ font-family: var(--font-mono); font-size:.78rem; color: var(--red); margin-bottom:20px; }
.wf-block h5{ font-size:1.05rem; margin-bottom:10px; }
.wf-block p{ font-size:.88rem; margin:0; }
.wf-progress{ position:absolute; bottom:0; left:0; height:3px; background: var(--red); width:0%; transition: width 1.4s var(--ease); }
.wf-block:nth-child(1) .wf-progress.in{ width:100%; }
.wf-block:nth-child(2) .wf-progress.in{ width:100%; transition-delay:.15s; }
.wf-block:nth-child(3) .wf-progress.in{ width:100%; transition-delay:.3s; }
.wf-block:nth-child(4) .wf-progress.in{ width:100%; transition-delay:.45s; }
@media (max-width: 991.98px){ .wf-row{ flex-direction:column; } .wf-block{ border-right:none; border-bottom:1px solid var(--gray-200); } .wf-block:last-child{ border-bottom:none; } }

/* =========================================================================
   FLEET SHOWCASE — large alternating layout
   ========================================================================= */
.fleet-item{ display:flex; align-items:center; }
.fleet-item .fl-media{ width:58%; position:relative; overflow:hidden; height: 460px; }
.fleet-item .fl-media img{ width:100%; height:100%; object-fit:cover; transition: transform 1.2s var(--ease); }
.fleet-item:hover .fl-media img{ transform: scale(1.06); }
.fleet-item .fl-content{ width:42%; padding: 0 6vw; }
.fleet-item.reverse{ flex-direction: row-reverse; }
.fl-content .fl-index{ font-family: var(--font-mono); font-size:.78rem; color: var(--red); margin-bottom:18px; }
.fl-content h3{ font-size: clamp(1.5rem,2.4vw,2.1rem); margin-bottom:16px; }
@media (max-width: 991.98px){
  .fleet-item, .fleet-item.reverse{ flex-direction:column; }
  .fleet-item .fl-media, .fleet-item .fl-content{ width:100%; }
  .fleet-item .fl-media{ height:320px; }
  .fleet-item .fl-content{ padding: 40px 24px; }
}

/* =========================================================================
   BUSINESS SECTORS — mosaic tag layout (not repeated cards)
   ========================================================================= */
.sector-mosaic{ display:flex; flex-wrap:wrap; gap:14px; }
.sector-tag{
  display:flex; align-items:center; gap:14px; padding: 20px 26px; border:1px solid var(--gray-200);
  border-radius: 100px; font-weight:600; font-size:.98rem; color: var(--navy); transition: all .35s var(--ease); flex: 0 0 auto;
}
.sector-tag i{ color: var(--red); font-size:1rem; }
.sector-tag:hover{ background: var(--navy); color:#fff; border-color: var(--navy); }
.sector-tag:hover i{ color: var(--red-soft); }
.sector-tag.lg{ font-size:1.15rem; padding: 26px 34px; }

/* =========================================================================
   TESTIMONIALS — luxury single-quote cards
   ========================================================================= */
.testi-luxe{ border:1px solid var(--gray-200); border-radius: var(--r-lg); padding: 56px; background: var(--white); }
.testi-luxe .tl-quote{ font-family: var(--font-display); font-size: clamp(1.3rem,2vw,1.7rem); color: var(--navy); font-weight:600; line-height:1.55; margin-bottom: 34px; }
.testi-luxe .tl-person{ display:flex; align-items:center; gap:16px; }
.testi-luxe .tl-person img{ width:52px; height:52px; border-radius:50%; object-fit:cover; }
.testi-luxe .tl-name{ font-weight:700; color: var(--navy); font-size:.95rem; }
.testi-luxe .tl-role{ font-size:.82rem; color: var(--text-soft); }
@media (max-width: 767.98px){ .testi-luxe{ padding: 34px 26px; } }

/* =========================================================================
   PARTNERS — grayscale to color on hover
   ========================================================================= */
.partner-strip{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap: 30px 40px; }
.partner-mark{ font-family: var(--font-display); font-weight:700; font-size:1.3rem; color: var(--gray-mid); filter: grayscale(1); opacity:.7; transition: all .4s var(--ease); }
.partner-mark:hover{ color: var(--navy); opacity:1; }

/* =========================================================================
   CLOSING STATEMENT
   ========================================================================= */
.closing{ padding: 190px 0; text-align:center; }
.closing p{ font-family: var(--font-display); font-weight:600; color: var(--navy); font-size: clamp(1.5rem,2.6vw,2.3rem); line-height:1.45; max-width:900px; margin: 0 auto; }
.closing .cl-mark{ width:34px; height:2px; background: var(--red); margin: 0 auto 34px; }

/* =========================================================================
   ABOUT PAGE — storytelling sections
   ========================================================================= */
.story-split{ display:flex; align-items:center; gap: 6vw; }
.story-split .ss-text{ width:44%; }
.story-split .ss-media{ width:56%; position:relative; }
.story-split .ss-media img{ width:100%; height:520px; object-fit:cover; border-radius: var(--r-lg); }
.story-split.reverse{ flex-direction:row-reverse; }
@media (max-width: 991.98px){
  .story-split, .story-split.reverse{ flex-direction:column; }
  .story-split .ss-text, .story-split .ss-media{ width:100%; }
  .story-split .ss-media img{ height:340px; }
}

.value-row{ border-top:1px solid var(--gray-200); }
.value-line{ display:flex; align-items:baseline; gap:36px; padding: 34px 0; border-bottom:1px solid var(--gray-200); }
.value-line .vl-num{ font-family: var(--font-mono); color: var(--red); font-size:.9rem; flex:0 0 40px; }
.value-line h5{ font-size:1.2rem; margin:0; flex: 0 0 200px; }
.value-line p{ margin:0; font-size:.94rem; max-width:520px; }
@media (max-width: 767.98px){ .value-line{ flex-direction:column; gap:10px; } .value-line h5{ flex:none; } }

.leader-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:2px; background: var(--gray-200); }
.leader-item{ background:#fff; padding: 34px 26px; text-align:center; }
.leader-item .li-photo{ width:90px; height:90px; border-radius:50%; overflow:hidden; margin: 0 auto 18px; }
.leader-item .li-photo img{ width:100%; height:100%; object-fit:cover; }
.leader-item h5{ font-size:1rem; margin-bottom:4px; }
.leader-item .li-role{ font-size:.8rem; color: var(--red); font-weight:600; }
@media (max-width: 767.98px){ .leader-grid{ grid-template-columns: repeat(2,1fr);} }

.infra-strip{ display:grid; grid-template-columns: repeat(3,1fr); gap:1px; background: var(--gray-200); }
.infra-cell{ background: var(--white); padding: 46px 34px; }
.infra-cell i{ font-size:1.6rem; color: var(--red); margin-bottom:22px; display:block; }
.infra-cell h5{ margin-bottom:10px; }
.infra-cell p{ margin:0; font-size:.9rem; }
@media (max-width: 767.98px){ .infra-strip{ grid-template-columns: 1fr;} }

.growth-rail{ position:relative; padding-left: 46px; }
.growth-rail::before{ content:''; position:absolute; left:6px; top:6px; bottom:6px; width:1px; background: var(--gray-300); }
.growth-node{ position:relative; padding-bottom: 52px; }
.growth-node:last-child{ padding-bottom:0; }
.growth-node::before{ content:''; position:absolute; left:-46px; top:4px; width:13px; height:13px; border-radius:50%; background:#fff; border:2px solid var(--red); }
.growth-node .gn-year{ font-family: var(--font-mono); color: var(--red); font-size:.85rem; font-weight:600; }
.growth-node h5{ margin: 6px 0 8px; }
.growth-node p{ margin:0; font-size:.92rem; max-width:560px; }

.culture-tiles{ display:grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 18px; }
.culture-tile{ position:relative; border-radius: var(--r-lg); overflow:hidden; min-height: 260px; }
.culture-tile img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; transition: transform 1s var(--ease); }
.culture-tile:hover img{ transform: scale(1.08); }
.culture-tile .ct-scrim{ position:absolute; inset:0; background: linear-gradient(0deg, rgba(6,20,38,.75), transparent 60%); }
.culture-tile .ct-label{ position:absolute; left:22px; bottom:20px; color:#fff; font-weight:700; z-index:1; }
@media (max-width: 991.98px){ .culture-tiles{ grid-template-columns: 1fr 1fr; } .culture-tile:first-child{ grid-column: span 2; } }

/* =========================================================================
   SERVICES PAGE — near-fullscreen alternating profile sections
   ========================================================================= */
.svc-block{ padding: 130px 0; border-bottom: 1px solid var(--gray-200); }
.svc-block:last-of-type{ border-bottom:none; }
.svc-media{ position:relative; border-radius: var(--r-lg); overflow:hidden; height: 500px; }
.svc-media img{ width:100%; height:100%; object-fit:cover; }
.svc-icon{ width:58px; height:58px; border-radius: var(--r-sm); background: var(--gray-100); border:1px solid var(--gray-200); display:flex; align-items:center; justify-content:center; font-size:1.3rem; color: var(--navy); margin-bottom: 28px; }
.svc-benefits{ list-style:none; padding:0; margin: 26px 0 0; display:grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; }
.svc-benefits li{ font-size:.92rem; color: var(--text); display:flex; gap:10px; align-items:flex-start; }
.svc-benefits li i{ color: var(--red); margin-top:4px; font-size:.8rem; }
.svc-feature-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top: 26px; }
.svc-feature-row span{ font-size:.8rem; font-weight:600; color: var(--navy); background: var(--gray-100); border:1px solid var(--gray-200); padding:8px 16px; border-radius:100px; }
.svc-index-tag{ position:absolute; top:22px; left:22px; background: rgba(255,255,255,.94); padding: 9px 16px; border-radius:100px; font-family: var(--font-mono); font-size:.72rem; letter-spacing:.06em; color: var(--navy); font-weight:600; }
@media (max-width: 767.98px){ .svc-benefits{ grid-template-columns: 1fr; } }

/* =========================================================================
   CONTACT PAGE — corporate cards
   ========================================================================= */
.corp-card{ border:1px solid var(--gray-200); border-radius: var(--r-md); padding: 38px 32px; height:100%; transition: all .35s var(--ease); }
.corp-card:hover{ box-shadow: var(--shadow-md); border-color: transparent; }
.corp-card .cc-icon{ width:52px; height:52px; border-radius: var(--r-sm); background: var(--gray-100); display:flex; align-items:center; justify-content:center; color: var(--navy); font-size:1.2rem; margin-bottom: 24px; }
.corp-card h5{ margin-bottom: 12px; }
.corp-card p{ font-size:.92rem; margin-bottom:4px; }
.corp-card a.cc-link{ font-weight:700; font-size:.9rem; color: var(--red); }

.hours-line{ display:flex; justify-content:space-between; padding: 12px 0; border-bottom: 1px solid var(--gray-200); font-size:.9rem; }
.hours-line:last-child{ border-bottom:none; }
.hours-line .hl-day{ font-weight:600; color: var(--navy); }
.hours-line .hl-time{ font-family: var(--font-mono); font-size:.83rem; color: var(--text-soft); }

.region-tag{ display:inline-flex; align-items:center; gap:8px; padding: 9px 18px; border:1px solid var(--gray-200); border-radius:100px; font-size:.85rem; font-weight:600; color: var(--navy); margin: 4px 8px 4px 0; }
.region-tag i{ color: var(--red); font-size:.75rem; }

.map-shell{ position:relative; border-radius: var(--r-lg); overflow:hidden; height: 440px; border: 1px solid var(--gray-200); }
.map-shell img{ width:100%; height:100%; object-fit:cover; filter: grayscale(.55) contrast(1.05); }
.map-marker{ position:absolute; top:50%; left:50%; transform: translate(-50%,-100%); width:40px; height:40px; border-radius:50% 50% 50% 0; background: var(--red); transform-origin:bottom center; rotate:-45deg; box-shadow: var(--shadow-lg); display:flex; align-items:center; justify-content:center; }
.map-marker i{ rotate:45deg; color:#fff; }
.map-label{ position:absolute; bottom:22px; left:22px; background: rgba(255,255,255,.95); padding: 12px 20px; border-radius: var(--r-sm); font-weight:700; font-size:.86rem; color: var(--navy); box-shadow: var(--shadow-sm); }

.social-mark{ width:42px; height:42px; border-radius:50%; border:1px solid var(--gray-200); display:flex; align-items:center; justify-content:center; color: white; transition: all .3s var(--ease); }
.social-mark:hover{ background: var(--navy); color:#fff; border-color: var(--navy); }

/* =========================================================================
   FOOTER
   ========================================================================= */
.mdcs-footer{ background: var(--navy-deep); color: rgba(255,255,255,.55); padding: 110px 0 0; }
.mdcs-footer h6{ color:#fff; font-weight:700; margin-bottom: 26px; font-size:.95rem; letter-spacing:.03em; }
.mdcs-footer p{ font-size:.9rem; color: rgba(255,255,255,.5); line-height:1.8; }
.mdcs-footer ul{ list-style:none; padding:0; margin:0; }
.mdcs-footer ul li{ margin-bottom:14px; }
.mdcs-footer ul li a{ font-size:.9rem; color: rgba(255,255,255,.62); transition: all .25s var(--ease); }
.mdcs-footer ul li a:hover{ color: var(--red-soft); padding-left:4px; }
.footer-line{ display:flex; gap:12px; margin-bottom:16px; font-size:.87rem; }
.footer-line i{ color: #fff; margin-top:3px; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); margin-top:70px; padding: 26px 0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:.8rem; }
.footer-bottom a{ color: rgba(255,255,255,.5); margin-left: 18px; }
.footer-bottom a:hover{ color:#fff; }

/* =========================================================================
   BACK TO TOP / MISC
   ========================================================================= */
.back-top{
  position:fixed; bottom:30px; right:30px; width:46px; height:46px; border-radius:50%;
  background: var(--navy); color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow: var(--shadow-lg); z-index:900; opacity:0; visibility:hidden; transform: translateY(10px);
  transition: all .35s var(--ease); border:none;
}
.back-top.show{ opacity:1; visibility:visible; transform: translateY(0); }
.back-top:hover{ background: var(--navy-ink); }

.divider-hair{ height:1px; background: var(--gray-200); }
[data-aos]{ transition-property: transform, opacity; }