/* ============================================================================
   LawCrawl marketing, Eyrie profile (petrol ground + brass accent).
   Supersedes Ink & Cobalt (2026-09-02 decision). Same token values as the
   portal's user-frontend/src/styles.css; fonts self-hosted (latin subsets),
   no Google Fonts request. font-display: swap.
   ========================================================================== */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('/public/fonts/Newsreader-var.latin.woff2') format('woff2-variations');
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url('/public/fonts/Newsreader-var.latin-italic.woff2') format('woff2-variations');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/public/fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/public/fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/public/fonts/ibm-plex-sans-latin-600-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/public/fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/public/fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2');
}

/* Motion tokens: ONE curve for the whole site (--ease, the Eyrie DNA),
   referenced everywhere below so nothing drifts back to `ease` or a
   Tailwind default. `interpolate-size` lets block-size animate to/from
   `auto` (details accordions) in browsers that support it. */
:root {
  --ease: cubic-bezier(.22, .61, .36, 1);
  interpolate-size: allow-keywords;
}

/* Editorial serif on headings (the Eyrie signature); body stays Plex Sans.
   Utility `font-display` exists in the Tailwind build for one-off uses. */
h1, h2, h3, .font-display {
  font-family: 'Newsreader', Georgia, 'Times New Roman', serif;
  letter-spacing: -0.01em;
}

/* Petrol ground with the Eyrie radial glows (brass top-right, teal top-left).
   bg-navy (Tailwind) still paints the base color underneath. */
body {
  background-image:
    radial-gradient(1100px 560px at 82% -8%, rgba(200, 162, 76, 0.10), transparent 60%),
    radial-gradient(900px 520px at 4% 0%, rgba(95, 168, 160, 0.08), transparent 55%);
  color-scheme: dark;
}

::selection { background: rgba(200, 162, 76, 0.35); }

/* Primary CTA: the Eyrie brass gradient (eyrie .btn.primary). Warm dark ink
   on brass, never white text on brass (fails contrast both ways). */
.btn-brass {
  background-image: linear-gradient(180deg, #DCB867, #C8A24C);
  color: #1A1206;
}
.btn-brass:hover { filter: brightness(1.06); }
.btn-brass:active { transform: translateY(1px); }
.btn-brass { transition: filter .15s var(--ease), transform .12s var(--ease); }

/* ---- Navbar: the Eyrie motion DNA -------------------------------------
   (the --ease curve, soft tint hovers, accent-bar active,
   staggered drawer reveal, ported from the old eyrie frontend). */
#siteHeader {
  transition: background-color .3s var(--ease),
              box-shadow .3s var(--ease);
}
#siteHeader.scrolled {
  background-color: rgba(11, 35, 39, .88);
  box-shadow: 0 1px 0 rgba(236,231,219,.10), 0 12px 32px -20px rgba(0,0,0,.65);
}

/* Nav links: brass on hover with an underline that grows from the left;
   the scrollspy keeps the current section's link lit (script.js). */
.nav-link { position: relative; transition: color .15s var(--ease); }
.nav-link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1.5px;
  border-radius: 2px;
  background: linear-gradient(90deg, #DCB867, #C8A24C);
  transform: scaleX(0); transform-origin: left;
  transition: transform .22s var(--ease);
}
.nav-link:hover { color: #DCB867; }
.nav-link:hover::after, .nav-link.nav-active::after { transform: scaleX(1); }
.nav-link.nav-active { color: #DCB867; }

/* Mobile menu: grid-rows drawer + staggered item reveal + burger→X morph
   (replaces the old binary `hidden` toggle; same ids/semantics). */
#mobileMenu {
  display: grid; grid-template-rows: 0fr; visibility: hidden;
  border-top: 1px solid transparent;
  transition: grid-template-rows .32s var(--ease),
              visibility .32s, border-color .32s var(--ease);
}
/* The nav is the 0fr-collapsed grid item: its padding must live in the open
   state (and transition), or 24px of invisible padding pads the CLOSED header
   at every viewport, the ID rule also outranks Tailwind's md:hidden. */
#mobileMenu > nav { overflow: hidden; min-height: 0; width: 100%;
  padding-top: 0; padding-bottom: 0;
  transition: padding .32s var(--ease); }
