@font-face { font-family:Murecho; src:url('assets/fonts/murecho-english.woff2') format('woff2'); font-style:normal; font-weight:400 700; font-display:swap; }
@font-face { font-family:Chakra; src:url('assets/fonts/chakra-regular.woff2') format('woff2'); font-style:normal; font-weight:400; font-display:swap; }
@font-face { font-family:Chakra; src:url('assets/fonts/chakra-semibold.woff2') format('woff2'); font-style:normal; font-weight:600; font-display:swap; }
:root { color-scheme:light; --navy:#082442; --deep:#071a2d; --light:#edf8fc; --amber:#ffc62c; --ink:#071646; --delay-moderate:#ffc62c; --delay-severe:#ff8a3d; --delay-extreme:#ff5c36; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; font-family:Murecho,sans-serif; color:var(--light); background:var(--navy); }
a { color:inherit; text-decoration-thickness:1px; text-underline-offset:.18em; }
a:focus-visible,button:focus-visible,summary:focus-visible,.board-scroll:focus-visible { outline:3px solid #ffd55e; outline-offset:4px; }
::selection { color:#071a2d; background:#ffd156; }
.casebook ::selection { color:#f4fafc; background:#0b2142; }
.correspondence ::selection { color:#071a2d; background:#ffd156; }
.skip-link { position:fixed; z-index:20; top:8px; left:8px; padding:12px 16px; color:#071a2d; background:#ffd156; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.icon-defs { position:absolute; width:0; height:0; overflow:hidden; }
svg { width:1em; height:1em; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.composition { position:relative; background:#081e37; }
.hero { position:relative; isolation:isolate; padding:clamp(36px,4vw,64px) clamp(20px,3.6vw,64px) clamp(40px,4.4vw,72px); }
.hero::before { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,rgba(8,30,55,.72),rgba(8,30,55,0) 7%),linear-gradient(90deg,rgba(8,30,55,.97) 0%,rgba(8,30,55,.82) 39%,rgba(8,30,55,0) 75%); pointer-events:none; }
.airport-scene { position:absolute; z-index:-2; inset:0; width:100%; height:100%; object-fit:cover; object-position:right center; }
.site-header { position:relative; z-index:3; height:clamp(64px,4.8vw,80px); display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 clamp(20px,3.4vw,64px); background:#08284f; }
.wordmark { display:flex; align-items:center; gap:clamp(10px,1.2vw,18px); font-size:clamp(20px,1.9vw,31px); line-height:1; font-weight:700; letter-spacing:-.025em; text-decoration:none; white-space:nowrap; }
.cart-icon { width:clamp(30px,2.7vw,43px); height:clamp(30px,2.7vw,43px); color:var(--amber); fill:var(--amber); stroke-width:2; }
nav { display:flex; align-items:center; gap:clamp(16px,2.4vw,40px); font-size:clamp(14px,.98vw,16px); font-weight:400; }
.mobile-nav { display:none; }
nav a:not(.button) { text-decoration:none; white-space:nowrap; } nav a:not(.button):hover { text-decoration:underline; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; border-radius:9px; background:var(--amber); color:#10151c; font-weight:700; text-decoration:none; white-space:nowrap; transition:background-color .2s ease,transform .2s ease; }
.button:hover { background:#ffdc6a; transform:translateY(-2px); } .button svg { width:1.1em; height:1.1em; stroke-width:2.4; }
.button-small { padding:0 18px; font-size:clamp(14px,.98vw,16px); }
.hero-copy { max-width:min(60rem,62%); }
h1 { margin:0; font-size:clamp(48px,6.38vw,98px); line-height:.94; letter-spacing:-.035em; font-weight:700; }
.hero-statement { margin:10px 0 0; font-size:clamp(26px,3.18vw,49px); line-height:1.04; font-weight:700; letter-spacing:-.03em; text-wrap:balance; }
.hero-intro { margin:16px 0 0; font-size:clamp(16px,1.4vw,22px); line-height:1.4; color:#d8eaf4; max-width:48ch; }
.hero-action { margin-top:24px; padding:0 26px; min-height:52px; font-size:clamp(16px,1.31vw,20px); }
.arrival-board { position:relative; width:min(100%,1080px,68vw); margin-top:clamp(32px,3.4vw,56px); overflow:hidden; border:1px solid #134e7a; border-radius:10px; background:#071a2c; }
.board-top { min-height:clamp(58px,5.4vw,88px); display:flex; justify-content:space-between; align-items:center; gap:16px; padding:0 clamp(16px,2.2vw,32px); border-bottom:1px solid #174369; color:#c4dff4; }
.board-heading { display:flex; align-items:center; gap:clamp(12px,1.6vw,24px); white-space:nowrap; } .board-heading svg { width:clamp(28px,3.2vw,46px); height:clamp(28px,3.2vw,46px); fill:currentColor; stroke-width:1; }
.board-heading h2 { margin:0; font-size:clamp(16px,1.75vw,27px); line-height:1; font-weight:500; letter-spacing:.28em; text-transform:uppercase; }
.board-top p { margin:0; font-size:clamp(11px,.85vw,14px); letter-spacing:.25em; text-transform:uppercase; white-space:nowrap; }
table { width:100%; border-collapse:collapse; table-layout:fixed; }
.item-col { width:29%; } .date-col { width:21%; } .status-col { width:29%; }
th,td { text-align:left; border-right:1px solid #103151; border-bottom:1px solid #103151; } th:last-child,td:last-child { border-right:0; } tbody tr:last-child th,tbody tr:last-child td { border-bottom:0; }
thead th { padding:14px clamp(12px,1.6vw,24px); color:#c4dff4; font-size:clamp(11px,.85vw,14px); font-weight:500; line-height:1.3; letter-spacing:.14em; text-transform:uppercase; }
tbody th { padding:clamp(12px,1.2vw,18px) clamp(12px,1.6vw,24px); font-size:clamp(14px,1.3vw,21px); font-weight:700; white-space:nowrap; }
tbody td { padding:clamp(12px,1.2vw,18px) clamp(12px,1.6vw,24px); color:var(--amber); font-family:Chakra,sans-serif; font-size:clamp(17px,1.7vw,28px); line-height:1; font-weight:400; letter-spacing:.09em; text-transform:uppercase; white-space:nowrap; }
.item { display:flex; align-items:center; gap:clamp(12px,1.4vw,22px); } .item a { color:inherit; text-decoration:underline; text-decoration-color:rgba(196,223,244,.6); text-underline-offset:.2em; } .item a:hover { text-decoration-color:currentColor; } .item img, .item > svg { width:clamp(36px,3.5vw,55px); height:auto; max-height:50px; object-fit:contain; flex:none; }
.microsoft-mark { width:clamp(26px,2.3vw,36px); height:clamp(26px,2.3vw,36px); display:grid; grid-template-columns:1fr 1fr; gap:2px; margin:0 clamp(5px,.6vw,10px); flex:none; }
.microsoft-mark i:nth-child(1){background:#f45122}.microsoft-mark i:nth-child(2){background:#80bc19}.microsoft-mark i:nth-child(3){background:#05a6ef}.microsoft-mark i:nth-child(4){background:#ffb900}
.board-status { display:flex; align-items:center; gap:10px; font-size:clamp(14px,1.3vw,21px); font-weight:600; letter-spacing:.02em; } .board-status svg { width:1.25em; height:1.25em; fill:currentColor; stroke-width:1; flex:none; }
.overview { display:grid; grid-template-columns:43% 1fr; gap:3%; padding:clamp(40px,4vw,64px) clamp(20px,3.9vw,76px); color:var(--ink); background:#e9f7fa; }
.overview h2 { margin:0 0 18px; font-size:clamp(28px,2.6vw,40px); line-height:1.08; letter-spacing:-.035em; text-wrap:balance; }
.overview-intro p { max-width:590px; margin:0 0 14px; font-size:clamp(16px,1.06vw,17px); line-height:1.5; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.step { position:relative; }
.step:not(:last-child)::after { content:"→"; position:absolute; top:16px; right:-22px; color:#8aafc8; font-family:Arial,sans-serif; font-size:20px; line-height:1; }
.step-icon { display:flex; align-items:center; justify-content:center; width:clamp(48px,3.8vw,58px); height:clamp(48px,3.8vw,58px); border-radius:50%; color:var(--ink); background:#d3e8fb; } .step-icon svg { width:54%; height:54%; }
.step h3,.notice-panel h3 { margin:12px 0 6px; font-size:clamp(16px,1.05vw,17px); line-height:1.2; } .step p,.notice-panel p { margin:0; font-size:clamp(14px,.94vw,15px); line-height:1.45; }
.notice-panel { display:flex; align-items:flex-start; gap:16px; margin-top:28px; padding:16px 20px; border-radius:8px; background:#fbefd8; color:#111820; } .notice-panel > svg { width:28px; height:34px; flex:none; } .notice-panel h3 { margin:0 0 6px; }
.casebook { color:#0b2142; background:#f4fafc; }
.section-wrap { width:100%; padding-inline:clamp(20px,3.9vw,76px); }
.casebook h2 { max-width:15ch; margin:0; font-size:clamp(2.2rem,4.35vw,4.3rem); line-height:1.05; letter-spacing:-.035em; }
.casebook p { line-height:1.6; }
.opening { display:grid; grid-template-columns:5fr 7fr; gap:7%; padding-block:clamp(76px,9vw,140px); }
.opening-heading .as-of { margin:24px 0 0; max-width:28ch; color:#41637e; font-size:15px; }
.prose { max-width:70ch; font-size:clamp(17px,1.22vw,19px); }
.prose p { margin:0 0 1.15em; }
.prose .lead { font-size:clamp(22px,2vw,30px); line-height:1.35; font-weight:700; letter-spacing:-.025em; }
.visual-note { padding-top:18px; color:#385d78; font-size:15px; }
.order-story { padding-block:clamp(72px,8.5vw,130px); background:#e7f4f8; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:32px; margin-bottom:58px; }
.section-heading > p { max-width:32ch; margin:0 0 6px; font-size:17px; }
.order-list { border-top:1px solid #a5c0ce; }
.order-row { display:grid; grid-template-columns:35% 1fr; gap:4%; padding:30px 20px; margin:0 -20px; border-bottom:1px solid #a5c0ce; border-radius:8px; transition:background-color .2s ease; }
.order-row:hover { background:rgba(11,33,66,.035); }
.order-row h3 { margin:0 0 5px; font-size:clamp(22px,2vw,30px); line-height:1.15; }
.order-row p { margin:0 0 10px; font-size:17px; }
.order-row > div:first-child p { color:#41637e; font-size:15px; }
.order-row > div:last-child { max-width:66ch; }.order-row > div:last-child p:last-child { color:#385d78; }
.correspondence { padding-block:clamp(76px,9vw,140px); color:#eaf6fb; background:#08284d; }
.light-heading > p { color:#c1d9e9; }
.message-list { border-top:1px solid #416482; }
.message { display:grid; grid-template-columns:24% 1fr; gap:4%; padding:38px 0; border-bottom:1px solid #416482; }
.message time { color:#ffc942; font-family:Chakra,sans-serif; font-size:16px; font-weight:600; display:flex; align-items:flex-start; gap:10px; }
.message time::before { content:""; display:inline-block; width:8px; height:8px; margin-top:6px; border-radius:50%; background:var(--amber); box-shadow:0 0 0 3px rgba(255,198,44,.2); flex:none; }
.message > div { max-width:70ch; }.message h3 { margin:0 0 15px; font-size:clamp(24px,2.2vw,33px); line-height:1.15; letter-spacing:-.025em; }.message p { margin:0 0 1em; color:#dcecf5; font-size:18px; }.message p:last-child { margin-bottom:0; }
.message blockquote { margin:22px 0; padding:18px 24px; border-left:3px solid var(--amber); border-radius:0 6px 6px 0; background:rgba(255,198,44,.06); color:#ffd159; font-size:clamp(22px,2vw,32px); line-height:1.25; font-weight:700; letter-spacing:-.025em; }
.verdict { padding-block:clamp(76px,9vw,140px); background:#f4fafc; }
.verdict-list { list-style:none; padding:0; margin:28px 0; border-top:1px solid #a5c0ce; }
.verdict-list li { position:relative; padding:18px 0 18px 32px; border-bottom:1px solid #a5c0ce; font-size:17px; line-height:1.6; color:#0b2142; }
.verdict-list li::before { content:"✕"; position:absolute; left:0; top:18px; color:#ff5c36; font-weight:700; font-size:18px; line-height:1; }
.verdict-list li strong { color:#071646; }
.questions { display:grid; grid-template-columns:5fr 7fr; gap:7%; padding-block:clamp(76px,9vw,140px); background:#dfedf3; }.questions > div:first-child p { max-width:30ch; color:#41637e; font-size:17px; }
.question-list { border-top:1px solid #a5c0ce; }.question-list details { border-bottom:1px solid #a5c0ce; }.question-list summary { position:relative; padding:23px 36px 23px 0; font-size:18px; font-weight:700; cursor:pointer; list-style:none; }
.question-list summary::-webkit-details-marker { display:none; }
.question-list summary::after { content:""; position:absolute; right:8px; top:50%; width:9px; height:9px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-70%) rotate(45deg); transition:transform .2s ease; opacity:.6; }
.question-list summary:hover { color:#215c85; }
.question-list summary:hover::after { opacity:1; }
.question-list details[open] > summary::after { transform:translateY(-30%) rotate(-135deg); opacity:1; }
.question-list details p { max-width:66ch; margin:0 0 24px; font-size:17px; }
.about { display:grid; grid-template-columns:5fr 7fr; gap:7%; padding-block:clamp(76px,9vw,140px); background:#f4fafc; }
.site-footer { padding-block:60px 48px; color:#eaf6fb; background:#071a2d; }
.site-footer .section-wrap { display:grid; grid-template-columns:1fr auto; gap:28px; align-items:end; }
.footer-cta { grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding-bottom:28px; margin-bottom:12px; border-bottom:1px solid #163654; }
.footer-cta p { margin:0 !important; font-size:clamp(16px,1.25vw,19px) !important; font-weight:500 !important; letter-spacing:0 !important; color:#c4dff4 !important; }
.footer-cta-actions { display:inline-flex; align-items:center; gap:12px; }
.share-btn { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:10px 20px; border-radius:8px; background:var(--amber); color:#10151c; font-weight:700; font-size:14px; text-decoration:none; cursor:pointer; border:0; font-family:inherit; transition:background-color .2s ease,transform .2s ease; }
.share-btn:hover { background:#ffdc6a; transform:translateY(-2px); }
.share-btn-quiet { background:transparent; color:#ffd159; box-shadow:inset 0 0 0 1.5px rgba(255,209,89,.5); } .share-btn-quiet:hover { background:rgba(255,198,44,.08); }
.share-btn svg { width:16px; height:16px; stroke-width:2.2; }
.copied-toast { display:none; padding:6px 12px; border-radius:6px; background:rgba(255,198,44,.15); color:var(--amber); font-size:13px; font-weight:600; }
.copied-toast.show { display:inline-block; }
.site-footer .footer-headline { margin:0; font-size:clamp(28px,3vw,46px); line-height:1.15; font-weight:700; letter-spacing:-.03em; }
.site-footer a.footer-top-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 22px; border:1.5px solid rgba(255,209,89,.5); border-radius:8px; color:#ffd159; font-weight:700; text-decoration:none; transition:border-color .2s ease,background-color .2s ease; }
.site-footer a.footer-top-btn:hover { border-color:var(--amber); background:rgba(255,198,44,.08); }
.site-footer small { grid-column:1 / -1; color:#b8d2e3; font-size:14px; margin-top:8px; }

/* === Scroll progress bar === */
.scroll-progress { position:fixed; z-index:30; top:0; left:0; width:100%; height:3px; background:transparent; pointer-events:none; }
.scroll-progress-bar { width:100%; height:100%; background:var(--amber); transform-origin:left; transform:scaleX(0); will-change:transform; }

/* === Scroll margin for anchor targets === */
[id] { scroll-margin-top:clamp(24px,5vw,70px); }
#top { scroll-margin-top:0; }

/* === Reading time === */
.reading-time { display:inline-flex; align-items:center; gap:8px; margin-top:14px; padding:6px 14px; border-radius:20px; background:rgba(11,33,66,.06); color:#41637e; font-size:14px; font-weight:500; letter-spacing:.01em; }
.reading-time svg { width:16px; height:16px; stroke-width:2.2; flex:none; }

/* === Delay severity in arrival board === */
.delay-moderate { color:var(--delay-moderate); }
.delay-severe { color:var(--delay-severe); }
.delay-extreme { color:var(--delay-extreme); }

@media (prefers-reduced-motion:no-preference) { @keyframes board-arrival { from { opacity:.7; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } } .arrival-board tbody tr { animation:board-arrival .55s ease-out both; } .arrival-board tbody tr:nth-child(2) { animation-delay:.08s; } .arrival-board tbody tr:nth-child(3) { animation-delay:.16s; } .arrival-board tbody tr:nth-child(4) { animation-delay:.24s; } .arrival-board tbody tr:nth-child(5) { animation-delay:.32s; } }
@media (max-width:1100px) { .arrival-board { width:100%; } .overview { grid-template-columns:1fr; gap:32px; } }
@media (max-width:800px) {
 .hero { padding:44px 20px 32px; } .hero::before { background:linear-gradient(90deg,rgba(8,30,55,.9),rgba(8,30,55,.25)); } .airport-scene { inset:0 0 auto; height:510px; object-position:70% center; opacity:.62; }
 .site-header { padding:0 20px; }
 nav { display:none; } .mobile-nav { position:relative; display:block; color:#edf8fc; font-size:15px; font-weight:700; } .mobile-nav summary { display:flex; align-items:center; gap:8px; min-height:44px; cursor:pointer; list-style:none; } .mobile-nav summary::-webkit-details-marker { display:none; } .mobile-nav summary svg { width:22px; height:22px; } .mobile-nav > div { position:absolute; z-index:5; top:50px; right:0; display:grid; min-width:190px; padding:10px; background:#08284f; box-shadow:0 10px 24px rgba(0,0,0,.22); } .mobile-nav a { padding:12px; text-decoration:none; } .mobile-nav a:hover,.mobile-nav a:focus-visible { background:#17476c; }
 .hero-copy { max-width:none; }
 h1 { font-size:clamp(43px,11vw,70px); } .hero-statement { margin:16px 0 0; font-size:clamp(25px,6vw,39px); line-height:1.08; } .hero-intro { margin:15px 0 0; max-width:38ch; font-size:16px; line-height:1.5; } .hero-action { margin-top:20px; padding:0 20px; font-size:16px; }
 .arrival-board { margin-top:28px; } .board-top p { display:none; } .board-heading h2 { letter-spacing:.1em; }
 .board-scroll { overflow-x:auto; } table { width:720px; }
 .overview { padding:44px 20px; } .steps { grid-template-columns:repeat(2,1fr); gap:24px; }
 .step:not(:last-child)::after { display:none; }
 .opening,.questions,.about,.verdict { grid-template-columns:1fr; gap:28px; }.section-heading { display:block; margin-bottom:36px; }.section-heading > p { margin-top:18px; }
 .order-row { grid-template-columns:1fr; gap:12px; padding:24px 0; margin:0; border-radius:0; } .order-row:hover { background:transparent; } .order-row p { font-size:16px; }
 .message { grid-template-columns:1fr; gap:12px; padding:28px 0; } .message p { font-size:16px; }
 .question-list summary { font-size:17px; padding:20px 32px 20px 0; } .question-list details p { font-size:16px; }
 .site-footer .section-wrap { grid-template-columns:1fr; } .footer-cta { flex-direction:column; align-items:flex-start; } .site-footer small { grid-column:auto; }
}
@media (max-width:600px) {
 .board-scroll { overflow:visible; }
 .arrival-board table { display:block; width:100%; height:auto; }
 .arrival-board colgroup { display:none; }
 .arrival-board thead { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
 .arrival-board tbody { display:block; }
 .arrival-board tbody tr { display:grid; grid-template-columns:1fr 1fr; gap:10px 16px; height:auto; padding:16px; border-bottom:1px solid #174369; }
 .arrival-board tbody tr:last-child { border-bottom:0; }
 .arrival-board tbody th,.arrival-board tbody td { border:0; }
 .arrival-board tbody th { grid-column:1 / -1; padding:0 0 3px; }
 .arrival-board tbody td { display:flex; flex-direction:column; gap:7px; padding:0; font-size:19px; }
 .arrival-board tbody td:nth-of-type(1)::before,.arrival-board tbody td:nth-of-type(2)::before { color:#c4dff4; font-family:Murecho,sans-serif; font-size:12px; letter-spacing:.02em; text-transform:none; }
 .arrival-board tbody td:nth-of-type(1)::before { content:"Promised / ordered"; }
 .arrival-board tbody td:nth-of-type(2)::before { content:"Reported delivery"; }
 .arrival-board tbody td:last-child { grid-column:1 / -1; display:block; padding:3px 0 0; }
 .arrival-board .item { transform:none; gap:14px; }
 .arrival-board tbody tr:last-child .board-status { transform:none; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button { transition:none; } .button:hover { transform:none; } .share-btn { transition:none; } .share-btn:hover { transform:none; } .order-row { transition:none; } .question-list summary::after { transition:none; } .site-footer a { transition:none; } .share-btn-quiet:hover { transform:none; } }