/*!
 * SecureGovRecords — precompiled Tailwind-style utility layer
 * Hand-compiled subset (no Node / npm build step required on XAMPP).
 * Only the utilities actually used by the markup are shipped, so the file
 * stays small and render-blocking cost stays low.
 * Breakpoints: sm 640 | md 768 | lg 1024 | xl 1280
 *
 * Cascade layers give utilities the last word over component styles, exactly
 * like a real Tailwind build — so `hidden` always beats `.btn{display:…}`.
 */
@layer base, components, utilities;

@layer base {

/* ---------------------------------------------------------------- tokens
 * Palette and type are taken directly from securegovrecords.com — the same
 * navy, royal blue, hairlines and tints, sampled from the live stylesheet.
 * Only the LAYOUT differs from the live site.
 */
:root{
  --ink:#0b1a33;          /* darkest ground — dark sections, footer           */
  --ink-800:#122342;      /* live body ink / raised dark surface              */
  --ink-700:#1c3157;      /* tertiary dark surface                            */
  --brand:#10254b;        /* live logo + heading navy                         */

  --canvas:#ffffff;       /* page canvas, as on the live site                 */
  --tint:#f6f8ff;         /* banded / inset surface (live --tint-2)           */
  --surface:#ffffff;

  --accent:#324de0;       /* live primary blue                                */
  --accent-700:#2538ab;   /* live deep blue — hover / pressed                 */
  --accent-400:#5470e4;   /* live hover blue                                  */
  --accent-300:#a8bcfa;   /* accent on dark grounds                           */
  --accent-100:#ecf1ff;   /* live accent wash                                 */

  --text:#122342;
  --muted:#54637b;
  --muted-2:#61708b;
  --slate:#344565;

  --line:#d6e0f2;         /* live hairline                                    */
  --line-2:#eaf0fb;
  --line-dark:rgba(255,255,255,.16);
  --ondark:rgba(217,229,250,.82);   /* live #d9e5fa, softened                 */

  --shadow-sm:0 1px 2px rgba(18,35,66,.06);
  --shadow-md:0 8px 22px -10px rgba(18,35,66,.18);
  --shadow-lg:0 28px 56px -24px rgba(18,35,66,.26);
  --shadow-xl:0 46px 90px -36px rgba(18,35,66,.4);

  /* The live site is Inter throughout — display type is weight, not a serif. */
  --font-sans:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --font-display:var(--font-sans);
  --header-h:78px;
}

/* ------------------------------------------------------------------ base */
*,::before,::after{box-sizing:border-box;border:0 solid var(--line)}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
body{margin:0;font-family:var(--font-sans);font-size:1rem;line-height:1.6;color:var(--text);background:var(--canvas);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
h1,h2,h3,h4,h5,h6{margin:0;font-weight:800;line-height:1.14;letter-spacing:-.028em;color:var(--brand)}
p,figure,figcaption,blockquote,dl,dd,hr{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
img,svg,video{display:block;max-width:100%;height:auto}
button,input,textarea,select{font:inherit;color:inherit;margin:0;background:none}
button{cursor:pointer}
address{font-style:normal}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
::selection{background:var(--accent);color:#fff}

} /* end @layer base */

@layer utilities {

/* --------------------------------------------------------------- display */
.block{display:block}.inline-block{display:inline-block}.inline{display:inline}
.flex{display:flex}.inline-flex{display:inline-flex}
.grid{display:grid}.hidden{display:none}.contents{display:contents}

/* ------------------------------------------------------------------ flex */
.flex-col{flex-direction:column}.flex-row{flex-direction:row}
.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}
.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.flex-none{flex:none}
.shrink-0{flex-shrink:0}.grow{flex-grow:1}
.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.items-baseline{align-items:baseline}
.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}
.content-center{align-content:center}
.self-start{align-self:flex-start}.self-center{align-self:center}.self-stretch{align-self:stretch}
.order-1{order:1}.order-2{order:2}

/* ------------------------------------------------------------------ grid */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.col-span-2{grid-column:span 2/span 2}
.col-span-full{grid-column:1/-1}

/* ------------------------------------------------------------------- gap */
.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}
.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}
.gap-12{gap:3rem}.gap-14{gap:3.5rem}.gap-16{gap:4rem}
.gap-x-2{column-gap:.5rem}.gap-x-3{column-gap:.75rem}.gap-x-4{column-gap:1rem}.gap-x-6{column-gap:1.5rem}.gap-x-8{column-gap:2rem}
.gap-y-2{row-gap:.5rem}.gap-y-3{row-gap:.75rem}.gap-y-4{row-gap:1rem}.gap-y-6{row-gap:1.5rem}.gap-y-8{row-gap:2rem}.gap-y-10{row-gap:2.5rem}