#mobileMenu.mm-open > nav { padding-top: .75rem; padding-bottom: .75rem; }
#mobileMenu.mm-open {
  grid-template-rows: 1fr; visibility: visible;
  border-top-color: rgba(236,231,219,.10);
}
#mobileMenu nav > * {
  opacity: 0; transform: translateY(-5px);
  transition: opacity .26s var(--ease), transform .26s var(--ease);
}
#mobileMenu.mm-open nav > * { opacity: 1; transform: none; }
#mobileMenu.mm-open nav > *:nth-child(1) { transition-delay: .03s; }
#mobileMenu.mm-open nav > *:nth-child(2) { transition-delay: .06s; }
#mobileMenu.mm-open nav > *:nth-child(3) { transition-delay: .09s; }
#mobileMenu.mm-open nav > *:nth-child(4) { transition-delay: .12s; }
#mobileMenu.mm-open nav > *:nth-child(5) { transition-delay: .15s; }
#mobileMenu.mm-open nav > *:nth-child(6) { transition-delay: .18s; }
#mobileMenu.mm-open nav > *:nth-child(7) { transition-delay: .21s; }
#mobileMenu.mm-open nav > *:nth-child(8) { transition-delay: .24s; }
#mobileMenu.mm-open nav > *:nth-child(9) { transition-delay: .27s; }
#mobileMenu.mm-open nav > *:nth-child(10) { transition-delay: .30s; }
#menuBtn svg path {
  transform-box: fill-box; transform-origin: center;
  transition: transform .28s var(--ease), opacity .18s;
}
#menuBtn[aria-expanded="true"] svg path:nth-child(1) { transform: translateY(6px) rotate(45deg); }
#menuBtn[aria-expanded="true"] svg path:nth-child(2) { opacity: 0; }
#menuBtn[aria-expanded="true"] svg path:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Anchor-tap instant close (script.js adds .no-anim): the .32s grid-rows
   collapse races the smooth scroll and lands every target ~274px short.
   Burger and Escape closes stay animated. */
#mobileMenu.no-anim, #mobileMenu.no-anim > nav, #mobileMenu.no-anim nav > * {
  transition: none !important;
}
/* The item stagger delays transforms by up to .30s, which reads as a dead
   tap. Zero the delay on :active so drawer press feedback is immediate
   ((1,2,2) here outranks the (1,2,1) stagger rules above). */
#mobileMenu.mm-open nav > a:active {
  transition: transform .12s var(--ease);
  transition-delay: 0s;
}
/* Drawer links get taller tap targets, and the drawer itself scrolls if the
   open menu would exceed a small viewport (SE phones). */
#mobileMenu nav > a { padding-top: .25rem; padding-bottom: .25rem; }
#mobileMenu { max-height: calc(100vh - 3.5rem); overflow-y: auto; }

/* Keyboard focus: a ring that survives the petrol ground. The UA default
   ring is near-black and invisible here; brass follows the accent system.
   :where() keeps specificity at zero so utility classes still win. */
:where(a, button, summary, [tabindex]):focus-visible {
  outline: 2px solid #DCB867;
  outline-offset: 2px;
}
/* Skip links render on a brass chip when focused, the brass ring above is
   invisible there, so they take the dark ink instead. */
