@import url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:wght@300;400;500;700;800&family=Oswald:wght@400;500;600;700&display=swap');

/* CSS Variables */
:root{
  --primary:#0B3B49;
  --secondary:#1F5E5F;
  --accent:#F0A23C;
  --dark:#0A0F1A;
  --light:#EAF1F4;

  --glass-bg: rgba(255,255,255,0.6);
  --glass-border: rgba(255,255,255,0.65);
  --glass-shadow: 0 10px 30px rgba(11,59,73,0.20), 0 3px 12px rgba(10,15,26,0.10);
  --glass-shadow-strong: 0 18px 50px rgba(11,59,73,0.35), 0 6px 18px rgba(10,15,26,0.20);
  --radius: 16px;
  --radius-lg: 22px;
  --blur: 16px;

  --space-16:16px; --space-24:24px; --space-32:32px; --space-48:48px; --space-64:64px; --space-80:80px;
}

/* Reset */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html,body{ height:100%; }
img,svg,video,canvas{ display:block; max-width:100%; height:auto; }
button,input,select,textarea{ font:inherit; color:inherit; }
a{ text-decoration:none; color:inherit; }

/* Base */
body{
  font-family:'Merriweather Sans', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--dark);
  font-size:16px;
  line-height:1.7;
  background:
    radial-gradient(1200px 600px at -10% -10%, rgba(240,162,60,0.10), transparent 60%),
    radial-gradient(900px 500px at 110% 10%, rgba(31,94,95,0.12), transparent 60%),
    linear-gradient(160deg, #ffffff 0%, #F4F8FA 55%, #E7EFF3 100%);
  background-attachment: fixed, fixed, scroll;
  overflow-x:hidden;
}
::selection{ background:rgba(240,162,60,0.25); color:var(--dark); }

/* Decorative global pattern */
body::before{
  content:"";
  position:fixed; inset:-10% -10% auto -10%;
  height:120%;
  background-image: radial-gradient(circle at 20px 20px, rgba(11,59,73,0.06) 1px, transparent 1px);
  background-size: 28px 28px;
  opacity:.5;
  pointer-events:none;
  z-index:-1;
}

/* Typography */
h1,h2,h3,h4,h5,h6{
  font-family:'Oswald', Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  letter-spacing:0.5px;
  text-transform:uppercase;
  color:var(--primary);
  overflow-wrap:break-word; word-break:break-word; hyphens:auto;
}
h1{ font-size:clamp(2rem,5vw,3.5rem); line-height:1.1; }
h2{ font-size:clamp(1.6rem,3.5vw,2.4rem); line-height:1.15; }
h3{ font-size:clamp(1.3rem,2.8vw,1.8rem); line-height:1.2; }
p,li,span,small,blockquote,label{
  overflow-wrap:break-word;
}
.text-center{ text-align:center; }

