/* Orbita One website. Travel-tech layout language: stepped pictures with a card nested in the cut-out corner, a drawn
   elbow arrow, small-label stats, a dotted step line and tabs that hang from a panel. Outfit for headings, Inter for text. */
@font-face { font-family: "Outfit"; src: url("fonts/Outfit-Variable.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/Inter-Variable.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
:root {
  --bg: #ffffff; --canvas: #f5f8fd; --ink: #13183a; --muted: #565c80; --line: #e3e8f2;
  --sky: #2e7cf6; --sky-deep: #1c5fd6; --sky-soft: #d6e6ff; --orange: #c24d0a; --orange-hi: #a8420a;
  --mint: #0b7f5e; --pink: #b8285a; --r: 32px; --shadow: 0 18px 40px -22px rgba(19, 24, 58, .35);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 16px/1.6 "Inter", system-ui, sans-serif; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--sky-deep); }
h1, h2, h3, .wm, .fbrand, .stats b, .ncard b { font-family: "Outfit", "Inter", sans-serif; font-weight: 600; letter-spacing: -.01em; line-height: 1.12; margin: 0 0 .4em; }
h1 { font-size: clamp(2.2rem, 4.6vw, 3.6rem); }
h2 { font-size: clamp(1.7rem, 3.2vw, 2.5rem); }
h3 { font-size: 1.12rem; }
p { margin: 0 0 1em; }
.small { font-size: .88rem; color: var(--muted); }
.lead { font-size: 1.08rem; color: var(--muted); max-width: 40em; }
.accent { color: var(--sky); }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: #fff; padding: 8px 14px; border-radius: 10px; z-index: 50; }
.skip:focus { left: 12px; }
:focus-visible { outline: 3px solid var(--sky); outline-offset: 3px; border-radius: 6px; }
main { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* header: logo left, small centred links, one outline pill */
.top { max-width: 1200px; margin: 0 auto; padding: 18px 24px; display: flex; align-items: center; gap: 24px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.bmark svg { width: 34px; height: 34px; display: block; }
.wm { font-size: 1.32rem; margin: 0; }
.links { display: flex; gap: 26px; margin: 0 auto; }
.links a { color: var(--ink); text-decoration: none; font-size: .93rem; position: relative; padding: 6px 0; }
.links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 2px; background: var(--sky); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.links a:hover::after, .links a[aria-current=page]::after { transform: scaleX(1); }
.mnav { display: none; }

/* pills */
.pill { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 20px; border-radius: 999px; font: 600 .94rem/1.2 "Inter", sans-serif;
  text-decoration: none; border: 1.6px solid transparent; cursor: pointer; transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease; }
.pill.orange { background: var(--orange); color: #fff; box-shadow: 0 10px 22px -12px rgba(194, 77, 10, .9); }
.pill.orange:hover { background: var(--orange-hi); transform: translateY(-2px); }
.pill.outline { background: var(--bg); color: var(--ink); border-color: var(--ink); }
.pill.outline:hover { background: var(--ink); color: #fff; transform: translateY(-2px); }
.pill.big { min-height: 52px; padding: 13px 26px; font-size: 1rem; }
.pill.wide { width: 100%; }
.pill .ar svg, .mini .ar svg, .ctile .ar svg { width: 18px; height: 18px; display: block; transition: transform .25s ease; }
.pill:hover .ar svg, .mini:hover .ar svg, .ctile:hover .ar svg { transform: translateX(4px); }
.row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* stepped picture with a card in the cut-out corner (kit signature) */
.stepped { position: relative; }
.stepped > img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r); background: var(--canvas); }
.stepped.square > img { aspect-ratio: 1; }
.notch { position: absolute; right: 0; bottom: 0; width: min(60%, 300px); background: var(--bg); border-top-left-radius: var(--r); padding: 14px 0 0 14px; }
.notch::before, .notch::after { content: ""; position: absolute; width: var(--r); height: var(--r); background: radial-gradient(circle at 0 0, transparent calc(var(--r) - .5px), var(--bg) var(--r)); }
.notch::before { right: 0; top: calc(-1 * var(--r)); }
.notch::after { left: calc(-1 * var(--r)); bottom: 0; }
.stepped.right .notch { right: auto; left: 0; border-top-left-radius: 0; border-top-right-radius: var(--r); padding: 14px 14px 0 0; }
.stepped.right .notch::before, .stepped.right .notch::after { background: radial-gradient(circle at 100% 0, transparent calc(var(--r) - .5px), var(--bg) var(--r)); }
.stepped.right .notch::before { right: auto; left: 0; }
.stepped.right .notch::after { left: auto; right: calc(-1 * var(--r)); }
.ncard { background: var(--canvas); border-radius: 22px; padding: 16px 18px; font-size: .9rem; color: var(--muted); transition: transform .3s ease, box-shadow .3s ease; }
.ncard p { margin: 6px 0 0; }
.ncard small { display: block; text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; font-weight: 600; color: var(--muted); }
.ncard b { display: block; font-size: 1.5rem; color: var(--ink); margin: 2px 0; }
.stepped:hover .ncard { transform: translateY(-4px); box-shadow: var(--shadow); }
.ico { width: 26px; height: 26px; color: var(--sky-deep); display: block; }

/* hero */
.hero { padding: 18px 0 8px; }
.hgrid { display: grid; grid-template-columns: 1.08fr 1fr; gap: 48px; align-items: start; }
.hero-img > img { aspect-ratio: 5 / 4; }
.htext { text-align: right; padding-top: 18px; position: relative; }
.htext h1 { margin-bottom: 0; }
.htext .lead { margin-left: auto; }
.htext .row { justify-content: flex-end; }
.elbow { width: 220px; height: 120px; display: block; margin: 4px 0 6px -40px; transform: scaleX(-1); }
.stats { display: flex; gap: 40px; justify-content: flex-end; margin: 4px 0 22px; text-align: left; }
.stats div { display: flex; flex-direction: column; }
.stats small { font-size: .78rem; color: var(--muted); }
.stats b { font-size: 2.6rem; margin: 2px 0; color: var(--ink); }
.stats b.sm { font-size: 1.45rem; }
.stats span { font-size: .84rem; color: var(--muted); }
.stats.wide { justify-content: flex-start; flex-wrap: wrap; }

/* sections */
section { margin: 0 0 88px; }
.split { display: grid; grid-template-columns: 1fr 1.05fr; gap: 56px; align-items: center; }
.split .stats { justify-content: flex-start; }
.fhead { text-align: center; margin-bottom: 26px; }
.fgrid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.fgrid4.wide { grid-template-columns: repeat(3, 1fr); }
.fcard { background: var(--bg); border: 1px solid var(--line); border-radius: 24px; padding: 22px; transition: transform .25s ease, box-shadow .25s ease; }
.fcard.tint { background: var(--canvas); }
.fcard:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.fcard h3 { margin-top: 14px; }
.fcard p { font-size: .92rem; color: var(--muted); }

.solutions { display: grid; grid-template-columns: 1fr 1.35fr; gap: 22px; align-items: start; }
.spanel { position: relative; border-radius: var(--r); overflow: hidden; min-height: 420px; }
.spanel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.spanel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(19, 24, 58, .62), rgba(19, 24, 58, 0) 60%); }
.spanel h2 { position: relative; z-index: 1; color: #fff; padding: 30px; max-width: 13em; }
.scard { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.solutions > .pill { grid-column: 2; justify-self: end; }
.tcard { display: flex; flex-direction: column; gap: 4px; text-decoration: none; color: var(--ink); background: var(--bg); border: 1px solid var(--line); border-radius: 24px; padding: 10px 10px 18px;
  transition: transform .25s ease, box-shadow .25s ease; }
.tcard img { border-radius: 18px; aspect-ratio: 3 / 2; object-fit: cover; margin-bottom: 8px; transition: transform .5s ease; }
.tcard:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.tcard:hover img { transform: scale(1.03); }
.tname { font: 600 1.08rem/1.3 "Outfit", sans-serif; padding: 0 8px; }
.tshort { font-size: .88rem; color: var(--muted); padding: 0 8px; }
.tprice { font-size: .86rem; font-weight: 600; color: var(--sky-deep); padding: 0 8px; }

/* dotted step line */
.steps { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: center; }
.steps.rev .stext { order: 2; }
.dots { list-style: none; margin: 18px 0 24px; padding: 0 0 0 34px; position: relative; }
.dots::before { content: ""; position: absolute; left: 10px; top: 8px; bottom: 8px; width: 2px; background: var(--line); }
.dots li { position: relative; margin-bottom: 18px; }
.dots .dot { position: absolute; left: -34px; top: 2px; width: 22px; height: 22px; border-radius: 50%; background: var(--sky-soft); border: 4px solid var(--bg); box-shadow: 0 0 0 2px var(--sky); }
.dots b { font-family: "Outfit", sans-serif; font-size: 1.08rem; }
.dots p { margin: 2px 0 0; color: var(--muted); font-size: .94rem; }
.stepped.small { max-width: 460px; justify-self: end; }

/* panel with hanging tabs */
.hband { background: linear-gradient(120deg, var(--sky-deep), #4fa3ff); color: #fff; border-radius: var(--r); padding: 44px 40px 120px; }
.hband p { color: #eef4ff; max-width: 36em; }
.ftabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: -96px 24px 0; }
.ftab { background: var(--bg); border-radius: 24px; padding: 12px 12px 18px; text-decoration: none; color: var(--ink); text-align: center; box-shadow: var(--shadow); transition: transform .25s ease; }
.ftab:hover { transform: translateY(-6px); }
.ftab .tabimg { border-radius: 16px; aspect-ratio: 1; object-fit: cover; margin-bottom: 10px; }
.ftab b { display: block; font-family: "Outfit", sans-serif; font-size: 1.04rem; }
.ftab span { font-size: .84rem; color: var(--muted); }

/* end banner */
.banner { background: var(--canvas); border-radius: var(--r); padding: 48px; position: relative; overflow: hidden; }
.banner::after { content: ""; position: absolute; right: -60px; top: -60px; width: 260px; height: 260px; border-radius: 50%; border: 18px solid var(--sky-soft); }
.btext { position: relative; z-index: 1; max-width: 640px; }

/* inner pages */
.phead { padding: 40px 0 0; max-width: 820px; margin-bottom: 40px; }
.tag { display: inline-block; font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; color: var(--sky-deep); margin-bottom: 10px; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.mcard { display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: var(--ink); padding: 10px 10px 16px; border-radius: 22px; border: 1px solid var(--line); transition: transform .25s ease, box-shadow .25s ease; }
.mcard img { border-radius: 16px; aspect-ratio: 1; object-fit: cover; margin-bottom: 8px; }
.mcard:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.mcard b { font-family: "Outfit", sans-serif; padding: 0 6px; }
.mcard span { font-size: .84rem; color: var(--muted); padding: 0 6px; }
.detail { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; padding-top: 30px; }
.flist ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 28px; }
.flist li { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: .94rem; }
.flist li span { flex: 1; }
.size { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; border-radius: 9px; font: 700 .8rem/1 "Outfit", sans-serif; color: #fff; flex: none; }
.size.sS { background: var(--mint); } .size.sM { background: var(--sky-deep); } .size.sL { background: var(--pink); }
.pr { font-style: normal; font-size: .76rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.pr.must { background: #fde3d3; color: #8a3507; } .pr.should { background: var(--sky-soft); color: #1645a0; } .pr.could { background: #dff3ea; color: #0a5c44; }
.others .minis { display: flex; flex-wrap: wrap; gap: 10px; }
.mini { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; min-height: 44px; border-radius: 999px; border: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.mini:hover { border-color: var(--sky); }
.hlist { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.hcard { display: grid; grid-template-columns: 150px 1fr; gap: 18px; align-items: center; padding: 14px; border-radius: 26px; background: var(--canvas); transition: transform .25s ease; }
.hcard:hover { transform: translateY(-4px); }
.hcard img { border-radius: 18px; aspect-ratio: 1; object-fit: cover; }
.hcard h2 { font-size: 1.4rem; }
.price { font-weight: 700; color: var(--sky-deep); margin: 0; }
.ptable { max-width: 860px; }
.tscroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: .95rem; }
caption { text-align: left; color: var(--muted); font-size: .86rem; padding-bottom: 8px; }
th, td { text-align: left; padding: 12px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
tbody th { font-weight: 600; }
tbody th .size { margin-right: 6px; }
.example { background: var(--canvas); border-radius: var(--r); padding: 36px; }
.facts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.fact { background: var(--canvas); border-radius: 18px; padding: 14px 16px; }
.fact span { display: block; font-size: .76rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.fact b { font-size: .96rem; }
.faq { max-width: 820px; }
.qa { border-bottom: 1px solid var(--line); }
.qa summary { cursor: pointer; padding: 18px 0; font: 600 1.08rem/1.4 "Outfit", sans-serif; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--sky-deep); transition: transform .25s ease; }
.qa[open] summary::after { transform: rotate(45deg); }
.qa p { color: var(--muted); }
.ctiles { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.ctile { border-radius: 26px; padding: 28px; color: #fff; text-decoration: none; display: flex; flex-direction: column; gap: 4px; min-height: 160px; transition: transform .25s ease; }
a.ctile:hover { transform: translateY(-5px); }
.ctile small { text-transform: uppercase; letter-spacing: .1em; font-size: .76rem; font-weight: 700; }
.ctile b { font: 600 1.4rem/1.25 "Outfit", sans-serif; overflow-wrap: anywhere; }
.ctile.sky { background: var(--sky-deep); } .ctile.pink { background: var(--pink); } .ctile.mint { background: var(--mint); } .ctile.orange { background: var(--orange); }
.note { color: var(--muted); font-size: .92rem; margin: 18px 0 80px; }
.note.warn { background: #fde3d3; color: #6e2a05; padding: 12px 16px; border-radius: 14px; }

/* planner */
.planner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 36px; align-items: start; }
.pform h2 { font-size: 1.3rem; margin: 28px 0 10px; }
.pform h2:first-child { margin-top: 0; }
.pform label { display: block; font-weight: 600; font-size: .9rem; margin: 12px 0 6px; }
.pform input[type=text], .pform input:not([type]), .pform input[type=tel], .pform input[type=email], .pform input[type=date], .pform select, .pform textarea {
  width: 100%; min-height: 46px; padding: 10px 14px; border: 1.5px solid var(--line); border-radius: 14px; font: inherit; background: var(--bg); color: var(--ink); }
.pform fieldset { border: 0; padding: 0; margin: 12px 0 0; }
.pform legend { font-weight: 600; font-size: .9rem; margin-bottom: 6px; padding: 0; }
.checks { display: flex; flex-wrap: wrap; gap: 8px; }
.checks label, .pform label.inline { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 10px 14px; min-height: 44px; border: 1.5px solid var(--line); border-radius: 999px; font-weight: 500; cursor: pointer; }
.checks label:has(input:checked) { border-color: var(--sky); background: var(--sky-soft); }
.sft { margin: 18px 0 6px; font: 600 .82rem/1.3 "Inter", sans-serif; text-transform: uppercase; letter-spacing: .08em; color: var(--sky-deep); }
.fline { border: 1.5px solid var(--line) !important; border-radius: 18px; padding: 12px 14px 14px !important; margin: 0 0 10px !important; }
.fline.on { border-color: var(--sky) !important; background: #f3f8ff; }
.fline legend { float: left; width: 100%; font-weight: 600; margin-bottom: 8px; }
.fline legend small { display: block; font-weight: 400; color: var(--muted); font-size: .84rem; margin-top: 2px; }
.fline legend .size { min-width: 24px; height: 24px; font-size: .74rem; margin-right: 6px; }
.seg { clear: both; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1.5px solid var(--line); border-radius: 999px; overflow: hidden; }
.seg label { margin: 0 !important; display: block; position: relative; cursor: pointer; }
.seg input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.seg span { display: flex; align-items: center; justify-content: center; min-height: 40px; font-size: .86rem; font-weight: 600; color: var(--muted); }
.seg label + label span { border-left: 1px solid var(--line); }
.seg input:checked + span { background: var(--ink); color: #fff; }
.seg input:focus-visible + span { outline: 3px solid var(--sky); outline-offset: -3px; }
.psum { position: sticky; top: 16px; background: var(--canvas); border-radius: var(--r); padding: 24px; }
.pchip { background: linear-gradient(120deg, var(--sky-deep), #4fa3ff); color: #fff; border-radius: 22px; padding: 18px 20px; margin-bottom: 16px; }
.pchip small { display: block; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.pchip b { display: block; font: 600 1.5rem/1.25 "Outfit", sans-serif; }
.pchip span { font-size: .86rem; }
.road { list-style: none; padding: 0; margin: 0 0 12px; display: grid; gap: 8px; }
.road li { border-radius: 16px; padding: 12px 14px; background: var(--bg); border-left: 6px solid var(--sky); display: flex; flex-direction: column; }
.road li.phase2 { border-left-color: var(--mint); } .road li.later { border-left-color: var(--pink); }
.road b { font-family: "Outfit", sans-serif; }
.road span { font-size: .9rem; font-weight: 600; color: var(--sky-deep); }
.road small { font-size: .82rem; color: var(--muted); }
.issues { background: #fde3d3; color: #6e2a05; border-radius: 16px; padding: 12px 16px; margin-bottom: 14px; font-size: .9rem; }
.issues ul { margin: 6px 0 0; padding-left: 18px; }
.psum .row { margin-bottom: 10px; }
.preview summary { cursor: pointer; color: var(--sky-deep); font-weight: 600; min-height: 44px; display: flex; align-items: center; }
.preview pre { white-space: pre-wrap; font: .82rem/1.5 ui-monospace, monospace; background: var(--bg); border-radius: 14px; padding: 14px; max-height: 420px; overflow: auto; }

/* privacy: index grid, then mirror-split sections with stepped pictures */
.pidx { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 56px; }
.pidx a { display: flex; gap: 10px; align-items: center; padding: 10px 14px; min-height: 44px; border-radius: 14px; background: var(--canvas); text-decoration: none; color: var(--ink); font-size: .9rem; transition: background-color .2s ease; }
.pidx a:hover { background: var(--sky-soft); }
.pidx b { font-family: "Outfit", sans-serif; color: var(--sky-deep); }
.psplit { display: grid; grid-template-columns: .9fr 1.1fr; gap: 48px; align-items: center; margin-bottom: 64px; scroll-margin-top: 20px; }
.psplit.rev .pimg { order: 2; }
.psplit.rev .pimg .notch { right: auto; left: 0; border-top-left-radius: 0; border-top-right-radius: var(--r); padding: 14px 14px 0 0; }
.psplit.rev .pimg .notch::before, .psplit.rev .pimg .notch::after { background: radial-gradient(circle at 100% 0, transparent calc(var(--r) - .5px), var(--bg) var(--r)); }
.psplit.rev .pimg .notch::before { right: auto; left: 0; }
.psplit.rev .pimg .notch::after { left: auto; right: calc(-1 * var(--r)); }
.pimg .notch { width: 96px; }
.pimg .ncard { text-align: center; padding: 12px; }
.pimg .ncard b { font-size: 1.6rem; color: var(--sky-deep); margin: 0; }
.ptext h2 { font-size: 1.6rem; }
.ptext p { color: var(--muted); }

/* footer */
.foot { background: var(--ink); color: #d9def0; margin-top: 40px; padding: 56px 24px 28px; }
.fgrid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 28px; }
.foot a { color: #fff; }
.fbrand { display: flex; align-items: center; gap: 10px; font-size: 1.3rem; color: #fff; }
.fh { font-weight: 700; color: #fff; margin-bottom: 6px; }
.legal { max-width: 1200px; margin: 30px auto 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .16); font-size: .82rem; color: #b8bfdc; }

/* motion: reveal on scroll and the drawn arrow; nothing hides without JavaScript */
[data-reveal] { transition: opacity .7s ease, transform .7s cubic-bezier(.2, .8, .2, 1); }
html.js [data-reveal] { opacity: 0; transform: translateY(26px); }
html.js [data-reveal].in { opacity: 1; transform: none; }
html.js .elbow .draw { stroke-dasharray: var(--len, 400); stroke-dashoffset: var(--len, 400); transition: stroke-dashoffset 1.3s ease .35s; }
html.js .in .elbow .draw { stroke-dashoffset: 0; }
.fgrid4 [data-reveal]:nth-child(2), .scard [data-reveal]:nth-child(2), .ftabs [data-reveal]:nth-child(2), .grid3 [data-reveal]:nth-child(3n+2), .grid4 [data-reveal]:nth-child(4n+2) { transition-delay: .08s; }
.fgrid4 [data-reveal]:nth-child(3), .scard [data-reveal]:nth-child(3), .ftabs [data-reveal]:nth-child(3), .grid3 [data-reveal]:nth-child(3n), .grid4 [data-reveal]:nth-child(4n+3) { transition-delay: .16s; }
.fgrid4 [data-reveal]:nth-child(4), .scard [data-reveal]:nth-child(4), .ftabs [data-reveal]:nth-child(4), .grid4 [data-reveal]:nth-child(4n) { transition-delay: .24s; }

@media (max-width: 960px) {
  .links, .top > .cta { display: none; }
  .mnav { display: block; margin-left: auto; position: relative; }
  .mnav summary { list-style: none; cursor: pointer; padding: 10px 18px; min-height: 44px; border: 1.6px solid var(--ink); border-radius: 999px; font-weight: 600; }
  .mnav summary::-webkit-details-marker { display: none; }
  .mnav nav { position: absolute; right: 0; top: 54px; z-index: 20; background: var(--bg); border-radius: 22px; box-shadow: var(--shadow); padding: 10px; display: flex; flex-direction: column; min-width: 220px; }
  .mnav nav a { padding: 12px 14px; border-radius: 12px; text-decoration: none; color: var(--ink); }
  .mnav nav a:hover { background: var(--canvas); }
  .hgrid, .split, .steps, .solutions, .detail, .planner, .psplit { grid-template-columns: 1fr; gap: 30px; }
  .htext { text-align: left; }
  .htext .lead { margin-left: 0; }
  .htext .row, .stats { justify-content: flex-start; }
  .elbow { display: none; }
  .steps.rev .stext, .psplit.rev .pimg { order: 0; }
  .solutions > .pill { grid-column: 1; justify-self: start; }
  .fgrid4, .grid4, .ftabs { grid-template-columns: 1fr 1fr; }
  .fgrid4.wide, .grid3, .hlist { grid-template-columns: 1fr 1fr; }
  .fgrid { grid-template-columns: 1fr 1fr; }
  .pidx { grid-template-columns: 1fr 1fr; }
  .psum { position: static; }
  .stepped.small { justify-self: stretch; max-width: none; }
}
@media (max-width: 600px) {
  main { padding: 0 16px; }
  .top { padding: 14px 16px; }
  section { margin-bottom: 64px; }
  .scard, .fgrid4, .fgrid4.wide, .grid3, .hlist, .flist ul, .ctiles, .facts, .pidx, .fgrid { grid-template-columns: 1fr; }
  .grid4, .ftabs { grid-template-columns: 1fr 1fr; }
  .ftabs { margin: -86px 10px 0; gap: 10px; }
  .hband { padding: 32px 24px 110px; }
  .hcard { grid-template-columns: 96px 1fr; }
  .stats { gap: 26px; flex-wrap: wrap; }
  .stats b { font-size: 2.1rem; }
  .banner, .example { padding: 30px 22px; }
  .notch { width: min(76%, 280px); }
  .hero-img > img { aspect-ratio: 1; }
  .hero-img .notch { width: min(66%, 250px); }
  .hero-img .ncard { font-size: .84rem; padding: 12px 14px; }
  .seg span { font-size: .8rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  html.js [data-reveal] { opacity: 1; transform: none; }
  html.js .elbow .draw { stroke-dashoffset: 0; }
  .fcard:hover, .tcard:hover, .ftab:hover, .mcard:hover, .hcard:hover, a.ctile:hover, .pill:hover, .stepped:hover .ncard { transform: none; }
  .tcard:hover img { transform: none; }
}