/* DOCUGULF, the four company setup pages: /services/company-setup and the free zone,
 * mainland and offshore pages. Their order flow is /start/flow like every other
 * service; this file only styles what those pages carry and the others do not.
 * Colours are the site's own tokens and nothing else, so the light and dark themes
 * both follow from the page's :root without a rule here.
 *
 * LINKED AS dg-setup.css?v=N. Stylesheets are cache-first in sw.js and sent with a
 * day's max-age, so a change here reaches a returning visitor only when N moves. */

/* The quote card says "Quoted for your setup" where other pages print a figure, so it
   is set at a sentence's size rather than a price's 30px. Only these four pages load
   this file, so no other quote card is touched. */
.quote-card .price{ font-size:22px; line-height:1.3; }

/* The comparison table on the company setup hub page. */
.cmp{ width:100%; border-collapse:collapse; font-size:14.5px; margin-top:8px; }
.cmp th, .cmp td{ text-align:left; padding:11px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
.cmp thead th{ font-family:var(--font-head); color:var(--brand-ink); font-size:14px; background:var(--mist); }
.cmp tbody th{ font-weight:600; color:var(--muted); width:30%; }
.cmp-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:12px; }

/* The three jurisdiction cards on the hub. */
.jx{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); margin-top:10px; }
.jx a{ display:flex; flex-direction:column; gap:6px; border:1px solid var(--line); border-radius:16px; padding:20px; background:var(--paper); box-shadow:var(--shadow-sm); transition:transform .12s ease, border-color .12s ease; }
.jx a:hover{ transform:translateY(-2px); border-color:var(--teal); }
.jx b{ font-family:var(--font-head); font-size:18px; color:var(--brand-ink); }
.jx span{ font-size:14px; color:var(--muted); }
.jx em{ font-style:normal; font-size:13.5px; font-weight:700; color:var(--gold-ink); margin-top:auto; }
@media(prefers-reduced-motion:reduce){ .jx a{ transition:none; } }