/* Utility containers and spacing */
.container{ max-width:1200px; margin:0 auto; padding:0 24px; width:100%; }
.section-padding{ padding:80px 0; }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px; padding:12px 22px;
  border-radius:999px;
  border:1px solid rgba(10,15,26,0.12);
  background:linear-gradient(180deg, #ffffff 0%, #F4F7FA 100%);
  color:var(--primary);
  font-weight:700; letter-spacing:.4px;
  box-shadow:0 8px 22px rgba(11,59,73,0.15), inset 0 1px 0 rgba(255,255,255,.6);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  min-height:44px;
}
.btn:hover{ transform:translateY(-2px); box-shadow:var(--glass-shadow-strong); }
.btn:focus-visible{ outline:3px solid rgba(240,162,60,0.55); outline-offset:2px; }
.btn-primary{
  background:linear-gradient(135deg, var(--secondary) 0%, var(--primary) 100%);
  color:#fff;
  border:1px solid rgba(234,241,244,0.55);
  text-shadow:0 1px 0 rgba(0,0,0,0.25);
}
.btn-primary:hover{
  background:linear-gradient(135deg, #247373 0%, #0B3B49 100%);
}
.btn-secondary{
  background:linear-gradient(135deg, #FFD18B 0%, #F0A23C 100%);
  color:#0A0F1A;
  border:1px solid rgba(249,190,96,0.8);
}
.btn-secondary:hover{ filter:brightness(0.95); }

/* Navigation */
.main-nav{
  position:sticky; top:0; z-index:1000; width:100%;
  backdrop-filter:saturate(120%) blur(12px);
  -webkit-backdrop-filter:saturate(120%) blur(12px);
  background:linear-gradient(180deg, rgba(234,241,244,0.85), rgba(234,241,244,0.78));
  border-bottom:1px solid rgba(11,59,73,0.10);
}
.nav-container{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
  max-width:1200px; margin:0 auto; padding:8px 24px;
}
.nav-logo{
  display:flex; align-items:center; gap:12px; font-family:'Oswald'; font-weight:700; letter-spacing:1px;
  color:var(--primary);
}
.nav-logo .mark{
  width:38px; height:38px; border-radius:10px;
  background:conic-gradient(from 120deg at 50% 50%, #F0A23C, #1F5E5F, #0B3B49, #F0A23C);
  box-shadow:0 6px 16px rgba(11,59,73,0.25), inset 0 1px 0 rgba(255,255,255,0.5);
  position:relative; isolation:isolate;
}
.nav-logo .mark::after{
  content:""; position:absolute; inset:3px; border-radius:8px;
  background:rgba(255,255,255,0.6); backdrop-filter: blur(3px);
}
.nav-links{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; list-style:none; padding:0; margin:0;
}
.nav-links a{
  white-space:nowrap; font-size:0.9rem; padding:6px 10px; color:var(--dark); font-weight:600;
  border-bottom:2px solid transparent; transition:border-color .2s ease, color .2s ease, background .2s ease;
  border-radius:8px;
}
.nav-links a:hover{ border-bottom-color:var(--accent); color:var(--primary); }
.nav-toggle-checkbox{ position:absolute; left:-9999px; opacity:0; }
.nav-toggle-label{
  display:none; align-items:center; justify-content:center; gap:8px;
  width:44px; height:44px; border-radius:10px; cursor:pointer;
  background:rgba(255,255,255,0.9); border:1px solid rgba(11,59,73,0.12);
  box-shadow:0 6px 16px rgba(11,59,73,0.12);
}
.nav-toggle-label span,.nav-toggle-label::before,.nav-toggle-label::after{
  content:""; display:block; width:22px; height:2px; background:var(--primary); border-radius:2px; transition:transform .25s ease, opacity .2s ease;
}
.nav-toggle-checkbox:checked + .nav-toggle-label::before{ transform:translateY(6px) rotate(45deg); }
.nav-toggle-checkbox:checked + .nav-toggle-label span{ opacity:0; }
.nav-toggle-checkbox:checked + .nav-toggle-label::after{ transform:translateY(-6px) rotate(-45deg); }

/* Hero Section - Diagonal Split */
.hero-section{
  position:relative; overflow:visible; background:#fff; color:var(--dark);
}
.hero-section::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(31,94,95,0.96) 0%, rgba(11,59,73,0.96) 100%);
  clip-path:polygon(0 0, 60% 0, 48% 100%, 0% 100%);
  z-index:0; animation:driftDiagonal 14s ease-in-out infinite alternate;
}
.hero-section::after{
  content:""; position:absolute; top:12%; left:40%; width:560px; height:560px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(240,162,60,0.55), rgba(240,162,60,0.0) 60%);
  filter:blur(18px); opacity:.55; z-index:0; pointer-events:none; animation:glowPulse 10s ease-in-out infinite;
}
.hero-section .container{ position:relative; z-index:2; }
.hero-section .eyebrow{
  display:inline-block; padding:6px 12px; border-radius:999px;
  background:rgba(234,241,244,0.9); color:var(--primary); border:1px solid rgba(11,59,73,0.15);
  font-weight:800; letter-spacing:.6px; text-transform:uppercase; font-size:.8rem;
}
.hero-section h1{
  color:#fff; text-shadow:0 2px 4px rgba(0,0,0,0.35), 0 0 2px rgba(0,0,0,0.2);
  max-width:14ch;
}
.hero-section p{
  color:#EAF1F4; max-width:60ch;
}
.hero-cta{ display:flex; flex-wrap:wrap; gap:16px; margin-top:24px; }

