/* Layout extensions to the authoritative components in assets/design-system.css. */
:root{--page:var(--page-bg-7);--surface:var(--surface-7);--ink:var(--dry-ink-1);--secondary:var(--secondary-text-3);--brown:var(--camel-brown-3);--gold:var(--route-gold-4);--border:var(--border-5);--font:'Plus Jakarta Sans','Inter',Arial,sans-serif;--mono:'IBM Plex Mono','SFMono-Regular',Consolas,monospace;--gutter:32px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--page);color:var(--ink);font:400 var(--type-body-size)/var(--type-body-lineHeight) var(--font);-webkit-font-smoothing:antialiased}h1,h2,h3,h4,p{margin:0}h1{font-size:var(--type-display-size);font-weight:var(--type-display-weight);line-height:var(--type-display-lineHeight);letter-spacing:var(--type-display-letterSpacing)}h2{font-size:var(--type-headline-size);font-weight:var(--type-headline-weight);line-height:var(--type-headline-lineHeight);letter-spacing:var(--type-headline-letterSpacing)}h3{font-size:var(--type-title-size);font-weight:var(--type-title-weight);line-height:var(--type-title-lineHeight);letter-spacing:var(--type-title-letterSpacing)}p{color:var(--secondary)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}svg{display:block}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--camel-brown-2);outline-offset:4px}main:focus{outline:none}.sr-btn-primary:focus-visible,.sr-btn-secondary:focus-visible{outline:2px solid var(--camel-brown-2);outline-offset:4px}.container{max-width:1280px;padding-left:var(--gutter);padding-right:var(--gutter);margin-left:auto;margin-right:auto}.section{padding-top:128px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:48px;margin-bottom:48px}.section-heading .sr-eyebrow{margin-bottom:24px}.section-heading>p{max-width:360px}.lead{font-size:var(--type-body-lg-size);line-height:var(--type-body-lg-lineHeight);max-width:620px}.sr-eyebrow{margin-bottom:24px}.arrow{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:32px}.sr-link{min-height:44px}.section-link{margin-top:24px}.skip-link{position:fixed;left:16px;top:8px;transform:translateY(-150%);padding:12px 20px;background:var(--surface);z-index:20}.skip-link:focus{transform:translateY(0)}
/* Shared navigation and footer. */
.sr-header{position:relative}.sr-brand{display:flex;align-items:center;gap:12px;white-space:nowrap}.camel{width:40px;height:28px;color:var(--camel-brown-2)}.sr-brand small{display:block;font-size:9px;letter-spacing:.25em;margin-top:2px}.desktop-nav a{min-height:44px;display:flex;align-items:center}.desktop-nav a[aria-current]{color:var(--camel-brown-2);text-decoration:underline;text-underline-offset:6px}.sr-header__actions>a:first-child{min-height:44px;display:flex;align-items:center}.menu-toggle{display:none;width:44px;height:44px;align-items:center;justify-content:center;background:transparent;border:1px solid var(--border);border-radius:var(--radius-control)}.menu-toggle svg{width:24px;fill:none;stroke:var(--ink);stroke-width:1.5}.mobile-menu{border:0;background:var(--page);color:var(--ink);width:min(420px,100%);max-width:100%;max-height:100dvh;margin:0 0 0 auto;min-height:100dvh;padding:24px;box-shadow:var(--shadow-structural)}.mobile-menu::backdrop{background:rgba(16,16,15,.35)}.menu-head{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--border);padding-bottom:24px}.menu-head h2{font-size:20px}.menu-close{height:44px;border:0;background:transparent;color:var(--secondary);padding:0 8px}.menu-close span{font-size:24px;margin-left:8px}.mobile-menu nav{display:flex;flex-direction:column;padding-top:24px}.mobile-menu nav a{padding:16px 0;border-bottom:1px solid var(--border);font-size:20px}.mobile-menu .actions{align-items:stretch;flex-direction:column}.footer{margin-top:128px;border-top:1px solid var(--border);padding-top:64px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px}.footer-grid h2{font-size:13px;letter-spacing:0;line-height:1.3;margin-bottom:24px}.footer-grid p,.footer-grid nav{font-size:13px;line-height:2}.footer-grid>div:first-child>p{margin-top:24px}.footer nav{display:flex;flex-direction:column;align-items:start}.footer nav a{min-height:44px;display:flex;align-items:center}.footer nav a:hover{color:var(--brown);text-decoration:underline}.footer-bottom{margin-top:48px;padding-top:24px;padding-bottom:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:24px;font-size:11px;color:var(--secondary)}.footer-bottom strong{font-weight:600}.pending{color:var(--secondary);font-size:12px;line-height:2}.footer .camel{width:32px;height:24px}
/* Hero: physical operations above a visibility layer. */
.home-hero{padding-top:96px;padding-bottom:64px;display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center}.home-hero h1>span{color:var(--brown)}.home-hero .lead{margin-top:24px;max-width:580px;font-size:16px}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.sr-fact{padding-top:24px}.sr-fact strong{margin-bottom:8px}.page-hero{padding-top:96px;padding-bottom:80px}.page-hero .lead{margin-top:24px;max-width:720px}
/* One connected logistics journey. */
.journey{padding:0;margin:0;list-style:none;display:grid;grid-template-columns:repeat(5,1fr)}.journey li{position:relative;padding-right:24px}.step-number{display:block;margin-bottom:24px;font-size:var(--type-mono-size)}.journey-node{display:block;width:10px;height:10px;border:2px solid var(--route-gold-3);border-radius:50%;background:var(--page);z-index:1;position:relative}.journey li:after{content:'';position:absolute;left:0;right:0;top:46px;height:1px;background:var(--route-gold-6)}.journey li:last-child:after{display:none}.journey h3{margin-top:24px;margin-bottom:8px}.journey li>p{font-size:13px;min-height:42px;max-width:180px}.journey li>.sr-code:last-child{display:block;font-size:var(--type-mono-size);margin-top:16px}.journey-note{margin-top:32px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:24px;align-items:center}.journey-note>.sr-code{font-size:var(--type-mono-size)}.journey-note p{font-size:12px}.journey-note a{font-size:12px}
/* Signature network: a diagram rather than a geographic promise. */
.network-section{margin-top:128px;background:var(--technical-grid-7);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.network-section .section{padding-top:64px;padding-bottom:48px}.network-key{display:flex;align-items:center;gap:24px;font-size:var(--type-mono-size);color:var(--secondary)}.network-key>span{display:flex;gap:8px;align-items:center}.network-key>.sr-code{margin-left:auto;font-size:var(--type-mono-size)}.key-node{width:8px;height:8px;border:1px solid var(--route-gold-3);border-radius:50%}.key-route{width:24px;height:1px;background:var(--gold)}.network-diagram{margin-top:32px}.desktop-network{width:100%;height:auto}.mobile-network{display:none}.network-outline{fill:none;stroke:var(--border-4);stroke-width:1}.region-label{font:11px var(--mono);letter-spacing:2px;fill:var(--secondary)}.route-under{fill:none;stroke:var(--border-4);stroke-width:1.5;stroke-dasharray:4 6}.progress-route,.branch-line,.destination-branches path{fill:none;stroke:var(--gold);stroke-width:2}.map-node circle{fill:var(--page);stroke:var(--route-gold-3);stroke-width:2}.network-label{font:600 15px var(--font);fill:var(--ink)}.map-label{font:10px var(--mono);fill:var(--secondary);letter-spacing:.3px}.moving-camel{color:var(--brown)}.moving-camel circle{fill:var(--page);stroke:var(--camel-brown-6);stroke-width:1}.moving-camel use{color:var(--brown)}.route-states{display:flex;justify-content:space-between;gap:12px;margin-top:24px}.route-state{font-size:10px;color:var(--secondary)}.route-state.is-active{color:var(--camel-brown-2);text-decoration:underline;text-underline-offset:5px}.network-bottom{border-top:1px solid var(--border);margin-top:32px;padding-top:24px;display:flex;justify-content:space-between;gap:24px;font-size:var(--type-mono-size);color:var(--secondary)}
/* Connected operational service rows. */
.service-rows{border-top:1px solid var(--border)}.service-row{display:grid;grid-template-columns:176px minmax(0,1fr) minmax(0,1.2fr) 24px;gap:24px;align-items:center;padding:32px 0;border-bottom:1px solid var(--border)}.service-row .sr-code{font-size:var(--type-mono-size)}.service-row p{font-size:14px;max-width:480px}.service-row:hover h3{color:var(--brown)}.row-arrow{color:var(--brown);font-size:20px}.final-cta{margin-top:128px;padding-top:64px;padding-bottom:64px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:48px}.final-cta h2{font-size:var(--type-headline-size)}.final-cta p{font-size:14px;max-width:620px;margin-top:16px}.final-cta .actions{flex-shrink:0;margin:0}
/* Violet never escapes the Okiroo product surface. */
.okiroo-section{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}.okiroo-section .section-heading{margin-bottom:24px}.okiroo-section .lead{font-size:15px}.sr-okiroo .demo-label{font:500 var(--type-mono-size)/1.5 var(--mono);color:var(--okiroo-violet-3);letter-spacing:.04em}.sr-okiroo__body{padding:24px}.sr-okiroo__body h3{font-size:20px;margin-top:24px;margin-bottom:8px}.sr-okiroo__body>.sr-code{font-size:var(--type-mono-size)}.sr-okiroo__bar{gap:16px;flex-wrap:wrap}
/* Dedicated pages. */
.service-detail{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center;border-top:1px solid var(--border);padding-top:64px;margin-top:96px}.service-detail .lead{font-size:16px;margin-top:24px}.service-detail h3{font-size:13px;letter-spacing:0;margin-top:24px;margin-bottom:8px}.service-detail p{font-size:14px}.supply-chain{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;padding:0;margin:0;gap:32px}.supply-chain li{border-top:1px solid var(--route-gold-6);padding-top:16px}.supply-chain .sr-code{display:block;font-size:10px;margin-bottom:12px}.supply-chain li>span:last-child{font-size:14px;font-weight:500}.tracking-form{margin-top:32px;max-width:580px}.tracking-form label{display:block;font-size:13px;font-weight:500;margin-bottom:12px}.sr-tracking{width:100%;max-width:580px}.sr-tracking input{width:0}.sr-tracking button{min-height:44px}.powered{font-size:12px;margin-top:16px}.form-notice{font-size:13px;margin-top:16px}.form-notice:empty{display:none}.tracking-section{padding-top:32px}.tracking-demo{max-width:720px}.tracking-demo .sr-okiroo__body>p{margin-bottom:16px}.tracking-milestones{list-style:none;padding:8px 0 0;margin:0}.tracking-milestones li{position:relative;padding-left:36px;padding-bottom:32px}.tracking-milestones li:before{content:'';width:1px;position:absolute;top:6px;bottom:0;left:5px;background:var(--okiroo-violet-6)}.tracking-milestones li:last-child:before{display:none}.tracking-milestones li:last-child{padding-bottom:0}.tracking-milestones h3{font-size:14px;letter-spacing:0;margin:0 0 4px}.tracking-milestones p{font-size:12px}.sr-okiroo .milestone-node{position:absolute;left:0;top:4px;width:11px;height:11px;border-radius:50%;border:2px solid var(--okiroo-violet-3);background:var(--surface)}.about-intro .lead{margin:48px 0 64px;max-width:720px}.about-rows>section{display:grid;grid-template-columns:1fr 2fr;gap:64px;border-top:1px solid var(--border);padding:48px 0}.about-rows h2{font-size:30px}.about-rows p:not(.sr-eyebrow){max-width:640px;margin-top:24px}.contact-layout{display:grid;grid-template-columns:2fr 1fr;gap:96px}.quote-form{border-top:1px solid var(--border);padding-top:32px}.quote-form h2{font-size:24px}.form-help{font-size:12px;margin-top:12px;margin-bottom:32px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.form-field{min-width:0}.form-field.full{grid-column:1/-1}.form-field label{display:block;font-size:13px;font-weight:500;margin-bottom:8px}.form-field input,.form-field select,.form-field textarea{width:100%;min-height:48px;padding:12px;border:1px solid var(--border);border-radius:var(--radius-control);background:var(--surface);color:var(--ink);font-size:15px}.form-field textarea{resize:vertical}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--camel-brown-5)}.quote-form>button{margin-top:32px}.contact-layout aside{padding-top:32px;border-top:1px solid var(--border)}.contact-layout aside h2{font-size:24px}.contact-details{margin:32px 0}.contact-details>div{padding:16px 0;border-top:1px solid var(--border)}.contact-details dt{font-size:13px;font-weight:600}.contact-details dd{margin:8px 0 0;font-size:13px;color:var(--secondary)}
@media(max-width:1279px){:root{--gutter:24px}.sr-header{padding:0 24px;gap:24px}.sr-header nav{gap:24px}.okiroo-section,.service-detail{gap:48px}.contact-layout{gap:64px}.home-hero{gap:32px}.final-cta{gap:32px}.final-cta p{max-width:520px}}
@media(max-width:1023px){.sr-header{grid-template-columns:auto 1fr auto;gap:16px}.sr-header .desktop-nav{display:none}.sr-header__actions{justify-self:end}.menu-toggle{display:flex}.sr-header__actions>a:first-child{display:none}.home-hero{grid-template-columns:1.2fr 1fr;padding-top:64px}.home-hero h1{font-size:clamp(42px,5vw,64px)}.journey li{padding-right:16px}.journey h3{font-size:18px}.journey-note{flex-wrap:wrap}.section-heading{gap:32px}.okiroo-section{gap:32px}.service-row{grid-template-columns:144px minmax(0,1fr) minmax(0,1.2fr) 20px;gap:16px}.network-label{font-size:16px}.map-label{font-size:11px}.route-states{flex-wrap:wrap}.final-cta{display:block}.final-cta .actions{margin-top:24px}.contact-layout{gap:32px}.footer-grid{grid-template-columns:1.5fr 1fr 1fr 1fr;gap:24px}.service-detail{gap:32px}}
@media(max-width:767px){:root{--gutter:20px}body{font-size:15px}.sr-header{padding:0 20px;height:76px;gap:12px}.sr-brand{gap:8px;font-size:16px}.sr-brand .camel{width:32px;height:24px}.sr-header__actions .sr-btn-primary{font-size:12px;padding:0 12px;gap:6px}.sr-header__actions .arrow{display:none}.home-hero{grid-template-columns:1fr;gap:48px;padding-top:64px;padding-bottom:48px}.home-hero h1{font-size:var(--type-display-size)}.home-hero .lead{font-size:16px}.facts{gap:16px;grid-template-columns:1fr}.sr-fact{display:grid;grid-template-columns:110px 1fr;gap:4px 16px;padding:20px 0}.sr-fact strong{grid-row:1/3;margin:0;align-self:center}.sr-fact:last-child strong{font-size:16px}.sr-fact small{font-size:11px}.section{padding-top:80px}.section-heading{display:block;margin-bottom:32px}.section-heading .sr-eyebrow{margin-bottom:24px}.section-heading>p{margin-top:24px}.page-hero{padding-top:64px;padding-bottom:64px}.page-hero .lead{font-size:16px}.journey{display:block}.journey li{padding:0 0 32px 64px;min-height:120px}.step-number{position:absolute;left:0;top:2px;font-size:var(--type-mono-size);margin:0}.journey .journey-node{position:absolute;left:34px;top:4px}.journey li:after{height:100%;width:1px;top:5px;left:38px;right:auto}.journey h3{margin-top:0;font-size:20px}.journey li>p{min-height:0;max-width:none}.journey li>.sr-code:last-child{margin-top:12px}.journey-note{margin-top:0;display:block}.journey-note p{margin-top:8px}.network-section{margin-top:80px}.network-section .section{padding-top:48px;padding-bottom:32px}.network-key{flex-wrap:wrap;gap:16px;font-size:var(--type-mono-size)}.network-key>.sr-code{width:100%;margin-left:0;font-size:var(--type-mono-size)}.desktop-network{display:none}.mobile-network{display:block;width:100%;height:auto;max-width:420px;margin:0 auto}.network-label{font-size:12px}.map-label{font-size:10px}.region-label{font-size:10px;letter-spacing:1px}.route-states{display:grid;grid-template-columns:1fr 1fr;gap:16px}.network-bottom{display:block;font-size:var(--type-mono-size)}.network-bottom span{display:block;margin-top:8px}.service-row{grid-template-columns:24px 1fr 20px;gap:12px;padding:24px 0}.service-row h3{font-size:18px}.service-row p{grid-column:2;grid-row:2;font-size:13px}.row-arrow{grid-column:3;grid-row:1}.final-cta{margin-top:80px;padding-top:48px;padding-bottom:48px}.okiroo-section{grid-template-columns:1fr;gap:48px}.sr-okiroo__body{padding:20px}.service-detail{grid-template-columns:1fr;gap:32px;padding-top:48px;margin-top:48px}.supply-chain{grid-template-columns:1fr;gap:0}.supply-chain li{position:relative;margin-left:8px;border-top:0;border-left:1px solid var(--route-gold-6);padding:0 0 32px 24px;display:flex;gap:16px}.supply-chain li:before{content:'';width:7px;height:7px;border:1px solid var(--route-gold-3);background:var(--page);border-radius:50%;position:absolute;top:5px;left:-4px}.supply-chain li:last-child{border-left:0;padding-bottom:0}.supply-chain .sr-code{margin:4px 0 0}.tracking-form input{font-size:16px}.sr-tracking button{padding:0 12px;font-size:12px}.tracking-section{padding-top:16px}.about-intro .lead{margin-top:32px;margin-bottom:48px;font-size:16px}.about-rows>section{grid-template-columns:1fr;gap:0;padding:32px 0}.about-rows h2{font-size:26px}.about-rows p:not(.sr-eyebrow){margin-top:16px}.contact-layout{grid-template-columns:1fr;gap:64px}.form-grid{grid-template-columns:1fr;gap:24px}.form-field input,.form-field select,.form-field textarea{font-size:16px}.footer{margin-top:80px;padding-top:48px}.footer-grid{grid-template-columns:1fr 1fr;gap:32px}.footer-grid>div:first-child{grid-column:1/-1}.footer-grid h2{margin-bottom:16px}.footer-bottom{margin-top:32px;flex-direction:column;gap:12px;font-size:10px}.sr-code{overflow-wrap:anywhere}.contact-layout aside h2{font-size:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.sr-link:hover span{transform:none}.sr-btn-primary:active{transform:none}}
.sr-header__actions>.sr-btn-primary{color:var(--surface);font-weight:600}
.page-hero+.network-section{margin-top:0}
.home-hero{grid-template-columns:8fr 4fr}
.hero-last{display:inline-block}
.sr-header__actions>.sr-btn-primary:hover{color:var(--surface)}
@media(max-width:1023px) and (min-width:768px){.home-hero{grid-template-columns:7fr 5fr}}
@media(max-width:767px){.home-hero{grid-template-columns:1fr}}
/* Accessible small gold text uses the darker tone from the supplied gold ramp. */
.sr-eyebrow{color:var(--route-gold-2)}
.hero-last{white-space:nowrap}
.service-detail p.sr-eyebrow{font-size:var(--type-eyebrow-size)}
.sr-brand{min-height:44px}
.sr-tracking input::placeholder{color:var(--secondary-text-3)}
@media(max-width:639px){.sr-header{gap:8px}.sr-header .sr-brand{gap:8px;font-size:16px}.sr-header .camel{width:28px}.sr-header__actions .sr-btn-primary{padding:0 12px;font-size:13px}}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
button:disabled{cursor:wait;opacity:.65}

/* V2: same design tokens, with rhythm tailored to physical and operational content. */
.home-hero {
  column-gap: var(--space-2xl);
  row-gap: var(--space-xl);
  padding-bottom: var(--space-xl);
}
.hero-facts { grid-column: 1 / -1; }
.hero-facts .sr-fact { padding-top: var(--space-lg); }
.home-page > .network-section { margin-top: var(--space-4xl); }
.home-page .services-section { padding-top: var(--space-3xl); }
.services-section .section-heading { margin-bottom: var(--space-xl); }
.service-row {
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
  transition: background var(--motion-standard);
}
.service-row h3 { transition: color var(--motion-standard); }
.service-row .row-arrow { transition: transform var(--motion-standard); }
.service-row:hover, .service-row:focus-visible { background: var(--technical-grid-7); }
.service-row:hover h3, .service-row:focus-visible h3 { color: var(--brown); }
.service-row:hover .row-arrow, .service-row:focus-visible .row-arrow { transform: translateX(3px); }
.desktop-nav a, .sr-header__actions > a, .footer nav a { transition: color var(--motion-standard); }
.home-page .okiroo-section { padding-top: var(--space-4xl); }
.okiroo-product-frame { margin: 0; }
.okiroo-product-content { min-width: 0; }
.okiroo-product-content > img { display: block; width: 100%; height: auto; }
.home-page .final-cta { margin-top: var(--space-4xl); padding-top: var(--space-2xl); padding-bottom: var(--space-2xl); }
.footer { margin-top: var(--space-4xl); padding-top: var(--space-2xl); }
.footer-grid { gap: var(--space-xl); }
.footer-grid h2 { margin-bottom: var(--space-md); }
.footer-grid > .footer-brand > p { margin-top: var(--space-md); }
.footer .footer-socials {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2xs);
  margin-top: var(--space-sm);
}
.footer .footer-socials a,
.footer .footer-social-placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  color: var(--secondary);
}
.footer .footer-socials a:hover { color: var(--brown); text-decoration: none; }
.footer-socials svg { fill: currentColor; }
.footer nav a { align-items: flex-start; }
.footer-bottom { margin-top: var(--space-xl); align-items: center; }
.footer-powered { display: inline-flex; align-items: center; gap: var(--space-2xs); min-height: 44px; text-decoration: underline; text-underline-offset: 4px; transition: color var(--motion-standard); }
.footer-powered:hover { color: var(--brown); }
.map-node circle { transition: fill var(--motion-standard); }
.map-node circle.is-active { fill: var(--route-gold-6); }

