/* ---------- Inter, self-hosted (SIL OFL 1.1 — see fonts/Inter-LICENSE.txt) ----------
   Self-hosted rather than CDN: removes a third-party request, improves LCP,
   and keeps EU partner deployments free of a Google Fonts dependency.
   InterDisplay is the optical-size variant used for display/headings per §26. */
@font-face{font-family:Inter;src:url(fonts/Inter-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/Inter-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/Inter-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/Inter-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Inter Display";src:url(fonts/InterDisplay-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Inter Display";src:url(fonts/InterDisplay-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* ============================================================
   Genwright by Knomatic — genwright.ai
   Tokens locked to Brand Standards Manual, Compact Edition 2.0
   Contrast-audited against §23. Deviations documented in the spec.
   ============================================================ */

:root{
  /* Core palette (§20) */
  --navy:#0F172A;
  --wright:#1D6EF2;
  --steel:#64748B;
  --fog:#E2E8F0;
  --white:#FFFFFF;

  /* Derived tints — required to meet §23 contrast at small sizes */
  --navy-lift:#16213A;      /* elevated surface on navy */
  --navy-deep:#0A1120;      /* recessed surface on navy */
  --wright-ink:#1558C4;     /* 6.51:1 on white — links, small blue text on light */
  --wright-lift:#5B93FF;    /* 6.00:1 on navy — small blue text on dark */
  --steel-lift:#94A3B8;     /* 6.96:1 on navy — small grey text on dark */
  --ink:#0F172A;
  --ink-2:#334155;
  --ink-3:#475569;
  --fog-2:#F1F5F9;
  --line:#D8E0EA;
  --line-dark:rgba(226,232,240,.14);

  --r:4px;
  --gutter:clamp(1.25rem,4.5vw,3rem);
  --sp:clamp(3.5rem,7.5vw,6rem);
  --measure:66ch;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}
body{
  margin:0;background:var(--white);color:var(--ink);
  font-family:Inter,"Inter var",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;
}
img,svg{display:block;max-width:100%;height:auto}
ul,ol{margin:0;padding:0}

h1,h2,h3,h4{margin:0 0 .5em;line-height:1.13;letter-spacing:-.022em;font-weight:700;text-wrap:balance}
h1,h2{font-family:"Inter Display",Inter,system-ui,sans-serif}
h1{font-size:clamp(2.15rem,4.6vw,3.4rem)}
h2{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:600;letter-spacing:-.02em}
h3{font-size:1.075rem;font-weight:600;letter-spacing:-.008em;line-height:1.35}
p{margin:0 0 1.05em;max-width:var(--measure)}
p:last-child{margin-bottom:0}
.lede{font-size:clamp(1.06rem,1.45vw,1.22rem);color:var(--ink-2);line-height:1.55}
a{color:var(--wright-ink);text-underline-offset:.18em;text-decoration-thickness:.07em}
a:hover{color:var(--wright)}
:focus-visible{outline:3px solid var(--wright);outline-offset:3px;border-radius:2px}

.wrap{width:min(1200px,100%);margin-inline:auto;padding-inline:var(--gutter)}
.wrap--narrow{width:min(860px,100%)}
.sec{padding-block:var(--sp)}
.sec--tight{padding-block:clamp(2.5rem,5vw,3.75rem)}

.eyebrow{
  display:block;margin:0 0 .9rem;font-size:.71rem;font-weight:600;
  letter-spacing:.17em;text-transform:uppercase;color:var(--wright-ink);
}
.hd{max-width:34ch}
.hd + .lede{margin-top:-.15rem}

/* ---------- surfaces ---------- */
.dark{background:var(--navy);color:#C6D2E2}
.dark h1,.dark h2,.dark h3,.dark h4{color:var(--white)}
.dark p{color:#C6D2E2}
.dark .lede{color:#CFDAE8}
.dark .eyebrow{color:var(--wright-lift)}
.dark a{color:#9CC2FF}
.light{background:var(--fog-2)}

/* textures — one per composition (§34) */
.tex-blueprint{
  background-image:
    linear-gradient(rgba(226,232,240,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(226,232,240,.05) 1px,transparent 1px);
  background-size:32px 32px;
}
.tex-topo{
  background-image:repeating-radial-gradient(
    circle at 82% 108%,transparent 0 46px,rgba(93,147,255,.075) 46px 47px);
}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:50;background:rgba(15,23,42,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-dark)}
.hdr__bar{display:flex;align-items:center;gap:1rem;min-height:66px}
.brand{display:flex;align-items:center;gap:.68rem;text-decoration:none;margin-right:auto;padding-block:.7rem}
.brand__mark{width:31px;height:auto;flex:none}
.brand__type{display:flex;flex-direction:column;line-height:1}
.brand__name{color:#fff;font-weight:700;font-size:1.14rem;letter-spacing:-.025em}
.brand__endorse{color:var(--wright-lift);font-size:.545rem;font-weight:700;letter-spacing:.23em;margin-top:.24rem}

.nav{display:flex;align-items:center;gap:1.6rem}
.nav a{color:#C6D2E2;text-decoration:none;font-size:.925rem;font-weight:500;white-space:nowrap}
.nav a:hover{color:#fff}
.nav__cta{margin-left:.4rem}

.menu{display:none}
.menu summary{
  list-style:none;cursor:pointer;color:#fff;font-size:.9rem;font-weight:600;
  padding:.6rem .9rem;border:1px solid var(--line-dark);border-radius:var(--r);
}
.menu summary::-webkit-details-marker{display:none}
.menu[open] .menu__panel{display:flex}
.menu__panel{
  display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;
  background:var(--navy);border-bottom:1px solid var(--line-dark);padding:.6rem var(--gutter) 1.2rem;
}
.menu__panel a{color:#C6D2E2;text-decoration:none;padding:.7rem 0;border-bottom:1px solid var(--line-dark);font-weight:500}
.menu__panel .btn{margin-top:1rem;text-align:center;border-bottom:0}

@media(max-width:940px){
  .hdr__bar{position:relative}
  .nav{display:none}
  .menu{display:block}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;padding:.8rem 1.55rem;border-radius:var(--r);
  font-size:.95rem;font-weight:600;text-decoration:none;border:2px solid transparent;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease;
}
.btn--primary{background:var(--wright);color:#fff}
.btn--primary:hover{background:var(--wright-ink);color:#fff}
.btn--ghost-dark{border-color:rgba(226,232,240,.34);color:#E2E8F0}
.btn--ghost-dark:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.05)}
.btn--ghost{border-color:var(--steel);color:var(--ink)}
.btn--ghost:hover{border-color:var(--ink);color:var(--ink);background:var(--fog-2)}
.btn--sm{padding:.58rem 1.05rem;font-size:.875rem}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.9rem}

/* ---------- hero ---------- */
.hero{padding-block:clamp(3rem,6vw,5rem) clamp(3rem,6vw,4.5rem)}
.hero__grid{display:grid;gap:clamp(2.5rem,4vw,3.5rem);align-items:center}
@media(min-width:1020px){.hero__grid{grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr)}}
.hero h1{max-width:16ch}
.hero .lede{max-width:50ch;color:#CFDAE8}
.hero__micro{
  margin-top:2rem;padding-top:1.4rem;border-top:1px solid var(--line-dark);
  font-size:.845rem;color:var(--steel-lift);max-width:46ch;
}

/* ---------- the Studio window (signature) ---------- */
.studio{
  border:1px solid rgba(226,232,240,.18);border-radius:6px;overflow:hidden;
  background:var(--navy-deep);box-shadow:0 24px 60px -28px rgba(0,0,0,.85);
}
.studio__chrome{
  display:flex;align-items:center;gap:.55rem;padding:.7rem .95rem;
  background:var(--navy-lift);border-bottom:1px solid var(--line-dark);
}
.studio__dots{display:flex;gap:.34rem}
.studio__dots i{width:9px;height:9px;border-radius:50%;background:rgba(148,163,184,.36)}
.studio__title{
  font-size:.685rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
  color:var(--steel-lift);margin-left:.35rem;
}
.studio__badge{
  margin-left:auto;font-size:.63rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--wright-lift);border:1px solid rgba(91,147,255,.4);border-radius:3px;padding:.2rem .5rem;
  display:flex;align-items:center;gap:.35rem;
}
.studio__badge svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

.studio input[type=radio]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.studio__tabs{display:flex;flex-wrap:wrap;background:rgba(15,23,42,.55);border-bottom:1px solid var(--line-dark)}
.studio__tabs label{
  padding:.72rem 1.05rem;font-size:.735rem;font-weight:600;letter-spacing:.085em;
  text-transform:uppercase;color:var(--steel-lift);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px;
}
.studio__tabs label:hover{color:#E2E8F0}
.studio input:focus-visible + label{outline:3px solid var(--wright);outline-offset:-3px}

.studio__panel{display:none;padding:1.35rem 1.45rem 1.5rem}
.studio__cap{
  font-size:.655rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--steel-lift);margin:0 0 .65rem;
}
.studio__said{
  margin:0;color:#E8EEF6;font-size:.965rem;line-height:1.55;max-width:none;
  border-left:2px solid var(--wright);padding-left:.95rem;
}
.studio__rule{
  display:flex;align-items:center;gap:.75rem;margin:1.35rem 0 1.05rem;
  font-size:.635rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--wright-lift);
}
.studio__rule::after{content:"";flex:1;height:1px;background:var(--line-dark)}
.studio__out{list-style:none}
.studio__out li{
  display:grid;grid-template-columns:7.6rem 1fr;gap:.85rem;align-items:baseline;
  padding:.46rem 0;border-bottom:1px dashed rgba(100,116,139,.28);font-size:.855rem;color:#C6D2E2;
}
.studio__out li:last-child{border-bottom:0}
.studio__out b{
  font-size:.645rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--wright-lift);
}
@media(max-width:430px){
  .studio__out li{grid-template-columns:1fr;gap:.15rem}
}
.studio__foot{
  padding:.8rem 1.45rem;border-top:1px solid var(--line-dark);background:rgba(22,33,58,.55);
  font-size:.775rem;color:var(--steel-lift);
}
#s-fleet:checked ~ .studio__tabs label[for=s-fleet],
#s-terminal:checked ~ .studio__tabs label[for=s-terminal],
#s-vessel:checked ~ .studio__tabs label[for=s-vessel],
#s-wellsite:checked ~ .studio__tabs label[for=s-wellsite]{color:#fff;border-bottom-color:var(--wright)}
#s-fleet:checked ~ #sp-fleet,
#s-terminal:checked ~ #sp-terminal,
#s-vessel:checked ~ #sp-vessel,
#s-wellsite:checked ~ #sp-wellsite{display:block}

/* ---------- trust strip ---------- */
.strip{border-block:1px solid var(--line);background:var(--fog-2)}
.strip__in{display:flex;flex-wrap:wrap;gap:1.1rem 2.4rem;align-items:center;padding-block:1.5rem}
.strip__lead{font-size:.9rem;color:var(--ink-3);font-weight:500;max-width:30ch;margin:0}
.strip__list{display:flex;flex-wrap:wrap;gap:.55rem;list-style:none;margin-left:auto}
.strip__list a{
  display:block;font-size:.735rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-2);border:1px solid var(--line);background:#fff;border-radius:var(--r);
  padding:.42rem .8rem;text-decoration:none;transition:border-color .15s,color .15s;
}
.strip__list a:hover{border-color:var(--wright);color:var(--wright-ink)}

/* ---------- icons ---------- */
.ico{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ico--blue{color:var(--wright)}
.dark .ico--blue{color:#fff}

/* ---------- grids & cards ---------- */
.grid{display:grid;gap:1.15rem}
@media(min-width:660px){.grid--2{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.grid--3{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1080px){.grid--4{grid-template-columns:repeat(4,1fr)}}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:1.55rem 1.5rem;display:flex;flex-direction:column;
}
.card .ico{margin-bottom:1rem}
.card h3{margin-bottom:.42rem}
.card p{font-size:.925rem;color:var(--ink-3);line-height:1.55;margin-bottom:.95rem}
.card ul{list-style:none;font-size:.885rem;color:var(--ink-3);margin-bottom:1.1rem}
.card ul li{padding-left:.95rem;position:relative;margin-bottom:.28rem}
.card ul li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:1px;background:var(--wright)}
.card__link{margin-top:auto;font-size:.895rem;font-weight:600;text-decoration:none}
.card__link::after{content:" →"}
.card--dark{background:var(--navy-lift);border-color:var(--line-dark)}
.card--dark p{color:#C6D2E2}
.card--flat{background:transparent;border:0;border-top:2px solid var(--wright);border-radius:0;padding:1.1rem 0 0}

/* ---------- steps ---------- */
.steps{list-style:none;display:grid;gap:1.6rem;margin-top:2.4rem}
@media(min-width:800px){.steps{grid-template-columns:repeat(4,1fr);gap:1.9rem}}
.steps li{border-top:2px solid var(--wright);padding-top:1rem}
.steps .n{
  display:block;margin-bottom:.5rem;font-size:.665rem;font-weight:700;
  letter-spacing:.15em;color:var(--steel);
}
.dark .steps .n{color:var(--steel-lift)}
.steps p{font-size:.915rem;color:var(--ink-3);line-height:1.55;margin:0}
.dark .steps p{color:#C6D2E2}

/* ---------- callout ---------- */
.callout{
  border-left:3px solid var(--wright);background:var(--fog-2);
  padding:1.2rem 1.4rem;margin:2rem 0 0;border-radius:0 var(--r) var(--r) 0;
}
.callout p{margin:0;font-size:.955rem;color:var(--ink-2);max-width:62ch}
.callout .eyebrow{margin-bottom:.42rem}
.dark .callout{background:rgba(29,110,242,.11);border-left-color:var(--wright-lift)}
.dark .callout p{color:#D3DEEC}

/* ---------- table ---------- */
.tbl{overflow-x:auto;margin-top:2.1rem;border:1px solid var(--line);border-radius:var(--r);background:#fff}
table{border-collapse:collapse;width:100%;min-width:780px;font-size:.885rem}
caption{text-align:left;padding:1rem 1.15rem;color:var(--ink-3);font-size:.865rem;border-bottom:1px solid var(--line)}
th,td{padding:.82rem 1.15rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
thead th{
  background:var(--navy);color:#fff;font-weight:600;font-size:.7rem;
  letter-spacing:.1em;text-transform:uppercase;border-bottom:0;
}
thead th:first-child{width:19%}
tbody th{font-weight:600;background:var(--fog-2);color:var(--ink)}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}
td.mark{color:var(--wright-ink);font-weight:600;background:rgba(29,110,242,.045)}

/* ---------- FAQ ---------- */
.faq{margin-top:2.2rem;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  list-style:none;cursor:pointer;padding:1.15rem 2.4rem 1.15rem 0;position:relative;
  font-size:1.045rem;font-weight:600;letter-spacing:-.008em;line-height:1.4;color:var(--ink);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:.45rem;top:1.55rem;width:9px;height:9px;
  border-right:2px solid var(--wright);border-bottom:2px solid var(--wright);
  transform:rotate(45deg);transition:transform .15s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg);top:1.75rem}
.faq summary:hover{color:var(--wright-ink)}
.faq p{padding:0 2.4rem 1.35rem 0;margin:0;color:var(--ink-2);font-size:.965rem;max-width:70ch}

/* ---------- split ---------- */
.split{display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:start}
@media(min-width:900px){.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

.stat{border-top:2px solid var(--wright);padding-top:.9rem}
.stat b{display:block;font-size:clamp(1.7rem,3vw,2.3rem);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.dark .stat b{color:#fff}
.stat span{display:block;margin-top:.3rem;font-size:.855rem;color:var(--ink-3)}
.dark .stat span{color:var(--steel-lift)}

/* ---------- breadcrumb ---------- */
.crumbs{font-size:.83rem;color:var(--steel-lift);margin-bottom:1.6rem}
.crumbs a{color:var(--steel-lift);text-decoration:none}
.crumbs a:hover{color:#fff}

/* ---------- footer ---------- */
.ftr{background:var(--navy);color:var(--steel-lift);padding-block:3.25rem 1.75rem;font-size:.9rem}
.ftr__cols{display:grid;gap:2.2rem;margin-bottom:2.75rem}
@media(min-width:760px){.ftr__cols{grid-template-columns:1.5fr repeat(3,1fr)}}
.ftr h4{color:#fff;font-size:.695rem;letter-spacing:.15em;text-transform:uppercase;font-weight:700;margin:0 0 .95rem}
.ftr a{color:var(--steel-lift);text-decoration:none;display:block;padding:.24rem 0;font-size:.9rem}
.ftr a:hover{color:#fff}
.ftr .brand{display:flex;padding:0}
.ftr .brand:hover .brand__name{color:#fff}
.ftr__blurb{color:var(--steel-lift);font-size:.885rem;max-width:30ch;margin:1rem 0 0}
.ftr__legal{
  border-top:1px solid var(--line-dark);padding-top:1.5rem;display:flex;flex-wrap:wrap;
  gap:.6rem 1.8rem;justify-content:space-between;align-items:center;
}
.ftr__legal p{margin:0;color:var(--steel-lift);font-size:.815rem}

.skip{position:absolute;left:-9999px}
.skip:focus{position:fixed;left:1rem;top:1rem;z-index:99;background:#fff;color:var(--navy);padding:.7rem 1.1rem;border-radius:var(--r);font-weight:600}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- module library ---------- */
.mods{display:grid;gap:1.15rem;margin-top:2.4rem}
@media(min-width:700px){.mods{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.mods{grid-template-columns:repeat(3,1fr)}}
.mod{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:1.45rem 1.4rem}
.mod h3{margin-bottom:.3rem}
.mod__note{font-size:.855rem;color:var(--steel);margin:0 0 .95rem;line-height:1.45}
.mod ul{list-style:none;font-size:.9rem;color:var(--ink-3)}
.mod ul li{padding:.32rem 0 .32rem .95rem;position:relative;border-bottom:1px solid var(--fog-2)}
.mod ul li:last-child{border-bottom:0}
.mod ul li::before{content:"";position:absolute;left:0;top:.95em;width:5px;height:1px;background:var(--wright)}
.light .mod{background:var(--white)}

.proof__note{font-size:.815rem;color:var(--steel);line-height:1.5;margin-top:.9rem;max-width:60ch}

/* ---------- numbered chain (a real sequence: application → timecard) ---------- */
.chain{list-style:none;display:grid;gap:1.1rem;margin-top:2.4rem;counter-reset:c}
@media(min-width:700px){.chain{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.chain{grid-template-columns:repeat(4,1fr)}}
.chain li{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.35rem;position:relative}
.chain .n{display:block;font-size:.665rem;font-weight:700;letter-spacing:.15em;color:var(--wright);margin-bottom:.55rem}
.chain h3{margin-bottom:.35rem}
.chain p{font-size:.895rem;color:var(--ink-3);line-height:1.55;margin:0}