/* Grid layouts */
.grid-2{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:32px; }
.grid-3{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:28px; }
.grid-4{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:24px; }
.grid-2 > *, .grid-3 > *, .grid-4 > *{ min-width:0; }

/* Cards - Glassmorphism */
.card{
  overflow:visible; min-width:0; width:100%;
  background:linear-gradient(180deg, rgba(255,255,255,0.75), rgba(255,255,255,0.55));
  backdrop-filter: blur(var(--blur)) saturate(140%);
  -webkit-backdrop-filter: blur(var(--blur)) saturate(140%);
  border:1px solid var(--glass-border);
  border-radius:var(--radius-lg);
  box-shadow:var(--glass-shadow);
  padding:24px;
  position:relative; isolation:isolate;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  color:var(--dark);
}
.card::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0) 40%);
  mix-blend-mode:soft-light;
}
.card:hover{
  transform:translateY(-6px);
  box-shadow:var(--glass-shadow-strong);
  border-color:rgba(240,162,60,0.6);
}
.card h2, .card h3{
  overflow-wrap:break-word; word-break:break-word; hyphens:auto;
  color:var(--primary);
}
.service-icon, .card .service-icon{
  width:84px; height:84px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin:-52px auto 16px auto;
  background:radial-gradient(circle at 35% 35%, #FFD89A 0%, #F0A23C 60%, #E07F0A 100%);
  border:6px solid rgba(255,255,255,0.75);
  box-shadow:0 10px 30px rgba(240,162,60,0.35), inset 0 2px 12px rgba(255,255,255,0.6);
  color:#0A0F1A; font-weight:900; font-size:28px;
  animation:floatUp 6s ease-in-out infinite;
}

/* Testimonial Card - darker glass for contrast on light background */
.testimonial-card{
  background:linear-gradient(180deg, rgba(11,59,73,0.86), rgba(10,15,26,0.86));
  border:1px solid rgba(234,241,244,0.25);
  color:#EAF1F4;
}
.testimonial-card h3{ color:#fff; }
.testimonial-card p{ color:#EAF1F4; }

/* Stats Section with skewed background transitions */
.stats-section{
  position:relative;
  background:linear-gradient(140deg, var(--secondary) 0%, var(--primary) 100%);
  color:#EAF1F4;
}
.stats-section .container{ position:relative; z-index:2; }
.stats-section::before,
.stats-section::after{
  content:""; position:absolute; left:0; right:0; height:80px; z-index:1;
  background:inherit; transform-origin:left;
}
.stats-section::before{ top:-40px; transform:skewY(-3deg); filter:brightness(1.05); }
.stats-section::after{ bottom:-40px; transform:skewY(-3deg); filter:brightness(0.95); }
.stat-number{
  font-family:'Oswald'; font-weight:700; font-size:clamp(2rem,6vw,3rem);
  color:#fff; text-shadow:0 2px 6px rgba(0,0,0,0.25);
}

/* Team */
.team-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,260px),1fr)); gap:28px; }
.team-member{
  min-width:0;
  background:linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.55));
  backdrop-filter: blur(var(--blur));
  border:1px solid rgba(255,255,255,0.7);
  border-radius:20px;
  padding:24px;
  box-shadow:var(--glass-shadow);
  text-align:center;
}
.member-photo{
  width:112px; height:112px; border-radius:50%; margin:0 auto 16px;
  background:linear-gradient(135deg, #CFE5EA, #EAF1F4);
  border:4px solid #fff;
  box-shadow:0 10px 24px rgba(11,59,73,0.18);
}

/* Contact Form */
.contact-form{
  background:linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.6));
  border:1px solid rgba(11,59,73,0.12);
  border-radius:20px;
  padding:32px;
  box-shadow:var(--glass-shadow);
  backdrop-filter: blur(10px);
  color:var(--dark);
}
.contact-form label, .contact-label{
  display:block; margin-bottom:8px; font-weight:700; color:var(--primary); letter-spacing:.3px;
}
.contact-form input, .contact-form textarea, .contact-form select{
  width:100%; border-radius:12px; border:1px solid rgba(11,59,73,0.25);
  background:rgba(255,255,255,0.95);
  color:var(--dark); padding:12px 14px; margin-bottom:16px;
  min-height:44px;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.contact-form input::placeholder, .contact-form textarea::placeholder{ color:#506874; opacity:1; }
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus{
  outline:none; border-color:var(--accent);
  box-shadow:0 0 0 4px rgba(240,162,60,0.25);
}

/* Section alternates to create rhythm */
.section-alt{
  background:linear-gradient(180deg, #FFFFFF 0%, #F6FBFD 100%);
  position:relative;
}
.section-alt::before, .section-alt::after{
  content:""; position:absolute; left:0; right:0; height:70px; background:inherit;
  transform:skewY(-3deg); z-index:1;
}
.section-alt::before{ top:-35px; filter:brightness(1.02); }
.section-alt::after{ bottom:-35px; filter:brightness(0.98); }

/* Footer - Split footer */
.site-footer{
  position:relative;
  background:linear-gradient(160deg, #0A0F1A 0%, #0B2130 60%, #0B3B49 100%);
  color:#EAF1F4;
  padding-top:64px;
}
.footer-grid{
  display:grid; grid-template-columns: 1.2fr 2fr; gap:48px; align-items:start;
}
.footer-brand{
  display:flex; flex-direction:column; gap:16px;
}
.footer-logo{
  display:flex; align-items:center; gap:12px; color:#fff; font-family:'Oswald'; font-weight:700; letter-spacing:1px;
}
.footer-logo .mark{
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg, #F0A23C, #C26F06);
  box-shadow:0 10px 24px rgba(240,162,60,0.35), inset 0 1px 0 rgba(255,255,255,0.5);
}
.footer-description{ color:#DCE7EC; max-width:48ch; }
.footer-links{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); gap:24px;
}
.footer-links h4{
  color:#fff; font-size:1rem; margin-bottom:12px;
}
.footer-links a{
  color:#DCE7EC; font-weight:600; padding:6px 0; display:inline-block;
  border-bottom:2px solid transparent;
}
.footer-links a:hover{ color:#fff; border-bottom-color:#F0A23C; }
.footer-contact-list{ list-style:none; padding:0; margin:0; color:#DCE7EC; }
.footer-bottom{
  border-top:1px solid rgba(234,241,244,0.18);
  margin-top:48px; padding:16px 0; color:#C7D6DC; font-size:0.9rem;
}

/* Links global (ensure visibility) */
a{ color:var(--primary); }
a:hover{ color:#07303C; }

/* Animations */
@keyframes floatUp{
  0%{ transform:translateY(0); }
  50%{ transform:translateY(-8px); }
  100%{ transform:translateY(0); }
}
@keyframes glassGlow{
  0%{ box-shadow:0 10px 30px rgba(11,59,73,0.18), inset 0 1px 0 rgba(255,255,255,.5); }
  100%{ box-shadow:0 18px 50px rgba(11,59,73,0.35), inset 0 1px 0 rgba(255,255,255,.7); }
}
@keyframes driftDiagonal{
  0%{ clip-path:polygon(0 0, 58% 0, 46% 100%, 0% 100%); }
  100%{ clip-path:polygon(0 0, 62% 0, 50% 100%, 0% 100%); }
}
@keyframes glowPulse{
  0%,100%{ opacity:.45; transform:translate3d(0,0,0) scale(1); }
  50%{ opacity:.65; transform:translate3d(6px,-6px,0) scale(1.05); }
}
@keyframes fadeInUp{
  0%{ opacity:0; transform:translateY(12px); }
  100%{ opacity:1; transform:translateY(0); }
}

/* Apply subtle animations to elements */
.card{ animation:fadeInUp .6s ease both; }
.hero-cta .btn-primary{ animation:glassGlow 1.8s ease-in-out alternate infinite; }

/* Sales / Dispatch / Services specific accents (glass tags) */
.tag-chip{
  display:inline-block; padding:6px 10px; border-radius:999px; font-weight:800; letter-spacing:.5px;
  background:rgba(240,162,60,0.15); border:1px solid rgba(240,162,60,0.5); color:#7a4c0a;
}

/* Results highlights */
.result-badge{
  display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:12px;
  background:rgba(31,94,95,0.15); border:1px solid rgba(31,94,95,0.4); color:#0B3B49; font-weight:800;
}

/* Pricing cards */
.pricing-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.86), rgba(255,255,255,0.66));
  border:1px solid rgba(11,59,73,0.16);
  backdrop-filter: blur(14px);
}
.pricing-card .price{
  font-family:'Oswald'; font-size:clamp(1.8rem,4vw,2.6rem); color:var(--primary);
}

/* Process steps */
.step{
  display:flex; align-items:flex-start; gap:16px; min-width:0;
}
.step .step-index{
  width:38px; height:38px; border-radius:10px; flex:0 0 auto;
  background:linear-gradient(135deg, var(--primary), var(--secondary));
  color:#fff; font-family:'Oswald'; display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(11,59,73,0.25);
}

/* FAQ */
.faq-item{
  background:linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.6));
  border:1px solid rgba(11,59,73,0.15);
  border-radius:16px; padding:18px 20px; min-width:0;
}
.faq-item summary{
  cursor:pointer; font-weight:800; color:var(--primary);
}
.faq-item p{ margin-top:12px; }

/* Navigation mobile rules (Mandatory) */
@media (max-width: 768px){
  .nav-toggle-label{ display:flex; }
  .nav-links{
    display:none; position:absolute; top:100%; left:0; right:0;
    flex-direction:column; padding:16px 24px; background:#fff;
    box-shadow:0 8px 24px rgba(0,0,0,0.12);
  }
  .nav-toggle-checkbox:checked ~ .nav-links{ display:flex; }
  .nav-links a{
    display:block; width:100%; padding:12px 16px; border-radius:8px; font-size:1rem;
    color:var(--primary); border-bottom:2px solid transparent;
  }
  .nav-links a:hover{ background:#F4F8FA; border-bottom-color:var(--accent); }

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

/* Smaller screens */
@media (max-width: 480px){
  .hero-cta .btn, .btn{ width:100%; }
  .service-icon{ width:76px; height:76px; margin-top:-48px; }
  .section-padding{ padding:64px 0; }
}

/* HERO specific content alignment to overlap split line */
.hero-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,300px),1fr)); gap:32px; align-items:center;
}
.hero-grid > *{ min-width:0; }
.hero-kpis{
  display:flex; flex-wrap:wrap; gap:16px; margin-top:16px;
}
.hero-stat{
  background:rgba(255,255,255,0.15); color:#fff; border:1px solid rgba(234,241,244,0.35);
  padding:12px 16px; border-radius:12px; backdrop-filter: blur(6px);
}