.skip-link:focus-visible { outline-color: #1A1206; }

/* Smooth scrolling ONLY for visitors who keep motion, the accessibility
   page promises reduced-motion is respected, and the bare html class
   didn't. Anchored headings land below the sticky header. */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
[id] { scroll-margin-top: 5rem; }

/* Package/blog cards carry Tailwind's `.transition`, re-point the curve to
   the site token so there is ONE easing family (Tailwind's default
   cubic-bezier(0.4,0,0.2,1) is a second one). Specificity (0,1,1) wins. */
a.transition { transition-timing-function: var(--ease); }

/* Press feedback on every control (was only on .btn-brass). Applies to
   flex/grid/block links; bare inline links ignore transforms, so text
   links are unaffected. */
a:active, button:active, summary:active { transform: translateY(1px); }
@media (hover: none) and (pointer: coarse) {
  a:active { transition: transform .12s var(--ease); }
}

/* Bare inline links (body copy) get the brand color fade on hover, most had
   no motion at all. .nav-link, .btn-brass, drawer links and post-body links
   override this with their own more specific rules. */
a { transition: color .15s var(--ease); }

/* Header dropdowns (More / language): one trigger, one panel, plain CSS
   so every page can carry the same inline block. */
.dd { position: relative; }
.dd-menu {
  position: absolute; top: calc(100% + .5rem); right: 0; z-index: 50;
  min-width: 10.5rem; padding: .375rem;
  background: #0D292E; border: 1px solid rgba(236,231,219,.14);
  border-radius: .75rem; box-shadow: 0 14px 34px rgba(0,0,0,.45);
}
.dd-menu[hidden] { display: none; }
.dd-item {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  width: 100%; padding: .5rem .625rem; border-radius: .5rem;
  font-size: .8125rem; color: rgba(236,231,219,.85); text-align: left;
  transition: background .15s var(--ease), color .15s var(--ease);
}
.dd-item:hover { background: rgba(236,231,219,.08); color: #ECE7DB; }
.dd-item[aria-pressed="true"] { color: #DCB867; }
.dd-chev { transition: transform .18s var(--ease); }
.dd-trigger[aria-expanded="true"] .dd-chev { transform: rotate(180deg); }
.lang-check { visibility: hidden; }
.lang-item[aria-pressed="true"] .lang-check { visibility: visible; }


/* Touch targets (WCAG 2.5.5): expand the hit area invisibly, tw.css has no
   py-1.5/py-2.5 utilities, so hit-area padding must live here. */
.lang-btn, #menuBtn, footer nav a { position: relative; }
.lang-btn::after { content: ""; position: absolute; inset: -10px; }
#menuBtn::after { content: ""; position: absolute; inset: -4px; }
footer nav a::after { content: ""; position: absolute; inset: -8px -2px; }

/* Tailwind's transition utilities hardcode their own curves on ~170 surfaces
   (cards, links, badges). Pages load styles.css BEFORE tw.css, so a
   single-class rule would lose the source-order fight, doubling the class
   wins on specificity instead: (0,2,0) beats any single utility regardless
   of order. */
.transition.transition,
.transition-colors.transition-colors,
.transition-all.transition-all {
  transition-timing-function: var(--ease);
}

/* Card grammar (kicker round): one anatomy for card grids, mono kicker,
   title, body, action. .pkg cards answer hover with border + brass title +
   arrow nudge (title/arrow need rules because tw.css has no group-hover). */
.card-kicker {
  display: block;
  margin-bottom: .55rem;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #7FBEB6; /* ice */
}
.pkg h3 { transition: color .15s var(--ease); }
.pkg:hover h3 { color: #DCB867; } /* brand-strong */
.pkg .pkg-arrow { display: inline-block; transition: transform .15s var(--ease); }
.pkg:hover .pkg-arrow { transform: translateX(4px); }

/* Hero alarm mock (proof-led hero): the alert artifact, in Eyrie skin. */
.alarm-mock {
  background: linear-gradient(170deg, #123A40, #0F2E33);
  border: 1px solid hsla(42, 31%, 89%, .16);
  border-radius: 16px;
  padding: 22px 24px;
  box-shadow: 0 24px 60px -24px rgba(200, 162, 76, .28);
}
.alarm-top {
  display: flex; align-items: center; gap: 10px;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 12px; letter-spacing: .12em; text-transform: uppercase;
  color: hsla(42, 31%, 89%, .6);
  margin-bottom: 14px;
}
.alarm-top .chip {
  margin-left: auto;
  color: #DCB867;
  border: 1px solid rgba(200, 162, 76, .4);
  border-radius: 999px;
  padding: 2px 10px;
}
.pulse {
  width: 8px; height: 8px; border-radius: 50%;
  background: #C8A24C; position: relative; flex: none;
}
.pulse::after {
  content: ""; position: absolute; inset: -4px;
  border-radius: 50%; border: 1px solid #C8A24C;
}
@media (prefers-reduced-motion: no-preference) {
  .pulse::after { animation: heroPulse 2.4s var(--ease) infinite; }
}
@keyframes heroPulse {
  0% { transform: scale(.5); opacity: .9; }
  80%, 100% { transform: scale(1.4); opacity: 0; }
}

/* C1 hero entrance: a pure-CSS stagger, it plays on first paint with no JS
   involved, and `both` fill-mode holds the pre-state through each delay, so
   there is no flash for no-JS visitors either. Living inside the
   no-preference query means reduce users simply get the static hero. */
@media (prefers-reduced-motion: no-preference) {
  .hero-in { animation: heroIn .7s var(--ease) both; }
  .hero-in.d1 { animation-name: heroInSlide; animation-delay: .06s; }
  .hero-in.d2 { animation-delay: .14s; }
  .hero-in.d3 { animation-delay: .22s; }
  .hero-in.d4 { animation-delay: .32s; }
  .hero-in.d5 { animation-delay: .55s; }
}
@keyframes heroInSlide { from { transform: translateY(12px); } to { transform: none; }
}
@keyframes heroIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: none; }
}
.alarm-ref {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 13px; color: #7FBEB6; margin-bottom: 6px;
}
.alarm-title { font-weight: 600; font-size: 18px; letter-spacing: -.01em; margin-bottom: 8px; }
.alarm-body { font-size: 14.5px; color: hsla(42, 31%, 89%, .75); line-height: 1.6; margin: 0; }
.alarm-meta {
  display: flex; gap: 18px; flex-wrap: wrap;
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid hsla(42, 31%, 89%, .1);
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 12.5px; color: hsla(42, 31%, 89%, .6);
}
.alarm-meta b { color: #ECE7DB; font-weight: 400; }

@media (prefers-reduced-motion: reduce) {
  #siteHeader, .nav-link, .nav-link::after, #mobileMenu, #mobileMenu > nav,
  #mobileMenu nav > *, #menuBtn svg path, .btn-brass, summary svg,
  .faq-item summary::after, details::details-content { transition: none !important; }
  #mobileMenu nav > * { transform: none; }
  html { scroll-behavior: auto; }
  /* .btn-brass:active (0,2,0) outranks a:active (0,1,1), so it needs its
     own suppression or the 1px press survives reduce. */
  a:active, button:active, summary:active, .btn-brass:active { transform: none; }
}

/* interactive dotted background */
.grid-bg { position: relative; }
#waves { position:absolute; inset:0; display:block; pointer-events:none; z-index:0; }

/* FAQ arrow fix (unified onto the --ease curve) */
summary svg { transition: transform .2s var(--ease); }
details[open] summary svg { transform: rotate(180deg); }

/* Accordion open/close: animate the details content itself, same grid-rows
   feel the mobile drawer uses, ported to every <details> on the site
   (homepage FAQ, blog FAQs, laglista law-list groups). ::details-content +
   interpolate-size (on :root) animates height to/from auto where supported;
   elsewhere the toggle stays instant and fully functional. */
details::details-content {
  block-size: 0;
  overflow: hidden;
  transition: block-size .3s var(--ease), content-visibility .3s allow-discrete;
}
details[open]::details-content { block-size: auto; }

/* Narrower FAQ body text */
#faq details > p { max-width: 80%; }
@media (max-width: 640px){ #faq details > p { max-width: 100%; } }

/* ---- Blog article prose (pages built by build_blog.py) ---- */
.post-body p { margin-top: 1rem; line-height: 1.75; color: rgba(236, 231, 219, 0.85); }
.post-body p:first-of-type { margin-top: 1.5rem; }
.post-body a { color: #C8A24C; text-decoration: underline; text-decoration-color: rgba(200, 162, 76, 0.4); text-underline-offset: 3px; }
.post-body a:hover { color: #7FBEB6; text-decoration-color: rgba(127, 190, 182, 0.5); }
.post-body code { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace; font-size: 0.88em; background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(236, 231, 219, 0.12); border-radius: 0.375rem; padding: 0.08em 0.4em; }
.post-list { margin-top: 1rem; padding-left: 1.4rem; list-style: disc; }
.post-list li { margin-top: 0.5rem; line-height: 1.7; color: rgba(236, 231, 219, 0.85); }
.post-list li::marker { color: #C8A24C; }
.table-wrap { overflow-x: auto; }
.post-body table { border-collapse: collapse; margin-top: 0.5rem; min-width: 100%; }
.post-body th { text-align: left; font-weight: 600; color: #ECE7DB; border-bottom: 1px solid rgba(236, 231, 219, 0.25); padding: 0.5rem 0.75rem; white-space: nowrap; }
.post-body td { border-bottom: 1px solid rgba(236, 231, 219, 0.1); padding: 0.5rem 0.75rem; color: rgba(236, 231, 219, 0.85); vertical-align: top; }

/* FAQ accordion items on blog posts */
.faq-item summary { list-style: none; cursor: pointer; position: relative; padding-right: 1.75rem; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: ""; position: absolute; right: 0.4rem; top: 50%; width: 0.5rem; height: 0.5rem; border-right: 2px solid rgba(236, 231, 219, 0.6); border-bottom: 2px solid rgba(236, 231, 219, 0.6); transform: translateY(-70%) rotate(45deg); transition: transform 0.2s var(--ease); }
.faq-item[open] summary::after { transform: translateY(-20%) rotate(225deg); }

/* ---- Mobile de-bloat (2026-09-17) ------------------------------------
   The page ran ~18 600px tall on a 390px phone (≈22 screens); three
   sections (packages, law lists, pricing) were 11 000px of it, and the
   48px display headings read as zoom. This block compacts spacing,
   rescales the display type and collapses the law-list showcase to a
   two-column chip list on phones. Desktop (>=641px) is untouched.
   Selectors are prefixed with `body` (or an id) so they outrank the
   Tailwind utilities in tw.css regardless of stylesheet order. ---- */
@media (max-width: 640px) {
  /* Display type: 48/36px at 390px wide is poster type, rescale to the
     usual phone sizes. */
  body .text-5xl { font-size: 1.875rem; line-height: 1.15; }
  body .text-6xl { font-size: 2.125rem; line-height: 1.12; }
  body .text-4xl { font-size: 1.5rem; line-height: 1.22; }
  body .text-3xl { font-size: 1.375rem; line-height: 1.25; }
  body .text-2xl { font-size: 1.25rem; line-height: 1.3; }

  /* Section rhythm: 80px top/bottom padding on 22 sections is most of
     the scroll. */
  body .py-20 { padding-top: 2.75rem; padding-bottom: 2.75rem; }

  /* Hero: no full-screen opener on a phone. */
  body #top { min-height: 0; }
  body #top .z-10 { padding-top: 2.5rem; padding-bottom: 2.75rem; }
  body #top .alarm-mock { margin-top: 2rem; }

  /* Cards everywhere: 24-32px card padding -> ~17px on a 390px screen. */
  body #packages .pkg,
  body #how .rounded-2xl,
  body #nordics .rounded-2xl,
  body #security .rounded-2xl,
  body #pricing .rounded-2xl,
  body #contact .rounded-2xl { padding: 1.05rem; }
  body #packages .grid,
  body #how .grid,
  body #security .grid,
  body #pricing .grid { gap: 0.7rem; }
  body #packages .mt-12 { margin-top: 1.75rem; }

  /* Package card blurbs: keep the pitch, cap it at three lines so a card
     stays scannable. */
  body #packages .pkg p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }

  /* Pricing: the market-context block sits mt-20 (80px) below the cards
     and reads as a separate page on a phone. */
  body #pricing .mt-20 { margin-top: 2.5rem; }

  /* FAQ rows: 24px cell padding -> 16px (summary keeps its negative-
     margin hit-area trick consistent with the details padding). */
  body #faq details { padding: 1rem; }
  body #faq details > summary { margin: -1rem; padding: 1rem; }

  /* Footer navs: two stacked single-column lists -> wrapping rows. */
  body footer div.pt-12 { padding-top: 2.25rem; }
  body footer nav.flex-col { flex-direction: row; flex-wrap: wrap; gap: 0.35rem 1.1rem; }
}

/* Contact form (F37): white fields on the petrol ground carry their own
   affordance, but the UA focus ring is near-black and invisible here
   (same finding as the :where focus rule), paint brass. Typed text must
   be dark on the white field; the page's light ink would vanish. */
#contact-form input, #contact-form textarea { color: #1A1206; }
#contact-form input:focus-visible, #contact-form textarea:focus-visible {
  outline: 2px solid #DCB867; outline-offset: 2px;
}
#contact-form button:disabled { opacity: 0.6; cursor: default; }

*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:IBM Plex Sans,ui-sans-serif,system-ui;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:IBM Plex Mono,ui-monospace,Menlo,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display: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-width:0}.pointer-events-none{pointer-events:none}.\!visible{visibility:visible!important}.visible{visibility:visible}.invisible{visibility:hidden}.collapse{visibility:collapse}.static{position:static}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-x-0{left:0;right:0}.bottom-0{bottom:0}.top-0{top:0}.z-10{z-index:10}.z-40{z-index:40}.-m-6{margin:-1.5rem}.mx-auto{margin-left:auto;margin-right:auto}.mb-10{margin-bottom:2.5rem}.mb-8{margin-bottom:2rem}.ml-2{margin-left:.5rem}.mr-1{margin-right:.25rem}.mt-1{margin-top:.25rem}.mt-1\.5{margin-top:.375rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-2{margin-top:.5rem}.mt-20{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}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-10{height:2.5rem}.h-14{height:3.5rem}.h-2{height:.5rem}.h-2\.5{height:.625rem}.h-24{height:6rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-\[18px\]{height:18px}.min-h-screen{min-height:100vh}.w-2{width:.5rem}.w-2\.5{width:.625rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-\[18px\]{width:18px}.w-auto{width:auto}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.w-px{width:1px}.min-w-0{min-width:0}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-5xl{max-width:64rem}.max-w-7xl{max-width:80rem}.max-w-lg{max-width:32rem}.max-w-md{max-width:28rem}.max-w-xl{max-width:36rem}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.grow{flex-grow:1}.border-collapse{border-collapse:collapse}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize{resize:both}.list-disc{list-style-type:disc}.list-none{list-style-type:none}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-baseline{align-items:baseline}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-3\.5{gap:.875rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-\[2px\]{gap:2px}.gap-x-10{-moz-column-gap:2.5rem;column-gap:2.5rem}.gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.gap-y-1{row-gap:.25rem}.gap-y-6{row-gap:1.5rem}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem*var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px*var(--tw-divide-y-reverse))}.divide-ink>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(236 231 219/var(--tw-divide-opacity,1))}.divide-ink\/10>:not([hidden])~:not([hidden]){border-color:hsla(42,31%,89%,.1)}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-r-xl{border-top-right-radius:.75rem;border-bottom-right-radius:.75rem}.border{border-width:1px}.border-y{border-top-width:1px}.border-b,.border-y{border-bottom-width:1px}.border-l-2{border-left-width:2px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-brand{--tw-border-opacity:1;border-color:rgb(200 162 76/var(--tw-border-opacity,1))}.border-brand\/30{border-color:rgba(200,162,76,.3)}.border-ink{--tw-border-opacity:1;border-color:rgb(236 231 219/var(--tw-border-opacity,1))}.border-ink\/10{border-color:hsla(42,31%,89%,.1)}.border-ink\/15{border-color:hsla(42,31%,89%,.15)}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.bg-\[\#2F8477\]{--tw-bg-opacity:1;background-color:rgb(47 132 119/var(--tw-bg-opacity,1))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-black\/20{background-color:rgba(0,0,0,.2)}.bg-black\/30{background-color:rgba(0,0,0,.3)}.bg-brand{--tw-bg-opacity:1;background-color:rgb(200 162 76/var(--tw-bg-opacity,1))}.bg-brand\/10{background-color:rgba(200,162,76,.1)}.bg-ink{--tw-bg-opacity:1;background-color:rgb(236 231 219/var(--tw-bg-opacity,1))}.bg-ink\/15{background-color:hsla(42,31%,89%,.15)}.bg-ink\/5{background-color:hsla(42,31%,89%,.05)}.bg-navy{--tw-bg-opacity:1;background-color:rgb(11 35 39/var(--tw-bg-opacity,1))}.bg-navy\/90{background-color:rgba(11,35,39,.9)}.bg-panel{--tw-bg-opacity:1;background-color:rgb(15 46 51/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.to-navy,.to-navy\/100{--tw-gradient-to:#0b2327 var(--tw-gradient-to-position)}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.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}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.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-2{padding-top:.5rem;padding-bottom:.5rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-24{padding-top:6rem;padding-bottom:6rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.pb-10{padding-bottom:2.5rem}.pb-24{padding-bottom:6rem}.pb-4{padding-bottom:1rem}.pb-8{padding-bottom:2rem}.pl-5{padding-left:1.25rem}.pt-12{padding-top:3rem}.pt-16{padding-top:4rem}.pt-20{padding-top:5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-display{font-family:Newsreader,Georgia,Times New Roman,serif}.font-mono{font-family:IBM Plex Mono,ui-monospace,Menlo,monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-6xl{font-size:3.75rem;line-height:1}.text-\[11px\]{font-size:11px}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.leading-\[1\.05\]{line-height:1.05}.leading-relaxed{line-height:1.625}.leading-snug{line-height:1.375}.leading-tight{line-height:1.25}.tracking-\[0\.12em\]{letter-spacing:.12em}.tracking-\[0\.14em\]{letter-spacing:.14em}.tracking-\[0\.18em\]{letter-spacing:.18em}.tracking-tight{letter-spacing:-.025em}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.text-brand{--tw-text-opacity:1;color:rgb(200 162 76/var(--tw-text-opacity,1))}.text-brand-strong{--tw-text-opacity:1;color:rgb(220 184 103/var(--tw-text-opacity,1))}.text-emerald-400{--tw-text-opacity:1;color:rgb(52 211 153/var(--tw-text-opacity,1))}.text-ice{--tw-text-opacity:1;color:rgb(127 190 182/var(--tw-text-opacity,1))}.text-ink{--tw-text-opacity:1;color:rgb(236 231 219/var(--tw-text-opacity,1))}.text-ink\/50{color:hsla(42,31%,89%,.5)}.text-ink\/60{color:hsla(42,31%,89%,.6)}.text-ink\/70{color:hsla(42,31%,89%,.7)}.text-ink\/75{color:hsla(42,31%,89%,.75)}.text-ink\/80{color:hsla(42,31%,89%,.8)}.text-ink\/85{color:hsla(42,31%,89%,.85)}.text-ink\/90{color:hsla(42,31%,89%,.9)}.text-red-400{--tw-text-opacity:1;color:rgb(248 113 113/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.underline-offset-2{text-underline-offset:2px}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shadow-soft{--tw-shadow:0 10px 30px rgba(0,0,0,.45);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline{outline-style:solid}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring,.ring-1{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring-inset{--tw-ring-inset:inset}.ring-brand{--tw-ring-opacity:1;--tw-ring-color:rgb(200 162 76/var(--tw-ring-opacity,1))}.ring-brand\/20{--tw-ring-color:rgba(200,162,76,.2)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur{--tw-backdrop-blur:blur(8px)}.backdrop-blur,.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.\[idx\:idx\]{idx:idx}.selection\:bg-brand\/30 ::-moz-selection{background-color:rgba(200,162,76,.3)}.selection\:bg-brand\/30 ::selection{background-color:rgba(200,162,76,.3)}.selection\:bg-brand\/30::-moz-selection{background-color:rgba(200,162,76,.3)}.selection\:bg-brand\/30::selection{background-color:rgba(200,162,76,.3)}.hover\:border-brand\/60:hover{border-color:rgba(200,162,76,.6)}.hover\:bg-brand\/10:hover{background-color:rgba(200,162,76,.1)}.hover\:bg-ink\/10:hover{background-color:hsla(42,31%,89%,.1)}.hover\:bg-ink\/5:hover{background-color:hsla(42,31%,89%,.05)}.hover\:text-ice:hover{--tw-text-opacity:1;color:rgb(127 190 182/var(--tw-text-opacity,1))}.hover\:text-icelight:hover{--tw-text-opacity:1;color:rgb(168 205 200/var(--tw-text-opacity,1))}.hover\:underline:hover{text-decoration-line:underline}.focus\:not-sr-only:focus{position:static;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip:auto;white-space:normal}.focus\:fixed:focus{position:fixed}.focus\:left-2:focus{left:.5rem}.focus\:top-2:focus{top:.5rem}.focus\:z-50:focus{z-index:50}.focus\:rounded:focus{border-radius:.25rem}.focus\:bg-brand:focus{--tw-bg-opacity:1;background-color:rgb(200 162 76/var(--tw-bg-opacity,1))}.focus\:px-3:focus{padding-left:.75rem;padding-right:.75rem}.focus\:py-2:focus{padding-top:.5rem;padding-bottom:.5rem}.focus\:text-inkdark:focus{--tw-text-opacity:1;color:rgb(26 18 6/var(--tw-text-opacity,1))}.group[open] .group-open\:rotate-180{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@supports ((-webkit-backdrop-filter:var(--tw )) or (backdrop-filter:var(--tw ))){.supports-\[backdrop-filter\]\:bg-navy\/70{background-color:rgba(11,35,39,.7)}}@media (min-width:640px){.sm\:inline{display:inline}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:p-10{padding:2.5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-5xl{font-size:3rem;line-height:1}.sm\:text-6xl{font-size:3.75rem;line-height:1}}@media (min-width:768px){.md\:col-span-3{grid-column:span 3/span 3}.md\:col-span-4{grid-column:span 4/span 4}.md\:col-span-5{grid-column:span 5/span 5}.md\:flex{display:flex}.md\:hidden{display:none}.md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:ml-auto{margin-left:auto}.lg\:mr-0{margin-right:0}.lg\:mt-0{margin-top:0}.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\:items-center{align-items:center}.lg\:gap-28{gap:7rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:text-\[68px\]{font-size:68px}}@media (min-width:1280px){.xl\:gap-36{gap:9rem}}