/* ShippingContainerCompany.com — site-level layout only.
   All colour, type, spacing, radius and elevation values come from the
   Container Co. design system tokens (_ds/.../styles.css). Do not add
   new colours or font sizes here. */

html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}

/* Links — design-system copper, never browser blue */
a{color:var(--copper-700);text-decoration:none;border-bottom:1px solid rgba(192,106,51,.35)}
a:hover{color:var(--copper-600);border-bottom-color:var(--copper-600)}
a:focus-visible{outline:none;box-shadow:var(--ring-focus);border-radius:var(--radius-sm)}
.u-plain,.u-plain:hover{border-bottom:0}

.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--ink-950);color:var(--bone-50);padding:12px 18px;font-size:14px;font-weight:600;border-bottom:0}
.skip-link:focus{left:12px;top:12px}

/* Containers */
.wrap{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter-page-lg)}
.wrap-narrow{max-width:var(--container-narrow);margin:0 auto;padding:0 var(--gutter-page-lg)}

/* Grids — collapse predictably instead of squeezing */
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.split-5-7{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:start}
.split-7-5{display:grid;grid-template-columns:7fr 5fr;gap:0}
.split-4-8{display:grid;grid-template-columns:4fr 8fr;gap:64px;align-items:start}
.split-6-6{display:grid;grid-template-columns:6fr 6fr;gap:64px;align-items:start}
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.form-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:48px}

/* Header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(252,250,246,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--border-hairline)}
.site-header-inner{max-width:var(--container-max);margin:0 auto;padding:14px clamp(20px,4vw,56px);min-height:80px;display:flex;align-items:center;flex-wrap:wrap;column-gap:clamp(16px,2.5vw,32px);row-gap:12px}
.site-nav{display:flex;flex-wrap:wrap;column-gap:clamp(12px,1.6vw,22px);row-gap:8px;min-width:0;flex:1 1 auto}
.site-nav a{font-size:13.5px;font-weight:600;white-space:nowrap;border-bottom:0;color:var(--ink-600)}
.site-nav a:hover{color:var(--ink-900)}
.site-nav a[aria-current="page"]{color:var(--ink-900)}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:12px;flex:0 0 auto}

@media (max-width:1180px){
  .split-5-7,.split-4-8,.split-6-6{gap:48px}
}
@media (max-width:1000px){
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split-5-7,.split-4-8,.split-6-6,.split-7-5{grid-template-columns:minmax(0,1fr);gap:40px}
  .form-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1fr 1fr;gap:40px}
  .site-nav{order:3;flex-basis:100%;overflow-x:auto;padding-bottom:2px}
  .header-actions{margin-left:auto}
}
@media (max-width:720px){
  .grid-4,.grid-3,.grid-2,.checklist,.form-2,.form-3,.footer-grid{grid-template-columns:minmax(0,1fr)}
  .checklist{gap:0}
  .hero{padding-top:88px !important;padding-bottom:72px !important}
}
@media (max-width:420px){
  .header-actions .ds-hide-xs{display:none}
}

/* Forms */
fieldset{border:0;margin:0;padding:0;min-width:0}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.field-error{font-size:var(--size-caption);color:var(--status-danger-fg)}
input[type="file"]{font-size:13px;font-family:var(--font-mono);max-width:100%}
input[type="file"]:focus-visible{outline:none;box-shadow:var(--ring-focus)}

/* Motion preference */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important;scroll-behavior:auto !important}
}