/* --------------------------------------------------------------- padding */
.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}
.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-7{padding:1.75rem}.p-8{padding:2rem}
.p-10{padding:2.5rem}.p-12{padding:3rem}
.px-0{padding-left:0;padding-right:0}.px-1{padding-left:.25rem;padding-right:.25rem}
.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}
.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-7{padding-left:1.75rem;padding-right:1.75rem}
.px-8{padding-left:2rem;padding-right:2rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}
.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}
.py-14{padding-top:3.5rem;padding-bottom:3.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}
.py-20{padding-top:5rem;padding-bottom:5rem}.py-24{padding-top:6rem;padding-bottom:6rem}
.pt-2{padding-top:.5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}.pt-10{padding-top:2.5rem}.pt-12{padding-top:3rem}.pt-16{padding-top:4rem}
.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-6{padding-bottom:1.5rem}.pb-8{padding-bottom:2rem}.pb-10{padding-bottom:2.5rem}.pb-12{padding-bottom:3rem}.pb-16{padding-bottom:4rem}
.pl-4{padding-left:1rem}.pl-6{padding-left:1.5rem}.pr-4{padding-right:1rem}.pr-6{padding-right:1.5rem}

/* ---------------------------------------------------------------- margin */
.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.ml-auto{margin-left:auto}.mr-auto{margin-right:auto}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}
.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}
.mt-12{margin-top:3rem}.mt-14{margin-top:3.5rem}.mt-16{margin-top:4rem}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}
.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}
.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}
.-mt-1{margin-top:-.25rem}

/* ----------------------------------------------------------------- sizes */
.w-auto{width:auto}.w-full{width:100%}.w-fit{width:fit-content}
.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}
.w-11{width:2.75rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-16{width:4rem}
.h-auto{height:auto}.h-full{height:100%}
.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}
.h-11{height:2.75rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}
.min-w-0{min-width:0}
.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-md{max-width:28rem}
.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}
.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}
.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-none{max-width:none}

/* ------------------------------------------------------------ typography */
.text-xs{font-size:.75rem;line-height:1.5}
.text-sm{font-size:.875rem;line-height:1.6}
.text-base{font-size:1rem;line-height:1.65}
.text-lg{font-size:1.0625rem;line-height:1.7}
.text-xl{font-size:1.25rem;line-height:1.5}
.text-2xl{font-size:1.5rem;line-height:1.35}
.text-3xl{font-size:1.875rem;line-height:1.22}
.text-4xl{font-size:2.25rem;line-height:1.15}
.text-5xl{font-size:2.75rem;line-height:1.1}
.text-6xl{font-size:3.25rem;line-height:1.06}
.text-7xl{font-size:4rem;line-height:1.02}
.font-display{font-family:var(--font-display)}
.font-sans{font-family:var(--font-sans)}
.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}
.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-black{font-weight:900}
.italic{font-style:italic}
.leading-none{line-height:1}.leading-tight{line-height:1.15}.leading-snug{line-height:1.35}
.leading-normal{line-height:1.55}.leading-relaxed{line-height:1.75}
.tracking-tighter{letter-spacing:-.04em}.tracking-tight{letter-spacing:-.022em}
.tracking-normal{letter-spacing:0}.tracking-wide{letter-spacing:.04em}
.tracking-wider{letter-spacing:.08em}.tracking-widest{letter-spacing:.14em}
.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}
.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}
.text-balance{text-wrap:balance}.text-pretty{text-wrap:pretty}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.whitespace-nowrap{white-space:nowrap}
.tabular-nums{font-variant-numeric:tabular-nums}
.underline{text-decoration:underline}.no-underline{text-decoration:none}