/* A shipment signal belongs to the hero, without a surrounding information card. */
.shipment-signal { align-self: center; min-width: 0; position: relative; }
.signal-desktop { display: block; width: 100%; height: auto; }
.signal-mobile { display: none; }
.signal-region { fill: var(--ink); font: 500 13px var(--mono); letter-spacing: .03em; }
.signal-base, .signal-progress { fill: none; stroke-width: 1.5; }
.signal-base { stroke: var(--border-4); }
.signal-progress { stroke: var(--gold); }
.signal-event circle { fill: var(--page); stroke: var(--route-gold-3); stroke-width: 1.5; }
.signal-event text { fill: var(--secondary); font: 500 13px var(--mono); letter-spacing: .02em; }
.signal-event.is-active circle { fill: var(--gold); }
.signal-event.is-active text { fill: var(--camel-brown-2); }
.signal-caption { display: flex; justify-content: space-between; gap: var(--space-sm); font-size:var(--type-mono-size); color: var(--secondary); }
.signal-caption .sr-code { font-size:var(--type-mono-size); }
.signal-mobile-caption { display: none; }
.signal-control { display: block; min-height: 44px; margin-left: auto; padding: 8px 0 8px 12px; background: transparent; border: 0; color: var(--secondary); font-size:var(--type-mono-size); text-decoration: underline; text-underline-offset: 4px; }
[hidden] { display: none !important; }

