/* AssignPro modern production shell
   Shared by each route as it moves off the legacy styles.css contract. */
:root {
  --ap-navy: #1e3a5f;
  --ap-navy-deep: #0d1c2e;
  --ap-navy-soft: #31557e;
  --ap-gold: #b8772f;
  --ap-gold-bright: #dda85f;
  --ap-paper: #f6f2e9;
  --ap-paper-deep: #ece4d7;
  --ap-white: #fffdfa;
  --ap-ink: #172033;
  --ap-muted: #667085;
  --ap-line: rgba(30, 58, 95, .16);
  --ap-dark-line: rgba(255, 255, 255, .13);
  --ap-heading: "Fraunces", Georgia, serif;
  --ap-body: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ap-ease: cubic-bezier(.22, 1, .36, 1);
  --ap-shell: 1280px;
  --ap-shadow: 0 22px 60px rgba(13, 28, 46, .13);
}

*, *::before, *::after { box-sizing: border-box; }
html { max-width: 100%; scroll-behavior: smooth; scroll-padding-top: 92px; overflow-x: clip; }
body.ap-page { max-width: 100%; margin: 0; overflow-x: clip; background: var(--ap-paper); color: var(--ap-ink); font-family: var(--ap-body); line-height: 1.65; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body.ap-menu-open { overflow: hidden; }
body.ap-page::before { content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none; background-image: linear-gradient(rgba(30,58,95,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(30,58,95,.035) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(to bottom, #000, transparent 88%); }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
::selection { background: var(--ap-gold); color: #fff; }
:focus-visible { outline: 3px solid var(--ap-gold-bright); outline-offset: 4px; }

.ap-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
.ap-skip-link { position: fixed; left: 16px; top: 12px; z-index: 1000; transform: translateY(-180%); padding: 10px 16px; border-radius: 4px; background: var(--ap-navy); color: #fff; text-decoration: none; transition: transform .2s ease; }
.ap-skip-link:focus { transform: translateY(0); }

.ap-progress { position: fixed; inset: 0 0 auto; z-index: 130; height: 3px; pointer-events: none; background: rgba(184,119,47,.11); }
.ap-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--ap-gold), var(--ap-gold-bright)); box-shadow: 0 0 16px rgba(221,168,95,.42); transform: scaleX(0); transform-origin: left; will-change: transform; }

.ap-header { position: fixed; inset: 0 0 auto; z-index: 120; height: 78px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; padding: 0 clamp(20px,4vw,64px); color: var(--ap-navy); border-bottom: 1px solid transparent; transition: height .35s var(--ap-ease), color .3s ease, background .3s ease, border-color .3s ease, box-shadow .3s ease, backdrop-filter .3s ease; }
.ap-header.is-scrolled { height: 66px; color: var(--ap-navy); background: rgba(246,242,233,.92); border-color: rgba(30,58,95,.11); box-shadow: 0 10px 34px rgba(13,28,46,.07); backdrop-filter: blur(18px) saturate(120%); }
.ap-page--dark-intro .ap-header:not(.is-scrolled) { color: var(--ap-white); }

.ap-brand { justify-self: start; display: inline-flex; align-items: center; gap: 10px; min-width: max-content; color: inherit; text-decoration: none; }
.ap-brand-mark { width: 36px; height: 36px; fill: currentColor; transition: transform .35s var(--ap-ease); }
.ap-brand:hover .ap-brand-mark { transform: rotate(-3deg) scale(1.035); }
.ap-brand-mark-accent { fill: var(--ap-gold); }
.ap-brand-name { font: 600 1.35rem/1 var(--ap-heading); letter-spacing: -.035em; }
.ap-brand-name span { color: var(--ap-gold-bright); }

.ap-nav { display: flex; align-items: center; gap: clamp(18px,2.4vw,32px); }
.ap-nav a { position: relative; color: currentColor; font-size: .72rem; font-weight: 700; letter-spacing: .11em; text-decoration: none; text-transform: uppercase; opacity: .78; transition: opacity .2s ease; }
.ap-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: var(--ap-gold-bright); transition: right .28s var(--ap-ease); }
.ap-nav a:hover, .ap-nav a[aria-current="page"] { opacity: 1; }
.ap-nav a:hover::after, .ap-nav a[aria-current="page"]::after { right: 0; }

.ap-header-cta { justify-self: end; display: inline-flex; align-items: center; gap: 11px; min-height: 44px; padding: 0 18px; border: 1px solid var(--ap-navy); border-radius: 4px; background: var(--ap-navy); color: #fff; font-size: .8rem; font-weight: 750; text-decoration: none; transition: transform .25s var(--ap-ease), background .25s ease, color .25s ease, border-color .25s ease; }
.ap-page--dark-intro .ap-header:not(.is-scrolled) .ap-header-cta { border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.08); color: #fff; }
.ap-header-cta:hover { transform: translateY(-2px); border-color: var(--ap-gold); background: var(--ap-gold); color: #fff; }
.ap-header-cta svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }

.ap-menu-toggle { position: relative; justify-self: end; display: none; width: 46px; height: 46px; padding: 0; border: 1px solid var(--ap-line); border-radius: 4px; background: rgba(255,255,255,.64); cursor: pointer; place-items: center; }
.ap-menu-toggle span { position: absolute; width: 18px; height: 1px; background: var(--ap-navy); transition: transform .25s var(--ap-ease); }
.ap-menu-toggle span:first-child { transform: translateY(-4px); }
.ap-menu-toggle span:last-child { transform: translateY(4px); }
.ap-menu-toggle[aria-expanded="true"] span:first-child { transform: rotate(45deg); }
.ap-menu-toggle[aria-expanded="true"] span:last-child { transform: rotate(-45deg); }

.ap-mobile-menu { position: fixed; inset: 0; z-index: 110; display: grid; grid-template-rows: 1fr auto; padding: 116px 24px 34px; background: var(--ap-paper); visibility: hidden; opacity: 0; transform: translateY(-12px); transition: opacity .3s ease, transform .45s var(--ap-ease), visibility 0s .45s; }
.ap-mobile-menu.is-open { visibility: visible; opacity: 1; transform: translateY(0); transition-delay: 0s; }
.ap-mobile-menu nav { display: flex; flex-direction: column; justify-content: center; }
.ap-mobile-menu nav a { display: grid; grid-template-columns: 44px minmax(0,1fr); align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--ap-line); color: var(--ap-navy); font: 500 clamp(2rem,10vw,3.2rem)/1.08 var(--ap-heading); text-decoration: none; }
.ap-mobile-menu nav span { color: var(--ap-gold); font: 700 .66rem/1 var(--ap-body); letter-spacing: .14em; }
.ap-mobile-cta { display: grid; place-items: center; min-height: 54px; border-radius: 4px; background: var(--ap-navy); color: #fff; font-weight: 750; text-decoration: none; }

.ap-shell { width: min(calc(100% - 48px), var(--ap-shell)); margin-inline: auto; }
.ap-kicker { display: inline-flex; align-items: center; gap: 10px; margin: 0; color: var(--ap-gold); font-size: .68rem; font-weight: 750; letter-spacing: .17em; text-transform: uppercase; }
.ap-kicker::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.ap-display { margin: 0; color: var(--ap-navy); font: 600 clamp(3.1rem,7.2vw,7.6rem)/.92 var(--ap-heading); letter-spacing: -.065em; text-wrap: balance; }
.ap-display em { color: var(--ap-gold); font-weight: 500; }
.ap-lede { max-width: 58ch; margin: 0; color: var(--ap-muted); font-size: clamp(1rem,1.4vw,1.16rem); line-height: 1.8; }

.ap-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 50px; padding: 0 21px; border: 1px solid var(--ap-navy); border-radius: 4px; background: var(--ap-navy); color: #fff; font-size: .86rem; font-weight: 750; text-decoration: none; transition: transform .25s var(--ap-ease), background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease; }
.ap-button:hover { transform: translateY(-2px); border-color: var(--ap-gold); background: var(--ap-gold); box-shadow: 0 14px 34px rgba(184,119,47,.23); }
.ap-button--ghost { background: transparent; color: var(--ap-navy); }
.ap-button--ghost:hover { color: #fff; }
.ap-button--light { border-color: rgba(255,255,255,.65); background: #fff; color: var(--ap-navy-deep); }
.ap-button--light:hover { border-color: var(--ap-gold-bright); background: var(--ap-gold-bright); color: var(--ap-navy-deep); }
.ap-arrow { transition: transform .25s var(--ap-ease); }
a:hover > .ap-arrow, .ap-button:hover .ap-arrow { transform: translate(3px,-3px); }

.ap-footer { position: relative; overflow: hidden; padding: 78px clamp(24px,5vw,72px) 28px; background: var(--ap-navy-deep); color: #fff; border-top: 1px solid rgba(221,168,95,.2); }
.ap-footer::before { content: "ASSIGNPRO"; position: absolute; left: -.04em; bottom: -.19em; color: rgba(255,255,255,.025); font: 600 clamp(7rem,18vw,18rem)/1 var(--ap-heading); letter-spacing: -.08em; white-space: nowrap; pointer-events: none; }
.ap-footer-inner { position: relative; z-index: 1; width: min(100%, var(--ap-shell)); margin-inline: auto; }
.ap-footer-top { display: grid; grid-template-columns: .8fr 1.2fr; align-items: end; gap: clamp(40px,8vw,120px); padding-bottom: 54px; border-bottom: 1px solid var(--ap-dark-line); }
.ap-footer .ap-brand { color: #fff; }
.ap-footer-top p { max-width: 590px; margin: 0; color: rgba(255,255,255,.58); font: 500 clamp(1.25rem,2.4vw,2rem)/1.45 var(--ap-heading); }
.ap-footer-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 30px; padding-block: 52px; }
.ap-footer-col { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ap-footer-col > span { margin-bottom: 7px; color: var(--ap-gold-bright); font-size: .62rem; font-weight: 750; letter-spacing: .15em; text-transform: uppercase; }
.ap-footer-col a { width: fit-content; max-width: 100%; color: rgba(255,255,255,.64); font-size: .84rem; text-decoration: none; overflow-wrap: anywhere; transition: color .2s ease, transform .2s var(--ap-ease); }
.ap-footer-col a:hover { color: #fff; transform: translateX(3px); }
.ap-footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 23px; border-top: 1px solid var(--ap-dark-line); color: rgba(255,255,255,.42); font-size: .68rem; }
.ap-footer-bottom a { color: inherit; text-decoration: none; }

.ap-whatsapp { position: fixed; right: 18px; bottom: 18px; z-index: 85; display: inline-flex; align-items: center; gap: 9px; min-height: 46px; padding: 0 15px; border: 1px solid rgba(255,255,255,.28); border-radius: 4px; background: rgba(13,28,46,.92); color: #fff; box-shadow: 0 12px 30px rgba(13,28,46,.22); font-size: .76rem; font-weight: 750; text-decoration: none; backdrop-filter: blur(14px); transition: transform .25s var(--ap-ease), background .25s ease; }
.ap-whatsapp:hover { transform: translateY(-3px); background: var(--ap-gold); }
.ap-whatsapp svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }

.ap-motion [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .9s var(--ap-ease); }
.ap-motion [data-reveal].is-visible { opacity: 1; transform: none; }
.ap-motion [data-reveal][data-delay="1"] { transition-delay: .08s; }
.ap-motion [data-reveal][data-delay="2"] { transition-delay: .16s; }
.ap-motion [data-reveal][data-delay="3"] { transition-delay: .24s; }

@media (max-width: 900px) {
  .ap-header { grid-template-columns: 1fr auto; height: 70px; padding-inline: 20px; }
  .ap-nav, .ap-header-cta { display: none; }
  .ap-menu-toggle { display: grid; }
  .ap-page--dark-intro .ap-header:not(.is-scrolled) .ap-menu-toggle { border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.08); }
  .ap-page--dark-intro .ap-header:not(.is-scrolled) .ap-menu-toggle span { background: #fff; }
  .ap-footer-top { grid-template-columns: 1fr; }
  .ap-footer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 36px 20px; }
}

@media (max-width: 560px) {
  .ap-shell { width: min(calc(100% - 32px), var(--ap-shell)); }
  .ap-brand-mark { width: 32px; height: 32px; }
  .ap-brand-name { font-size: 1.15rem; }
  .ap-display { font-size: clamp(2.75rem,14vw,4.5rem); }
  .ap-footer { padding: 64px 16px 24px; }
  .ap-footer-top { gap: 26px; padding-bottom: 38px; }
  .ap-footer-top p { font-size: 1.2rem; }
  .ap-footer-grid { padding-block: 40px; }
  .ap-footer-bottom { flex-direction: column; gap: 8px; }
  .ap-whatsapp { right: 12px; bottom: 12px; width: 46px; padding: 0; justify-content: center; border-radius: 50%; }
  .ap-whatsapp span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}