/* ---------------------------------------------------------------- colors */
.text-ink{color:var(--ink)}.text-brand{color:var(--brand)}.text-body{color:var(--text)}
.text-accent{color:var(--accent)}.text-accent-700{color:var(--accent-700)}.text-accent-300{color:var(--accent-300)}
.text-accent-400{color:var(--accent-400)}
.text-muted{color:var(--muted)}.text-muted-2{color:var(--muted-2)}.text-slate{color:var(--slate)}
.text-white{color:#fff}.text-canvas{color:var(--canvas)}.text-ondark{color:var(--ondark)}
.text-current{color:currentColor}
.bg-white{background-color:#fff}.bg-surface{background-color:var(--surface)}
.bg-canvas{background-color:var(--canvas)}.bg-tint{background-color:var(--tint)}
.bg-ink{background-color:var(--ink)}.bg-ink-800{background-color:var(--ink-800)}
.bg-accent{background-color:var(--accent)}.bg-accent-100{background-color:var(--accent-100)}
.bg-accent-700{background-color:var(--accent-700)}
.bg-line{background-color:var(--line)}.bg-transparent{background-color:transparent}

/* --------------------------------------------------------------- borders */
.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}
.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}
.border-l{border-left-width:1px}.border-r{border-right-width:1px}
.border-l-2{border-left-width:2px}
.border-line{border-color:var(--line)}.border-line-2{border-color:var(--line-2)}
.border-accent{border-color:var(--accent)}.border-ink{border-color:var(--ink)}
.border-white{border-color:#fff}
.border-dark{border-color:var(--line-dark)}
.rounded-none{border-radius:0}.rounded{border-radius:.375rem}.rounded-md{border-radius:.5rem}
.rounded-lg{border-radius:.75rem}.rounded-xl{border-radius:1rem}.rounded-2xl{border-radius:1.25rem}
.rounded-3xl{border-radius:1.75rem}.rounded-full{border-radius:9999px}

/* --------------------------------------------------------------- effects */
.shadow-none{box-shadow:none}.shadow-sm{box-shadow:var(--shadow-sm)}
.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}
.shadow-xl{box-shadow:var(--shadow-xl)}
.opacity-0{opacity:0}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-80{opacity:.8}.opacity-100{opacity:1}

/* -------------------------------------------------------------- position */
.static{position:static}.relative{position:relative}.absolute{position:absolute}
.fixed{position:fixed}.sticky{position:sticky}
.inset-0{inset:0}.inset-x-0{left:0;right:0}
.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}
.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}

/* ------------------------------------------------------------ misc utils */
.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}
.object-cover{object-fit:cover}.object-center{object-position:center}
.aspect-video{aspect-ratio:16/9}.aspect-square{aspect-ratio:1/1}.aspect-\[4\/3\]{aspect-ratio:4/3}
.cursor-pointer{cursor:pointer}.pointer-events-none{pointer-events:none}
.select-none{-webkit-user-select:none;user-select:none}
.transition{transition:color .25s ease,background-color .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease,opacity .25s ease}
.transition-transform{transition:transform .35s cubic-bezier(.22,1,.36,1)}
.list-none{list-style:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ------------------------------------------------------------- container */
.container-x{width:100%;max-width:1280px;margin-inline:auto;padding-inline:1.25rem}
.container-narrow{width:100%;max-width:980px;margin-inline:auto;padding-inline:1.25rem}

/* ------------------------------------------------------------- additions */
.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.col-span-3{grid-column:span 3/span 3}
.max-w-prose{max-width:66ch}
.order-first{order:-1}.order-last{order:99}
.border-b-2{border-bottom-width:2px}
.pt-20{padding-top:5rem}.pb-20{padding-bottom:5rem}.pt-14{padding-top:3.5rem}.pb-14{padding-bottom:3.5rem}
.gap-y-12{row-gap:3rem}.gap-y-16{row-gap:4rem}
.mt-20{margin-top:5rem}.mb-20{margin-bottom:5rem}
.rotate-90{transform:rotate(90deg)}
.origin-left{transform-origin:left}
.isolate{isolation:isolate}

/* ============================================================== sm 640px */
@media (min-width:640px){
  .sm\:block{display:block}.sm\:flex{display:flex}.sm\:inline-flex{display:inline-flex}.sm\:hidden{display:none}
  .sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:text-left{text-align:left}
  .sm\:w-auto{width:auto}
  .sm\:text-4xl{font-size:2.25rem;line-height:1.15}
  .sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}
}