/* Underline nav animation (minimal) */
.nav-links a{ position:relative; }
.nav-links a::after{
  content:""; position:absolute; left:10px; right:10px; bottom:2px; height:2px; background:var(--accent);
  transform:scaleX(0); transform-origin:left; transition:transform .2s ease;
}
.nav-links a:hover::after{ transform:scaleX(1); }

/* Shadows and depth helpers */
.layered-shadow{
  box-shadow:
    0 30px 60px rgba(11,59,73,0.22),
    0 18px 36px rgba(11,59,73,0.18),
    inset 0 1px 0 rgba(255,255,255,0.6);
}

/* Link colors for dark/light sections */
.on-dark a{ color:#fff; border-bottom-color:transparent; }
.on-dark a:hover{ color:#FFDFAE; }

/* Ensure no text clipping anywhere */
h1,h2,h3,h4,h5,h6,.card h2,.card h3,p,li,small,blockquote,label,summary{ max-width:100%; }

/* Specific section themes for HYAB LOGISTICS LLC */
.dispatch-highlight{
  background:linear-gradient(135deg, rgba(31,94,95,0.1), rgba(240,162,60,0.12));
  border-radius:24px; padding:24px; border:1px solid rgba(11,59,73,0.15);
}
.sales-highlight{
  background:linear-gradient(135deg, rgba(240,162,60,0.18), rgba(255,255,255,0.6));
  border-radius:24px; padding:24px; border:1px solid rgba(240,162,60,0.35);
}

/* Safety Focus styles */
:focus-visible{ outline:3px solid rgba(240,162,60,0.6); outline-offset:2px; }

/* Global CSS Safety Block - explicit color contexts and contrasts */
.main-nav, .main-nav a, .main-nav button{
  color:var(--dark);
}
.hero-section h1, .hero-section h2, .hero-section h3, .hero-section p, .hero-section a, .hero-section .btn{
  color:#EAF1F4;
}
.hero-section .btn.btn-secondary{ color:#0A0F1A; }
.section-alt h1, .section-alt h2, .section-alt h3, .section-alt p, .section-alt a{ color:var(--dark); }
.stats-section h1, .stats-section h2, .stats-section h3, .stats-section p, .stats-section a{ color:#EAF1F4; }
.stats-section .btn{ background:#FFFFFF; color:var(--primary); border-color:rgba(255,255,255,0.8); }
.card h1,.card h2,.card h3,.card p,.card a{ color:var(--dark); }
.testimonial-card h1,.testimonial-card h2,.testimonial-card h3,.testimonial-card p,.testimonial-card a{ color:#EAF1F4; }
.pricing-card h1,.pricing-card h2,.pricing-card h3,.pricing-card p,.pricing-card a{ color:var(--dark); }

.site-footer, .site-footer h1, .site-footer h2, .site-footer h3, .site-footer p, .site-footer a, .site-footer small, .site-footer label{
  color:#DCE7EC;
}
.site-footer a:hover{ color:#fff; }

.contact-form label, .contact-form input, .contact-form textarea{ color:var(--dark); }
.contact-form .btn-primary{ color:#fff; }
.contact-form .btn-secondary{ color:#0A0F1A; }

/* Link states visibility */
a:focus-visible, .footer-links a:focus-visible, .nav-links a:focus-visible, .btn:focus-visible{
  box-shadow:0 0 0 4px rgba(240,162,60,0.35);
}

/* Ensure strong contrast for placeholders on dark backgrounds */
.on-dark ::placeholder{ color:#C7D6DC; opacity:1; }

/* Prevent layout overflow issues */
.container, .grid-2, .grid-3, .grid-4, .team-grid, .footer-grid{ overflow:visible; }

/* Additional diagonal section utility */
.angled-section{
  position:relative;
}
.angled-section::before{
  content:""; position:absolute; top:-40px; left:0; right:0; height:80px; background:inherit; transform:skewY(-3deg);
}
.angled-section::after{
  content:""; position:absolute; bottom:-40px; left:0; right:0; height:80px; background:inherit; transform:skewY(-3deg);
}

/* Form states */
.input-error{ border-color:#C62828 !important; box-shadow:0 0 0 4px rgba(198,40,40,0.2) !important; }
.input-success{ border-color:#2E7D32 !important; box-shadow:0 0 0 4px rgba(46,125,50,0.2) !important; }

/* Ensure navigation handles many links without overflow */
.nav-links{ max-width:calc(100% - 200px); }
@media (max-width: 1024px){
  .nav-links{ max-width:100%; }
}

/* Strong color overrides for dark backgrounds */
.bg-dark, .on-dark{
  background:linear-gradient(170deg, #0A0F1A, #0B2130);
  color:#EAF1F4;
}
.bg-dark h1,.bg-dark h2,.bg-dark h3,.bg-dark p,.bg-dark a{ color:#EAF1F4; }
.bg-dark .btn{ background:#fff; color:var(--primary); }

/* Ensure cards on dark backgrounds remain readable */
.bg-dark .card{
  background:linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.08));
  color:#EAF1F4; border-color:rgba(234,241,244,0.2);
}
.bg-dark .card h2, .bg-dark .card h3, .bg-dark .card p, .bg-dark .card a{ color:#EAF1F4; }

/* Ensure nav/mobile menu text visibility */
@media (max-width:768px){
  .main-nav{ background:#FFFFFF; }
  .nav-links a{ color:var(--primary); }
  .nav-toggle-label{ background:#FFFFFF; }
}

/* End Safety */

/* === LAYOUT SAFETY OVERRIDES (always appended) === */
*,*::before,*::after{box-sizing:border-box}
h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;word-break:break-word;hyphens:auto}
p,li,span,a,td,th,label,blockquote,figcaption{overflow-wrap:break-word}
img,video,svg,canvas{max-width:100%;height:auto}
.container{max-width:1200px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px;width:100%}
.main-nav{position:sticky;top:0;z-index:1000;width:100%}
.nav-container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;max-width:1200px;margin:0 auto;padding:8px 24px}
.nav-logo{flex-shrink:0}
.nav-links{display:flex;flex-wrap:wrap;list-style:none;gap:6px 16px;align-items:center;padding:0;margin:0}
.nav-links li{list-style:none}
.nav-links a{white-space:nowrap;font-size:0.9rem;padding:6px 10px;display:inline-block}
.card{overflow:visible;min-width:0}
.card h2,.card h3,.card h4{overflow-wrap:break-word;word-break:break-word;hyphens:auto}
.grid-2,.grid-3,.grid-4{display:grid}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.grid-2>*,.grid-3>*,.grid-4>*{min-width:0;width:100%}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.team-grid>*{min-width:0}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.footer-grid>*{min-width:0}
@media(max-width:768px){
  .nav-links{position:absolute;top:100%;left:0;right:0;flex-direction:column;padding:16px 24px;display:none;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,0.12);border-top:1px solid rgba(0,0,0,0.06);z-index:999}
  .nav-links li{width:100%}
  .nav-links a{display:block;width:100%;padding:12px 16px;border-radius:8px;font-size:1rem;transition:background 0.2s}
  .nav-links a:hover{background:rgba(0,0,0,0.04)}
  .nav-toggle-label{display:flex!important;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;cursor:pointer}
  .nav-toggle-label:hover{background:rgba(0,0,0,0.04)}
  .nav-toggle-checkbox:checked~.nav-links{display:flex!important}
  .grid-2,.grid-3,.grid-4,.team-grid,.footer-grid{grid-template-columns:1fr}
  .hero-section{padding:80px 0 60px!important}
  .hero-section h1{font-size:clamp(1.8rem,6vw,2.8rem)!important}
  .section-padding{padding:50px 0!important}
  .card{padding:24px!important}
  .stats-section .stat-number{font-size:2rem!important}
}
@media(max-width:480px){
  .hero-section{padding:60px 0 40px!important}
  .section-padding{padding:40px 0!important}
  .btn{padding:12px 24px!important;font-size:0.95rem!important;width:100%!important;text-align:center}
  .hero-section .btn{width:auto!important}
  h2{font-size:clamp(1.3rem,4vw,2rem)!important}
}