@media (max-width: 1279px) {
  .home-hero { column-gap: var(--space-xl); }
}
@media (min-width: 768px) and (max-width: 1279px) {
  /* Compensate for the smaller SVG canvas without shrinking operational labels. */
  .signal-desktop .signal-region { font-size: 16px; }
  .signal-desktop .signal-event text { font-size: 16px; }
}
@media (min-width: 768px) and (pointer: fine) {
  .footer nav a { min-height: calc(var(--space-lg) + var(--space-sm)); }
}
@media (min-width: 768px) {
  /* Match the number line box, its gap, and the midpoint of the 10px node. */
  .journey li::after { top: calc(var(--type-mono-size) * var(--type-body-lineHeight) + var(--space-lg) + 4.5px); }
}
@media (max-width: 767px) {
  .home-hero { row-gap: var(--space-xl); padding-bottom: var(--space-md); }
  .signal-desktop { display: none; }
  .signal-mobile { display: block; width: 100%; height: auto; max-width: 360px; margin: auto; }
  .signal-caption { flex-wrap: wrap; gap: var(--space-xs); }
  .hero-facts { gap: 0; }
  .hero-facts .sr-fact { padding: var(--space-md) 0; }
  .home-page .services-section { padding-top: var(--space-2xl); }
  .home-page .okiroo-section { padding-top: var(--space-3xl); }
  .home-page > .network-section { margin-top: var(--space-3xl); }
  .home-page .final-cta { margin-top: var(--space-3xl); padding-top: var(--space-xl); padding-bottom: var(--space-xl); }
  .footer { margin-top: var(--space-3xl); padding-top: var(--space-xl); }
  .footer-grid { grid-template-areas: 'brand brand' 'explore china' 'explore somaliland'; gap: var(--space-lg) var(--space-xl); }
  .footer-brand { grid-area: brand; }
  .footer-explore { grid-area: explore; }
  .footer-china { grid-area: china; }
  .footer-somaliland { grid-area: somaliland; }
  .footer-bottom { margin-top: var(--space-lg); align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .service-row:hover .row-arrow, .service-row:focus-visible .row-arrow { transform: none; }
}

/* Forms: six essentials first, with optional operational detail disclosed on request. */
.form-availability { margin-top: var(--space-md); font-size: 13px; line-height: 1.6; }
.contact-layout--single { grid-template-columns: minmax(0, 840px); }
.field-help { font-size: 13px; line-height: 1.6; margin-top: var(--space-xs); }
.tracking-form > .field-help { margin: 0 0 var(--space-md); }
.tracking-form > .form-availability { margin: 0 0 var(--space-lg); }
.tracking-support { margin-top: var(--space-sm); }
.quote-group { min-width: 0; padding: 0; margin: 0 0 var(--space-xl); border: 0; }
.quote-group legend { padding: 0; margin-bottom: var(--space-md); font-size: 16px; font-weight: 600; }
.quote-options, .tracking-example { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.quote-options summary, .tracking-example summary {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-height: 56px;
  padding: var(--space-sm) 0;
  list-style: none;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
}
.quote-options summary::-webkit-details-marker, .tracking-example summary::-webkit-details-marker { display: none; }
.quote-options summary > .sr-code { color: var(--secondary); }
.quote-options summary:focus-visible, .tracking-example summary:focus-visible, #operations-contacts:focus-visible {
  outline: 2px solid var(--camel-brown-2);
  outline-offset: 4px;
}
.disclosure-icon { margin-left: auto; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.quote-options[open] .disclosure-plus, .tracking-example[open] .disclosure-plus { display: none; }
.quote-options > .form-grid { padding: var(--space-sm) 0 var(--space-lg); }

@media (max-width: 767px) {
  .signal-mobile .signal-region, .signal-mobile .signal-event text { font-size: var(--type-mono-size); }
  .quote-group { margin-bottom: var(--space-lg); }
}

/* One linked service system replaces separate process and marketing sections. */
.service-row { position: relative; }
.service-row::before {
  content: '';
  position: absolute;
  left: 4.5px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--route-gold-6);
}
.service-row:first-child::before { top: 50%; }
.service-row:last-child::before { bottom: 50%; }
.service-row-stage {
  position: relative;
  padding-left: var(--space-lg);
  font-size: var(--type-mono-size);
}
.service-row-stage > .journey-node { position: absolute; left: 0; top: calc(50% - 5px); }
.service-row-stage > .sr-code { white-space: nowrap; }

/* Okiroo: a factual capability overview, ready for the real product surface. */
.okiroo-capabilities { margin: 0; }
.okiroo-capabilities > div { padding: var(--space-md) 0; }
.okiroo-capabilities > div:first-child { padding-top: 0; }
.okiroo-capabilities > div:last-child { padding-bottom: 0; }
.okiroo-capabilities > div + div { border-top: 1px solid var(--border); }
.sr-okiroo .okiroo-capabilities dt { font-size: var(--type-body-size); font-weight: 600; color: var(--okiroo-violet-3); }
.sr-okiroo .okiroo-capabilities dd { margin: var(--space-2xs) 0 0; font-size: var(--type-label-size); line-height: 1.6; }
.tracking-example { max-width: 720px; }
.tracking-example > .tracking-demo { margin-bottom: var(--space-lg); }
.tracking-demo .sr-okiroo__bar h2 { font-size: var(--type-label-size); line-height: 1.4; letter-spacing: 0; }

@media (max-width: 767px) {
  .service-row { grid-template-columns: var(--space-sm) minmax(0, 1fr) 20px; gap: var(--space-sm); }
  .service-row-stage { grid-column: 1 / -1; grid-row: 1; }
  .service-row h3 { grid-column: 2; grid-row: 2; }
  .service-row p { grid-column: 2 / -1; grid-row: 3; }
  .service-row .row-arrow { grid-column: 3; grid-row: 2; }
  .service-row:first-child::before { top: calc(var(--space-lg) + 9px); }
  .service-row:last-child::before { bottom: calc(100% - var(--space-lg) - 9px); }
}

/* Mobile: preserve the brand while adapting reading, navigation and touch. */
.container { padding-left: max(var(--gutter), env(safe-area-inset-left)); padding-right: max(var(--gutter), env(safe-area-inset-right)); }
.sr-link > span, .disclosure-icon, .arrow { flex-shrink: 0; }
.desktop-nav a, .footer nav a { min-width: 44px; }
@media (max-width: 1023px) {
  html { scroll-padding-top: calc(88px + env(safe-area-inset-top)); }
  .sr-header {
    position: sticky;
    top: 0;
    z-index: 10;
    height: calc(76px + env(safe-area-inset-top));
    padding-top: env(safe-area-inset-top);
    padding-left: max(var(--gutter), env(safe-area-inset-left));
    padding-right: max(var(--gutter), env(safe-area-inset-right));
    background: var(--page);
  }
  .sr-header .sr-brand { min-width: 0; }
  .home-hero { grid-template-columns: minmax(0, 1fr); }
  .shipment-signal { width: 100%; max-width: 480px; margin-inline: auto; }
  .contact-layout { grid-template-columns: minmax(0, 1fr); }
  .menu-toggle { flex-shrink: 0; }
  .mobile-menu {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    max-height: 100dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0 max(var(--space-lg), env(safe-area-inset-right)) max(var(--space-lg), env(safe-area-inset-bottom)) max(var(--space-lg), env(safe-area-inset-left));
  }
  .mobile-menu nav a { min-height: 48px; font-size: 18px; }
  .mobile-menu .menu-head { position: sticky; top: 0; z-index: 1; padding-top: max(var(--space-lg), env(safe-area-inset-top)); background: var(--page); }
  .mobile-menu .sr-btn-primary, .mobile-menu .sr-btn-secondary { min-height: 48px; }
  .form-field input, .form-field select, .form-field textarea, .sr-tracking input { scroll-margin-top: var(--space-sm); font-size: 16px; }
}
@media (max-width: 767px) {
  .home-hero, .page-hero { padding-top: var(--space-2xl); }
  .page-hero { padding-bottom: var(--space-2xl); }
  .hero-copy, .hero-facts, .contact-layout > *, .okiroo-section > * { min-width: 0; }
  .home-hero .lead, .page-hero .lead, .okiroo-section .lead, .service-row p { font-size: 16px; }
  .actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-sm); width: 100%; }
  .actions > a, .actions > button { min-width: 0; min-height: 48px; padding-inline: var(--space-sm); }
  .actions > :only-child { grid-column: 1 / -1; }
  .mobile-menu .actions { grid-template-columns: minmax(0, 1fr); }
  .hero-facts .sr-fact { grid-template-columns: var(--space-2xl) minmax(0, 1fr); }
  .hero-facts .sr-fact span { font-size: 14px; }
  .hero-facts .sr-fact small { font-size: var(--type-mono-size); }
  /* A descriptive value needs its own row rather than the narrow count column. */
  .hero-facts .sr-fact:last-child { grid-template-columns: minmax(0, 1fr); }
  .hero-facts .sr-fact:last-child strong { grid-row: auto; white-space: nowrap; }
  .signal-mobile .signal-region, .signal-mobile .signal-event text { font-size: 15px; }
  .signal-control, .signal-controls { min-height: 44px; }
  .signal-caption { display: block; margin-top: var(--space-xs); }
  .signal-caption > :not(.signal-mobile-caption) { display: none; }
  .signal-caption .signal-mobile-caption { display: block; font-size: var(--type-mono-size); line-height: 1.6; }
  .signal-control { margin-left: 0; padding-left: 0; }
  .journey li { min-height: 0; padding-bottom: var(--space-lg); }
  .journey .journey-node { top: calc((18px * var(--type-title-lineHeight) - 10px) / 2); }
  .journey li::after { left: 38.5px; top: calc(18px * var(--type-title-lineHeight) / 2); }
  .journey li:last-child { padding-bottom: 0; }
  .journey h3 { font-size: 18px; }
  .journey-note { margin-top: var(--space-lg); }
  .journey-note p, .journey-note a { font-size: 14px; }
  .form-field label, .tracking-form label { font-size: 14px; }
  .form-help, .field-help, .form-availability, .form-notice { font-size: 14px; }
  .form-field input, .form-field select, .form-field textarea { min-height: 52px; font-size: 16px; }
  .quote-form > button { width: 100%; min-height: 48px; }
  .quote-options summary > .sr-code { margin-left: auto; }
  .quote-options .disclosure-icon { margin-left: 0; }
  .okiroo-product-frame .sr-okiroo__bar,
  .okiroo-product-frame .sr-okiroo__body { padding-inline: var(--space-lg); }
  .tracking-form .sr-tracking { display: flex; flex-direction: column; gap: var(--space-sm); height: auto; border: 0; border-radius: 0; background: transparent; overflow: visible; }
  .tracking-form .sr-tracking:focus-within { box-shadow: none; }
  .tracking-form .sr-tracking input { width: 100%; min-height: 52px; padding: var(--space-md); border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); font-size: 16px; }
  .tracking-form .sr-tracking button { min-height: 48px; border: 1px solid var(--brown); border-radius: var(--radius-control); font-size: 14px; }
  .tracking-milestones h3 { font-size: 16px; }
  .tracking-milestones p, .tracking-demo .sr-okiroo__body > p:not(.sr-code) { font-size: 14px; }
  .okiroo-capabilities dd { font-size: 14px; }
  .quote-options summary, .tracking-example summary { font-size: 15px; }
  .final-cta p { font-size: 16px; }
  .footer-grid p, .footer-grid nav { font-size: 14px; }
  .footer nav { align-items: stretch; }
  .footer nav a { min-height: 44px; min-width: 44px; }
  .footer-bottom { font-size: var(--type-mono-size); padding-bottom: max(var(--space-lg), env(safe-area-inset-bottom)); }
}
@media (max-width: 359px) {
  :root { --gutter: var(--space-md); }
  .sr-header .sr-brand { gap: 6px; font-size: 14px; }
  .sr-header .camel { width: 24px; }
  .sr-header__actions .sr-btn-primary { padding-inline: var(--space-xs); font-size: 12px; }
  .actions { grid-template-columns: minmax(0, 1fr); }
  .quote-options summary > .sr-code { margin-left: auto; }
}
@media (hover: none) {
  .service-row:hover .row-arrow { transform: none; }
}

/* The supplied wordmark stays intact in both header and footer. */
.sr-brand .brand-logo { display: block; width: 192px; height: auto; flex-shrink: 0; }
@media (max-width: 767px) {
  .sr-header .brand-logo { width: 144px; }
}
@media (max-width: 359px) {
  .sr-header .brand-logo { width: 128px; }
}