/* ============================================================== md 768px */
@media (min-width:768px){
  .md\:block{display:block}.md\:flex{display:flex}.md\:inline-flex{display:inline-flex}
  .md\:grid{display:grid}.md\:hidden{display:none}
  .md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}
  .md\:items-center{align-items:center}.md\:items-end{align-items:flex-end}
  .md\:justify-between{justify-content:space-between}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .md\:col-span-2{grid-column:span 2/span 2}
  .md\:gap-6{gap:1.5rem}.md\:gap-8{gap:2rem}.md\:gap-10{gap:2.5rem}.md\:gap-12{gap:3rem}
  .md\:py-20{padding-top:5rem;padding-bottom:5rem}
  .md\:py-24{padding-top:6rem;padding-bottom:6rem}
  .md\:p-8{padding:2rem}.md\:p-10{padding:2.5rem}.md\:p-12{padding:3rem}
  .md\:px-8{padding-left:2rem;padding-right:2rem}
  .md\:mt-0{margin-top:0}
  .md\:text-left{text-align:left}
  .md\:text-2xl{font-size:1.5rem;line-height:1.35}
  .md\:text-3xl{font-size:1.875rem;line-height:1.22}
  .md\:text-4xl{font-size:2.25rem;line-height:1.15}
  .md\:text-5xl{font-size:2.75rem;line-height:1.1}
  .md\:text-lg{font-size:1.0625rem;line-height:1.7}
  .md\:w-auto{width:auto}
  .md\:max-w-none{max-width:none}
  .md\:order-1{order:1}.md\:order-2{order:2}
  .md\:order-first{order:-1}.md\:order-last{order:99}
  .md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .md\:col-span-3{grid-column:span 3/span 3}
  .md\:pt-20{padding-top:5rem}.md\:pb-20{padding-bottom:5rem}
  .md\:text-xl{font-size:1.25rem;line-height:1.5}
  .md\:text-6xl{font-size:3.25rem;line-height:1.06}
}

/* ============================================================= lg 1024px */
@media (min-width:1024px){
  .lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}
  .lg\:flex-row{flex-direction:row}
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .lg\:gap-10{gap:2.5rem}.lg\:gap-12{gap:3rem}.lg\:gap-16{gap:4rem}
  .lg\:py-28{padding-top:7rem;padding-bottom:7rem}
  .lg\:px-8{padding-left:2rem;padding-right:2rem}
  .lg\:p-12{padding:3rem}
  .lg\:text-5xl{font-size:2.75rem;line-height:1.1}
  .lg\:text-6xl{font-size:3.25rem;line-height:1.06}
  .lg\:text-4xl{font-size:2.25rem;line-height:1.15}
  .lg\:text-xl{font-size:1.25rem;line-height:1.5}
  .lg\:sticky{position:sticky}
  .lg\:col-span-2{grid-column:span 2/span 2}
  .lg\:col-span-3{grid-column:span 3/span 3}
  .lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .lg\:order-1{order:1}.lg\:order-2{order:2}.lg\:order-first{order:-1}
  .lg\:text-7xl{font-size:4rem;line-height:1.02}
  .lg\:text-2xl{font-size:1.5rem;line-height:1.35}
  .lg\:pt-28{padding-top:7rem}.lg\:pb-28{padding-bottom:7rem}
  .lg\:text-3xl{font-size:1.875rem;line-height:1.22}
}

/* ============================================================= xl 1280px */
@media (min-width:1280px){
  .xl\:text-6xl{font-size:3.5rem;line-height:1.05}
  .xl\:gap-20{gap:5rem}
  .container-x{padding-inline:2rem}
}

} /* end @layer utilities */
